mirror of
https://github.com/tusen-ai/naive-ui.git
synced 2025-01-06 12:17:13 +08:00
93 lines
1.8 KiB
SCSS
93 lines
1.8 KiB
SCSS
@import './mixins/mixins.scss';
|
|
@import './theme/default.scss';
|
|
|
|
@include b(button) {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
box-shadow: inset 0 0 0 1.5px $default-button-border-color;
|
|
cursor: pointer;
|
|
user-select: none;
|
|
font-weight: 700;
|
|
&.n-button--large-size {
|
|
font-size: 16px;
|
|
height: 40px;
|
|
border-radius: 6px;
|
|
padding: 0 24px;
|
|
&.is-round {
|
|
border-radius: 20px
|
|
}
|
|
.n-button__icon {
|
|
height: 22px;
|
|
margin-right: 6px;
|
|
& > i::before {
|
|
color: #63E2B7FF;
|
|
font-size: 22px;
|
|
}
|
|
}
|
|
}
|
|
&.n-button--small-size {
|
|
font-size: 14px;
|
|
height: 28px;
|
|
border-radius: 6px;
|
|
padding: 0 18px;
|
|
&.is-round {
|
|
border-radius: 14px
|
|
}
|
|
.n-button__icon {
|
|
height: 18px;
|
|
margin-right: 6px;
|
|
& > i::before {
|
|
font-size: 18px;
|
|
}
|
|
}
|
|
}
|
|
&.n-button--default-size, &.n-button--medium-size {
|
|
font-size: 16px;
|
|
height: 34px;
|
|
border-radius: 6px;
|
|
padding: 0 24px;
|
|
&.is-round {
|
|
border-radius: 17px
|
|
}
|
|
.n-button__icon {
|
|
height: 20px;
|
|
margin-right: 6px;
|
|
& > i::before {
|
|
font-size: 22px;
|
|
}
|
|
}
|
|
}
|
|
|
|
&.is-default {
|
|
color: $default-button-text-color;
|
|
&:hover {
|
|
background-color: #336F6FFF;
|
|
}
|
|
&:active {
|
|
background-color: #366165FF;
|
|
}
|
|
}
|
|
&.is-primary {
|
|
color: #1F263EFF;
|
|
background: #63E2B7FF;
|
|
box-shadow: none;
|
|
&:hover {
|
|
background-color: #6FF7C9FF;
|
|
}
|
|
&:active {
|
|
background-color: #4DB199FF;
|
|
}
|
|
}
|
|
.n-button__icon {
|
|
height: 18px;
|
|
margin-right: 6px;
|
|
& > i::before {
|
|
color: #63E2B7FF;
|
|
font-size: 18px;
|
|
}
|
|
}
|
|
// .n-button__content, .n-button__icon {
|
|
// margin-top: -1px;
|
|
// }
|
|
} |