@onereach/styles 0.1.12 → 0.1.14
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.
- package/README.md +3 -3
- package/package.json +2 -2
- package/src/base/index.scss +5 -5
- package/src/components/{base/_button.scss → _or-button.scss} +3 -5
- package/src/components/{base/_checkbox.scss → _or-checkbox.scss} +2 -2
- package/src/components/{base/_collapse.scss → _or-collapse.scss} +2 -2
- package/src/components/{base/_error.scss → _or-error.scss} +2 -2
- package/src/components/{base/_hint.scss → _or-hint.scss} +2 -2
- package/src/components/{base/_icon.scss → _or-icon.scss} +2 -2
- package/src/components/{base/_label.scss → _or-label.scss} +2 -2
- package/src/components/{base/_list.scss → _or-list.scss} +5 -5
- package/src/components/{base/_loader.scss → _or-loader.scss} +4 -4
- package/src/components/{base/_radio-group.scss → _or-radio-group.scss} +2 -2
- package/src/components/{base/_radio.scss → _or-radio.scss} +2 -2
- package/src/components/{base/_switch.scss → _or-switch.scss} +3 -3
- package/src/components/{base/_textbox.scss → _or-textbox.scss} +8 -11
- package/src/global.scss +1 -0
- package/src/main.scss +0 -1
- package/src/variables/_initial.scss +1 -1
- package/src/components/modern/_button.scss +0 -6
package/README.md
CHANGED
|
@@ -31,18 +31,18 @@ import '@onereach/styles/src/components/(base/modern/etc.)/component-name.scss';
|
|
|
31
31
|
|
|
32
32
|
<script>
|
|
33
33
|
// with sass-loader
|
|
34
|
-
// import '@onereach/styles/src/components/
|
|
34
|
+
// import '@onereach/styles/src/components/or-icon.scss';
|
|
35
35
|
|
|
36
36
|
export default {};
|
|
37
37
|
</script>
|
|
38
38
|
|
|
39
39
|
<style lang="scss">
|
|
40
|
-
@import "node_modules/@onereach/styles/src/components/
|
|
40
|
+
@import "node_modules/@onereach/styles/src/components/or-icon";
|
|
41
41
|
</style>
|
|
42
42
|
```
|
|
43
43
|
```js
|
|
44
44
|
// example with js or ts files
|
|
45
|
-
import '@onereach/styles/src/components/
|
|
45
|
+
import '@onereach/styles/src/components/or-icon.scss';
|
|
46
46
|
|
|
47
47
|
export default {
|
|
48
48
|
name: 'BaseHeading',
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@onereach/styles",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.14",
|
|
4
4
|
"description": "Styles for or-ui-next",
|
|
5
5
|
"main": "./dist/index.min.css",
|
|
6
6
|
"unpkg": "./dist/index.css",
|
|
@@ -38,5 +38,5 @@
|
|
|
38
38
|
"sass": "^1.35.1",
|
|
39
39
|
"stylelint": "^13.13.1"
|
|
40
40
|
},
|
|
41
|
-
"gitHead": "
|
|
41
|
+
"gitHead": "2e8d0f885940cdff8116d3e77ee5608780f4367a"
|
|
42
42
|
}
|
package/src/base/index.scss
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
@
|
|
2
|
-
@
|
|
3
|
-
@
|
|
4
|
-
@
|
|
5
|
-
@
|
|
1
|
+
@forward "reset";
|
|
2
|
+
@forward "generic";
|
|
3
|
+
@forward "typography";
|
|
4
|
+
@forward "v-transitions";
|
|
5
|
+
@forward "animation";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
@use "
|
|
2
|
-
@use "
|
|
1
|
+
@use "../utils/index" as *;
|
|
2
|
+
@use "../variables/initial";
|
|
3
3
|
|
|
4
4
|
$btn-prefix: initial.$base-prefix !default;
|
|
5
5
|
|
|
@@ -190,12 +190,10 @@ $btn-types: (outline, text, icon, icon-simple);
|
|
|
190
190
|
|
|
191
191
|
@mixin icon-type() {
|
|
192
192
|
&.icon-type {
|
|
193
|
-
$btn-border-radius: initial.$round;
|
|
194
|
-
|
|
195
193
|
min-width: auto;
|
|
196
194
|
max-width: px-to-rem(54);
|
|
197
195
|
padding: px-to-rem(14);
|
|
198
|
-
border-radius:
|
|
196
|
+
border-radius: initial.$round;
|
|
199
197
|
|
|
200
198
|
.material-icons {
|
|
201
199
|
font-size: px-to-rem(24);
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
@use "
|
|
2
|
-
@use "
|
|
1
|
+
@use "../utils/index" as *;
|
|
2
|
+
@use "../variables/initial";
|
|
3
3
|
|
|
4
4
|
$list-prefix: initial.$base-prefix !default;
|
|
5
5
|
|
|
@@ -26,9 +26,9 @@ $list-prefix: initial.$base-prefix !default;
|
|
|
26
26
|
width: 100%;
|
|
27
27
|
margin-bottom: var(--s-4);
|
|
28
28
|
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
}
|
|
29
|
+
//.material-icons {
|
|
30
|
+
// color: var(--c-neutral-4);
|
|
31
|
+
//}
|
|
32
32
|
}
|
|
33
33
|
|
|
34
34
|
&--slot {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
@use "
|
|
2
|
-
@use "
|
|
3
|
-
@use "
|
|
1
|
+
@use "../utils/index" as *;
|
|
2
|
+
@use "../base/animation" as *;
|
|
3
|
+
@use "../variables/initial";
|
|
4
4
|
|
|
5
5
|
$loader-prefix: initial.$base-prefix !default;
|
|
6
6
|
|
|
@@ -45,7 +45,7 @@ $loader-border-color: inherit !default;
|
|
|
45
45
|
}
|
|
46
46
|
|
|
47
47
|
@for $i from 0 through 3 {
|
|
48
|
-
|
|
48
|
+
.#{$loader-prefix}-loader--dot:nth-child(#{$i}) {
|
|
49
49
|
animation: fade 1s initial.$transition-function $i * 0.2s infinite;
|
|
50
50
|
}
|
|
51
51
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
@use "
|
|
2
|
-
@use "
|
|
1
|
+
@use "../utils/index" as *;
|
|
2
|
+
@use "../variables/initial";
|
|
3
3
|
|
|
4
4
|
// base
|
|
5
5
|
$switch-prefix: initial.$base-prefix !default;
|
|
@@ -117,7 +117,7 @@ $switch-content-color-disabled: var(--c-neutral-4) !default;
|
|
|
117
117
|
}
|
|
118
118
|
|
|
119
119
|
&--loader {
|
|
120
|
-
|
|
120
|
+
&.#{$switch-prefix}-loader {
|
|
121
121
|
&::after {
|
|
122
122
|
width: $switch-loader-size;
|
|
123
123
|
min-width: $switch-loader-size;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
@use "sass:list";
|
|
2
|
-
@use "
|
|
3
|
-
@use "
|
|
2
|
+
@use "../utils/index" as *;
|
|
3
|
+
@use "../variables/initial";
|
|
4
4
|
|
|
5
5
|
$textbox-prefix: initial.$base-prefix !default;
|
|
6
6
|
|
|
@@ -39,11 +39,13 @@ $textbox-label-margin: 0 0 px-to-rem(4) !default;
|
|
|
39
39
|
$textbox-label-color: var(--c-neutral-4) !default;
|
|
40
40
|
|
|
41
41
|
.#{$textbox-prefix}-textbox {
|
|
42
|
-
display:
|
|
43
|
-
|
|
42
|
+
display: flex;
|
|
43
|
+
align-items: flex-start;
|
|
44
44
|
|
|
45
|
-
|
|
46
|
-
|
|
45
|
+
> div {
|
|
46
|
+
&:not(.#{$textbox-prefix}-textbox--append, .#{$textbox-prefix}-textbox--prepend) {
|
|
47
|
+
width: 100%;
|
|
48
|
+
}
|
|
47
49
|
}
|
|
48
50
|
|
|
49
51
|
&--label {
|
|
@@ -186,11 +188,6 @@ $textbox-label-color: var(--c-neutral-4) !default;
|
|
|
186
188
|
}
|
|
187
189
|
}
|
|
188
190
|
|
|
189
|
-
//&.has-slot {
|
|
190
|
-
// flex-direction: row;
|
|
191
|
-
// align-items: flex-end;
|
|
192
|
-
//}
|
|
193
|
-
|
|
194
191
|
&.has-counter {
|
|
195
192
|
.#{$textbox-prefix}-textbox {
|
|
196
193
|
&--hint,
|
package/src/global.scss
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@forward "utils";
|
package/src/main.scss
CHANGED
|
@@ -33,7 +33,7 @@ $heading-font-weight: var(--fw-2) !default;
|
|
|
33
33
|
$heading-line-height: var(--lh-2) !default;
|
|
34
34
|
|
|
35
35
|
// generic
|
|
36
|
-
$base-prefix: quote(
|
|
36
|
+
$base-prefix: quote('or') !default;
|
|
37
37
|
$round: 9999px !default;
|
|
38
38
|
|
|
39
39
|
$transition-function: var(--t-func) !default;
|