common-ui/src/assets/styles/common-texts.scss
2023-05-29 21:24:06 +03:00

149 lines
2.2 KiB
SCSS

@use 'common-mixins' as mixins;
* {
-webkit-font-smoothing: subpixel-antialiased;
-moz-osx-font-smoothing: auto;
}
.text-muted {
opacity: 0.7;
}
.all-caps-label {
text-transform: uppercase;
font-size: 11px;
font-weight: 600;
letter-spacing: 0;
line-height: 14px;
transition: opacity 0.2s;
@extend .text-muted;
&.cancel {
cursor: pointer;
&:hover {
opacity: 1;
}
&.disabled {
opacity: 0.3;
cursor: default;
}
}
&.primary {
color: var(--iqser-primary);
opacity: 1;
}
}
a {
color: var(--iqser-primary);
transition: color 0.1s;
&:hover {
color: var(--iqser-primary-2);
}
&.with-underline {
&:hover {
text-decoration: underline;
}
}
cursor: pointer;
}
pre {
font-family: var(--iqser-font-family);
color: var(--iqser-text);
}
.heading-xxl {
font-size: 36px;
font-weight: 400;
line-height: 43px;
}
.heading-xl {
font-size: 24px;
font-weight: 600;
line-height: 29px;
}
.heading-l {
font-size: 20px;
font-weight: 600;
line-height: 24px;
}
.heading {
font-size: 16px;
line-height: 20px;
font-weight: 600;
}
.info {
font-size: var(--iqser-font-size);
line-height: 18px;
@extend .text-muted;
}
.page-title {
font-size: var(--iqser-font-size);
font-weight: 600;
line-height: 18px;
text-align: center;
padding: 0 20px;
}
.small-label {
font-size: 11px;
line-height: 14px;
font-weight: initial;
&:not(.full-opacity) {
@extend .text-muted;
}
}
.link-action {
color: var(--iqser-text);
font-size: 11px;
line-height: 14px;
text-decoration: underline;
cursor: pointer;
&:hover {
text-decoration: none;
color: var(--iqser-text);
}
}
.large-label {
color: var(--iqser-text);
font-size: var(--iqser-font-size);
line-height: 16px;
}
.clamp-1 {
@include mixins.line-clamp(1);
}
.clamp-2 {
@include mixins.line-clamp(2);
}
.clamp-3 {
@include mixins.line-clamp(3);
}
.clamp-4 {
@include mixins.line-clamp(4);
}
.no-wrap {
white-space: nowrap;
}