Files
lucent-laravel/front/sass/_button.scss
T
2026-05-14 22:49:47 +03:00

91 lines
1.5 KiB
SCSS

.button {
border-radius: 12px;
background: var(--p20);
padding: 3px 10px;
cursor: pointer;
border: 0px solid var(--p30);
font-size: 14px;
min-height: 27px;
display: flex;
align-items: center;
gap: 4px;
color: var(--text);
&:focus {
}
&:hover {
background: var(--p30);
}
&:active {
background: var(--p50) !important;
box-shadow: none;
}
&.active {
background: var(--p30);
}
&.secondary {
background: var(--p30);
&:hover {
background: var(--p40);
}
}
&.primary {
background: var(--p70);
color: var(--p10);
&:hover {
background: var(--p90);
}
}
&[disabled] {
pointer-events: none;
opacity: 0.7;
color: var(--text);
}
}
.upload-button {
padding: 0;
border: none;
label {
margin: 0;
font-size: 14px;
line-height: 14px;
font-weight: normal;
background: var(--p80) !important;
color: var(--p10);
}
}
.button-text {
border: none;
padding: 0;
background: transparent;
cursor: pointer;
}
.spinner-border {
width: 12px;
height: 12px;
border: 2px solid var(--p10);
border-bottom-color: var(--p30);
border-radius: 50%;
display: inline-block;
box-sizing: border-box;
animation: rotation 1s linear infinite;
}
@keyframes rotation {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}