mirror of https://github.com/IoTcat/sakura2.git
parent
2bb942c9cd
commit
b1f72d2daf
10 changed files with 80 additions and 42 deletions
@ -0,0 +1,34 @@ |
|||||||
|
### Resources |
||||||
|
- [material-components-web](https://material.io/develop/web/components/) |
||||||
|
- [TS handbook](https://typescript.bootcss.com/) |
||||||
|
- [SASS hankbook](https://www.sasscss.com/docs/) |
||||||
|
|
||||||
|
### MDC |
||||||
|
#### 输入框样式 |
||||||
|
|
||||||
|
```scss |
||||||
|
.commit-button { |
||||||
|
@include mdc-button-ink-color($orange); |
||||||
|
@include mdc-states($orange); |
||||||
|
} |
||||||
|
|
||||||
|
.user-info { |
||||||
|
@include mdc-text-field-focused-outline-color($orange); |
||||||
|
@include mdc-text-field-hover-outline-color($orange); |
||||||
|
@include mdc-text-field-outline-color($black); |
||||||
|
@include mdc-text-field-caret-color($orange); |
||||||
|
@include mdc-text-field-label-color($black); |
||||||
|
} |
||||||
|
*/ |
||||||
|
/* |
||||||
|
.mdc-text-field--focused:not(.mdc-text-field--disabled) .mdc-floating-label { |
||||||
|
color: orange; |
||||||
|
} |
||||||
|
.mdc-text-field--focused .mdc-text-field__input:required ~ .mdc-floating-label::after, |
||||||
|
.mdc-text-field--focused .mdc-text-field__input:required ~ .mdc-notched-outline .mdc-floating-label::after { |
||||||
|
color: orange; |
||||||
|
} |
||||||
|
``` |
||||||
|
|
||||||
|
### Linux 相关 |
||||||
|
Ctrl-Z -> `jobs` -> `fg 1` |
@ -1,9 +1,2 @@ |
|||||||
@import "./scheme.scss"; |
@import "./variables.scss"; |
||||||
@import "./size.scss"; |
@import "./mdc.scss"; |
||||||
|
|
||||||
@import "@material/button/mdc-button"; |
|
||||||
|
|
||||||
.foo-button { |
|
||||||
@include mdc-button-ink-color(teal); |
|
||||||
@include mdc-states(teal); |
|
||||||
} |
|
||||||
|
@ -0,0 +1,2 @@ |
|||||||
|
@import "@material/button/mdc-button"; |
||||||
|
@import "@material/textfield/mdc-text-field"; |
@ -1,5 +0,0 @@ |
|||||||
$orange: #fe9600; |
|
||||||
$white: #ffffff; |
|
||||||
$gray: #cfcfcf; |
|
||||||
$dark: #4f4f4f; |
|
||||||
$black: #000000; |
|
@ -1,2 +0,0 @@ |
|||||||
// Font size |
|
||||||
$base: 1em; |
|
@ -0,0 +1,12 @@ |
|||||||
|
/* |
||||||
|
* MDC varibles |
||||||
|
* must using before import |
||||||
|
*/ |
||||||
|
$mdc-theme-primary: #fcb8ab; |
||||||
|
$mdc-theme-secondary: #feeae6; |
||||||
|
$mdc-theme-on-primary: #442b2d; |
||||||
|
$mdc-theme-on-secondary: #442b2d; |
||||||
|
$mdc-theme-surface: #fedbd0; |
||||||
|
$mdc-theme-background: #feeae6; |
||||||
|
$mdc-theme-on-surface: #442c2e; |
||||||
|
$mdc-theme-on-background: #442c2e; |
Loading…
Reference in new issue