190 行
4.7 KiB
SCSS
190 行
4.7 KiB
SCSS
.btn, btn:hover {
|
|
margin: 0 2px;
|
|
border: 2px solid;
|
|
}
|
|
|
|
.btn {
|
|
border-left-color: $white1;
|
|
border-top-color: $white1;
|
|
}
|
|
|
|
.btn:hover {
|
|
border-left-color: $grey3;
|
|
border-top-color: $grey3;
|
|
}
|
|
|
|
.btn-cwgames, .btn-cwgames.disabled, .btn-cwgames:disabled {
|
|
background: radial-gradient(ellipse at top, $black3, transparent),
|
|
radial-gradient(ellipse at bottom, $black1, transparent);
|
|
color: $white1;
|
|
border-bottom-color: $grey2;
|
|
border-right-color: $grey2;
|
|
}
|
|
|
|
.btn-cwgames:hover {
|
|
color: $white1;
|
|
background-color: $grey4;
|
|
border-color: transparent;
|
|
border-bottom-color: $black2;
|
|
border-right-color: $black2;
|
|
}
|
|
|
|
.btn-fumei, .btn-fumei.disabled, .btn-fumei:disabled {
|
|
background: radial-gradient(ellipse at top, $kawaii3, transparent),
|
|
radial-gradient(ellipse at bottom, $black1, transparent);
|
|
color: $white1;
|
|
background-color: $kawaii2;
|
|
border-bottom-color: $kawaii1;
|
|
border-right-color: $kawaii1;
|
|
}
|
|
|
|
.btn-fumei:hover {
|
|
color: $white1;
|
|
background-color: $kawaii3;
|
|
border-color: transparent;
|
|
border-bottom-color: $kawaii2;
|
|
border-right-color: $kawaii2;
|
|
}
|
|
|
|
.btn-fumei-check {
|
|
color: $white1;
|
|
background-color: $kawaii3;
|
|
border-color: transparent;
|
|
border-bottom-color: $kawaii2;
|
|
border-right-color: $kawaii2;
|
|
box-shadow: 0px 0px 7px 3px $kawaii2;
|
|
}
|
|
|
|
.btn-danshi, .btn-danshi.disabled, .btn-danshi:disabled {
|
|
background: radial-gradient(ellipse at top, $dan2, transparent),
|
|
radial-gradient(ellipse at bottom, $black1, transparent);
|
|
color: $white1;
|
|
background-color: $white1;
|
|
border-bottom-color: $dan1;
|
|
border-right-color: $dan1;
|
|
}
|
|
|
|
.btn-danshi:hover {
|
|
color: $white1;
|
|
background-color: $dan4;
|
|
border-color: transparent;
|
|
border-bottom-color: $dan3;
|
|
border-right-color: $dan3;
|
|
}
|
|
|
|
.btn-danshi-check {
|
|
color: $white1;
|
|
background-color: $dan4;
|
|
border-color: transparent;
|
|
border-bottom-color: $dan3;
|
|
border-right-color: $dan3;
|
|
box-shadow: 0px 0px 7px 3px $dan3;
|
|
}
|
|
|
|
.btn-joshi, .btn-joshi.disabled, .btn-joshi:disabled {
|
|
background: radial-gradient(ellipse at top, $jo2, transparent),
|
|
radial-gradient(ellipse at bottom, $black1, transparent);
|
|
color: $white1;
|
|
background-color: $white1;
|
|
border-bottom-color: $jo1;
|
|
border-right-color: $jo1;
|
|
}
|
|
|
|
.btn-joshi:hover {
|
|
color: $white1;
|
|
background-color: $jo4;
|
|
border-color: transparent;
|
|
border-bottom-color: $jo3;
|
|
border-right-color: $jo3;
|
|
}
|
|
|
|
.btn-joshi-check {
|
|
color: $white1;
|
|
background-color: $jo4;
|
|
border-color: transparent;
|
|
border-bottom-color: $jo3;
|
|
border-right-color: $jo3;
|
|
box-shadow: 0px 0px 7px 3px $jo3;
|
|
}
|
|
|
|
.btn-primary, .btn-primary.disabled, .btn-primary:disabled {
|
|
background: radial-gradient(ellipse at top, $suwa03, transparent),
|
|
radial-gradient(ellipse at bottom, $black1, transparent);
|
|
color: $white1;
|
|
border-bottom-color: $suwa00;
|
|
border-right-color: $suwa00;
|
|
}
|
|
|
|
.btn-primary:hover {
|
|
color: $white1;
|
|
background-color: $suwa08;
|
|
border-color: transparent;
|
|
border-bottom-color: $suwa04;
|
|
border-right-color: $suwa04;
|
|
}
|
|
|
|
.btn-secondary, .btn-secondary.disabled, .btn-secondary:disabled {
|
|
background: radial-gradient(ellipse at top, $grey3, transparent),
|
|
radial-gradient(ellipse at bottom, $black1, transparent);
|
|
color: $white1;
|
|
border-bottom-color: $grey1;
|
|
border-right-color: $grey1;
|
|
}
|
|
|
|
.btn-secondary:hover {
|
|
color: $white1;
|
|
background-color: $grey5;
|
|
border-color: transparent;
|
|
border-bottom-color: $grey2;
|
|
border-right-color: $grey2;
|
|
}
|
|
|
|
.btn-success, .btn-success.disabled, .btn-success:disabled, .alert-success {
|
|
background: radial-gradient(ellipse at top, $ok2, transparent),
|
|
radial-gradient(ellipse at bottom, $black1, transparent);
|
|
color: $white1;
|
|
border-bottom-color: $ok1;
|
|
border-right-color: $ok1;
|
|
}
|
|
|
|
.btn-success:hover {
|
|
color: $white1;
|
|
background-color: $ok5;
|
|
border-color: transparent;
|
|
border-bottom-color: $ok4;
|
|
border-right-color: $ok4;
|
|
}
|
|
|
|
.btn-danger, .btn-danger.disabled, .btn-danger:disabled, .alert-danger {
|
|
background: radial-gradient(ellipse at top, $ng3, transparent),
|
|
radial-gradient(ellipse at bottom, $black1, transparent);
|
|
color: $white1;
|
|
border-bottom-color: $ng1;
|
|
border-right-color: $ng1;
|
|
}
|
|
|
|
.btn-danger:hover {
|
|
color: $white1;
|
|
background-color: $ng7;
|
|
border-color: transparent;
|
|
border-bottom-color: $ng3;
|
|
border-right-color: $ng3;
|
|
}
|
|
|
|
|
|
.btn-warning, .btn-warning.disabled, .btn-warning:disabled, .alert-warning {
|
|
background: radial-gradient(ellipse at top, $yellow3, transparent),
|
|
radial-gradient(ellipse at bottom, $black1, transparent);
|
|
color: $white1;
|
|
border-bottom-color: $yellow1;
|
|
border-right-color: $yellow1;
|
|
}
|
|
|
|
.btn-warning:hover {
|
|
color: $white1;
|
|
background-color: $yellow5;
|
|
border-color: transparent;
|
|
border-bottom-color: $yellow3;
|
|
border-right-color: $yellow3;
|
|
}
|