mirror/naive-ui
2
0
Fork 0
mirror of https://github.com/tusen-ai/naive-ui.git synced 2025-01-30 12:52:43 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore: add some theme scaffold files

Browse Source
This commit is contained in:
07akioni 2019-11-26 13:05:25 +08:00
parent c289970b68
commit 24a6cee5ae
26 changed files with 100 additions and 167 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
styles/ColumnGroup.scss
View File

@ -1,15 +0,0 @@
@import './mixins/mixins.scss';
@include b(column-group) {
& > .columns {
display: flex;
justify-content: space-between;
& >.column {
margin-right: 18px;
&:last-child {
margin-right: 0;
}
flex-grow: 1;
}
}
}

111
styles/NimbusForm.scss
View File

@ -1,111 +0,0 @@
@import './mixins/mixins.scss';
@include themes-mixin {
@include b(nimbus-form-card) {
// position: relative;
@include once {
min-width: 600px;
width: 1032px;
margin: auto;
pointer-events: none;
border-radius: 9px;
}
.n-nimbus-form-card__body {
position: relative;
pointer-events: all;
clip-path: border-box;
margin-top: 24px;
margin-bottom: 24px;
background: $--nimbus-form-background-color;
color: $--nimbus-form-text-color;
border-radius: 9px;
.n-nimbus-form-card__header {
position: relative;
&.n-nimbus-form-card__header--sticky {
position: sticky;
top: 0px;
}
top: 0;
// background-color: #5c657e;
border-radius: 9px;
display: flex;
justify-content: space-between;
align-items: center;
padding-bottom: 20px;
padding-top: 24px;
padding-left: 30px;
padding-right: 30px;
margin-left: 15px;
margin-right: 15px;
height: 19px;
.n-nimbus-form-card__title {
line-height: 19px;
font-size: 16px;
font-weight: 700;
color: $--nimbus-form-title-color;
}
.n-nimbus-form-card__right-header {
display: flex;
align-items: center;
.n-nimbus-form-card__deactivator {
position: relative;
width: 14px;
height: 14px;
margin-left: 17px;
cursor: pointer;
&::before {
position: absolute;
transform: rotate(45deg);
height: 7px;
width: 7px;
top: -3px;
content: "";
border-right: 3px solid #c5d0de;
border-bottom: 3px solid #c5d0de;
}
&::after {
position: absolute;
height: 7px;
width: 7px;
content: "";
transform: rotate(45deg);
top: 7px;
border-left: 3px solid #c5d0de;
border-top: 3px solid #c5d0de;
}
}
}
}
.n-nimbus-form-card__content {
padding: 19px 45px;
}
.n-nimbus-form-card__divider {
border-bottom: 1px solid $--nimbus-form-divider-color;
position: absolute;
left: 30px;
right: 30px;
bottom: 0;
}
.n-nimbus-form-card__footer {
&.n-nimbus-form-card__footer--sticky {
position: sticky;
}
position: relative;
padding-top: 24px;
padding-bottom: 24px;
padding-left: 30px;
padding-right: 30px;
margin-left: 15px;
margin-right: 15px;
display: flex;
flex-direction: row-reverse;
// background: #5c657e;
border-radius: 9px;
bottom: 0;
.n-nimbus-form-card__divider {
bottom: unset;
top: 0;
}
}
}
}
}

38
styles/ServiceCard.scss
View File

@ -1,38 +0,0 @@
@import './mixins/mixins.scss';
@include b(service-card) {
& {
background:rgba(58,64,85,1);
box-shadow:0px 2px 20px 0px rgba(0,0,0,0.23),0px 1px 10px 0px rgba(0,0,0,0.04);
border-radius:10px;
padding: 15px 14px 18px 14px;
margin-bottom: 16px;
}
& > .title {
font-size: 14px;
color: rgba(212, 216, 231, .5);
}
& > .divider {
margin-top: 15px;
margin-bottom: 15px;
height: 1px;
background-color: rgba(255, 255, 255, .09)
}
& > .items {
display: flex;
flex-direction: column;
& > .item {
font-size: 14px;
padding: 10px 16px;
color: #fff;
background-color: rgba(255,255,255,0.23);
border-radius: 6px;
}
& > .item:not(:last-child) {
margin-bottom: 10px;
}
& > .item.disabled {
background-color: rgba(255,255,255,0.23);
}
}
}

3
styles/index.scss
View File

@ -3,9 +3,7 @@
@import "./Card.scss";
@import "./Icon.scss";
@import "./GradientText.scss";
@import "./ColumnGroup.scss";
@import "./WithPadding.scss";
@import "./ServiceCard.scss";
@import "./Table.scss";
@import "./WithMargin.scss";
@import "./Checkbox.scss";
@ -64,7 +62,6 @@
@import "./Confirm.scss";
@import "./BaseLoading.scss";
@import "./BaseSlotMachine.scss";
@import "./NimbusForm.scss";
@import "./Modal.scss";
@import "./Result.scss";
@import "./Thing.scss";

3
styles/themes/dark/components/Affix.scss Normal file
View File

@ -0,0 +1,3 @@
@mixin setup-dark-affix {
}

3
styles/themes/dark/components/AutoComplete.scss Normal file
View File

@ -0,0 +1,3 @@
@mixin setup-dark-auto-complete {
}

3
styles/themes/dark/components/Card.scss Normal file
View File

@ -0,0 +1,3 @@
@mixin setup-dark-card {
}

3
styles/themes/dark/components/Descriptions.scss Normal file
View File

@ -0,0 +1,3 @@
@mixin setup-dark-descriptions {
}

3
styles/themes/dark/components/Drawer.scss Normal file
View File

@ -0,0 +1,3 @@
@mixin setup-dark-drawer {
}

3
styles/themes/dark/components/Empty.scss Normal file
View File

@ -0,0 +1,3 @@
@mixin setup-dark-empty {
}

3
styles/themes/dark/components/Form.scss Normal file
View File

@ -0,0 +1,3 @@
@mixin setup-dark-form {
}

3
styles/themes/dark/components/Layout.scss Normal file
View File

@ -0,0 +1,3 @@
@mixin setup-dark-layout {
}

3
styles/themes/dark/components/List.scss Normal file
View File

@ -0,0 +1,3 @@
@mixin setup-dark-list {
}

3
styles/themes/dark/components/Thing.scss Normal file
View File

@ -0,0 +1,3 @@
@mixin setup-dark-thing {
}

20
styles/themes/dark/index.scss
View File

@ -41,6 +41,16 @@
@import "components/NimbusForm.scss";
@import "components/Modal.scss";
@import "components/Transfer.scss";
@import "components/Thing.scss";
@import "components/List.scss";
@import "components/Layout.scss";
@import "components/Form.scss";
@import "components/Empty.scss";
@import "components/Drawer.scss";
@import "components/Descriptions.scss";
@import "components/Card.scss";
@import "components/AutoComplete.scss";
@import "components/Affix.scss";
@mixin setup-dark-theme() {
@include setup-dark-colors();
@ -109,4 +119,14 @@
@include setup-dark-nimbus-form;
@include setup-dark-modal;
@include setup-dark-transfer;
@include setup-dark-thing;
@include setup-dark-list;
@include setup-dark-layout;
@include setup-dark-form;
@include setup-dark-empty;
@include setup-dark-drawer;
@include setup-dark-descriptions;
@include setup-dark-card;
@include setup-dark-auto-complete;
@include setup-dark-affix;
}

3
styles/themes/light/components/Affix.scss Normal file
View File

@ -0,0 +1,3 @@
@mixin setup-light-affix {
}

3
styles/themes/light/components/AutoComplete.scss Normal file
View File

@ -0,0 +1,3 @@
@mixin setup-light-auto-complete {
}

3
styles/themes/light/components/Card.scss Normal file
View File

@ -0,0 +1,3 @@
@mixin setup-light-card {
}

3
styles/themes/light/components/Descriptions.scss Normal file
View File

@ -0,0 +1,3 @@
@mixin setup-light-descriptions {
}

3
styles/themes/light/components/Drawer.scss Normal file
View File

@ -0,0 +1,3 @@
@mixin setup-light-drawer {
}

3
styles/themes/light/components/Empty.scss Normal file
View File

@ -0,0 +1,3 @@
@mixin setup-light-empty {
}

3
styles/themes/light/components/Form.scss Normal file
View File

@ -0,0 +1,3 @@
@mixin setup-light-form {
}

3
styles/themes/light/components/Layout.scss Normal file
View File

@ -0,0 +1,3 @@
@mixin setup-light-layout {
}

3
styles/themes/light/components/List.scss Normal file
View File

@ -0,0 +1,3 @@
@mixin setup-light-list {
}

3
styles/themes/light/components/Thing.scss Normal file
View File

@ -0,0 +1,3 @@
@mixin setup-light-thing {
}

20
styles/themes/light/index.scss
View File

@ -41,6 +41,16 @@
@import "components/NimbusForm.scss";
@import "components/Modal.scss";
@import "components/Transfer.scss";
@import "components/Thing.scss";
@import "components/List.scss";
@import "components/Layout.scss";
@import "components/Form.scss";
@import "components/Empty.scss";
@import "components/Drawer.scss";
@import "components/Descriptions.scss";
@import "components/Card.scss";
@import "components/AutoComplete.scss";
@import "components/Affix.scss";
@mixin setup-light-theme() {
@include setup-light-colors();
@ -107,4 +117,14 @@
@include setup-light-nimbus-form;
@include setup-light-modal;
@include setup-light-transfer;
@include setup-light-thing;
@include setup-light-list;
@include setup-light-layout;
@include setup-light-form;
@include setup-light-empty;
@include setup-light-drawer;
@include setup-light-descriptions;
@include setup-light-card;
@include setup-light-auto-complete;
@include setup-light-affix;
}