68 lines
No EOL
1.6 KiB
SCSS
68 lines
No EOL
1.6 KiB
SCSS
@import "../variables/media";
|
|
.button {
|
|
width: fit-content;
|
|
padding: 12rem 16rem;
|
|
min-width: 133rem;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
text-align: center;
|
|
font: var( --nav-link);
|
|
color: var(--common-white);
|
|
text-decoration: none;
|
|
border-radius: var(--border-r-8);
|
|
transition: background-color var(--transition);
|
|
gap: 10rem;
|
|
cursor: pointer;
|
|
&:hover {
|
|
transition: background-color var(--transition);
|
|
background-color: var(--common-green-hover);
|
|
}
|
|
&--main {
|
|
background-color: var(--common-green);
|
|
}
|
|
&--line {
|
|
color: var(--green-button);
|
|
background-color: transparent;
|
|
border: 1rem solid var(--green-button);
|
|
&:hover {
|
|
color: var(--common-white);
|
|
}
|
|
}
|
|
&--line-min {
|
|
min-width: auto;
|
|
font: var(--nav-bred);
|
|
padding: 7rem 10rem;
|
|
color: var(--green-button);
|
|
background-color: transparent;
|
|
border: 1rem solid var(--green-button);
|
|
&:hover {
|
|
color: var(--common-white);
|
|
}
|
|
}
|
|
&--transparent {
|
|
color: var(--green-button);
|
|
transition: transform var(--transition);
|
|
padding: 10rem 0;
|
|
min-width: fit-content;
|
|
&:hover {
|
|
transition: background-color var(--transition);
|
|
background-color: transparent;
|
|
transition: transform var(--transition);
|
|
transform: scale(1.1);
|
|
}
|
|
}
|
|
|
|
&--card {
|
|
max-width: 170rem;
|
|
text-align: left;
|
|
background-color: var(--common-green-btn-social);
|
|
font: var(--p-sub);
|
|
gap: 10rem;
|
|
padding: 8rem;
|
|
flex-direction: row-reverse;
|
|
svg {
|
|
transform: scaleX(-1);
|
|
}
|
|
}
|
|
} |