diff options
| -rw-r--r-- | package.json | 2 | ||||
| -rw-r--r-- | pnpm-lock.yaml | 10 | ||||
| -rw-r--r-- | src/scopes/_implicit.scss | 232 |
3 files changed, 123 insertions, 121 deletions
diff --git a/package.json b/package.json index 9abf0aa..6b07c26 100644 --- a/package.json +++ b/package.json | |||
| @@ -20,7 +20,7 @@ | |||
| 20 | }, | 20 | }, |
| 21 | "dependencies": { | 21 | "dependencies": { |
| 22 | "include-media": "^2.0.0", | 22 | "include-media": "^2.0.0", |
| 23 | "iro-sass": "git+https://git.vulpes.one/git/iro-sass.git#14f85b1899ae57edc3733bb39a9d311463f7c94a" | 23 | "iro-sass": "git+https://git.vulpes.one/git/iro-sass.git#a9efa537b7ecd99caebb92cc3912a03d2bb7bdaf" |
| 24 | }, | 24 | }, |
| 25 | "devDependencies": { | 25 | "devDependencies": { |
| 26 | "iro-icons": "git+https://git.vulpes.one/git/iro-icons.git#8b921f634a565fd9bb8f6e0ddb1b4d7ba207c0a0", | 26 | "iro-icons": "git+https://git.vulpes.one/git/iro-icons.git#8b921f634a565fd9bb8f6e0ddb1b4d7ba207c0a0", |
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 0c6b6b2..08ad701 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml | |||
| @@ -12,8 +12,8 @@ importers: | |||
| 12 | specifier: ^2.0.0 | 12 | specifier: ^2.0.0 |
| 13 | version: 2.0.0 | 13 | version: 2.0.0 |
| 14 | iro-sass: | 14 | iro-sass: |
| 15 | specifier: git+https://git.vulpes.one/git/iro-sass.git#14f85b1899ae57edc3733bb39a9d311463f7c94a | 15 | specifier: git+https://git.vulpes.one/git/iro-sass.git#a9efa537b7ecd99caebb92cc3912a03d2bb7bdaf |
| 16 | version: git+https://git.vulpes.one/git/iro-sass.git#14f85b1899ae57edc3733bb39a9d311463f7c94a | 16 | version: git+https://git.vulpes.one/git/iro-sass.git#a9efa537b7ecd99caebb92cc3912a03d2bb7bdaf |
| 17 | devDependencies: | 17 | devDependencies: |
| 18 | iro-icons: | 18 | iro-icons: |
| 19 | specifier: git+https://git.vulpes.one/git/iro-icons.git#8b921f634a565fd9bb8f6e0ddb1b4d7ba207c0a0 | 19 | specifier: git+https://git.vulpes.one/git/iro-icons.git#8b921f634a565fd9bb8f6e0ddb1b4d7ba207c0a0 |
| @@ -688,8 +688,8 @@ packages: | |||
| 688 | peerDependencies: | 688 | peerDependencies: |
| 689 | svg-sprite: ^2.0.2 | 689 | svg-sprite: ^2.0.2 |
| 690 | 690 | ||
| 691 | iro-sass@git+https://git.vulpes.one/git/iro-sass.git#14f85b1899ae57edc3733bb39a9d311463f7c94a: | 691 | iro-sass@git+https://git.vulpes.one/git/iro-sass.git#a9efa537b7ecd99caebb92cc3912a03d2bb7bdaf: |
| 692 | resolution: {commit: 14f85b1899ae57edc3733bb39a9d311463f7c94a, repo: https://git.vulpes.one/git/iro-sass.git, type: git} | 692 | resolution: {commit: a9efa537b7ecd99caebb92cc3912a03d2bb7bdaf, repo: https://git.vulpes.one/git/iro-sass.git, type: git} |
| 693 | version: 1.0.2 | 693 | version: 1.0.2 |
| 694 | 694 | ||
| 695 | is-arrayish@0.2.1: | 695 | is-arrayish@0.2.1: |
| @@ -1916,7 +1916,7 @@ snapshots: | |||
| 1916 | dependencies: | 1916 | dependencies: |
| 1917 | svg-sprite: 2.0.4 | 1917 | svg-sprite: 2.0.4 |
| 1918 | 1918 | ||
| 1919 | iro-sass@git+https://git.vulpes.one/git/iro-sass.git#14f85b1899ae57edc3733bb39a9d311463f7c94a: {} | 1919 | iro-sass@git+https://git.vulpes.one/git/iro-sass.git#a9efa537b7ecd99caebb92cc3912a03d2bb7bdaf: {} |
| 1920 | 1920 | ||
| 1921 | is-arrayish@0.2.1: {} | 1921 | is-arrayish@0.2.1: {} |
| 1922 | 1922 | ||
diff --git a/src/scopes/_implicit.scss b/src/scopes/_implicit.scss index c368072..18791a8 100644 --- a/src/scopes/_implicit.scss +++ b/src/scopes/_implicit.scss | |||
| @@ -11,147 +11,149 @@ | |||
| 11 | @mixin styles { | 11 | @mixin styles { |
| 12 | @include materialize-at-root(meta.module-variables('vars')); | 12 | @include materialize-at-root(meta.module-variables('vars')); |
| 13 | 13 | ||
| 14 | html { | 14 | @layer scope { |
| 15 | accent-color: props.get(core.$theme, --accent, --600); | 15 | html { |
| 16 | scrollbar-color: props.get(core.$theme, --text-disabled) transparent; | 16 | accent-color: props.get(core.$theme, --accent, --600); |
| 17 | } | 17 | scrollbar-color: props.get(core.$theme, --text-disabled) transparent; |
| 18 | } | ||
| 18 | 19 | ||
| 19 | html, | 20 | html, |
| 20 | body { | 21 | body { |
| 21 | block-size: 100%; | 22 | block-size: 100%; |
| 22 | } | 23 | } |
| 23 | 24 | ||
| 24 | body { | 25 | body { |
| 25 | padding: 0; | 26 | padding: 0; |
| 26 | margin: 0; | 27 | margin: 0; |
| 27 | font-family: props.get(vars.$body--font-family); | 28 | font-family: props.get(vars.$body--font-family); |
| 28 | font-size: props.get(vars.$body--font-size); | 29 | font-size: props.get(vars.$body--font-size); |
| 29 | font-feature-settings: props.get(vars.$body--feature-settings); | 30 | font-feature-settings: props.get(vars.$body--feature-settings); |
| 30 | line-height: props.get(vars.$body--line-height); | 31 | line-height: props.get(vars.$body--line-height); |
| 31 | color: props.get(core.$theme, --text); | 32 | color: props.get(core.$theme, --text); |
| 32 | background-color: props.get(core.$theme, --bg-base); | 33 | background-color: props.get(core.$theme, --bg-base); |
| 33 | } | 34 | } |
| 34 | 35 | ||
| 35 | pre, | 36 | pre, |
| 36 | code { | 37 | code { |
| 37 | font-family: props.get(vars.$code--font-family); | 38 | font-family: props.get(vars.$code--font-family); |
| 38 | font-size: props.get(vars.$code--font-size); | 39 | font-size: props.get(vars.$code--font-size); |
| 39 | font-feature-settings: props.get(vars.$code--feature-settings); | 40 | font-feature-settings: props.get(vars.$code--feature-settings); |
| 40 | line-height: props.get(vars.$code--line-height); | 41 | line-height: props.get(vars.$code--line-height); |
| 41 | } | 42 | } |
| 42 | 43 | ||
| 43 | pre { | 44 | pre { |
| 44 | margin: 0; | 45 | margin: 0; |
| 45 | overflow-x: auto; | 46 | overflow-x: auto; |
| 46 | 47 | ||
| 47 | code { | 48 | code { |
| 48 | font-size: 1em; | 49 | font-size: 1em; |
| 49 | color: currentColor; | 50 | color: currentColor; |
| 51 | } | ||
| 50 | } | 52 | } |
| 51 | } | ||
| 52 | 53 | ||
| 53 | h1, | 54 | h1, |
| 54 | h2, | 55 | h2, |
| 55 | h3, | 56 | h3, |
| 56 | h4, | 57 | h4, |
| 57 | h5, | 58 | h5, |
| 58 | h6 { | 59 | h6 { |
| 59 | margin-block: props.get(vars.$heading--margin-bs) 0; | 60 | margin-block: props.get(vars.$heading--margin-bs) 0; |
| 60 | font-family: props.get(vars.$heading--font-family); | 61 | font-family: props.get(vars.$heading--font-family); |
| 61 | font-size: props.get(vars.$heading--font-size); | 62 | font-size: props.get(vars.$heading--font-size); |
| 62 | font-weight: props.get(vars.$heading--font-weight); | 63 | font-weight: props.get(vars.$heading--font-weight); |
| 63 | font-feature-settings: props.get(vars.$heading--feature-settings); | 64 | font-feature-settings: props.get(vars.$heading--feature-settings); |
| 64 | line-height: props.get(vars.$heading--line-height); | 65 | line-height: props.get(vars.$heading--line-height); |
| 65 | color: props.get(vars.$heading--color); | 66 | color: props.get(vars.$heading--color); |
| 66 | 67 | ||
| 67 | & + & { | 68 | & + & { |
| 68 | margin-block-start: props.get(vars.$heading--margin-bs-sibling); | 69 | margin-block-start: props.get(vars.$heading--margin-bs-sibling); |
| 70 | } | ||
| 69 | } | 71 | } |
| 70 | } | ||
| 71 | 72 | ||
| 72 | p { | 73 | p { |
| 73 | margin-block: props.get(vars.$paragraph--margin-bs) 0; | 74 | margin-block: props.get(vars.$paragraph--margin-bs) 0; |
| 74 | 75 | ||
| 75 | &:empty { | 76 | &:empty { |
| 76 | display: none; | 77 | display: none; |
| 78 | } | ||
| 77 | } | 79 | } |
| 78 | } | ||
| 79 | 80 | ||
| 80 | strong { | 81 | strong { |
| 81 | font-weight: bold; | 82 | font-weight: bold; |
| 82 | } | 83 | } |
| 83 | 84 | ||
| 84 | small { | 85 | small { |
| 85 | font-size: props.get(vars.$small--font-size); | 86 | font-size: props.get(vars.$small--font-size); |
| 86 | } | 87 | } |
| 87 | 88 | ||
| 88 | ul, | 89 | ul, |
| 89 | ol { | 90 | ol { |
| 90 | padding: 0; | 91 | padding: 0; |
| 91 | margin: 0; | 92 | margin: 0; |
| 92 | list-style: none; | 93 | list-style: none; |
| 93 | } | 94 | } |
| 94 | 95 | ||
| 95 | li { | 96 | li { |
| 96 | padding: 0; | 97 | padding: 0; |
| 97 | margin: 0; | 98 | margin: 0; |
| 98 | } | 99 | } |
| 99 | 100 | ||
| 100 | :focus, | 101 | :focus, |
| 101 | :focus-visible { | 102 | :focus-visible { |
| 102 | outline: 0; | 103 | outline: 0; |
| 103 | } | 104 | } |
| 104 | 105 | ||
| 105 | :link, | 106 | :link, |
| 106 | :visited { | 107 | :visited { |
| 107 | color: currentColor; | 108 | color: currentColor; |
| 108 | text-decoration: none; | 109 | text-decoration: none; |
| 109 | } | 110 | } |
| 110 | 111 | ||
| 111 | 112 | ||
| 112 | button, | 113 | button, |
| 113 | input, | 114 | input, |
| 114 | textarea { | 115 | textarea { |
| 115 | box-sizing: content-box; | 116 | box-sizing: content-box; |
| 116 | padding: 0; | 117 | padding: 0; |
| 117 | margin: 0; | 118 | margin: 0; |
| 118 | font-family: inherit; | 119 | font-family: inherit; |
| 119 | font-size: 1em; | 120 | font-size: 1em; |
| 120 | font-style: inherit; | 121 | font-style: inherit; |
| 121 | font-weight: inherit; | 122 | font-weight: inherit; |
| 122 | line-height: inherit; | 123 | line-height: inherit; |
| 123 | color: currentColor; | 124 | color: currentColor; |
| 124 | text-align: inherit; | 125 | text-align: inherit; |
| 125 | text-transform: inherit; | 126 | text-transform: inherit; |
| 126 | appearance: none; | 127 | appearance: none; |
| 127 | background: none; | 128 | background: none; |
| 128 | border: 0; | 129 | border: 0; |
| 129 | 130 | ||
| 130 | &::-moz-focus-inner { | 131 | &::-moz-focus-inner { |
| 131 | border: 0; | 132 | border: 0; |
| 133 | } | ||
| 132 | } | 134 | } |
| 133 | } | ||
| 134 | 135 | ||
| 135 | input, | 136 | input, |
| 136 | textarea { | 137 | textarea { |
| 137 | &::placeholder { | 138 | &::placeholder { |
| 138 | color: props.get(core.$theme, --text-mute); | 139 | color: props.get(core.$theme, --text-mute); |
| 139 | opacity: 1; | 140 | opacity: 1; |
| 140 | } | 141 | } |
| 141 | 142 | ||
| 142 | &:disabled { | 143 | &:disabled { |
| 143 | color: props.get(core.$theme, --text-disabled); | 144 | color: props.get(core.$theme, --text-disabled); |
| 145 | } | ||
| 144 | } | 146 | } |
| 145 | } | ||
| 146 | 147 | ||
| 147 | textarea { | 148 | textarea { |
| 148 | block-size: calc(1em * props.get(core.$font--standard--line-height)); | 149 | block-size: calc(1em * props.get(core.$font--standard--line-height)); |
| 149 | } | 150 | } |
| 150 | 151 | ||
| 151 | hr { | 152 | hr { |
| 152 | block-size: props.get(core.$border-width--thin); | 153 | block-size: props.get(core.$border-width--thin); |
| 153 | margin: 0; | 154 | margin: 0; |
| 154 | background-color: props.get(core.$theme, --border); | 155 | background-color: props.get(core.$theme, --border); |
| 155 | border: 0; | 156 | border: 0; |
| 157 | } | ||
| 156 | } | 158 | } |
| 157 | } | 159 | } |
