@wix/thunderbolt-common-css 1.10.0 → 1.12.0

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 (14) hide show
  1. package/dist/index.global.css +73 -13
  2. package/dist/index.global.css.map +1 -1
  3. package/dist/viewer.global.css +3 -0
  4. package/dist/viewer.global.css.map +1 -1
  5. package/package.json +6 -6
  6. package/src/assets/scss/builder.scss +2 -2
  7. package/src/assets/scss/mesh.scss +113 -116
  8. package/src/assets/scss/mobile_renderer.scss +19 -19
  9. package/src/assets/scss/root_renderer.scss +1 -1
  10. package/src/assets/scss/themeWiringVars.scss +66 -66
  11. package/src/assets/scss/transforms.scss +3 -3
  12. package/src/assets/scss/view-transitions.scss +52 -52
  13. package/src/assets/scss/wixSites.scss +2 -2
  14. package/src/viewer.global.scss +44 -38
package/dist/index.global.css CHANGED
@@ -1,13 +1,69 @@
1
- div, span, applet, object, iframe,
2
- h1, h2, h3, h4, h5, h6, p, blockquote, pre,
3
- a, abbr, acronym, address, big, cite, code,
4
- del, dfn, em, font, img, ins, kbd, q, s, samp,
5
- small, strike, strong, sub, sup, tt, var,
6
- b, u, i, center,
7
- dl, dt, dd, ol, ul, li,
8
- fieldset, form, label, legend,
9
- table, caption, tbody, tfoot, thead, tr, th, td,
10
- nav, button, section, header, footer, title {
1
+ div,
2
+ span,
3
+ applet,
4
+ object,
5
+ iframe,
6
+ h1,
7
+ h2,
8
+ h3,
9
+ h4,
10
+ h5,
11
+ h6,
12
+ p,
13
+ blockquote,
14
+ pre,
15
+ a,
16
+ abbr,
17
+ acronym,
18
+ address,
19
+ big,
20
+ cite,
21
+ code,
22
+ del,
23
+ dfn,
24
+ em,
25
+ font,
26
+ img,
27
+ ins,
28
+ kbd,
29
+ q,
30
+ s,
31
+ samp,
32
+ small,
33
+ strike,
34
+ strong,
35
+ sub,
36
+ sup,
37
+ tt,
38
+ var,
39
+ b,
40
+ u,
41
+ i,
42
+ center,
43
+ dl,
44
+ dt,
45
+ dd,
46
+ ol,
47
+ ul,
48
+ li,
49
+ fieldset,
50
+ form,
51
+ label,
52
+ legend,
53
+ table,
54
+ caption,
55
+ tbody,
56
+ tfoot,
57
+ thead,
58
+ tr,
59
+ th,
60
+ td,
61
+ nav,
62
+ button,
63
+ section,
64
+ header,
65
+ footer,
66
+ title {
11
67
  margin: 0;
12
68
  padding: 0;
13
69
  border: 0;
@@ -16,16 +72,20 @@ nav, button, section, header, footer, title {
16
72
  background: transparent;
17
73
  }
18
74
 
19
- textarea, input, select {
75
+ textarea,
76
+ input,
77
+ select {
20
78
  font-family: Helvetica, Arial, sans-serif;
21
79
  box-sizing: border-box;
22
80
  }
23
81
 
24
- ol, ul {
82
+ ol,
83
+ ul {
25
84
  list-style: none;
26
85
  }
27
86
 
28
- blockquote, q {
87
+ blockquote,
88
+ q {
29
89
  quotes: none;
30
90
  }
31
91
 
package/dist/index.global.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":"","sources":["../../../node_modules/@wix/thunderbolt-app-reset-css/src/assets/scss/renderer/reset_renderer.scss","../../../node_modules/@wix/thunderbolt-app-reset-css/src/assets/scss/mobile.scss","../src/assets/scss/root_renderer.scss","../src/assets/scss/mobile_renderer.scss","../src/assets/scss/mesh.scss","../src/assets/scss/transforms.scss","../src/assets/scss/wixSites.scss","../src/assets/scss/themeWiringVars.scss","../src/assets/scss/builder.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAUE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;AACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;ACjEE;EACE;EACA;;AAIA;EACE;EACA;EACA;EACA;EACA;;AAIA;EACE;;AAMN;EACE;;AAIF;EACE;EACA;;AAGF;EACE;IACE;IACA;;;AAOF;EACE;EACA;;AAIJ;EACE;;AAEA;AAAA;AAAA;EAGE;;AAKN;EACE;;AAIF;EACE;EACA;;AAEA;EACE;EACA;;AAOJ;EACE;EACA;;AAGA;AAAA;EAEE;EACA;;AAGF;AAAA;EAEE;;AAGF;EACE;;AAIJ;EAEE;EACA;;AAGF;EACE;;AAIA;EACE;;;ACnHN;EACC;EACA;EACA;EACA;;AAEA;EACC;;AAKD;EACC;;;AAIF;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AC9BD;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;ACnBJ;AAAA;AAAA;EAGI;EACA;;;AAIJ;AAAA;EAEI;;;AAGJ;AAAA;AAAA;EAGI;;;AAKI;EACI;EACA;EACA;;;AAKZ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAQI;EACA;EACA;;AAGJ;AAAA;EAEI;EACA;;AAGJ;AAAA;AAAA;EAGI;EACA;;AAGJ;AAAA;EAEI;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;AAAA;EAEI;EACA;;AAGJ;AAAA;AAAA;EAGI;;AAIA;EACI;;AAIR;AAAA;AAAA;AAAA;AAAA;EAKI;;AAIJ;AAAA;EAEI;;AAIJ;EACI;;AAGJ;EACI;;AAKA;AAAA;EAEI;;;AC1HZ;EACE;;;AAGF;EACE;;;ACNF;EACE;EACA;;;ACFF;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;ACjEJ;EACI;;;AAGJ;EACI","file":"index.global.css"}
1
+ {"version":3,"sourceRoot":"","sources":["../../../node_modules/@wix/thunderbolt-app-reset-css/src/assets/scss/renderer/reset_renderer.scss","../../../node_modules/@wix/thunderbolt-app-reset-css/src/assets/scss/mobile.scss","../src/assets/scss/root_renderer.scss","../src/assets/scss/mobile_renderer.scss","../src/assets/scss/mesh.scss","../src/assets/scss/transforms.scss","../src/assets/scss/wixSites.scss","../src/assets/scss/themeWiringVars.scss","../src/assets/scss/builder.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAkEC;EACA;EACA;EACA;EACA;EACA;;;AAGD;AAAA;AAAA;EAGC;EACA;;;AAGD;AAAA;EAEC;;;AAGD;AAAA;EAEC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;;;AAGD;EACC;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;EACA;AACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AC/HC;EACC;EACA;;AAIA;EACC;EACA;EACA;EACA;EACA;;AAIA;EACC;;AAMH;EACC;;AAID;EACC;EACA;;AAGD;EACC;IACC;IACA;;;AAOD;EACC;EACA;;AAIF;EACC;;AAEA;AAAA;AAAA;EAGC;;AAKH;EACC;;AAID;EACC;EACA;;AAEA;EACC;EACA;;AAOF;EACC;EACA;;AAGA;AAAA;EAEC;EACA;;AAGD;AAAA;EAEC;;AAGD;EACC;;AAIF;EAEC;EACA;;AAGD;EACC;;AAIA;EACC;;;ACjHH;EACC;EACA;EACA;EACA;;AAEA;EACC;;AAKD;EACC;;;AAIF;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AC9BD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;ACnBF;AAAA;AAAA;EAGC;EACA;;;AAID;AAAA;EAEC;;;AAGD;AAAA;AAAA;EAGC;;;AAKC;EACC;EACA;EACA;;;AAKH;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAQC;EACA;EACA;;AAGD;AAAA;EAEC;EACA;;AAGD;AAAA;AAAA;EAGC;EACA;;AAGD;AAAA;EAEC;;AAGD;EACC;;AAGD;EACC;;AAGD;AAAA;EAEC;EACA;;AAGD;AAAA;AAAA;EAGC;;AAIA;EACC;;AAIF;AAAA;AAAA;AAAA;AAAA;EAKC;;AAGD;AAAA;EAEC;;AAGD;EACC;;AAGD;EACC;;AAIA;AAAA;EAEC;;;ACvHH;EACC;;;AAGD;EACC;;;ACND;EACC;EACA;;;ACFD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;ACjED;EACC;;;AAGD;EACC","file":"index.global.css"}
package/dist/viewer.global.css CHANGED
@@ -125,6 +125,9 @@ body {
125
125
  font-size: 10px;
126
126
  font-family: Arial, Helvetica, sans-serif;
127
127
  --scrollbar-width: 0px;
128
+ -webkit-text-size-adjust: 100%;
129
+ -moz-text-size-adjust: 100%;
130
+ text-size-adjust: 100%;
128
131
  }
129
132
 
130
133
  html,
package/dist/viewer.global.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":"","sources":["../src/assets/scss/view-transitions.scss","../src/viewer.global.scss"],"names":[],"mappings":"AAAA;EACE;IACE;;;AAIJ;EACE;IACE;;EAEF;IACE;IACA;;;AAIJ;EACE;IACE;;;AAIJ;EACE;IACE;;EAEF;IACE;IACA;;;AAIJ;EACE;IACE;;;AAIJ;EACE;IACE;;;AASJ;EACE;;;AAGF;AAAA;AAAA;EAGE;;;AAIF;EACE;;;AAMF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;AAAA;AAAA;EAGE;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAEF;EACE;EACA;;;AAGF;EACE;EACA;;;AAEF;EACE;EACA;;;AAGF;EACE;;;AAEF;EACE;;;AAGF;EACE;AAAA;AAAA;IAGE;;;ACpHJ;AAEA;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAOF;AAAA;EAEE;;;AAQF;EACE;EACA;;;AAGF;AAGE;EACE;EACA;;;AAIJ;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAOF;EACE;IACE;IACA;;;AAIJ;EACE;IACE;;;AAKJ;EACE;EACA;;;AAGF;EACE","file":"viewer.global.css"}
1
+ {"version":3,"sourceRoot":"","sources":["../src/assets/scss/view-transitions.scss","../src/viewer.global.scss"],"names":[],"mappings":"AAAA;EACC;IACC;;;AAIF;EACC;IACC;;EAED;IACC;IACA;;;AAIF;EACC;IACC;;;AAIF;EACC;IACC;;EAED;IACC;IACA;;;AAIF;EACC;IACC;;;AAIF;EACC;IACC;;;AASF;EACC;;;AAGD;AAAA;AAAA;EAGC;;;AAID;EACC;;;AAMD;EACC;;;AAED;EACC;;;AAED;EACC;;;AAED;EACC;;;AAGD;AAAA;AAAA;EAGC;EACA;EACA;EACA;;;AAGD;EACC;EACA;;;AAED;EACC;EACA;;;AAGD;EACC;EACA;;;AAED;EACC;EACA;;;AAGD;EACC;;;AAED;EACC;;;AAGD;EACC;AAAA;AAAA;IAGC;;;ACpHF;AAEA;AAAA;EAEC;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;EAEA;EACA;EACA;;;AAOD;AAAA;EAEC;;;AAQD;EACC;EACA;;;AAGD;AAGC;EACC;EACA;;;AAIF;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;;;AAOD;EACC;IACC;IACA;;;AAIF;EACC;IACC;;;AAKF;EACC,YACC;EAED;;;AAGD;EACC","file":"viewer.global.css"}
package/package.json CHANGED
@@ -1,7 +1,11 @@
1
1
  {
2
2
  "name": "@wix/thunderbolt-common-css",
3
- "version": "1.10.0",
3
+ "version": "1.12.0",
4
4
  "license": "UNLICENSED",
5
+ "files": [
6
+ "dist",
7
+ "src"
8
+ ],
5
9
  "main": "dist/index.css",
6
10
  "exports": {
7
11
  "./index.global.css": "./dist/index.global.css",
@@ -9,10 +13,6 @@
9
13
  "./src/index.global.scss": "./src/index.global.scss",
10
14
  "./src/viewer.global.scss": "./src/viewer.global.scss"
11
15
  },
12
- "files": [
13
- "dist",
14
- "src"
15
- ],
16
16
  "publishConfig": {
17
17
  "registry": "https://registry.npmjs.org/",
18
18
  "access": "public"
@@ -44,5 +44,5 @@
44
44
  ]
45
45
  }
46
46
  },
47
- "falconPackageHash": "794327f6111d62b24afcbad9308f0d69c0c270dfbd9d1a106a54aff0"
47
+ "falconPackageHash": "612cffe553b699a0d582b7793422631fd1d39ef110ff03df55c17522"
48
48
  }
package/src/assets/scss/builder.scss CHANGED
@@ -1,7 +1,7 @@
1
1
  .wix-presets-wrapper {
2
- display: contents;
2
+ display: contents;
3
3
  }
4
4
 
5
5
  .builder-root {
6
- box-sizing: border-box;
6
+ box-sizing: border-box;
7
7
  }
package/src/assets/scss/mesh.scss CHANGED
@@ -1,127 +1,124 @@
1
- [data-mesh-id$="inlineContent"],
2
- [data-mesh-id$="centeredContent"],
3
- [data-mesh-id$="form"] {
4
- position: relative;
5
- pointer-events: none;
1
+ [data-mesh-id$='inlineContent'],
2
+ [data-mesh-id$='centeredContent'],
3
+ [data-mesh-id$='form'] {
4
+ position: relative;
5
+ pointer-events: none;
6
6
  }
7
7
 
8
8
  // To make sure overlaps and soap container does not block clicks on components underneath
9
- [data-mesh-id$="-gridWrapper"],
10
- [data-mesh-id$="-rotated-wrapper"] {
11
- pointer-events: none;
9
+ [data-mesh-id$='-gridWrapper'],
10
+ [data-mesh-id$='-rotated-wrapper'] {
11
+ pointer-events: none;
12
12
  }
13
13
 
14
- [data-mesh-id$="-gridContainer"]>*,
15
- [data-mesh-id$="-rotated-wrapper"]>*,
16
- [data-mesh-id$="inlineContent"]> :not([data-mesh-id$="-gridContainer"]) {
17
- pointer-events: auto;
14
+ [data-mesh-id$='-gridContainer'] > *,
15
+ [data-mesh-id$='-rotated-wrapper'] > *,
16
+ [data-mesh-id$='inlineContent'] > :not([data-mesh-id$='-gridContainer']) {
17
+ pointer-events: auto;
18
18
  }
19
19
 
20
20
  .device-mobile-optimized {
21
- #masterPage.mesh-layout {
22
- #SOSP_CONTAINER_CUSTOM_ID {
23
- -ms-grid-row: 2;
24
- grid-area: 2/1/3/2;
25
- position: relative;
26
- }
27
- }
21
+ #masterPage.mesh-layout {
22
+ #SOSP_CONTAINER_CUSTOM_ID {
23
+ -ms-grid-row: 2;
24
+ grid-area: 2/1/3/2;
25
+ position: relative;
26
+ }
27
+ }
28
28
  }
29
29
 
30
30
  #masterPage.mesh-layout {
31
- display: -ms-grid; // IE11 support
32
- display: grid;
33
- -ms-grid-rows: max-content max-content min-content max-content; // IE11 support
34
- grid-template-rows: max-content max-content min-content max-content;
35
- -ms-grid-columns: 100%; // IE11 support
36
- grid-template-columns: 100%;
37
- align-items: start;
38
- justify-content: stretch;
39
-
40
- #SITE_HEADER_WRAPPER,
41
- #SITE_HEADER-placeholder,
42
- #SOSP_CONTAINER_CUSTOM_ID[data-state~="mobileView"],
43
- #PAGES_CONTAINER,
44
- #soapBeforePagesContainer,
45
- #soapAfterPagesContainer,
46
- #SITE_FOOTER_WRAPPER,
47
- #SITE_FOOTER-placeholder {
48
- -ms-grid-column: 1;
49
- -ms-grid-row-align: start;
50
- -ms-grid-column-align: start;
51
- }
52
-
53
- #SITE_HEADER_WRAPPER,
54
- #SITE_HEADER-placeholder {
55
- -ms-grid-row: 1;
56
- grid-area: 1/1/2/2;
57
- }
58
-
59
- #PAGES_CONTAINER,
60
- #soapBeforePagesContainer,
61
- #soapAfterPagesContainer {
62
- -ms-grid-row: 3;
63
- grid-area: 3/1/4/2;
64
- }
65
-
66
- #soapBeforePagesContainer,
67
- #soapAfterPagesContainer {
68
- width: 100%; // IE11 needs this
69
- }
70
-
71
- #PAGES_CONTAINER {
72
- align-self: stretch;
73
- }
74
-
75
- main#PAGES_CONTAINER {
76
- display: block; // IE11 - main element is not block
77
- }
78
-
79
- #SITE_FOOTER_WRAPPER,
80
- #SITE_FOOTER-placeholder {
81
- -ms-grid-row: 4;
82
- grid-area: 4/1/5/2;
83
- }
84
-
85
- [data-mesh-id=PAGES_CONTAINERcenteredContent],
86
- [data-mesh-id=PAGES_CONTAINERinlineContent],
87
- #SITE_PAGES {
88
- height: 100%;
89
- }
90
-
91
- &.desktop {
92
- >* {
93
- width: 100%;
94
- }
95
- }
96
-
97
- #SITE_PAGES,
98
- #SITE_HEADER_WRAPPER,
99
- #SITE_FOOTER_WRAPPER,
100
- #PAGES_CONTAINER,
101
- #masterPageinlineContent {
102
- position: relative;
103
- }
104
-
105
-
106
- #SITE_FOOTER,
107
- #SITE_HEADER {
108
- position: relative;
109
- }
110
-
111
-
112
- #SITE_HEADER {
113
- grid-area: 1/1/2/2;
114
- }
115
-
116
- #SITE_FOOTER {
117
- grid-area: 4/1/5/2;
118
- }
119
-
120
- &.overflow-x-clip {
121
-
122
- #SITE_HEADER,
123
- #SITE_FOOTER {
124
- overflow-x: clip;
125
- }
126
- }
127
- }
31
+ display: -ms-grid; // IE11 support
32
+ display: grid;
33
+ -ms-grid-rows: max-content max-content min-content max-content; // IE11 support
34
+ grid-template-rows: max-content max-content min-content max-content;
35
+ -ms-grid-columns: 100%; // IE11 support
36
+ grid-template-columns: 100%;
37
+ align-items: start;
38
+ justify-content: stretch;
39
+
40
+ #SITE_HEADER_WRAPPER,
41
+ #SITE_HEADER-placeholder,
42
+ #SOSP_CONTAINER_CUSTOM_ID[data-state~='mobileView'],
43
+ #PAGES_CONTAINER,
44
+ #soapBeforePagesContainer,
45
+ #soapAfterPagesContainer,
46
+ #SITE_FOOTER_WRAPPER,
47
+ #SITE_FOOTER-placeholder {
48
+ -ms-grid-column: 1;
49
+ -ms-grid-row-align: start;
50
+ -ms-grid-column-align: start;
51
+ }
52
+
53
+ #SITE_HEADER_WRAPPER,
54
+ #SITE_HEADER-placeholder {
55
+ -ms-grid-row: 1;
56
+ grid-area: 1/1/2/2;
57
+ }
58
+
59
+ #PAGES_CONTAINER,
60
+ #soapBeforePagesContainer,
61
+ #soapAfterPagesContainer {
62
+ -ms-grid-row: 3;
63
+ grid-area: 3/1/4/2;
64
+ }
65
+
66
+ #soapBeforePagesContainer,
67
+ #soapAfterPagesContainer {
68
+ width: 100%; // IE11 needs this
69
+ }
70
+
71
+ #PAGES_CONTAINER {
72
+ align-self: stretch;
73
+ }
74
+
75
+ main#PAGES_CONTAINER {
76
+ display: block; // IE11 - main element is not block
77
+ }
78
+
79
+ #SITE_FOOTER_WRAPPER,
80
+ #SITE_FOOTER-placeholder {
81
+ -ms-grid-row: 4;
82
+ grid-area: 4/1/5/2;
83
+ }
84
+
85
+ [data-mesh-id='PAGES_CONTAINERcenteredContent'],
86
+ [data-mesh-id='PAGES_CONTAINERinlineContent'],
87
+ #SITE_PAGES {
88
+ height: 100%;
89
+ }
90
+
91
+ &.desktop {
92
+ > * {
93
+ width: 100%;
94
+ }
95
+ }
96
+
97
+ #SITE_PAGES,
98
+ #SITE_HEADER_WRAPPER,
99
+ #SITE_FOOTER_WRAPPER,
100
+ #PAGES_CONTAINER,
101
+ #masterPageinlineContent {
102
+ position: relative;
103
+ }
104
+
105
+ #SITE_FOOTER,
106
+ #SITE_HEADER {
107
+ position: relative;
108
+ }
109
+
110
+ #SITE_HEADER {
111
+ grid-area: 1/1/2/2;
112
+ }
113
+
114
+ #SITE_FOOTER {
115
+ grid-area: 4/1/5/2;
116
+ }
117
+
118
+ &.overflow-x-clip {
119
+ #SITE_HEADER,
120
+ #SITE_FOOTER {
121
+ overflow-x: clip;
122
+ }
123
+ }
124
+ }
package/src/assets/scss/mobile_renderer.scss CHANGED
@@ -1,22 +1,22 @@
1
1
  .fullScreenOverlay {
2
- z-index: 1005; // This value should be in correlation with the value of $zindex-full-screen-overlay in EE: https://github.com/wix-private/editor-elements/blob/900b1a7344e69b95e99e166c5abac9d901c53b32/packages/thunderbolt-elements/src/core/style/z-index.scss#L114
3
- position: fixed;
4
- left: 0;
5
- top: -60px;
6
- right: 0;
7
- bottom: 0;
8
- display: flex;
9
- justify-content: center;
10
- overflow-y: hidden;
2
+ z-index: 1005; // This value should be in correlation with the value of $zindex-full-screen-overlay in EE: https://github.com/wix-private/editor-elements/blob/900b1a7344e69b95e99e166c5abac9d901c53b32/packages/thunderbolt-elements/src/core/style/z-index.scss#L114
3
+ position: fixed;
4
+ left: 0;
5
+ top: -60px;
6
+ right: 0;
7
+ bottom: 0;
8
+ display: flex;
9
+ justify-content: center;
10
+ overflow-y: hidden;
11
11
 
12
- > .fullScreenOverlayContent {
13
- margin: 0 auto;
14
- position: absolute;
15
- right: 0;
16
- top: 60px;
17
- left: 0;
18
- bottom: 0;
19
- overflow: hidden;
20
- transform: translateZ(0);
21
- }
12
+ > .fullScreenOverlayContent {
13
+ margin: 0 auto;
14
+ position: absolute;
15
+ right: 0;
16
+ top: 60px;
17
+ left: 0;
18
+ bottom: 0;
19
+ overflow: hidden;
20
+ transform: translateZ(0);
21
+ }
22
22
  }
package/src/assets/scss/root_renderer.scss CHANGED
@@ -29,4 +29,4 @@
29
29
 
30
30
  .has-click-trigger {
31
31
  cursor: pointer;
32
- }
32
+ }
package/src/assets/scss/themeWiringVars.scss CHANGED
@@ -1,67 +1,67 @@
1
1
  :root {
2
- --wst-button-color-fill-primary: rgb(var(--color_48));
3
- --wst-button-color-border-primary: rgb(var(--color_49));
4
- --wst-button-color-text-primary: rgb(var(--color_50));
5
- --wst-button-color-fill-primary-hover: rgb(var(--color_51));
6
- --wst-button-color-border-primary-hover: rgb(var(--color_52));
7
- --wst-button-color-text-primary-hover: rgb(var(--color_53));
8
- --wst-button-color-fill-primary-disabled: rgb(var(--color_54));
9
- --wst-button-color-border-primary-disabled: rgb(var(--color_55));
10
- --wst-button-color-text-primary-disabled: rgb(var(--color_56));
11
- --wst-button-color-fill-secondary: rgb(var(--color_57));
12
- --wst-button-color-border-secondary: rgb(var(--color_58));
13
- --wst-button-color-text-secondary: rgb(var(--color_59));
14
- --wst-button-color-fill-secondary-hover: rgb(var(--color_60));
15
- --wst-button-color-border-secondary-hover: rgb(var(--color_61));
16
- --wst-button-color-text-secondary-hover: rgb(var(--color_62));
17
- --wst-button-color-fill-secondary-disabled: rgb(var(--color_63));
18
- --wst-button-color-border-secondary-disabled: rgb(var(--color_64));
19
- --wst-button-color-text-secondary-disabled: rgb(var(--color_65));
20
- --wst-color-fill-base-1: rgb(var(--color_36));
21
- --wst-color-fill-base-2: rgb(var(--color_37));
22
- --wst-color-fill-base-shade-1: rgb(var(--color_38));
23
- --wst-color-fill-base-shade-2: rgb(var(--color_39));
24
- --wst-color-fill-base-shade-3: rgb(var(--color_40));
25
- --wst-color-fill-accent-1: rgb(var(--color_41));
26
- --wst-color-fill-accent-2: rgb(var(--color_42));
27
- --wst-color-fill-accent-3: rgb(var(--color_43));
28
- --wst-color-fill-accent-4: rgb(var(--color_44));
29
- --wst-color-fill-background-primary: rgb(var(--color_11));
30
- --wst-color-fill-background-secondary: rgb(var(--color_12));
31
- --wst-color-text-primary: rgb(var(--color_15));
32
- --wst-color-text-secondary: rgb(var(--color_14));
33
- --wst-color-action: rgb(var(--color_18));
34
- --wst-color-disabled: rgb(var(--color_39));
35
- --wst-color-title: rgb(var(--color_45));
36
- --wst-color-subtitle: rgb(var(--color_46));
37
- --wst-color-line: rgb(var(--color_47));
38
- --wst-font-style-h2: var(--font_2);
39
- --wst-font-style-h3: var(--font_3);
40
- --wst-font-style-h4: var(--font_4);
41
- --wst-font-style-h5: var(--font_5);
42
- --wst-font-style-h6: var(--font_6);
43
- --wst-font-style-body-large: var(--font_7);
44
- --wst-font-style-body-medium: var(--font_8);
45
- --wst-font-style-body-small: var(--font_9);
46
- --wst-font-style-body-x-small: var(--font_10);
47
- --wst-color-custom-1: rgb(var(--color_13));
48
- --wst-color-custom-2: rgb(var(--color_16));
49
- --wst-color-custom-3: rgb(var(--color_17));
50
- --wst-color-custom-4: rgb(var(--color_19));
51
- --wst-color-custom-5: rgb(var(--color_20));
52
- --wst-color-custom-6: rgb(var(--color_21));
53
- --wst-color-custom-7: rgb(var(--color_22));
54
- --wst-color-custom-8: rgb(var(--color_23));
55
- --wst-color-custom-9: rgb(var(--color_24));
56
- --wst-color-custom-10: rgb(var(--color_25));
57
- --wst-color-custom-11: rgb(var(--color_26));
58
- --wst-color-custom-12: rgb(var(--color_27));
59
- --wst-color-custom-13: rgb(var(--color_28));
60
- --wst-color-custom-14: rgb(var(--color_29));
61
- --wst-color-custom-15: rgb(var(--color_30));
62
- --wst-color-custom-16: rgb(var(--color_31));
63
- --wst-color-custom-17: rgb(var(--color_32));
64
- --wst-color-custom-18: rgb(var(--color_33));
65
- --wst-color-custom-19: rgb(var(--color_34));
66
- --wst-color-custom-20: rgb(var(--color_35));
67
- }
2
+ --wst-button-color-fill-primary: rgb(var(--color_48));
3
+ --wst-button-color-border-primary: rgb(var(--color_49));
4
+ --wst-button-color-text-primary: rgb(var(--color_50));
5
+ --wst-button-color-fill-primary-hover: rgb(var(--color_51));
6
+ --wst-button-color-border-primary-hover: rgb(var(--color_52));
7
+ --wst-button-color-text-primary-hover: rgb(var(--color_53));
8
+ --wst-button-color-fill-primary-disabled: rgb(var(--color_54));
9
+ --wst-button-color-border-primary-disabled: rgb(var(--color_55));
10
+ --wst-button-color-text-primary-disabled: rgb(var(--color_56));
11
+ --wst-button-color-fill-secondary: rgb(var(--color_57));
12
+ --wst-button-color-border-secondary: rgb(var(--color_58));
13
+ --wst-button-color-text-secondary: rgb(var(--color_59));
14
+ --wst-button-color-fill-secondary-hover: rgb(var(--color_60));
15
+ --wst-button-color-border-secondary-hover: rgb(var(--color_61));
16
+ --wst-button-color-text-secondary-hover: rgb(var(--color_62));
17
+ --wst-button-color-fill-secondary-disabled: rgb(var(--color_63));
18
+ --wst-button-color-border-secondary-disabled: rgb(var(--color_64));
19
+ --wst-button-color-text-secondary-disabled: rgb(var(--color_65));
20
+ --wst-color-fill-base-1: rgb(var(--color_36));
21
+ --wst-color-fill-base-2: rgb(var(--color_37));
22
+ --wst-color-fill-base-shade-1: rgb(var(--color_38));
23
+ --wst-color-fill-base-shade-2: rgb(var(--color_39));
24
+ --wst-color-fill-base-shade-3: rgb(var(--color_40));
25
+ --wst-color-fill-accent-1: rgb(var(--color_41));
26
+ --wst-color-fill-accent-2: rgb(var(--color_42));
27
+ --wst-color-fill-accent-3: rgb(var(--color_43));
28
+ --wst-color-fill-accent-4: rgb(var(--color_44));
29
+ --wst-color-fill-background-primary: rgb(var(--color_11));
30
+ --wst-color-fill-background-secondary: rgb(var(--color_12));
31
+ --wst-color-text-primary: rgb(var(--color_15));
32
+ --wst-color-text-secondary: rgb(var(--color_14));
33
+ --wst-color-action: rgb(var(--color_18));
34
+ --wst-color-disabled: rgb(var(--color_39));
35
+ --wst-color-title: rgb(var(--color_45));
36
+ --wst-color-subtitle: rgb(var(--color_46));
37
+ --wst-color-line: rgb(var(--color_47));
38
+ --wst-font-style-h2: var(--font_2);
39
+ --wst-font-style-h3: var(--font_3);
40
+ --wst-font-style-h4: var(--font_4);
41
+ --wst-font-style-h5: var(--font_5);
42
+ --wst-font-style-h6: var(--font_6);
43
+ --wst-font-style-body-large: var(--font_7);
44
+ --wst-font-style-body-medium: var(--font_8);
45
+ --wst-font-style-body-small: var(--font_9);
46
+ --wst-font-style-body-x-small: var(--font_10);
47
+ --wst-color-custom-1: rgb(var(--color_13));
48
+ --wst-color-custom-2: rgb(var(--color_16));
49
+ --wst-color-custom-3: rgb(var(--color_17));
50
+ --wst-color-custom-4: rgb(var(--color_19));
51
+ --wst-color-custom-5: rgb(var(--color_20));
52
+ --wst-color-custom-6: rgb(var(--color_21));
53
+ --wst-color-custom-7: rgb(var(--color_22));
54
+ --wst-color-custom-8: rgb(var(--color_23));
55
+ --wst-color-custom-9: rgb(var(--color_24));
56
+ --wst-color-custom-10: rgb(var(--color_25));
57
+ --wst-color-custom-11: rgb(var(--color_26));
58
+ --wst-color-custom-12: rgb(var(--color_27));
59
+ --wst-color-custom-13: rgb(var(--color_28));
60
+ --wst-color-custom-14: rgb(var(--color_29));
61
+ --wst-color-custom-15: rgb(var(--color_30));
62
+ --wst-color-custom-16: rgb(var(--color_31));
63
+ --wst-color-custom-17: rgb(var(--color_32));
64
+ --wst-color-custom-18: rgb(var(--color_33));
65
+ --wst-color-custom-19: rgb(var(--color_34));
66
+ --wst-color-custom-20: rgb(var(--color_35));
67
+ }
package/src/assets/scss/transforms.scss CHANGED
@@ -1,8 +1,8 @@
1
1
  // For 3D Transforms Safari Workaround
2
2
  [data-z-counter] {
3
- z-index: 0;
3
+ z-index: 0;
4
4
  }
5
5
 
6
- [data-z-counter="0"] {
7
- z-index: auto;
6
+ [data-z-counter='0'] {
7
+ z-index: auto;
8
8
  }
package/src/assets/scss/view-transitions.scss CHANGED
@@ -1,45 +1,45 @@
1
1
  @keyframes slide-horizontal-new {
2
- from {
3
- transform: translateX(100%);
4
- }
2
+ from {
3
+ transform: translateX(100%);
4
+ }
5
5
  }
6
6
 
7
7
  @keyframes slide-horizontal-old {
8
- 80% {
9
- opacity: 1;
10
- }
11
- to {
12
- opacity: 0;
13
- transform: translateX(-100%);
14
- }
8
+ 80% {
9
+ opacity: 1;
10
+ }
11
+ to {
12
+ opacity: 0;
13
+ transform: translateX(-100%);
14
+ }
15
15
  }
16
16
 
17
17
  @keyframes slide-vertical-new {
18
- from {
19
- transform: translateY(-100%);
20
- }
18
+ from {
19
+ transform: translateY(-100%);
20
+ }
21
21
  }
22
22
 
23
23
  @keyframes slide-vertical-old {
24
- 80% {
25
- opacity: 1;
26
- }
27
- to {
28
- opacity: 0;
29
- transform: translateY(100%);
30
- }
24
+ 80% {
25
+ opacity: 1;
26
+ }
27
+ to {
28
+ opacity: 0;
29
+ transform: translateY(100%);
30
+ }
31
31
  }
32
32
 
33
33
  @keyframes out-in-new {
34
- from {
35
- opacity: 0;
36
- }
34
+ from {
35
+ opacity: 0;
36
+ }
37
37
  }
38
38
 
39
39
  @keyframes out-in-old {
40
- to {
41
- opacity: 0;
42
- }
40
+ to {
41
+ opacity: 0;
42
+ }
43
43
  }
44
44
 
45
45
  $easeQuintIn: cubic-bezier(0.64, 0, 0.78, 0);
@@ -48,74 +48,74 @@ $easeQuintInOut: cubic-bezier(0.83, 0, 0.17, 1);
48
48
 
49
49
  // disable the default cross fade view transition
50
50
  :root:active-view-transition {
51
- view-transition-name: none;
51
+ view-transition-name: none;
52
52
  }
53
53
 
54
54
  :root:active-view-transition::view-transition-group(*),
55
55
  :root:active-view-transition::view-transition-old(*),
56
56
  :root:active-view-transition::view-transition-new(*) {
57
- animation: none;
57
+ animation: none;
58
58
  }
59
59
 
60
60
  // disable default stylesheet rule, allow clicks on the non transitioning elements (i.e. menu) during transition
61
61
  ::view-transition {
62
- pointer-events: none;
62
+ pointer-events: none;
63
63
  }
64
64
 
65
65
  // Create transition groups for elements so they are layered correctly during transition
66
66
  // Otherwise they are treated as background and the page content renders above them
67
67
  // (e.g. when animating SlideVertical)
68
68
  :root:active-view-transition #SITE_HEADER {
69
- view-transition-name: header-group;
69
+ view-transition-name: header-group;
70
70
  }
71
71
  :root:active-view-transition #WIX_ADS {
72
- view-transition-name: wix-ads-group;
72
+ view-transition-name: wix-ads-group;
73
73
  }
74
74
  :root:active-view-transition #SITE_FOOTER {
75
- view-transition-name: footer-group;
75
+ view-transition-name: footer-group;
76
76
  }
77
77
  :root:active-view-transition #BACKGROUND_GROUP_TRANSITION_GROUP > div {
78
- view-transition-name: background-group;
78
+ view-transition-name: background-group;
79
79
  }
80
80
 
81
81
  :root:active-view-transition::view-transition-group(page-group),
82
82
  :root:active-view-transition::view-transition-old(page-group),
83
83
  :root:active-view-transition::view-transition-new(page-group) {
84
- pointer-events: all;
85
- cursor: wait;
86
- animation: revert; // Restore the default CrossFade that the wildcard rule disables
87
- animation-duration: 600ms;
84
+ pointer-events: all;
85
+ cursor: wait;
86
+ animation: revert; // Restore the default CrossFade that the wildcard rule disables
87
+ animation-duration: 600ms;
88
88
  }
89
89
 
90
90
  :root:active-view-transition-type(SlideHorizontal)::view-transition-old(page-group) {
91
- mix-blend-mode: normal;
92
- animation: slide-horizontal-old 600ms $easeQuintInOut forwards;
91
+ mix-blend-mode: normal;
92
+ animation: slide-horizontal-old 600ms $easeQuintInOut forwards;
93
93
  }
94
94
  :root:active-view-transition-type(SlideHorizontal)::view-transition-new(page-group) {
95
- mix-blend-mode: normal;
96
- animation: slide-horizontal-new 600ms $easeQuintInOut backwards;
95
+ mix-blend-mode: normal;
96
+ animation: slide-horizontal-new 600ms $easeQuintInOut backwards;
97
97
  }
98
98
 
99
99
  :root:active-view-transition-type(SlideVertical)::view-transition-old(page-group) {
100
- mix-blend-mode: normal;
101
- animation: slide-vertical-old 600ms $easeQuintInOut forwards;
100
+ mix-blend-mode: normal;
101
+ animation: slide-vertical-old 600ms $easeQuintInOut forwards;
102
102
  }
103
103
  :root:active-view-transition-type(SlideVertical)::view-transition-new(page-group) {
104
- mix-blend-mode: normal;
105
- animation: slide-vertical-new 600ms $easeQuintInOut backwards;
104
+ mix-blend-mode: normal;
105
+ animation: slide-vertical-new 600ms $easeQuintInOut backwards;
106
106
  }
107
107
 
108
108
  :root:active-view-transition-type(OutIn)::view-transition-old(page-group) {
109
- animation: out-in-old 350ms $easeQuintOut forwards;
109
+ animation: out-in-old 350ms $easeQuintOut forwards;
110
110
  }
111
111
  :root:active-view-transition-type(OutIn)::view-transition-new(page-group) {
112
- animation: out-in-new 350ms 350ms $easeQuintIn backwards;
112
+ animation: out-in-new 350ms 350ms $easeQuintIn backwards;
113
113
  }
114
114
 
115
115
  @media (prefers-reduced-motion: reduce) {
116
- ::view-transition-group(*),
117
- ::view-transition-old(*),
118
- ::view-transition-new(*) {
119
- animation: none !important;
120
- }
116
+ ::view-transition-group(*),
117
+ ::view-transition-old(*),
118
+ ::view-transition-new(*) {
119
+ animation: none !important;
120
+ }
121
121
  }
package/src/assets/scss/wixSites.scss CHANGED
@@ -1,4 +1,4 @@
1
1
  .wixSiteProperties {
2
- -webkit-font-smoothing: antialiased;
3
- -moz-osx-font-smoothing: grayscale;
2
+ -webkit-font-smoothing: antialiased;
3
+ -moz-osx-font-smoothing: grayscale;
4
4
  }
package/src/viewer.global.scss CHANGED
@@ -1,21 +1,25 @@
1
- @import "./assets/scss/view-transitions.scss";
1
+ @import './assets/scss/view-transitions.scss';
2
2
 
3
3
  /* Global reset rules: */
4
4
 
5
5
  html,
6
6
  body {
7
- margin: 0;
8
- padding: 0;
9
- border: 0;
10
- outline: 0;
11
- vertical-align: baseline;
12
- background: transparent;
7
+ margin: 0;
8
+ padding: 0;
9
+ border: 0;
10
+ outline: 0;
11
+ vertical-align: baseline;
12
+ background: transparent;
13
13
  }
14
14
 
15
15
  body {
16
- font-size: 10px;
17
- font-family: Arial, Helvetica, sans-serif;
18
- --scrollbar-width: 0px;
16
+ font-size: 10px;
17
+ font-family: Arial, Helvetica, sans-serif;
18
+ --scrollbar-width: 0px;
19
+ // This is to prevent the text from being lareger than it should be in on iOS devices
20
+ -webkit-text-size-adjust: 100%;
21
+ -moz-text-size-adjust: 100%;
22
+ text-size-adjust: 100%;
19
23
  }
20
24
 
21
25
  // *
@@ -24,7 +28,7 @@ body {
24
28
  // *
25
29
  html,
26
30
  body {
27
- height: 100%;
31
+ height: 100%;
28
32
  }
29
33
 
30
34
  // *************************************
@@ -33,37 +37,37 @@ body {
33
37
 
34
38
  // When in Public Viewer Mode
35
39
  body {
36
- overflow-x: auto;
37
- overflow-y: scroll;
40
+ overflow-x: auto;
41
+ overflow-y: scroll;
38
42
  }
39
43
 
40
44
  /* Global root rules: */
41
45
 
42
46
  body:not(.responsive) {
43
- #site-root {
44
- width: 100%;
45
- min-width: var(--site-width);
46
- }
47
+ #site-root {
48
+ width: 100%;
49
+ min-width: var(--site-width);
50
+ }
47
51
  }
48
52
 
49
53
  body:not([data-js-loaded]) [data-hide-prejs] {
50
- visibility: hidden;
54
+ visibility: hidden;
51
55
  }
52
56
 
53
57
  interact-element {
54
- display: contents;
58
+ display: contents;
55
59
  }
56
60
 
57
61
  #SITE_CONTAINER {
58
- position: relative;
62
+ position: relative;
59
63
  }
60
64
 
61
65
  :root {
62
- --one-unit: 1vw;
63
- --section-max-width: 9999px;
64
- --spx-stopper-max: 9999px;
65
- --spx-stopper-min: 0px;
66
- --browser-zoom: 1;
66
+ --one-unit: 1vw;
67
+ --section-max-width: 9999px;
68
+ --spx-stopper-max: 9999px;
69
+ --spx-stopper-min: 0px;
70
+ --browser-zoom: 1;
67
71
  }
68
72
 
69
73
  // We want to apply this only to Safari, using this hack which is supposed to work for at least Safari 13:
@@ -71,24 +75,26 @@ interact-element {
71
75
  // Was tested on Dec 2023 for Safari 17, iOS Safari 17, Chrome 120, firefox 120
72
76
  // (@see same usage in editor elements TextMask)
73
77
  @supports (-webkit-appearance: none) and (stroke-color: transparent) {
74
- :root {
75
- --safari-sticky-fix: opacity;
76
- --experimental-safari-sticky-fix: translateZ(0);
77
- }
78
+ :root {
79
+ --safari-sticky-fix: opacity;
80
+ --experimental-safari-sticky-fix: translateZ(0);
81
+ }
78
82
  }
79
83
 
80
- @supports (container-type:inline-size) {
81
- :root {
82
- --one-unit: 1cqw;
83
- }
84
+ @supports (container-type: inline-size) {
85
+ :root {
86
+ --one-unit: 1cqw;
87
+ }
84
88
  }
85
89
 
86
90
  // Global styles for old Hoverbox migration
87
- [id^="oldHoverBox-"] {
88
- transition: opacity 0.5s ease, visibility 0.5s ease;
89
- mix-blend-mode: plus-lighter;
91
+ [id^='oldHoverBox-'] {
92
+ transition:
93
+ opacity 0.5s ease,
94
+ visibility 0.5s ease;
95
+ mix-blend-mode: plus-lighter;
90
96
  }
91
97
 
92
- [data-mesh-id$="inlineContent-gridContainer"]:has(> [id^="oldHoverBox-"]) {
93
- isolation: isolate;
98
+ [data-mesh-id$='inlineContent-gridContainer']:has(> [id^='oldHoverBox-']) {
99
+ isolation: isolate;
94
100
  }