diff --git a/package-lock.json b/package-lock.json index 43080fc..7710fc4 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1833,7 +1833,6 @@ "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==", "dev": true, "license": "MIT", - "peer": true, "engines": { "node": ">=12" }, @@ -2012,7 +2011,6 @@ "integrity": "sha512-+VUy01yfDqNmIVMd/LLKl2TTtY0ovZN0rTonh+FhKr65mFwIYgU9WzgIZKS7U9/SPCQvWTsTGx9jyt+qRm/XFw==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "@bufbuild/protobuf": "^2.5.0", "buffer-builder": "^0.2.0", @@ -2491,7 +2489,6 @@ "integrity": "sha512-NL8jTlbo0Tn4dUEXEsUg8KeyG/Lkmc4Fnzb8JXN/Ykm9G4HNImjtABMJgkQoVjOBN/j2WAwDTRytdqJbZsah7w==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "esbuild": "^0.25.0", "fdir": "^6.5.0", @@ -2566,7 +2563,6 @@ "resolved": "https://registry.npmjs.org/vue/-/vue-3.5.25.tgz", "integrity": "sha512-YLVdgv2K13WJ6n+kD5owehKtEXwdwXuj2TTyJMsO7pSeKw2bfRNZGjhB7YzrpbMYj5b5QsUebHpOqR3R3ziy/g==", "license": "MIT", - "peer": true, "dependencies": { "@vue/compiler-dom": "3.5.25", "@vue/compiler-sfc": "3.5.25", diff --git a/public/assets/css/src/_buttons.scss b/public/assets/css/src/_buttons.scss index 4e0927b..e0f4c7e 100644 --- a/public/assets/css/src/_buttons.scss +++ b/public/assets/css/src/_buttons.scss @@ -1,59 +1,22 @@ +button { + cursor: pointer; -.unit-toggle{ - button:not(.spinner-btn) { - cursor: pointer; - - border: 1px solid var(--color-interface-400); - color: var(--color-interface-400); - background-color: var(--color-panel-bg); - border-radius: var(--border-radius); - padding: 0.1rem 0.3rem; - height: calc(var(--input-h)*0.75); - + border: 1px solid var(--color-browngray-300); + color: var(--color-browngray-300); + background-color: var(--color-panel-bg); + border-radius: var(--border-radius); + padding: 0.1rem 0.3rem; - &:not(.active):hover{ - background-color: var(--color-interface-100); - } - + &.active { + border: 1px solid #000; + color: #000; + } + + &.tab { &.active { - // border: 1px solid var(--color-interface-700); - color: var(--color-interface-050); - background-color: var(--color-interface-500); - cursor: auto; - } - - - } -} - - -#editor-panel .tabs{ - .tab{ - color: var(--color-interface-600); - font-size: 1rem; - font-family: var(--sans-serif); - height: var(--input-h); - padding: 0 1ch; - border: 1px solid currentColor; - border-radius: calc(var(--input-h)); - font-weight: 500; - - &.active{ - background-color: var(--color-interface-400); - border-color: var(--color-interface-400); - color: var(--color-panel-bg); - } - - &:not(.active):hover{ - cursor: pointer; - background-color: var(--color-interface-100); + background-color: #000; + color: #fff; + border: none; } } - // .tab { - // &.active { - // background-color: var(--color-txt); - // color: #fff; - // border: none; - // } - // } } diff --git a/public/assets/css/src/_colors.scss b/public/assets/css/src/_colors.scss deleted file mode 100644 index f3996c0..0000000 --- a/public/assets/css/src/_colors.scss +++ /dev/null @@ -1,105 +0,0 @@ -:root{ - - - - - // BRONZE SUBTIL - --color-interface-050: #f5f0ed; - --color-interface-050: #f8f5f4; - --color-interface-100: #efe9e6; - --color-interface-200: #e0d5d0; - --color-interface-300: #cabbb5; - --color-interface-400: #b2a29c; - --color-interface-500: #998985; - --color-interface-600: #7f716e; - --color-interface-700: #675b58; - --color-interface-800: #5b4f4c; - --color-interface-900: #483c39; - - - --color-050: #f5f0ed; - --color-050: #f8f5f4; - --color-100: #efe9e6; - --color-200: #e0d5d0; - --color-300: #cabbb5; - --color-400: #b2a29c; - --color-500: #998985; - --color-600: #7f716e; - --color-700: #675b58; - --color-800: #5b4f4c; - --color-900: #483c39; - - - - - - // MARRON -// --color-interface-050: #fcf7f4; -// --color-interface-100: #f5eae4; -// --color-interface-200: #e9d4c8; -// --color-interface-300: #d8b7a6; -// --color-interface-400: #c39986; -// --color-interface-500: #ad826f; -// --color-interface-600: #916b5b; -// --color-interface-700: #755548; -// --color-interface-800: #5c443a; -// --color-interface-900: #46342b; - - - - - // CHAMPAGNE - // --color-interface-050: #f9f6f4; - // --color-interface-100: #f2ebe6; - // --color-interface-200: #e6d8cf; - // --color-interface-300: #d4c2b7; - // --color-interface-400: #c2ac9d; - // --color-interface-500: #ac9383; - // --color-interface-600: #927a6a; - // --color-interface-700: #776356; - // --color-interface-800: #5e4e45; - // --color-interface-900: #473a32; - - // GREY - // --color-interface-050: #f7f6f4; - // --color-interface-100: #eceae6; - // --color-interface-200: #dedbd6; - // --color-interface-300: #c9c5be; - // --color-interface-400: #b4afa7; - // --color-interface-500: #9d978f; - // --color-interface-600: #86817a; - // --color-interface-700: #6e6a63; - // --color-interface-800: #55534d; - // --color-interface-900: #3e3c37; - - -} - - - -[data-color-type="elem"]{ - --color-050: #fff4ec; - --color-100: #ffe6d6; - --color-200: #ffd1b5; - --color-300: #ffbc94; - --color-400: #ffa673; - --color-500: #ff945b; - --color-600: #ff8d54; - --color-700: #f97f46; - --color-800: #ff8a50; - --color-900: #d96a30; -} - - -[data-color-type="page"]{ - --color-050: #f4f0ff; - --color-100: #e7e1ff; - --color-200: #d4c8ff; - --color-300: #b9a8ff; - --color-400: #9f89ff; - --color-500: #866aff; - --color-600: #7a52ff; - --color-700: #7442ff; - --color-800: #7136ff; - --color-900: #5223d6; -} \ No newline at end of file diff --git a/public/assets/css/src/_fonts.scss b/public/assets/css/src/_fonts.scss deleted file mode 100644 index e94ed06..0000000 --- a/public/assets/css/src/_fonts.scss +++ /dev/null @@ -1,162 +0,0 @@ -// DM Sans - Variable font (recommended) -@font-face { - font-family: 'DM Sans'; - src: url('/assets/fonts/DMSans/DMSans[opsz,wght].woff2') format('woff2-variations'); - font-weight: 100 1000; - font-style: normal; - font-display: swap; -} - -@font-face { - font-family: 'DM Sans'; - src: url('/assets/fonts/DMSans/DMSans-Italic[opsz,wght].woff2') format('woff2-variations'); - font-weight: 100 1000; - font-style: italic; - font-display: swap; -} - -// DM Sans - Static weights (fallback) -@font-face { - font-family: 'DM Sans'; - src: url('/assets/fonts/DMSans/DMSans-Thin.woff2') format('woff2'); - font-weight: 100; - font-style: normal; - font-display: swap; -} - -@font-face { - font-family: 'DM Sans'; - src: url('/assets/fonts/DMSans/DMSans-ExtraLight.woff2') format('woff2'); - font-weight: 200; - font-style: normal; - font-display: swap; -} - -@font-face { - font-family: 'DM Sans'; - src: url('/assets/fonts/DMSans/DMSans-Light.woff2') format('woff2'); - font-weight: 300; - font-style: normal; - font-display: swap; -} - -@font-face { - font-family: 'DM Sans'; - src: url('/assets/fonts/DMSans/DMSans-Regular.woff2') format('woff2'); - font-weight: 400; - font-style: normal; - font-display: swap; -} - -@font-face { - font-family: 'DM Sans'; - src: url('/assets/fonts/DMSans/DMSans-Medium.woff2') format('woff2'); - font-weight: 500; - font-style: normal; - font-display: swap; -} - -@font-face { - font-family: 'DM Sans'; - src: url('/assets/fonts/DMSans/DMSans-SemiBold.woff2') format('woff2'); - font-weight: 600; - font-style: normal; - font-display: swap; -} - -@font-face { - font-family: 'DM Sans'; - src: url('/assets/fonts/DMSans/DMSans-Bold.woff2') format('woff2'); - font-weight: 700; - font-style: normal; - font-display: swap; -} - -@font-face { - font-family: 'DM Sans'; - src: url('/assets/fonts/DMSans/DMSans-ExtraBold.woff2') format('woff2'); - font-weight: 800; - font-style: normal; - font-display: swap; -} - -@font-face { - font-family: 'DM Sans'; - src: url('/assets/fonts/DMSans/DMSans-Black.woff2') format('woff2'); - font-weight: 900; - font-style: normal; - font-display: swap; -} - -// Inconsolata - Monospace font -@font-face { - font-family: 'Inconsolata'; - src: url('/assets/fonts/Inconsolata/Inconsolata-Thin.woff2') format('woff2'); - font-weight: 100; - font-style: normal; - font-display: swap; -} - -@font-face { - font-family: 'Inconsolata'; - src: url('/assets/fonts/Inconsolata/Inconsolata-ExtraLight.woff2') format('woff2'); - font-weight: 200; - font-style: normal; - font-display: swap; -} - -@font-face { - font-family: 'Inconsolata'; - src: url('/assets/fonts/Inconsolata/Inconsolata-Light.woff2') format('woff2'); - font-weight: 300; - font-style: normal; - font-display: swap; -} - -@font-face { - font-family: 'Inconsolata'; - src: url('/assets/fonts/Inconsolata/Inconsolata-Regular.woff2') format('woff2'); - font-weight: 400; - font-style: normal; - font-display: swap; -} - -@font-face { - font-family: 'Inconsolata'; - src: url('/assets/fonts/Inconsolata/Inconsolata-Medium.woff2') format('woff2'); - font-weight: 500; - font-style: normal; - font-display: swap; -} - -@font-face { - font-family: 'Inconsolata'; - src: url('/assets/fonts/Inconsolata/Inconsolata-SemiBold.woff2') format('woff2'); - font-weight: 600; - font-style: normal; - font-display: swap; -} - -@font-face { - font-family: 'Inconsolata'; - src: url('/assets/fonts/Inconsolata/Inconsolata-Bold.woff2') format('woff2'); - font-weight: 700; - font-style: normal; - font-display: swap; -} - -@font-face { - font-family: 'Inconsolata'; - src: url('/assets/fonts/Inconsolata/Inconsolata-ExtraBold.woff2') format('woff2'); - font-weight: 800; - font-style: normal; - font-display: swap; -} - -@font-face { - font-family: 'Inconsolata'; - src: url('/assets/fonts/Inconsolata/Inconsolata-Black.woff2') format('woff2'); - font-weight: 900; - font-style: normal; - font-display: swap; -} diff --git a/public/assets/css/src/_forms-section.scss b/public/assets/css/src/_forms-section.scss deleted file mode 100644 index 2290d07..0000000 --- a/public/assets/css/src/_forms-section.scss +++ /dev/null @@ -1,56 +0,0 @@ -.settings-section { - - margin-top: 3em; - - - // .cons - - - - h2 { - margin-bottom: var(--space); - - font-weight: 600; - font-size: 1.4rem; - // border-radius: var(--border-radius); - // height: var(--input-h); - // padding: 0 1ch; - // display: flex; - // align-items: center; - - // color: var(--color-interface-050); - // background-color: var(--color-800); - // display: inline-block; - - border-bottom: 1px solid var(--color-200); - color: var(--color-800); - -// border-bottom: 2px solid currentColor; -// margin-bottom: 2rem; - } - - .infos{ - font-size: 0.8rem; - color: var(--color-interface-400); - } - - .settings-subsection:not(:last-child) { - border-bottom: 1px solid var(--color-interface-100); - } - - .settings-subsection { - padding: var(--space-xs) 0; - - h3 { - margin-top: calc(var(--space-xs)*1.5); - margin-bottom: calc(var(--space-xs)*2); - // color: var(--color-600); - font-size: 1rem; - font-weight: 600; - - } - } -} - - - \ No newline at end of file diff --git a/public/assets/css/src/_forms.scss b/public/assets/css/src/_forms.scss index f687355..75f67da 100644 --- a/public/assets/css/src/_forms.scss +++ b/public/assets/css/src/_forms.scss @@ -1,132 +1,17 @@ select, input[type="text"], input[type="number"] { - height: var(--input-h); - border: 1px solid var(--color-interface-200); - background-color: var(--color-interface-100); - font-family: var(--sans-serif); - font-size: 1rem; - // min-width: var(--input-w); - // width: 100%; - // padding: 0 1ch; - + background-color: var(--color-browngray-300); } -.field { - display: flex; - - // label{ - // width: var(--label-w); - // background-color: red; - // flex-grow: 3; - // } - - label { - font-weight: 600; - color: var(--color-800); - } - - - - .input-with-unit { - display: flex; - gap: 0.3rem; - - - } - - .unit-toggle { - height: var(--input-h); - display: flex; - gap: 0.3rem; - align-items: center; - } - - .input-with-color { - width: 100%; - .clr-field { - width: 100%; - display: grid; - grid-template-columns: var(--input-h); - grid-gap: 1ch; - button{ - grid-column: 1; - position: relative; - border-radius: var(--border-radius); - - } - input{ - grid-column: 2; - } - - } - } -} - - -.field{ - display: grid; - grid-template-columns: var(--label-w) 1fr; - label{ - align-self: center; - } -} - -.field-font{ - display: grid; - grid-template-columns: var(--label-w) 1fr; - grid-template-rows: var(--input-h) var(--input-h); - - select{ - width: 100%; - } - .field-checkbox{ - padding-top: var(--space-xs); - label{ - font-weight: 400; - margin-left: 0.75ch; - } - } -} - -.field-margin, .field-size{ - display: inline-grid; - width: calc(50% - 1ch); - grid-template-columns: 6.5ch var(--input-w-small) 1fr; - margin-bottom: var(--space-xs); - input{ - width: var(--input-w-small); - padding-left: 0.75ch; - } - &:nth-of-type(odd){ - margin-right: 2ch; - - } - -} - -.checkbox-field{ - margin: calc(var(--space-xs)*2) 0; - grid-template-columns: 3ch 1fr; - label{ - // font-weight: normal; - } - input{ - justify-self: left; - margin: 0; - } -} - - - - .field--view-only { opacity: 0.3; } /* Label with CSS tooltip */ .label-with-tooltip { - text-decoration: underline dotted 1px var(--color-200); + text-decoration: underline dotted; + text-decoration-color: var(--color-browngray-200); text-underline-offset: 2px; cursor: help; position: relative; @@ -138,9 +23,9 @@ input[type="number"] { left: 0; margin-bottom: 4px; padding: 0.25rem 0.5rem; - background: var(--color-interface-700); - color: var(--color-interface-050); - font-family: var(--mono); + background: var(--color-browngray-700); + color: var(--color-browngray-100); + font-family: "Courier New", Courier, monospace; font-size: 0.75rem; border-radius: 4px; white-space: nowrap; @@ -158,127 +43,86 @@ input[type="number"] { } } - - - - - - -// INPUT NUMBER =============================================== - -// Masquer les spinners natifs partout -input[type="number"]::-webkit-inner-spin-button, -input[type="number"]::-webkit-outer-spin-button { - -webkit-appearance: none; - appearance: none; - margin: 0; -} - -input[type="number"] { - -moz-appearance: textfield; -} - - -.number-input{ - position: relative; - // padding: 0 1ch!important; - input{ - padding-top: 0; - padding-bottom: 0; +.settings-section { + h2 { + border-bottom: 1px solid #000; + margin-bottom: var(--space-xs); } - .spinner-buttons{ - height: var(--input-h); - width: var(--input-h); - display: flex; - flex-direction: column; - position: absolute; - right: 0; - top: 0; - - button{ - height: calc(var(--input-h)*0.6); - cursor: pointer; - padding: 0; - svg path{ - fill: var(--color-interface-600); - } - &:hover{ - svg path{ - fill: var(--color-interface-900); - } - } - } - .spinner-down{ - svg{ - position: relative; - top: -2px; - } - } - - + .settings-subsection:not(:last-child) { + border-bottom: 1px solid var(--color-browngray-050); } + .settings-subsection { + padding: var(--space-xs) 0; + + h3 { + margin-bottom: var(--space-xs); + } + + .field { + display: flex; + + label, + select { + width: 50%; + } + + input { + padding: 0.1rem 0.1rem 0.1rem 0.3rem; + } + + .input-with-unit { + display: flex; + gap: 0.3rem; + + .unit-toggle { + display: flex; + gap: 0.3rem; + } + } + + .input-with-color { + width: 50%; + .clr-field { + display: flex; + button { + position: absolute; + transform: none; + height: 1.1rem; + top: auto; + right: auto; + cursor: pointer; + } + + input { + padding-left: 2.5rem; + width: 100%; + } + } + } + } + + &.margins { + display: flex; + flex-wrap: wrap; + row-gap: var(--space-xs); + + h3 { + width: 100%; + } + .field { + width: 50%; + + label { + width: 30%; + } + + .input-with-unit { + input { + width: 50%; + } + } + } + } + } } -// Composant NumberInput avec boutons personnalisés -// .number-input { -// position: relative; -// display: flex; -// align-items: center; -// width: 100%; -// position: relative; - -// input[type="number"] { -// width: 100%; -// box-sizing: border-box; -// } - -// .spinner-buttons { -// background-color: red; -// position: absolute; -// right: 1px; -// top: 1px; -// bottom: 1px; -// display: flex; -// flex-direction: column; -// justify-content: center; -// gap: 1px; -// z-index: 10; - -// .spinner-btn { -// display: flex; -// align-items: center; -// justify-content: center; -// width: 20px; -// height: 10px; -// padding: 0; -// margin: 0; -// background-color: var(--color-interface-200); -// border: 1px solid var(--color-interface-300); -// border-radius: 2px; -// cursor: pointer; -// transition: background-color 0.15s ease; -// color: var(--color-interface-700); -// line-height: 0; - -// svg { -// width: 8px; -// height: 6px; -// display: block; -// } - -// &:hover:not(:disabled) { -// background-color: var(--color-interface-300); -// color: var(--color-interface-900); -// } - -// &:active:not(:disabled) { -// background-color: var(--color-interface-400); -// } - -// &:disabled { -// opacity: 0.3; -// cursor: not-allowed; -// } -// } -// } -// } diff --git a/public/assets/css/src/_reset.scss b/public/assets/css/src/_reset.scss index 8617ad6..ed3fb95 100644 --- a/public/assets/css/src/_reset.scss +++ b/public/assets/css/src/_reset.scss @@ -25,7 +25,3 @@ button { background-color: transparent; border: none; } - -img { - width: 100%; -} diff --git a/public/assets/css/src/_settings-popup.scss b/public/assets/css/src/_settings-popup.scss index e1d148b..797ecb3 100644 --- a/public/assets/css/src/_settings-popup.scss +++ b/public/assets/css/src/_settings-popup.scss @@ -60,38 +60,38 @@ } // Label with CSS tooltip -// .label-with-tooltip { -// text-decoration: underline dotted; -// text-underline-offset: 2px; -// cursor: help; -// position: relative; +.label-with-tooltip { + text-decoration: underline dotted; + text-underline-offset: 2px; + cursor: help; + position: relative; -// &::after { -// content: attr(data-css); -// position: absolute; -// bottom: 100%; -// left: 0; -// margin-bottom: 4px; -// padding: 0.25rem 0.5rem; -// background: var(--color-browngray-700, #3d3d3d); -// color: var(--color-browngray-100, #f5f5f5); -// font-family: "Courier New", Courier, monospace; -// font-size: 0.75rem; -// border-radius: 4px; -// white-space: nowrap; -// opacity: 0; -// visibility: hidden; -// transition: -// opacity 0.15s ease, -// visibility 0.15s ease; -// z-index: 10; -// } + &::after { + content: attr(data-css); + position: absolute; + bottom: 100%; + left: 0; + margin-bottom: 4px; + padding: 0.25rem 0.5rem; + background: var(--color-browngray-700, #3d3d3d); + color: var(--color-browngray-100, #f5f5f5); + font-family: "Courier New", Courier, monospace; + font-size: 0.75rem; + border-radius: 4px; + white-space: nowrap; + opacity: 0; + visibility: hidden; + transition: + opacity 0.15s ease, + visibility 0.15s ease; + z-index: 10; + } -// &:hover::after { -// opacity: 1; -// visibility: visible; -// } -// } + &:hover::after { + opacity: 1; + visibility: visible; + } +} // Inheritance lock/unlock button .inheritance-btn { diff --git a/public/assets/css/src/_text.scss b/public/assets/css/src/_text.scss index c74bd60..6c537a3 100644 --- a/public/assets/css/src/_text.scss +++ b/public/assets/css/src/_text.scss @@ -1,10 +1,15 @@ -body { - font-family: var(--sans-serif); - color: var(--color-txt); +body, +h1, +h2, +h3, +h4, +h5, +h6, +p, +a, +input, +select, +figcaption, +label { + font-family: sans-serif; } - -// code, -// pre, -// .monospace { -// font-family: 'Inconsolata', monospace; -// } diff --git a/public/assets/css/src/_variables.scss b/public/assets/css/src/_variables.scss index c550470..e8b86eb 100644 --- a/public/assets/css/src/_variables.scss +++ b/public/assets/css/src/_variables.scss @@ -1,37 +1,15 @@ :root { - - - + --color-panel-bg: #e8e6e5; --color-browngray-050: #f5f3f0; --color-browngray-200: #d0c4ba; + --color-browngray-300: #b5a9a1; - - - - - --color-txt: var(--color-interface-800); - --color-panel-bg: var(--color-interface-050); - --color-page-highlight: #ff8a50; --color-purple: #7136ff; --border-radius: 0.2rem; --space-xs: 0.5rem; - --space-s: 1rem; - --space: 1.5rem; --curve: cubic-bezier(0.86, 0, 0.07, 1); - - --sans-serif: 'DM Sans', sans-serif; - --mono: 'Inconsolata', monospace; - - - --input-h: 26px; - --input-w: 160px; - --input-w-small: 45px; - --label-w: 18ch; - font-size: 14px; - - --panel-w: 540px; } diff --git a/public/assets/css/style.css b/public/assets/css/style.css index 371c245..2d229d0 100644 --- a/public/assets/css/style.css +++ b/public/assets/css/style.css @@ -1,194 +1,3 @@ -@font-face { - font-family: "DM Sans"; - src: url("/assets/fonts/DMSans/DMSans[opsz,wght].woff2") format("woff2-variations"); - font-weight: 100 1000; - font-style: normal; - font-display: swap; -} -@font-face { - font-family: "DM Sans"; - src: url("/assets/fonts/DMSans/DMSans-Italic[opsz,wght].woff2") format("woff2-variations"); - font-weight: 100 1000; - font-style: italic; - font-display: swap; -} -@font-face { - font-family: "DM Sans"; - src: url("/assets/fonts/DMSans/DMSans-Thin.woff2") format("woff2"); - font-weight: 100; - font-style: normal; - font-display: swap; -} -@font-face { - font-family: "DM Sans"; - src: url("/assets/fonts/DMSans/DMSans-ExtraLight.woff2") format("woff2"); - font-weight: 200; - font-style: normal; - font-display: swap; -} -@font-face { - font-family: "DM Sans"; - src: url("/assets/fonts/DMSans/DMSans-Light.woff2") format("woff2"); - font-weight: 300; - font-style: normal; - font-display: swap; -} -@font-face { - font-family: "DM Sans"; - src: url("/assets/fonts/DMSans/DMSans-Regular.woff2") format("woff2"); - font-weight: 400; - font-style: normal; - font-display: swap; -} -@font-face { - font-family: "DM Sans"; - src: url("/assets/fonts/DMSans/DMSans-Medium.woff2") format("woff2"); - font-weight: 500; - font-style: normal; - font-display: swap; -} -@font-face { - font-family: "DM Sans"; - src: url("/assets/fonts/DMSans/DMSans-SemiBold.woff2") format("woff2"); - font-weight: 600; - font-style: normal; - font-display: swap; -} -@font-face { - font-family: "DM Sans"; - src: url("/assets/fonts/DMSans/DMSans-Bold.woff2") format("woff2"); - font-weight: 700; - font-style: normal; - font-display: swap; -} -@font-face { - font-family: "DM Sans"; - src: url("/assets/fonts/DMSans/DMSans-ExtraBold.woff2") format("woff2"); - font-weight: 800; - font-style: normal; - font-display: swap; -} -@font-face { - font-family: "DM Sans"; - src: url("/assets/fonts/DMSans/DMSans-Black.woff2") format("woff2"); - font-weight: 900; - font-style: normal; - font-display: swap; -} -@font-face { - font-family: "Inconsolata"; - src: url("/assets/fonts/Inconsolata/Inconsolata-Thin.woff2") format("woff2"); - font-weight: 100; - font-style: normal; - font-display: swap; -} -@font-face { - font-family: "Inconsolata"; - src: url("/assets/fonts/Inconsolata/Inconsolata-ExtraLight.woff2") format("woff2"); - font-weight: 200; - font-style: normal; - font-display: swap; -} -@font-face { - font-family: "Inconsolata"; - src: url("/assets/fonts/Inconsolata/Inconsolata-Light.woff2") format("woff2"); - font-weight: 300; - font-style: normal; - font-display: swap; -} -@font-face { - font-family: "Inconsolata"; - src: url("/assets/fonts/Inconsolata/Inconsolata-Regular.woff2") format("woff2"); - font-weight: 400; - font-style: normal; - font-display: swap; -} -@font-face { - font-family: "Inconsolata"; - src: url("/assets/fonts/Inconsolata/Inconsolata-Medium.woff2") format("woff2"); - font-weight: 500; - font-style: normal; - font-display: swap; -} -@font-face { - font-family: "Inconsolata"; - src: url("/assets/fonts/Inconsolata/Inconsolata-SemiBold.woff2") format("woff2"); - font-weight: 600; - font-style: normal; - font-display: swap; -} -@font-face { - font-family: "Inconsolata"; - src: url("/assets/fonts/Inconsolata/Inconsolata-Bold.woff2") format("woff2"); - font-weight: 700; - font-style: normal; - font-display: swap; -} -@font-face { - font-family: "Inconsolata"; - src: url("/assets/fonts/Inconsolata/Inconsolata-ExtraBold.woff2") format("woff2"); - font-weight: 800; - font-style: normal; - font-display: swap; -} -@font-face { - font-family: "Inconsolata"; - src: url("/assets/fonts/Inconsolata/Inconsolata-Black.woff2") format("woff2"); - font-weight: 900; - font-style: normal; - font-display: swap; -} -:root { - --color-interface-050: #f5f0ed; - --color-interface-050: #f8f5f4; - --color-interface-100: #efe9e6; - --color-interface-200: #e0d5d0; - --color-interface-300: #cabbb5; - --color-interface-400: #b2a29c; - --color-interface-500: #998985; - --color-interface-600: #7f716e; - --color-interface-700: #675b58; - --color-interface-800: #5b4f4c; - --color-interface-900: #483c39; - --color-050: #f5f0ed; - --color-050: #f8f5f4; - --color-100: #efe9e6; - --color-200: #e0d5d0; - --color-300: #cabbb5; - --color-400: #b2a29c; - --color-500: #998985; - --color-600: #7f716e; - --color-700: #675b58; - --color-800: #5b4f4c; - --color-900: #483c39; -} - -[data-color-type=elem] { - --color-050: #fff4ec; - --color-100: #ffe6d6; - --color-200: #ffd1b5; - --color-300: #ffbc94; - --color-400: #ffa673; - --color-500: #ff945b; - --color-600: #ff8d54; - --color-700: #f97f46; - --color-800: #ff8a50; - --color-900: #d96a30; -} - -[data-color-type=page] { - --color-050: #f4f0ff; - --color-100: #e7e1ff; - --color-200: #d4c8ff; - --color-300: #b9a8ff; - --color-400: #9f89ff; - --color-500: #866aff; - --color-600: #7a52ff; - --color-700: #7442ff; - --color-800: #7136ff; - --color-900: #5223d6; -} - body, html { padding: 0; @@ -216,35 +25,32 @@ button { border: none; } -img { - width: 100%; -} - :root { + --color-panel-bg: #e8e6e5; --color-browngray-050: #f5f3f0; --color-browngray-200: #d0c4ba; - --color-txt: var(--color-interface-800); - --color-panel-bg: var(--color-interface-050); + --color-browngray-300: #b5a9a1; --color-page-highlight: #ff8a50; --color-purple: #7136ff; --border-radius: 0.2rem; --space-xs: 0.5rem; - --space-s: 1rem; - --space: 1.5rem; --curve: cubic-bezier(0.86, 0, 0.07, 1); - --sans-serif: "DM Sans", sans-serif; - --mono: "Inconsolata", monospace; - --input-h: 26px; - --input-w: 160px; - --input-w-small: 45px; - --label-w: 18ch; - font-size: 14px; - --panel-w: 540px; } -body { - font-family: var(--sans-serif); - color: var(--color-txt); +body, +h1, +h2, +h3, +h4, +h5, +h6, +p, +a, +input, +select, +figcaption, +label { + font-family: sans-serif; } /* PagedJS print styles */ @@ -269,93 +75,7 @@ h2 { select, input[type=text], input[type=number] { - height: var(--input-h); - border: 1px solid var(--color-interface-200); - background-color: var(--color-interface-100); - font-family: var(--sans-serif); - font-size: 1rem; -} - -.field { - display: flex; -} -.field label { - font-weight: 600; - color: var(--color-800); -} -.field .input-with-unit { - display: flex; - gap: 0.3rem; -} -.field .unit-toggle { - height: var(--input-h); - display: flex; - gap: 0.3rem; - align-items: center; -} -.field .input-with-color { - width: 100%; -} -.field .input-with-color .clr-field { - width: 100%; - display: grid; - grid-template-columns: var(--input-h); - grid-gap: 1ch; -} -.field .input-with-color .clr-field button { - grid-column: 1; - position: relative; - border-radius: var(--border-radius); -} -.field .input-with-color .clr-field input { - grid-column: 2; -} - -.field { - display: grid; - grid-template-columns: var(--label-w) 1fr; -} -.field label { - align-self: center; -} - -.field-font { - display: grid; - grid-template-columns: var(--label-w) 1fr; - grid-template-rows: var(--input-h) var(--input-h); -} -.field-font select { - width: 100%; -} -.field-font .field-checkbox { - padding-top: var(--space-xs); -} -.field-font .field-checkbox label { - font-weight: 400; - margin-left: 0.75ch; -} - -.field-margin, .field-size { - display: inline-grid; - width: calc(50% - 1ch); - grid-template-columns: 6.5ch var(--input-w-small) 1fr; - margin-bottom: var(--space-xs); -} -.field-margin input, .field-size input { - width: var(--input-w-small); - padding-left: 0.75ch; -} -.field-margin:nth-of-type(odd), .field-size:nth-of-type(odd) { - margin-right: 2ch; -} - -.checkbox-field { - margin: calc(var(--space-xs) * 2) 0; - grid-template-columns: 3ch 1fr; -} -.checkbox-field input { - justify-self: left; - margin: 0; + background-color: var(--color-browngray-300); } .field--view-only { @@ -364,8 +84,9 @@ input[type=number] { /* Label with CSS tooltip */ .label-with-tooltip { - -webkit-text-decoration: underline dotted 1px var(--color-200); - text-decoration: underline dotted 1px var(--color-200); + -webkit-text-decoration: underline dotted; + text-decoration: underline dotted; + text-decoration-color: var(--color-browngray-200); text-underline-offset: 2px; cursor: help; position: relative; @@ -377,9 +98,9 @@ input[type=number] { left: 0; margin-bottom: 4px; padding: 0.25rem 0.5rem; - background: var(--color-interface-700); - color: var(--color-interface-050); - font-family: var(--mono); + background: var(--color-browngray-700); + color: var(--color-browngray-100); + font-family: "Courier New", Courier, monospace; font-size: 0.75rem; border-radius: 4px; white-space: nowrap; @@ -393,112 +114,89 @@ input[type=number] { visibility: visible; } -input[type=number]::-webkit-inner-spin-button, -input[type=number]::-webkit-outer-spin-button { - -webkit-appearance: none; - appearance: none; - margin: 0; -} - -input[type=number] { - -moz-appearance: textfield; -} - -.number-input { - position: relative; -} -.number-input input { - padding-top: 0; - padding-bottom: 0; -} -.number-input .spinner-buttons { - height: var(--input-h); - width: var(--input-h); - display: flex; - flex-direction: column; - position: absolute; - right: 0; - top: 0; -} -.number-input .spinner-buttons button { - height: calc(var(--input-h) * 0.6); - cursor: pointer; - padding: 0; -} -.number-input .spinner-buttons button svg path { - fill: var(--color-interface-600); -} -.number-input .spinner-buttons button:hover svg path { - fill: var(--color-interface-900); -} -.number-input .spinner-buttons .spinner-down svg { - position: relative; - top: -2px; -} - -.settings-section { - margin-top: 3em; -} .settings-section h2 { - margin-bottom: var(--space); - font-weight: 600; - font-size: 1.4rem; - border-bottom: 1px solid var(--color-200); - color: var(--color-800); -} -.settings-section .infos { - font-size: 0.8rem; - color: var(--color-interface-400); + border-bottom: 1px solid #000; + margin-bottom: var(--space-xs); } .settings-section .settings-subsection:not(:last-child) { - border-bottom: 1px solid var(--color-interface-100); + border-bottom: 1px solid var(--color-browngray-050); } .settings-section .settings-subsection { padding: var(--space-xs) 0; } .settings-section .settings-subsection h3 { - margin-top: calc(var(--space-xs) * 1.5); - margin-bottom: calc(var(--space-xs) * 2); - font-size: 1rem; - font-weight: 600; + margin-bottom: var(--space-xs); +} +.settings-section .settings-subsection .field { + display: flex; +} +.settings-section .settings-subsection .field label, +.settings-section .settings-subsection .field select { + width: 50%; +} +.settings-section .settings-subsection .field input { + padding: 0.1rem 0.1rem 0.1rem 0.3rem; +} +.settings-section .settings-subsection .field .input-with-unit { + display: flex; + gap: 0.3rem; +} +.settings-section .settings-subsection .field .input-with-unit .unit-toggle { + display: flex; + gap: 0.3rem; +} +.settings-section .settings-subsection .field .input-with-color { + width: 50%; +} +.settings-section .settings-subsection .field .input-with-color .clr-field { + display: flex; +} +.settings-section .settings-subsection .field .input-with-color .clr-field button { + position: absolute; + transform: none; + height: 1.1rem; + top: auto; + right: auto; + cursor: pointer; +} +.settings-section .settings-subsection .field .input-with-color .clr-field input { + padding-left: 2.5rem; + width: 100%; +} +.settings-section .settings-subsection.margins { + display: flex; + flex-wrap: wrap; + row-gap: var(--space-xs); +} +.settings-section .settings-subsection.margins h3 { + width: 100%; +} +.settings-section .settings-subsection.margins .field { + width: 50%; +} +.settings-section .settings-subsection.margins .field label { + width: 30%; +} +.settings-section .settings-subsection.margins .field .input-with-unit input { + width: 50%; } -.unit-toggle button:not(.spinner-btn) { +button { cursor: pointer; - border: 1px solid var(--color-interface-400); - color: var(--color-interface-400); + border: 1px solid var(--color-browngray-300); + color: var(--color-browngray-300); background-color: var(--color-panel-bg); border-radius: var(--border-radius); padding: 0.1rem 0.3rem; - height: calc(var(--input-h) * 0.75); } -.unit-toggle button:not(.spinner-btn):not(.active):hover { - background-color: var(--color-interface-100); +button.active { + border: 1px solid #000; + color: #000; } -.unit-toggle button:not(.spinner-btn).active { - color: var(--color-interface-050); - background-color: var(--color-interface-500); - cursor: auto; -} - -#editor-panel .tabs .tab { - color: var(--color-interface-600); - font-size: 1rem; - font-family: var(--sans-serif); - height: var(--input-h); - padding: 0 1ch; - border: 1px solid currentColor; - border-radius: calc(var(--input-h)); - font-weight: 500; -} -#editor-panel .tabs .tab.active { - background-color: var(--color-interface-400); - border-color: var(--color-interface-400); - color: var(--color-panel-bg); -} -#editor-panel .tabs .tab:not(.active):hover { - cursor: pointer; - background-color: var(--color-interface-100); +button.tab.active { + background-color: #000; + color: #fff; + border: none; } .settings-popup { @@ -560,6 +258,36 @@ input[type=number] { font-weight: 600; } +.label-with-tooltip { + -webkit-text-decoration: underline dotted; + text-decoration: underline dotted; + text-underline-offset: 2px; + cursor: help; + position: relative; +} +.label-with-tooltip::after { + content: attr(data-css); + position: absolute; + bottom: 100%; + left: 0; + margin-bottom: 4px; + padding: 0.25rem 0.5rem; + background: var(--color-browngray-700, #3d3d3d); + color: var(--color-browngray-100, #f5f5f5); + font-family: "Courier New", Courier, monospace; + font-size: 0.75rem; + border-radius: 4px; + white-space: nowrap; + opacity: 0; + visibility: hidden; + transition: opacity 0.15s ease, visibility 0.15s ease; + z-index: 10; +} +.label-with-tooltip:hover::after { + opacity: 1; + visibility: visible; +} + .inheritance-btn { display: flex; align-items: center; diff --git a/public/assets/css/style.css.map b/public/assets/css/style.css.map index 1a56067..498edd4 100644 --- a/public/assets/css/style.css.map +++ b/public/assets/css/style.css.map @@ -1,5 +1 @@ -<<<<<<< HEAD -{"version":3,"sources":["src/_reset.scss","style.css","src/_variables.scss","src/_text.scss","src/_print-styles.scss","src/_forms.scss","src/_buttons.scss","src/_settings-popup.scss"],"names":[],"mappings":"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","file":"style.css"} -======= -{"version":3,"sources":["src/_fonts.scss","style.css","src/_colors.scss","src/_reset.scss","src/_variables.scss","src/_text.scss","src/_print-styles.scss","src/_forms.scss","src/_forms-section.scss","src/_buttons.scss","src/_settings-popup.scss"],"names":[],"mappings":"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","file":"style.css"} ->>>>>>> styles +{"version":3,"sources":["src/_reset.scss","style.css","src/_variables.scss","src/_text.scss","src/_print-styles.scss","src/_forms.scss","src/_buttons.scss","src/_settings-popup.scss"],"names":[],"mappings":"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","file":"style.css"} \ No newline at end of file diff --git a/public/assets/css/style.scss b/public/assets/css/style.scss index a844cc7..656ee33 100644 --- a/public/assets/css/style.scss +++ b/public/assets/css/style.scss @@ -1,10 +1,7 @@ -@use "src/_fonts.scss" as *; -@use "src/_colors.scss" as *; -@use "src/_reset.scss" as *; -@use "src/_variables.scss" as *; -@use "src/_text.scss" as *; -@use "src/_print-styles.scss" as *; -@use "src/_forms.scss" as *; -@use "src/_forms-section.scss" as *; -@use "src/_buttons.scss" as *; -@use "src/_settings-popup.scss" as *; +@import "src/_reset.scss"; +@import "src/_variables.scss"; +@import "src/_text.scss"; +@import "src/_print-styles.scss"; +@import "src/_forms.scss"; +@import "src/_buttons.scss"; +@import "src/_settings-popup.scss"; diff --git a/public/assets/css/stylesheet.css b/public/assets/css/stylesheet.css index 5f10ef0..d6f0264 100644 --- a/public/assets/css/stylesheet.css +++ b/public/assets/css/stylesheet.css @@ -24,13 +24,5 @@ h2 { p { font-size: 1rem; - margin: 0mm 0mm 10mm 0mm; -} - -img { - width: 100%; -} - -li p { - margin-bottom: 0; + margin: 0mm 0mm 24mm 0mm; } diff --git a/public/assets/fonts/DMSans/DMSans-Black.woff2 b/public/assets/fonts/DMSans/DMSans-Black.woff2 deleted file mode 100644 index 3d7df7f..0000000 Binary files a/public/assets/fonts/DMSans/DMSans-Black.woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/DMSans-BlackItalic.woff2 b/public/assets/fonts/DMSans/DMSans-BlackItalic.woff2 deleted file mode 100644 index 719c05b..0000000 Binary files a/public/assets/fonts/DMSans/DMSans-BlackItalic.woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/DMSans-Bold.woff2 b/public/assets/fonts/DMSans/DMSans-Bold.woff2 deleted file mode 100644 index af58614..0000000 Binary files a/public/assets/fonts/DMSans/DMSans-Bold.woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/DMSans-BoldItalic.woff2 b/public/assets/fonts/DMSans/DMSans-BoldItalic.woff2 deleted file mode 100644 index d671120..0000000 Binary files a/public/assets/fonts/DMSans/DMSans-BoldItalic.woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/DMSans-ExtraBlack.woff2 b/public/assets/fonts/DMSans/DMSans-ExtraBlack.woff2 deleted file mode 100644 index 913890a..0000000 Binary files a/public/assets/fonts/DMSans/DMSans-ExtraBlack.woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/DMSans-ExtraBlackItalic.woff2 b/public/assets/fonts/DMSans/DMSans-ExtraBlackItalic.woff2 deleted file mode 100644 index 10a798c..0000000 Binary files a/public/assets/fonts/DMSans/DMSans-ExtraBlackItalic.woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/DMSans-ExtraBold.woff2 b/public/assets/fonts/DMSans/DMSans-ExtraBold.woff2 deleted file mode 100644 index de9f58b..0000000 Binary files a/public/assets/fonts/DMSans/DMSans-ExtraBold.woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/DMSans-ExtraBoldItalic.woff2 b/public/assets/fonts/DMSans/DMSans-ExtraBoldItalic.woff2 deleted file mode 100644 index 1c41a90..0000000 Binary files a/public/assets/fonts/DMSans/DMSans-ExtraBoldItalic.woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/DMSans-ExtraLight.woff2 b/public/assets/fonts/DMSans/DMSans-ExtraLight.woff2 deleted file mode 100644 index b30cc79..0000000 Binary files a/public/assets/fonts/DMSans/DMSans-ExtraLight.woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/DMSans-ExtraLightItalic.woff2 b/public/assets/fonts/DMSans/DMSans-ExtraLightItalic.woff2 deleted file mode 100644 index 111f1f2..0000000 Binary files a/public/assets/fonts/DMSans/DMSans-ExtraLightItalic.woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/DMSans-Italic.woff2 b/public/assets/fonts/DMSans/DMSans-Italic.woff2 deleted file mode 100644 index c6eafe1..0000000 Binary files a/public/assets/fonts/DMSans/DMSans-Italic.woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/DMSans-Italic[opsz,wght].woff2 b/public/assets/fonts/DMSans/DMSans-Italic[opsz,wght].woff2 deleted file mode 100644 index b9224aa..0000000 Binary files a/public/assets/fonts/DMSans/DMSans-Italic[opsz,wght].woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/DMSans-Light.woff2 b/public/assets/fonts/DMSans/DMSans-Light.woff2 deleted file mode 100644 index 31265a3..0000000 Binary files a/public/assets/fonts/DMSans/DMSans-Light.woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/DMSans-LightItalic.woff2 b/public/assets/fonts/DMSans/DMSans-LightItalic.woff2 deleted file mode 100644 index dfc26f0..0000000 Binary files a/public/assets/fonts/DMSans/DMSans-LightItalic.woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/DMSans-Medium.woff2 b/public/assets/fonts/DMSans/DMSans-Medium.woff2 deleted file mode 100644 index 27f223c..0000000 Binary files a/public/assets/fonts/DMSans/DMSans-Medium.woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/DMSans-MediumItalic.woff2 b/public/assets/fonts/DMSans/DMSans-MediumItalic.woff2 deleted file mode 100644 index 817a696..0000000 Binary files a/public/assets/fonts/DMSans/DMSans-MediumItalic.woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/DMSans-Regular.woff2 b/public/assets/fonts/DMSans/DMSans-Regular.woff2 deleted file mode 100644 index 1b06ad8..0000000 Binary files a/public/assets/fonts/DMSans/DMSans-Regular.woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/DMSans-SemiBold.woff2 b/public/assets/fonts/DMSans/DMSans-SemiBold.woff2 deleted file mode 100644 index 225015c..0000000 Binary files a/public/assets/fonts/DMSans/DMSans-SemiBold.woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/DMSans-SemiBoldItalic.woff2 b/public/assets/fonts/DMSans/DMSans-SemiBoldItalic.woff2 deleted file mode 100644 index c4cae67..0000000 Binary files a/public/assets/fonts/DMSans/DMSans-SemiBoldItalic.woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/DMSans-Thin.woff2 b/public/assets/fonts/DMSans/DMSans-Thin.woff2 deleted file mode 100644 index 4f25c05..0000000 Binary files a/public/assets/fonts/DMSans/DMSans-Thin.woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/DMSans-ThinItalic.woff2 b/public/assets/fonts/DMSans/DMSans-ThinItalic.woff2 deleted file mode 100644 index eb72cf4..0000000 Binary files a/public/assets/fonts/DMSans/DMSans-ThinItalic.woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/DMSans[opsz,wght].woff2 b/public/assets/fonts/DMSans/DMSans[opsz,wght].woff2 deleted file mode 100644 index ab7ecbb..0000000 Binary files a/public/assets/fonts/DMSans/DMSans[opsz,wght].woff2 and /dev/null differ diff --git a/public/assets/fonts/DMSans/stylesheet.css b/public/assets/fonts/DMSans/stylesheet.css deleted file mode 100644 index fbfe2b1..0000000 --- a/public/assets/fonts/DMSans/stylesheet.css +++ /dev/null @@ -1,137 +0,0 @@ -/* DMSans Font Faces */ -@font-face { - font-family: "DMSans"; - src: url("DMSans-Black.woff2") format("woff2"); - font-weight: 900; - font-style: normal; -} -@font-face { - font-family: "DMSans"; - src: url("DMSans-BlackItalic.woff2") format("woff2"); - font-weight: 900; - font-style: italic; -} -@font-face { - font-family: "DMSans"; - src: url("DMSans-Bold.woff2") format("woff2"); - font-weight: 700; - font-style: normal; -} -@font-face { - font-family: "DMSans"; - src: url("DMSans-BoldItalic.woff2") format("woff2"); - font-weight: 700; - font-style: italic; -} -@font-face { - font-family: "DMSans"; - src: url("DMSans-ExtraBlack.woff2") format("woff2"); - font-weight: 950; - font-style: normal; -} -@font-face { - font-family: "DMSans"; - src: url("DMSans-ExtraBlackItalic.woff2") format("woff2"); - font-weight: 950; - font-style: italic; -} -@font-face { - font-family: "DMSans"; - src: url("DMSans-ExtraBold.woff2") format("woff2"); - font-weight: 800; - font-style: normal; -} -@font-face { - font-family: "DMSans"; - src: url("DMSans-ExtraBoldItalic.woff2") format("woff2"); - font-weight: 800; - font-style: italic; -} -@font-face { - font-family: "DMSans"; - src: url("DMSans-ExtraLight.woff2") format("woff2"); - font-weight: 200; - font-style: normal; -} -@font-face { - font-family: "DMSans"; - src: url("DMSans-ExtraLightItalic.woff2") format("woff2"); - font-weight: 200; - font-style: italic; -} -@font-face { - font-family: "DMSans"; - src: url("DMSans-Italic.woff2") format("woff2"); - font-weight: 400; - font-style: italic; -} -@font-face { - font-family: "DMSans"; - src: url("DMSans-Italic[opsz,wght].woff2") format("woff2"); - font-weight: 100 900; - font-style: italic; -} -@font-face { - font-family: "DMSans"; - src: url("DMSans-Light.woff2") format("woff2"); - font-weight: 300; - font-style: normal; -} -@font-face { - font-family: "DMSans"; - src: url("DMSans-LightItalic.woff2") format("woff2"); - font-weight: 300; - font-style: italic; -} -@font-face { - font-family: "DMSans"; - src: url("DMSans-Medium.woff2") format("woff2"); - font-weight: 500; - font-style: normal; -} -@font-face { - font-family: "DMSans"; - src: url("DMSans-MediumItalic.woff2") format("woff2"); - font-weight: 500; - font-style: italic; -} -@font-face { - font-family: "DMSans"; - src: url("DMSans-Regular.woff2") format("woff2"); - font-weight: 400; - font-style: normal; -} -@font-face { - font-family: "DMSans"; - src: url("DMSans-SemiBold.woff2") format("woff2"); - font-weight: 600; - font-style: normal; -} -@font-face { - font-family: "DMSans"; - src: url("DMSans-SemiBoldItalic.woff2") format("woff2"); - font-weight: 600; - font-style: italic; -} -@font-face { - font-family: "DMSans"; - src: url("DMSans-Thin.woff2") format("woff2"); - font-weight: 100; - font-style: normal; -} -@font-face { - font-family: "DMSans"; - src: url("DMSans-ThinItalic.woff2") format("woff2"); - font-weight: 100; - font-style: italic; -} -@font-face { - font-family: "DMSans"; - src: url("DMSans[opsz,wght].woff2") format("woff2"); - font-weight: 100 900; - font-style: normal; -} -/* Example usage */ -body { - font-family: "DMSans", sans-serif; -}/*# sourceMappingURL=stylesheet.css.map */ \ No newline at end of file diff --git a/public/assets/fonts/DMSans/stylesheet.css.map b/public/assets/fonts/DMSans/stylesheet.css.map deleted file mode 100644 index d8d81f8..0000000 --- a/public/assets/fonts/DMSans/stylesheet.css.map +++ /dev/null @@ -1 +0,0 @@ -{"version":3,"sources":["stylesheet.scss","stylesheet.css"],"names":[],"mappings":"AAAA,sBAAA;AACA;EACE,qBAAA;EACA,8CAAA;EACA,gBAAA;EACA,kBAAA;ACCF;ADCA;EACE,qBAAA;EACA,oDAAA;EACA,gBAAA;EACA,kBAAA;ACCF;ADCA;EACE,qBAAA;EACA,6CAAA;EACA,gBAAA;EACA,kBAAA;ACCF;ADCA;EACE,qBAAA;EACA,mDAAA;EACA,gBAAA;EACA,kBAAA;ACCF;ADCA;EACE,qBAAA;EACA,mDAAA;EACA,gBAAA;EACA,kBAAA;ACCF;ADCA;EACE,qBAAA;EACA,yDAAA;EACA,gBAAA;EACA,kBAAA;ACCF;ADCA;EACE,qBAAA;EACA,kDAAA;EACA,gBAAA;EACA,kBAAA;ACCF;ADCA;EACE,qBAAA;EACA,wDAAA;EACA,gBAAA;EACA,kBAAA;ACCF;ADCA;EACE,qBAAA;EACA,mDAAA;EACA,gBAAA;EACA,kBAAA;ACCF;ADCA;EACE,qBAAA;EACA,yDAAA;EACA,gBAAA;EACA,kBAAA;ACCF;ADCA;EACE,qBAAA;EACA,+CAAA;EACA,gBAAA;EACA,kBAAA;ACCF;ADCA;EACE,qBAAA;EACA,0DAAA;EACA,oBAAA;EACA,kBAAA;ACCF;ADCA;EACE,qBAAA;EACA,8CAAA;EACA,gBAAA;EACA,kBAAA;ACCF;ADCA;EACE,qBAAA;EACA,oDAAA;EACA,gBAAA;EACA,kBAAA;ACCF;ADCA;EACE,qBAAA;EACA,+CAAA;EACA,gBAAA;EACA,kBAAA;ACCF;ADCA;EACE,qBAAA;EACA,qDAAA;EACA,gBAAA;EACA,kBAAA;ACCF;ADCA;EACE,qBAAA;EACA,gDAAA;EACA,gBAAA;EACA,kBAAA;ACCF;ADCA;EACE,qBAAA;EACA,iDAAA;EACA,gBAAA;EACA,kBAAA;ACCF;ADCA;EACE,qBAAA;EACA,uDAAA;EACA,gBAAA;EACA,kBAAA;ACCF;ADCA;EACE,qBAAA;EACA,6CAAA;EACA,gBAAA;EACA,kBAAA;ACCF;ADCA;EACE,qBAAA;EACA,mDAAA;EACA,gBAAA;EACA,kBAAA;ACCF;ADCA;EACE,qBAAA;EACA,mDAAA;EACA,oBAAA;EACA,kBAAA;ACCF;ADEA,kBAAA;AACA;EACE,iCAAA;ACAF","file":"stylesheet.css"} \ No newline at end of file diff --git a/public/assets/fonts/DMSans/stylesheet.scss b/public/assets/fonts/DMSans/stylesheet.scss deleted file mode 100644 index 5cc3671..0000000 --- a/public/assets/fonts/DMSans/stylesheet.scss +++ /dev/null @@ -1,138 +0,0 @@ -/* DMSans Font Faces */ -@font-face { - font-family: 'DMSans'; - src: url('DMSans-Black.woff2') format('woff2'); - font-weight: 900; - font-style: normal; -} -@font-face { - font-family: 'DMSans'; - src: url('DMSans-BlackItalic.woff2') format('woff2'); - font-weight: 900; - font-style: italic; -} -@font-face { - font-family: 'DMSans'; - src: url('DMSans-Bold.woff2') format('woff2'); - font-weight: 700; - font-style: normal; -} -@font-face { - font-family: 'DMSans'; - src: url('DMSans-BoldItalic.woff2') format('woff2'); - font-weight: 700; - font-style: italic; -} -@font-face { - font-family: 'DMSans'; - src: url('DMSans-ExtraBlack.woff2') format('woff2'); - font-weight: 950; - font-style: normal; -} -@font-face { - font-family: 'DMSans'; - src: url('DMSans-ExtraBlackItalic.woff2') format('woff2'); - font-weight: 950; - font-style: italic; -} -@font-face { - font-family: 'DMSans'; - src: url('DMSans-ExtraBold.woff2') format('woff2'); - font-weight: 800; - font-style: normal; -} -@font-face { - font-family: 'DMSans'; - src: url('DMSans-ExtraBoldItalic.woff2') format('woff2'); - font-weight: 800; - font-style: italic; -} -@font-face { - font-family: 'DMSans'; - src: url('DMSans-ExtraLight.woff2') format('woff2'); - font-weight: 200; - font-style: normal; -} -@font-face { - font-family: 'DMSans'; - src: url('DMSans-ExtraLightItalic.woff2') format('woff2'); - font-weight: 200; - font-style: italic; -} -@font-face { - font-family: 'DMSans'; - src: url('DMSans-Italic.woff2') format('woff2'); - font-weight: 400; - font-style: italic; -} -@font-face { - font-family: 'DMSans'; - src: url('DMSans-Italic[opsz,wght].woff2') format('woff2'); - font-weight: 100 900; - font-style: italic; -} -@font-face { - font-family: 'DMSans'; - src: url('DMSans-Light.woff2') format('woff2'); - font-weight: 300; - font-style: normal; -} -@font-face { - font-family: 'DMSans'; - src: url('DMSans-LightItalic.woff2') format('woff2'); - font-weight: 300; - font-style: italic; -} -@font-face { - font-family: 'DMSans'; - src: url('DMSans-Medium.woff2') format('woff2'); - font-weight: 500; - font-style: normal; -} -@font-face { - font-family: 'DMSans'; - src: url('DMSans-MediumItalic.woff2') format('woff2'); - font-weight: 500; - font-style: italic; -} -@font-face { - font-family: 'DMSans'; - src: url('DMSans-Regular.woff2') format('woff2'); - font-weight: 400; - font-style: normal; -} -@font-face { - font-family: 'DMSans'; - src: url('DMSans-SemiBold.woff2') format('woff2'); - font-weight: 600; - font-style: normal; -} -@font-face { - font-family: 'DMSans'; - src: url('DMSans-SemiBoldItalic.woff2') format('woff2'); - font-weight: 600; - font-style: italic; -} -@font-face { - font-family: 'DMSans'; - src: url('DMSans-Thin.woff2') format('woff2'); - font-weight: 100; - font-style: normal; -} -@font-face { - font-family: 'DMSans'; - src: url('DMSans-ThinItalic.woff2') format('woff2'); - font-weight: 100; - font-style: italic; -} -@font-face { - font-family: 'DMSans'; - src: url('DMSans[opsz,wght].woff2') format('woff2'); - font-weight: 100 900; - font-style: normal; -} - -/* Example usage */ -body { - font-family: 'DMSans', sans-serif; -} \ No newline at end of file diff --git a/public/assets/fonts/webfont/Inconsolata-Black.woff2 b/public/assets/fonts/webfont/Inconsolata-Black.woff2 deleted file mode 100644 index 81e7b8b..0000000 Binary files a/public/assets/fonts/webfont/Inconsolata-Black.woff2 and /dev/null differ diff --git a/public/assets/fonts/webfont/Inconsolata-Bold.woff2 b/public/assets/fonts/webfont/Inconsolata-Bold.woff2 deleted file mode 100644 index a183d29..0000000 Binary files a/public/assets/fonts/webfont/Inconsolata-Bold.woff2 and /dev/null differ diff --git a/public/assets/fonts/webfont/Inconsolata-ExtraBold.woff2 b/public/assets/fonts/webfont/Inconsolata-ExtraBold.woff2 deleted file mode 100644 index f43698e..0000000 Binary files a/public/assets/fonts/webfont/Inconsolata-ExtraBold.woff2 and /dev/null differ diff --git a/public/assets/fonts/webfont/Inconsolata-ExtraLight.woff2 b/public/assets/fonts/webfont/Inconsolata-ExtraLight.woff2 deleted file mode 100644 index e56d763..0000000 Binary files a/public/assets/fonts/webfont/Inconsolata-ExtraLight.woff2 and /dev/null differ diff --git a/public/assets/fonts/webfont/Inconsolata-Light.woff2 b/public/assets/fonts/webfont/Inconsolata-Light.woff2 deleted file mode 100644 index 67c1971..0000000 Binary files a/public/assets/fonts/webfont/Inconsolata-Light.woff2 and /dev/null differ diff --git a/public/assets/fonts/webfont/Inconsolata-Medium.woff2 b/public/assets/fonts/webfont/Inconsolata-Medium.woff2 deleted file mode 100644 index d1f080b..0000000 Binary files a/public/assets/fonts/webfont/Inconsolata-Medium.woff2 and /dev/null differ diff --git a/public/assets/fonts/webfont/Inconsolata-Regular.woff2 b/public/assets/fonts/webfont/Inconsolata-Regular.woff2 deleted file mode 100644 index fb2d3c4..0000000 Binary files a/public/assets/fonts/webfont/Inconsolata-Regular.woff2 and /dev/null differ diff --git a/public/assets/fonts/webfont/Inconsolata-SemiBold.woff2 b/public/assets/fonts/webfont/Inconsolata-SemiBold.woff2 deleted file mode 100644 index bced232..0000000 Binary files a/public/assets/fonts/webfont/Inconsolata-SemiBold.woff2 and /dev/null differ diff --git a/public/assets/fonts/webfont/Inconsolata-Thin.woff2 b/public/assets/fonts/webfont/Inconsolata-Thin.woff2 deleted file mode 100644 index f5e7aec..0000000 Binary files a/public/assets/fonts/webfont/Inconsolata-Thin.woff2 and /dev/null differ diff --git a/public/assets/fonts/webfont/stylesheet.css b/public/assets/fonts/webfont/stylesheet.css deleted file mode 100644 index 0d26d26..0000000 --- a/public/assets/fonts/webfont/stylesheet.css +++ /dev/null @@ -1,61 +0,0 @@ -/* Inconsolata Font Faces (ordered from lightest to boldest) */ -@font-face { - font-family: 'Inconsolata'; - src: url('Inconsolata-Thin.woff2') format('woff2'); - font-weight: 100; - font-style: normal; - } - @font-face { - font-family: 'Inconsolata'; - src: url('Inconsolata-ExtraLight.woff2') format('woff2'); - font-weight: 200; - font-style: normal; - } - @font-face { - font-family: 'Inconsolata'; - src: url('Inconsolata-Light.woff2') format('woff2'); - font-weight: 300; - font-style: normal; - } - @font-face { - font-family: 'Inconsolata'; - src: url('Inconsolata-Regular.woff2') format('woff2'); - font-weight: 400; - font-style: normal; - } - @font-face { - font-family: 'Inconsolata'; - src: url('Inconsolata-Medium.woff2') format('woff2'); - font-weight: 500; - font-style: normal; - } - @font-face { - font-family: 'Inconsolata'; - src: url('Inconsolata-SemiBold.woff2') format('woff2'); - font-weight: 600; - font-style: normal; - } - @font-face { - font-family: 'Inconsolata'; - src: url('Inconsolata-Bold.woff2') format('woff2'); - font-weight: 700; - font-style: normal; - } - @font-face { - font-family: 'Inconsolata'; - src: url('Inconsolata-ExtraBold.woff2') format('woff2'); - font-weight: 800; - font-style: normal; - } - @font-face { - font-family: 'Inconsolata'; - src: url('Inconsolata-Black.woff2') format('woff2'); - font-weight: 900; - font-style: normal; - } - - /* Example usage */ - /* code, pre, .mono { - font-family: 'Inconsolata', monospace; - } */ - \ No newline at end of file diff --git a/public/site/snippets/header.php b/public/site/snippets/header.php index e989166..e420f16 100644 --- a/public/site/snippets/header.php +++ b/public/site/snippets/header.php @@ -8,7 +8,7 @@ isHomePage() != true, $page->title() . ' - ') . $site->title() ?> - + diff --git a/src/components/ElementPopup.vue b/src/components/ElementPopup.vue index 9d36142..a8d9a73 100644 --- a/src/components/ElementPopup.vue +++ b/src/components/ElementPopup.vue @@ -58,10 +58,10 @@
-
@@ -109,7 +109,7 @@
-
+
-
+
-
@@ -177,10 +177,10 @@
-
@@ -274,8 +274,6 @@ import { ref, computed, watch } from 'vue'; import { useStylesheetStore } from '../stores/stylesheet'; import { usePopupPosition } from '../composables/usePopupPosition'; -import { useDebounce } from '../composables/useDebounce'; -import NumberInput from './ui/NumberInput.vue'; import Coloris from '@melloware/coloris'; import '@melloware/coloris/dist/coloris.css'; import hljs from 'highlight.js/lib/core'; @@ -308,7 +306,7 @@ const colorInput = ref(null); const backgroundInput = ref(null); let isUpdatingFromStore = false; -const { debouncedUpdate } = useDebounce(500); +let updateTimer = null; // Style properties const fontFamily = ref({ value: 'Alegreya Sans' }); @@ -321,6 +319,11 @@ const background = ref({ value: 'transparent' }); const marginOuter = ref({ value: 0, unit: 'mm' }); const paddingInner = ref({ value: 0, unit: 'mm' }); +const debouncedUpdate = (callback) => { + clearTimeout(updateTimer); + updateTimer = setTimeout(callback, 1000); +}; + const immediateUpdate = (callback) => { callback(); }; @@ -369,22 +372,6 @@ const elementCss = computed(() => { return stylesheetStore.extractBlock(selector.value) || ''; }); -// Remove the element-specific CSS block to restore inheritance -const removeElementBlock = () => { - if (!selector.value) return; - - const block = stylesheetStore.extractBlock(selector.value); - if (block) { - // Escape special regex characters in selector - const escaped = selector.value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); - // Remove the block and any surrounding whitespace - stylesheetStore.content = stylesheetStore.content.replace( - new RegExp(`\\n?${escaped}\\s*\\{[^}]*\\}\\n?`), - '\n' - ); - } -}; - const highlightedCss = computed(() => { if (!elementCss.value) return ''; return hljs.highlight(elementCss.value, { language: 'css' }).value; @@ -617,9 +604,6 @@ const open = (element, event, count = null) => { // Store instance count if provided, otherwise calculate it elementInstanceCount.value = count !== null ? count : getInstanceCount(selector.value); - // Read inheritance state from element's data attribute - inheritanceLocked.value = element.dataset.inheritanceUnlocked !== 'true'; - // Load values from stylesheet loadValuesFromStylesheet(); @@ -683,22 +667,8 @@ const handleIframeClick = (event, targetElement = null, elementCount = null) => }; const toggleInheritance = () => { - const wasLocked = inheritanceLocked.value; inheritanceLocked.value = !inheritanceLocked.value; - - // Store the inheritance state in the element's data attribute - if (selectedElement.value) { - if (inheritanceLocked.value) { - delete selectedElement.value.dataset.inheritanceUnlocked; - } else { - selectedElement.value.dataset.inheritanceUnlocked = 'true'; - } - } - - // When re-locking, remove the element-specific CSS block to restore inheritance - if (inheritanceLocked.value && !wasLocked) { - removeElementBlock(); - } + // TODO: Implement CSS priority logic when unlocked }; defineExpose({ handleIframeClick, close, visible }); diff --git a/src/components/PagePopup.vue b/src/components/PagePopup.vue index aae5505..eb4632c 100644 --- a/src/components/PagePopup.vue +++ b/src/components/PagePopup.vue @@ -27,10 +27,10 @@ >
-
@@ -68,10 +68,10 @@ >
-
@@ -109,10 +109,10 @@ >
-
@@ -150,10 +150,10 @@ >
-
@@ -285,8 +285,6 @@ import { ref, computed, watch, onMounted } from 'vue'; import { useStylesheetStore } from '../stores/stylesheet'; import { usePopupPosition } from '../composables/usePopupPosition'; -import { useDebounce } from '../composables/useDebounce'; -import NumberInput from './ui/NumberInput.vue'; import Coloris from '@melloware/coloris'; import '@melloware/coloris/dist/coloris.css'; import hljs from 'highlight.js/lib/core'; @@ -313,7 +311,7 @@ const inheritanceLocked = ref(true); const backgroundColorInput = ref(null); let isUpdatingFromStore = false; -const { debouncedUpdate } = useDebounce(500); +let updateTimer = null; const margins = ref({ top: { value: 0, unit: 'mm' }, @@ -329,6 +327,11 @@ const background = ref({ const pattern = ref(''); +const debouncedUpdate = (callback) => { + clearTimeout(updateTimer); + updateTimer = setTimeout(callback, 1000); +}; + const immediateUpdate = (callback) => { callback(); }; @@ -532,8 +535,8 @@ const open = (pageElement, event, count = 1) => { // Extract template name from data-page-type attribute templateName.value = pageElement.getAttribute('data-page-type') || ''; - // Read inheritance state from page element's data attribute - inheritanceLocked.value = pageElement.dataset.inheritanceUnlocked !== 'true'; + // Reset inheritance state when opening + inheritanceLocked.value = true; // Load values from stylesheet (@page block) loadValuesFromStylesheet(); @@ -583,15 +586,6 @@ const toggleInheritance = () => { const wasLocked = inheritanceLocked.value; inheritanceLocked.value = !inheritanceLocked.value; - // Store the inheritance state in the page element's data attribute - if (selectedPageElement.value) { - if (inheritanceLocked.value) { - delete selectedPageElement.value.dataset.inheritanceUnlocked; - } else { - selectedPageElement.value.dataset.inheritanceUnlocked = 'true'; - } - } - if (inheritanceLocked.value && !wasLocked) { // Re-locking: remove the template-specific block // Fields keep their values, but preview returns to @page defaults diff --git a/src/components/editor/EditorPanel.vue b/src/components/editor/EditorPanel.vue index e209215..eb2c255 100644 --- a/src/components/editor/EditorPanel.vue +++ b/src/components/editor/EditorPanel.vue @@ -70,7 +70,7 @@ const activeTab = inject('activeTab'); position: fixed; top: 0; left: 0; - width: var(--panel-w); + width: 35rem; height: 100vh; display: flex; flex-direction: column; @@ -79,7 +79,7 @@ const activeTab = inject('activeTab'); nav { position: absolute; - margin: 1.5rem 0 0 2rem; + margin: 1rem 0 0 1rem; display: flex; gap: 0.5rem; @@ -88,7 +88,7 @@ nav { .close-button { position: absolute; - top: 1.5rem; + top: 1rem; right: 1rem; z-index: 2; @@ -100,7 +100,7 @@ nav { border: none; cursor: pointer; - color: var(--color-interface-300); + color: var(--color-browngray-300); transition: color 0.2s ease; &:hover { @@ -117,9 +117,9 @@ nav { flex: 1; overflow: hidden; position: relative; - left: calc(var(--panel-w)*-1); + left: -35rem; - padding: 4rem 0; + padding: 4rem 1rem 1rem 1rem; background-color: var(--color-panel-bg); box-shadow: -5px 0px 12px; @@ -134,8 +134,5 @@ nav { .tab-panel { height: 100%; overflow-y: auto; - overflow-x: hidden; - padding: 0 2em; - // padding-left: 1em; } diff --git a/src/components/editor/PageSettings.vue b/src/components/editor/PageSettings.vue index d21a5a5..06f417d 100644 --- a/src/components/editor/PageSettings.vue +++ b/src/components/editor/PageSettings.vue @@ -1,11 +1,9 @@ diff --git a/src/composables/useDebounce.js b/src/composables/useDebounce.js deleted file mode 100644 index f4d1ff3..0000000 --- a/src/composables/useDebounce.js +++ /dev/null @@ -1,15 +0,0 @@ -/** - * Composable for debounced updates - * @param {number} delay - Debounce delay in milliseconds (default: 500ms) - * @returns {Function} debouncedUpdate function - */ -export function useDebounce(delay = 500) { - let timer = null; - - const debouncedUpdate = (callback) => { - clearTimeout(timer); - timer = setTimeout(callback, delay); - }; - - return { debouncedUpdate }; -} diff --git a/src/style.css b/src/style.css index 7fe7f5e..699de50 100644 --- a/src/style.css +++ b/src/style.css @@ -1 +1 @@ -@import '../public/assets/css/style.scss'; +@import url('/assets/css/style.css'); diff --git a/src/utils/css-parsing.js b/src/utils/css-parsing.js index 96e3c85..08edd4c 100644 --- a/src/utils/css-parsing.js +++ b/src/utils/css-parsing.js @@ -16,32 +16,20 @@ const extractCssValue = (css, selector, property) => { const updateCssValue = ({ css, selector, property, value, unit }) => { const escaped = selector.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); - const formattedValue = unit === '' || unit === undefined ? value : `${value}${unit}`; - // Check if selector exists - const selectorRegex = new RegExp(`${escaped}\\s*{([^}]*)}`, 'i'); - const selectorMatch = css.match(selectorRegex); - - if (!selectorMatch) { - // Selector doesn't exist, create it - return css + `\n${selector} {\n ${property}: ${formattedValue};\n}\n`; + if (unit === '') { + const regex = new RegExp( + `(${escaped}\\s*{[^}]*${property}:\\s*)[^;]+`, + 'gi' + ); + return css.replace(regex, `$1${value}`); } - const blockContent = selectorMatch[1]; - - // Check if property exists in the block - const propertyRegex = new RegExp(`(${property}\\s*:\\s*)([^;]+)(;?)`, 'i'); - const propertyMatch = blockContent.match(propertyRegex); - - if (!propertyMatch) { - // Property doesn't exist, add it to the block - const newBlockContent = blockContent.trimEnd() + `\n ${property}: ${formattedValue};`; - return css.replace(selectorRegex, `${selector} {${newBlockContent}}`); - } - - // Property exists, replace the entire value - const newBlockContent = blockContent.replace(propertyRegex, `$1${formattedValue}$3`); - return css.replace(selectorRegex, `${selector} {${newBlockContent}}`); + const regex = new RegExp( + `(${escaped}\\s*{[^}]*${property}:\\s*)[\\d.]+(px|rem|em|mm|cm|in)`, + 'gi' + ); + return css.replace(regex, `$1${value}${unit}`); }; const cssParsingUtils = { extractCssBlock, extractCssValue, updateCssValue };