@jaisocx/css-clean-start-2 1.2.5 → 1.2.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (85) hide show
  1. package/MediaAndStyles/CssCleanStart_2_543_resolved.css +8608 -0
  2. package/MediaAndStyles/CssCleanStart_2_main.css +1 -0
  3. package/MediaAndStyles/CssCleanStart_2_main_resolved.css +0 -0
  4. package/MediaAndStyles/CssCleanStart_2_main_resolved_minimal.css +0 -0
  5. package/MediaAndStyles/CssCleanStart_2_presets.css +0 -0
  6. package/MediaAndStyles/responsive_size_Constants.css +0 -0
  7. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_d05_very_small_xxs_landscape__CssCleanStart_2__theme_base.css +0 -0
  8. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_d05_very_small_xxs_portrait__CssCleanStart_2__theme_base.css +0 -0
  9. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_e02_mobile_xs_landscape__CssCleanStart_2__theme_base.css +0 -0
  10. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_e02_mobile_xs_portrait__CssCleanStart_2__theme_base.css +0 -0
  11. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_e04_mobile_s_landscape__CssCleanStart_2__theme_base.css +0 -0
  12. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_e04_mobile_s_portrait__CssCleanStart_2__theme_base.css +0 -0
  13. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_e06_mobile_sm_landscape__CssCleanStart_2__theme_base.css +0 -0
  14. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_e06_mobile_sm_portrait__CssCleanStart_2__theme_base.css +0 -0
  15. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_e08_mobile_md_landscape__CssCleanStart_2__theme_base.css +0 -0
  16. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_e08_mobile_md_portrait__CssCleanStart_2__theme_base.css +0 -0
  17. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_h03_tablet_s_landscape__CssCleanStart_2__theme_base.css +0 -0
  18. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_h03_tablet_s_portrait__CssCleanStart_2__theme_base.css +0 -0
  19. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_h05_tablet_sm_landscape__CssCleanStart_2__theme_base.css +0 -0
  20. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_h05_tablet_sm_portrait__CssCleanStart_2__theme_base.css +0 -0
  21. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_h07_tablet_md_landscape__CssCleanStart_2__theme_base.css +0 -0
  22. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_h07_tablet_md_portrait__CssCleanStart_2__theme_base.css +0 -0
  23. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_h09_tablet_lg_landscape__CssCleanStart_2__theme_base.css +0 -0
  24. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_h09_tablet_lg_portrait__CssCleanStart_2__theme_base.css +0 -0
  25. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_l02_laptop_sm_landscape__CssCleanStart_2__theme_base.css +0 -0
  26. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_l02_laptop_sm_portrait__CssCleanStart_2__theme_base.css +0 -0
  27. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_l03_laptop_md_landscape__CssCleanStart_2__theme_base.css +0 -0
  28. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_l03_laptop_md_portrait__CssCleanStart_2__theme_base.css +0 -0
  29. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_l07_laptop_lg_landscape__CssCleanStart_2__theme_base.css +0 -0
  30. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_l07_laptop_lg_portrait__CssCleanStart_2__theme_base.css +0 -0
  31. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_s02_display_xl_landscape__CssCleanStart_2__theme_base.css +0 -0
  32. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_s02_display_xl_portrait__CssCleanStart_2__theme_base.css +0 -0
  33. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_s04_display_xxl_landscape__CssCleanStart_2__theme_base.css +0 -0
  34. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_s04_display_xxl_portrait__CssCleanStart_2__theme_base.css +0 -0
  35. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_s08_display_qhd_landscape__CssCleanStart_2__theme_base.css +0 -0
  36. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_s08_display_qhd_portrait__CssCleanStart_2__theme_base.css +0 -0
  37. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_t04_tv_4k_landscape__CssCleanStart_2__theme_base.css +0 -0
  38. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_t04_tv_4k_portrait__CssCleanStart_2__theme_base.css +0 -0
  39. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_t08_tv_8k_landscape__CssCleanStart_2__theme_base.css +0 -0
  40. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_t08_tv_8k_portrait__CssCleanStart_2__theme_base.css +0 -0
  41. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_t16_tv_16k_landscape__CssCleanStart_2__theme_base.css +0 -0
  42. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_t16_tv_16k_portrait__CssCleanStart_2__theme_base.css +0 -0
  43. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_t99_tv_xxxl_landscape__CssCleanStart_2__theme_base.css +0 -0
  44. package/MediaAndStyles/themes/theme_base/responsive/responsive_size_t99_tv_xxxl_portrait__CssCleanStart_2__theme_base.css +0 -0
  45. package/MediaAndStyles/themes/theme_base/responsive_size_Imports_CssCleanStart_2_theme_base_Relative.css +0 -0
  46. package/MediaAndStyles/themes/theme_base/responsive_size_Imports_CssCleanStart_2_theme_base_Webpack.css +0 -0
  47. package/MediaAndStyles/themes/theme_base/responsive_size_Imports_CssCleanStart_2_theme_base_Webpack_minimal.css +0 -0
  48. package/MediaAndStyles/themes/theme_visible_height/theme_visible_height.css +0 -0
  49. package/README.md +127 -48
  50. package/package.json +13 -8
  51. package/responsive_sizes.html +3 -10
  52. package/transpiled/CommonJS/index.d.ts +0 -0
  53. package/transpiled/CommonJS/index.d.ts.map +0 -0
  54. package/transpiled/CommonJS/index.js +0 -0
  55. package/transpiled/CommonJS/index.js.map +0 -0
  56. package/transpiled/CommonJS/webpack.aliases.cjs +0 -0
  57. package/transpiled/CommonJS/webpack.aliases.cjs.map +0 -0
  58. package/transpiled/CommonJS/webpack.aliases.d.cts +0 -0
  59. package/transpiled/CommonJS/webpack.aliases.d.cts.map +0 -0
  60. package/transpiled/CommonJS/webpack.aliases.d.mts +0 -0
  61. package/transpiled/CommonJS/webpack.aliases.d.mts.map +0 -0
  62. package/transpiled/CommonJS/webpack.aliases.mjs +0 -0
  63. package/transpiled/CommonJS/webpack.aliases.mjs.map +0 -0
  64. package/transpiled/CommonJS/webpackAliases.d.ts +0 -0
  65. package/transpiled/CommonJS/webpackAliases.d.ts.map +0 -0
  66. package/transpiled/CommonJS/webpackAliases.js +0 -0
  67. package/transpiled/CommonJS/webpackAliases.js.map +0 -0
  68. package/transpiled/ESNext/index.d.ts +0 -0
  69. package/transpiled/ESNext/index.d.ts.map +0 -0
  70. package/transpiled/ESNext/index.js +0 -0
  71. package/transpiled/ESNext/index.js.map +0 -0
  72. package/transpiled/ESNext/webpack.aliases.cjs +0 -0
  73. package/transpiled/ESNext/webpack.aliases.cjs.map +0 -0
  74. package/transpiled/ESNext/webpack.aliases.d.cts +0 -0
  75. package/transpiled/ESNext/webpack.aliases.d.cts.map +0 -0
  76. package/transpiled/ESNext/webpack.aliases.d.mts +0 -0
  77. package/transpiled/ESNext/webpack.aliases.d.mts.map +0 -0
  78. package/transpiled/ESNext/webpack.aliases.mjs +0 -0
  79. package/transpiled/ESNext/webpack.aliases.mjs.map +0 -0
  80. package/transpiled/ESNext/webpackAliases.d.ts +0 -0
  81. package/transpiled/ESNext/webpackAliases.d.ts.map +0 -0
  82. package/transpiled/ESNext/webpackAliases.js +0 -0
  83. package/transpiled/ESNext/webpackAliases.js.map +0 -0
  84. package/with_preloaded_fonts_node_modules__preview.html +3 -13
  85. package/favicon/Icon_Sandbox_Brightday.ico +0 -0
@@ -83,6 +83,7 @@ html.jsx script {
83
83
  max-width: 0;
84
84
  overflow-y: hidden;
85
85
  overflow-x: hidden;
86
+ display: none;
86
87
  }
87
88
 
88
89
 
File without changes
File without changes
File without changes
package/README.md CHANGED
@@ -1,108 +1,187 @@
1
- # CSS Clean Start 2
2
1
 
3
2
 
4
- ## Status of the Project
3
+ # @jaisocx/css-clean-start-2
4
+ > Template for new .html, mobile friendly, with css3 themes examples.
5
5
 
6
- ready
7
6
 
8
7
 
8
+ #### status
9
+ > ✅ yarn add | npm install Ok
9
10
 
10
- ## Status
11
+ > ✅ `.html` previews Ok
11
12
 
12
- Ready to use since the 19-th of July in the Year 2025.
13
13
 
14
14
 
15
+ #### supports
16
+ > Client Side
17
+ > Server Side
15
18
 
16
- ## The aim of the setup
19
+ ```
20
+ Browser | Express | Console |
21
+ ✅ yes | ✅ yes | ❌ no |
22
+ ```
17
23
 
18
- All front end devs use some normalizing styles for their new projects from scratch.
19
24
 
20
- When You start fresh project from scratch, You have at once the index.html with responsive markup,
21
- and You are able to set the look and feel of Your site in few minutes,
22
- via setting very few variables,
23
- like text color, background color and font family.
24
25
 
25
- In this index.html template,
26
- several .css files will be loaded with size of very few KB.
27
- 1. base normalizing css file for all html tags
28
- 2. base theme file, where all css variabes becomes values set
26
+ #### 📅 latest update
27
+ > November 2025
29
28
 
29
+ **Library**: `@jaisocx/css-clean-start-2` ver. `1.2.5`
30
30
 
31
+ 🗓 **Updated at**: `24th of November 2025`
31
32
 
33
+ ---
32
34
 
33
- ## The latest .tgz archive (v.1.1.5 25th of August 2025)
34
35
 
35
- [https://sandbox.brightday.email/sites_tools/css_tools/CssCleanStart_2/jaisocx-css-clean-start-2-1.1.5.tgz](https://sandbox.brightday.email/sites_tools/css_tools/CssCleanStart_2/jaisocx-css-clean-start-2-1.1.5.tgz)
36
36
 
37
+ ## 💡 The aim of the setup
38
+ All front end devs use some normalizing styles for their new projects from scratch.
39
+
40
+ When You start fresh project from scratch, You have at once the index.html with responsive markup,
41
+ and You are able to set the look and feel of Your site in few minutes,
42
+ via setting very few variables,
43
+ like text color, background color and font family.
44
+
45
+ In this index.html template,
46
+ several .css files will be loaded with size of very few KB.
47
+ 1. base normalizing css file for all html tags
48
+ 2. base theme file, where all css variabes becomes values set
37
49
 
50
+ ---
38
51
 
39
52
 
40
53
 
41
- ## Watch site in action
54
+ ## 1. html coding example
42
55
 
43
- [https://sandbox.brightday.email/sites_tools/css_tools/CssCleanStart_2/index.example.html](https://sandbox.brightday.email/sites_tools/css_tools/CssCleanStart_2/index.example.html)
56
+ ### 1.1. <html class="jsx">
57
+ Normally set the css class `jsx` and theme css class in <html> tag.
44
58
 
59
+ ```html
60
+ <html lang="en" class="jsx">
61
+ ```
45
62
 
63
+ ```html
64
+ <html lang="en" class="jsx theme_lightmode">
65
+ ```
46
66
 
47
- ### Dev mode, get to know responsive .css file name
67
+ ```html
68
+ <html lang="en" class="jsx theme_darkmode">
69
+ ```
48
70
 
49
- [https://sandbox.brightday.email/sites_tools/css_tools/CssCleanStart_2/responsive_sizes.html](https://sandbox.brightday.email/sites_tools/css_tools/CssCleanStart_2/responsive_sizes.html)
71
+ ```html
72
+ <html lang="en" class="jsx theme_darkmode small">
73
+ ```
50
74
 
75
+ ```html
76
+ <html lang="en" class="jsx theme_darkmode long">
77
+ ```
51
78
 
52
79
 
53
80
 
54
- ## Github
55
- [https://github.com/Jaisocx-Tools/Workspace/tree/main/workspace/ts/Jaisocx_SitesTools/sites_tools/css_tools/CssCleanStart_2](https://github.com/Jaisocx-Tools/Workspace/tree/main/workspace/ts/Jaisocx_SitesTools/sites_tools/css_tools/CssCleanStart_2)
81
+ ### 1.2. class ul-reset
82
+ You can set css class `ul-reset` when You don't need html lists rendering with the predefined 90-s years html look and feel.
56
83
 
84
+ ```html
85
+ <html lang="en" class="jsx ul-reset">
86
+ ```
57
87
 
88
+ or in some tag, where You don't need html lists rendering with the predefined 90-s years html look and feel.
89
+ ```html
90
+ <html lang="en" class="jsx">
91
+ ...
92
+ <a-tag class="ul-reset">
93
+ ```
58
94
 
59
95
 
60
96
 
97
+ ## 2. css coding example
61
98
 
99
+ ```css
62
100
 
63
- ## Usage
101
+ /* Css Clean Start Lite styles overrides */
64
102
 
65
- ### 1. &lt;html class="jsx"&gt;
66
- Normally set the css class `jsx` and theme css class in &lt;html&gt; tag.
67
- ```
68
- <html lang="en" class="jsx">
69
- ```
103
+ .jsx {
104
+ --jsx--css-clean-start-2--h1--margin: 1.4rem 0 1rem 0;
105
+ --jsx--css-clean-start-2--h1--font-weight: 500;
106
+ }
70
107
 
108
+ .jsx label {
109
+ padding: 0.1rem 1rem;
110
+ background-color: #f5fff5;
111
+ border-radius: 0.35rem;
112
+ border: 1px solid #e0ffe0;
113
+ }
71
114
 
72
- ### 2. class ul-reset
73
- You can set css class `ul-reset` when You don't need html lists rendering with the predefined 90-s years html look and feel.
74
- ```
75
- <html lang="en" class="jsx ul-reset">
76
115
  ```
77
116
 
78
- or in some tag, where You don't need html lists rendering with the predefined 90-s years html look and feel.
79
- ```
80
- <html lang="en" class="jsx">
81
- ...
82
- <a-tag class="ul-reset">
117
+
118
+
119
+ ## 3. Improvals planned
120
+
121
+ ### 3.1. renamings
122
+
123
+ #### 3.1.1. Libraries:
124
+
125
+ `@jaisocx/css-clean-start-2` => `@jaisocx/css_clean_start_responsive`
126
+
127
+
128
+
129
+ #### 3.1.2. Main css class name "jaisocx" turning on | off tools by Jaisocx:
130
+
131
+ ```html
132
+ <html lang="en" class="jaisocx">
83
133
  ```
84
134
 
85
- ### 3. class small
86
- ### 4. class browser-width
87
135
 
88
136
 
137
+ #### 3.1.3. Main css class name "css_clean_start" turning on | off the CssCleanStart:
138
+
139
+ ```html
140
+ <html lang="en" class="jaisocx css_clean_start">
141
+ ```
142
+
89
143
 
90
- ## npm for webpack
91
144
 
92
- I use in the package.json th line to push to npm registry the MediaAndStyles/fonts folder.
145
+ #### 3.1.4. Variables start with the Jaisocx keyword: "--jaisocx--"
93
146
 
94
- this is not the good practice, and I shall use cdn urls for fonts and media in other packages,
95
- and in this package I wanted to test the build with webpack with 3rd party dependencies loaded from npm registry,
96
- that we have the package.json config, webpack configs and webpack aliases
97
- to build the normal bundle.js for a Css Sites UI tool.
147
+ ```css
148
+ /* Jaisocx_CssCleanStart_Main.css */
98
149
 
99
- there could be mini images and fonts for sure.
150
+ html.jaisocx.css_clean_start * {
100
151
 
152
+ position: var(--jaisocx--css_clean_start--all-tags--position);
153
+ display: var(--jaisocx--css_clean_start--custom-tags--display);
154
+
155
+ ...
156
+ ...
157
+
158
+ }
101
159
 
102
160
  ```
103
- npm install @jaisocx/css-clean-start-2
161
+
162
+
163
+
164
+ ```css
165
+ /* Jaisocx_CssCleanStart_ThemeBase_Main.css */
166
+
167
+ .jaisocx.css_clean_start {
168
+
169
+ ...
170
+ ...
171
+
172
+ --jaisocx--css_clean_start--block-tags--display: block;
173
+
104
174
  ```
105
175
 
176
+ ---
177
+
178
+
179
+
180
+ Have a nice day.
181
+
182
+ Elias, Software Architect of Jaisocx Company
183
+
184
+
106
185
 
107
186
 
108
187
 
package/package.json CHANGED
@@ -1,8 +1,8 @@
1
1
  {
2
+ "author": "ILLIA POLIANSKYI, Jaisocx Company",
2
3
  "name": "@jaisocx/css-clean-start-2",
3
- "version": "1.2.5",
4
+ "version": "1.2.9",
4
5
  "description": "Css sites resetting default styles with main.css of few hundereds css code lines, and the very nice infrastructure for responsive sites bugfixing and fine-tuning",
5
- "author": "Jaisocx Company",
6
6
  "keywords": [
7
7
  "css",
8
8
  "styles"
@@ -16,7 +16,10 @@
16
16
  "with_preloaded_fonts_node_modules__preview.html",
17
17
 
18
18
  "MediaAndStyles/*.css",
19
- "MediaAndStyles/themes",
19
+ "MediaAndStyles/themes/theme_base",
20
+ "MediaAndStyles/themes/theme_lightmode",
21
+ "MediaAndStyles/themes/theme_darkmode",
22
+ "MediaAndStyles/themes/theme_visible_height",
20
23
 
21
24
  "transpiled/CommonJS",
22
25
  "transpiled/ESNext",
@@ -25,13 +28,11 @@
25
28
 
26
29
  "README.md"
27
30
  ],
28
- "optionalDependencies": {
29
- "@jaisocx/media_tools_fonts_base": "~1.0.5",
31
+ "devDependencies": {
30
32
  "@jaisocx/responsive-sizes": "~1.3.4"
31
33
  },
32
- "private": false,
33
- "publishConfig": {
34
- "access": "public"
34
+ "optionalDependencies": {
35
+ "@jaisocx/media_tools_fonts_base": "~1.0.9"
35
36
  },
36
37
  "type": "module",
37
38
  "main": "./transpiled/CommonJS/index.js",
@@ -46,6 +47,10 @@
46
47
  "import": "./transpiled/ESNext/webpack.aliases.mjs",
47
48
  "require": "./transpiled/CommonJS/webpack.aliases.cjs"
48
49
  }
50
+ },
51
+ "private": false,
52
+ "publishConfig": {
53
+ "access": "public"
49
54
  }
50
55
  }
51
56
 
@@ -6,24 +6,17 @@
6
6
 
7
7
  <base href="./">
8
8
 
9
+
10
+
9
11
  <meta charset="utf-8" />
10
12
  <meta content="width=device-width, initial-scale=1.0" name="viewport" />
11
13
 
12
14
 
13
15
 
14
16
  <!--# FAVICON -->
15
- <!-- <link
16
- rel="icon"
17
- type="image/x-icon"
18
- href="https://sandbox.brightday.email/cdn/www/media/images/favicon/Icon_Jaisocx.ico"
19
- href-fallback="favicon/Icon_Jaisocx.ico"
20
- onerror="javascript: ( () => { console.log( this ); this.onerror = null; this.href = this.getAttribute( 'href-fallback' ); } )();"
21
- /> -->
22
-
23
17
  <link
24
18
  rel="icon"
25
- type="image/x-icon"
26
- href="favicon/Icon_Sandbox_Brightday.ico"
19
+ href="favicon/Icon_Jaisocx.ico"
27
20
  />
28
21
 
29
22
 
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
@@ -12,20 +12,10 @@
12
12
 
13
13
 
14
14
  <!--# FAVICON -->
15
- <!-- <link
16
- rel="icon"
17
- type="image/x-icon"
18
- href="https://sandbox.brightday.email/cdn/www/media/images/favicon/Icon_Jaisocx.ico"
19
- href-fallback="favicon/Icon_Jaisocx.ico"
20
- onerror="javascript: ( () => { console.log( this ); this.onerror = null; this.href = this.getAttribute( 'href-fallback' ); } )();"
21
- /> -->
22
15
 
23
16
  <link
24
17
  rel="icon"
25
- type="image/x-icon"
26
- href="https://sandbox.brightday.email/cdn/www/media/images/favicon/Icon_Sandbox_Brightday.ico"
27
- href-fallback="favicon/Icon_Sandbox_Brightday.ico"
28
- onerror="javascript: ( () => { console.log( this ); this.href = this.getAttribute( 'href-fallback' ); this.onerror = null; } )();"
18
+ href="favicon/Icon_Jaisocx.ico"
29
19
  />
30
20
 
31
21
 
@@ -33,7 +23,7 @@
33
23
  <!--# FONTS PRELOAD WITHOUT JAVASCRIPT CALL -->
34
24
  <!-- The fonts are loaded just one time -->
35
25
  <link
36
- fetchpriority="high"
26
+ fetchpriority="low"
37
27
  rel="preload"
38
28
  as="font"
39
29
  type="font/ttf"
@@ -44,7 +34,7 @@
44
34
  />
45
35
 
46
36
  <link
47
- fetchpriority="high"
37
+ fetchpriority="low"
48
38
  rel="preload"
49
39
  as="font"
50
40
  type="font/ttf"
Binary file