servnest/less/buttons.less

156 lines
2.7 KiB
Text

.button {
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 {
background-color: @darkHtColor;
&::selection {
color: @darkHtColor;
}
}
&::selection {
background-color: @darkHtColor;
}
}
@media @dark {
border-color: @lightHtColor;
color: @lightHtColor;
&:hover {
background-color: @lightHtColor;
&::selection {
color: @lightHtColor;
}
}
&::selection {
background-color: @lightHtColor;
}
}
}
.regButton {
.button();
@media @light {
border-color: @darkRegColor;
color: @darkRegColor;
&:hover {
background-color: @darkRegColor;
&::selection {
color: @darkRegColor;
}
}
&::selection {
background-color: @darkRegColor;
}
}
@media @dark {
border-color: @lightRegColor;
color: @lightRegColor;
&:hover {
background-color: @lightRegColor;
&::selection {
color: @lightRegColor;
}
}
&::selection {
background-color: @lightRegColor;
}
}
}
.nsButton {
.button();
@media @light {
border-color: @darkNsColor;
color: @darkNsColor;
&:hover {
background-color: @darkNsColor;
&::selection {
color: @darkNsColor;
}
}
&::selection {
background-color: @darkNsColor;
}
}
@media @dark {
border-color: @lightNsColor;
color: @lightNsColor;
&:hover {
background-color: @lightNsColor;
&::selection {
color: @lightNsColor;
}
}
&::selection {
background-color: @lightNsColor;
}
}
}
.authButton {
.button();
@media @light {
border-color: @darkAuthColor;
color: @darkAuthColor;
&:hover {
background-color: @darkAuthColor;
&::selection {
color: @darkAuthColor;
}
}
&::selection {
background-color: @darkAuthColor;
}
}
@media @dark {
border-color: @lightAuthColor;
color: @lightAuthColor;
&:hover {
background-color: @lightAuthColor;
&::selection {
color: @lightAuthColor;
}
}
&::selection {
background-color: @lightAuthColor;
}
}
}
@media @light {
.htButton:hover, .regButton:hover, .nsButton:hover, .authButton:hover {
color: @lightColor;
&::selection {
background-color: @lightColor;
}
}
}
@media @dark {
.htButton:hover, .regButton:hover, .nsButton:hover, .authButton:hover {
color: @darkColor;
&::selection {
background-color: @darkColor;
}
}
}