160 lines
2.7 KiB
Text
160 lines
2.7 KiB
Text
.button {
|
|
font-size: 35px;
|
|
font-weight: 600;
|
|
border-width: 4px;
|
|
border-style: solid;
|
|
text-decoration: none;
|
|
border-radius: 20px;
|
|
padding: 14px 18px 16px 18px;
|
|
margin: 10px;
|
|
margin-left: 0px;
|
|
display: inline-block;
|
|
}
|
|
|
|
.htButton {
|
|
.button();
|
|
|
|
@media @light {
|
|
border-color: @darkHtColor;
|
|
color: @darkHtColor;
|
|
&:hover, &:focus {
|
|
background-color: @darkHtColor;
|
|
&::selection {
|
|
color: @darkHtColor;
|
|
}
|
|
}
|
|
&::selection {
|
|
background-color: @darkHtColor;
|
|
}
|
|
}
|
|
|
|
@media @dark {
|
|
border-color: @lightHtColor;
|
|
color: @lightHtColor;
|
|
&:hover, &:focus {
|
|
background-color: @lightHtColor;
|
|
&::selection {
|
|
color: @lightHtColor;
|
|
}
|
|
}
|
|
&::selection {
|
|
background-color: @lightHtColor;
|
|
}
|
|
}
|
|
}
|
|
|
|
.regButton {
|
|
.button();
|
|
|
|
@media @light {
|
|
border-color: @darkRegColor;
|
|
color: @darkRegColor;
|
|
&:hover, &:focus {
|
|
background-color: @darkRegColor;
|
|
&::selection {
|
|
color: @darkRegColor;
|
|
}
|
|
}
|
|
&::selection {
|
|
background-color: @darkRegColor;
|
|
}
|
|
}
|
|
|
|
@media @dark {
|
|
border-color: @lightRegColor;
|
|
color: @lightRegColor;
|
|
&:hover, &:focus {
|
|
background-color: @lightRegColor;
|
|
&::selection {
|
|
color: @lightRegColor;
|
|
}
|
|
}
|
|
&::selection {
|
|
background-color: @lightRegColor;
|
|
}
|
|
}
|
|
}
|
|
|
|
.nsButton {
|
|
.button();
|
|
|
|
@media @light {
|
|
border-color: @darkNsColor;
|
|
color: @darkNsColor;
|
|
&:hover, &:focus {
|
|
background-color: @darkNsColor;
|
|
&::selection {
|
|
color: @darkNsColor;
|
|
}
|
|
}
|
|
&::selection {
|
|
background-color: @darkNsColor;
|
|
}
|
|
}
|
|
|
|
@media @dark {
|
|
border-color: @lightNsColor;
|
|
color: @lightNsColor;
|
|
&:hover, &:focus {
|
|
background-color: @lightNsColor;
|
|
&::selection {
|
|
color: @lightNsColor;
|
|
}
|
|
}
|
|
&::selection {
|
|
background-color: @lightNsColor;
|
|
}
|
|
}
|
|
}
|
|
|
|
.authButton {
|
|
.button();
|
|
|
|
@media @light {
|
|
border-color: @darkAuthColor;
|
|
color: @darkAuthColor;
|
|
&:hover, &:focus {
|
|
background-color: @darkAuthColor;
|
|
&::selection {
|
|
color: @darkAuthColor;
|
|
}
|
|
}
|
|
&::selection {
|
|
background-color: @darkAuthColor;
|
|
}
|
|
}
|
|
|
|
@media @dark {
|
|
border-color: @lightAuthColor;
|
|
color: @lightAuthColor;
|
|
&:hover, &:focus {
|
|
background-color: @lightAuthColor;
|
|
&::selection {
|
|
color: @lightAuthColor;
|
|
}
|
|
}
|
|
&::selection {
|
|
background-color: @lightAuthColor;
|
|
}
|
|
}
|
|
}
|
|
|
|
@media @light {
|
|
.htButton:hover, .regButton:hover, .nsButton:hover, .authButton:hover,
|
|
.htButton:focus, .regButton:focus, .nsButton:focus, .authButton:focus {
|
|
color: @lightColor;
|
|
&::selection {
|
|
background-color: @lightColor;
|
|
}
|
|
}
|
|
}
|
|
|
|
@media @dark {
|
|
.htButton:hover, .regButton:hover, .nsButton:hover, .authButton:hover,
|
|
.htButton:focus, .regButton:focus, .nsButton:focus, .authButton:focus {
|
|
color: @darkColor;
|
|
&::selection {
|
|
background-color: @darkColor;
|
|
}
|
|
}
|
|
}
|