2025-08-12 13:33:25 +03:00

219 lines
3.1 KiB
Plaintext

@import '_colors.less';
@import '_variables.less';
button,
a.button
{
font-family: inherit;
font-size: 1.2rem;
font-weight: 200;
display: inline-block;
padding: 1rem 1.5rem;
cursor: pointer;
transition: background .2s ease-out,opacity .2s ease-out;
text-decoration: none;
color: white;
border: none;
outline: none;
background: @blue;
@media(max-width: @mobile){
width:100%;
text-align: center;
& + button,& + a.button{
margin-top:@gutter/2;
}
}
&[data-label]{
transition:all .2s ease-out;
&:hover{
padding:0 2rem!important;
&:before{
margin-right: 5px;
}
&:after{
content:attr(data-label);
width:auto;
}
}
}
&:hover,
&:active
{
text-decoration: none;
color: white;
background: lighten(@blue,10%);
}
&.big{
padding: 50px 0;
text-align: center;
i{
display: block;
font-size: 10vw;
padding-bottom:2rem;
}
}
&.add{
.success();
&:before{
content: '\f067';
font-family: 'FontAwesome';
margin-right: .5rem;
font-size: 1.2rem;
}
}
&.check{
.success();
&:before{
content: '\f00c';
font-family: 'FontAwesome';
margin-right: .5rem;
font-size: 1.2rem;
}
}
&.save{
.success();
&:before{
content: '\f0c7';
font-family: 'FontAwesome';
margin-right: .5rem;
font-size: 1.2rem;
}
}
&.refresh{
&:before{
content: '\f021';
font-family: 'FontAwesome';
margin-right: .5rem;
font-size: 1.2rem;
}
}
&.view{
&:before{
content: '\f002';
font-family: 'FontAwesome';
margin-right: .5rem;
font-size: 1.2rem;
}
}
&.edit{
.warning();
&:before{
content: '\f040';
font-family: 'FontAwesome';
margin-right: .5rem;
font-size: 1.2rem;
}
}
&.disable{
.error();
&:before{
content: '\f05e';
font-family: 'FontAwesome';
margin-right: .5rem;
font-size: 1.2rem;
}
}
&.enable{
.warning();
&:before{
content: '\f00c';
font-family: 'FontAwesome';
margin-right: .5rem;
font-size: 1.2rem;
}
}
&.remove{
.error();
&:before{
content: '\f00d';
font-family: 'FontAwesome';
margin-right: .5rem;
font-size: 1.2rem;
}
}
&.success{
background:@green;
&.invert{
color: @green;
}
&:hover,&:active{
background:lighten(@green,10%);
}
}
&.warning{
background:@orange;
&.invert{
color: @orange;
}
&:hover,&:active{
background:lighten(@orange,10%);
}
}
&.error{
background:@red;
&.invert{
color: @red;
}
&:hover,&:active{
background:lighten(@red,10%);
}
}
&.invert{
background:transparent;
&:hover{
color:white;
}
}
&.full{
width: 100%;
}
&:empty:before{
margin-right:0;
}
}