9f7c20dae8
* Package updates * Fix up things that look broken * Add to utils * Lead now just sets font size, just use f3 where needed * Update package-lock.json * Update index.tsx * Delete bump-link.scss * Update trigger-error.js * Update components/GenericError.tsx Co-authored-by: Ash Guillaume <10384315+ashygee@users.noreply.github.com> * Update ArticlePage.tsx * Update ActionBar.tsx * Changes from meeting * Found a few more monos * Fix from a merge conflict * Missed a few f3s * Update SubLandingHero.tsx * Bye gradients * Match up breadcrumbs * Update SubLandingHero.tsx * Update lists.scss Co-authored-by: Ash Guillaume <10384315+ashygee@users.noreply.github.com>
126 lines
2.4 KiB
SCSS
126 lines
2.4 KiB
SCSS
.color-unset {
|
|
color: unset;
|
|
}
|
|
|
|
.line-break-anywhere {
|
|
line-break: anywhere;
|
|
}
|
|
|
|
.transition-200 {
|
|
transition: 200ms;
|
|
}
|
|
|
|
.rotate-180 {
|
|
transform: rotateX(180deg);
|
|
}
|
|
|
|
.min-h-screen {
|
|
min-height: 100vh;
|
|
}
|
|
|
|
/* Print utilities
|
|
------------------------------------------------------------------------------*/
|
|
|
|
@media print {
|
|
.no-print {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
/* Opacity utilities
|
|
------------------------------------------------------------------------------*/
|
|
|
|
.opacity-0 {
|
|
opacity: 0;
|
|
}
|
|
.opacity-60 {
|
|
opacity: 0.6;
|
|
}
|
|
.opacity-70 {
|
|
opacity: 0.7;
|
|
}
|
|
.opacity-100 {
|
|
opacity: 1;
|
|
}
|
|
|
|
/* Text utilities
|
|
------------------------------------------------------------------------------*/
|
|
|
|
.underline-dashed {
|
|
padding-bottom: $spacer-1;
|
|
background-image: linear-gradient(
|
|
to right,
|
|
var(--color-auto-gray-3) 50%,
|
|
transparent 0%
|
|
);
|
|
background-repeat: repeat-x;
|
|
background-position: bottom;
|
|
background-size: 10px 1px;
|
|
}
|
|
|
|
/* List utilities
|
|
------------------------------------------------------------------------------*/
|
|
|
|
.list-style-inside {
|
|
list-style: inside;
|
|
}
|
|
|
|
/* Hover utilities
|
|
------------------------------------------------------------------------------*/
|
|
|
|
.hover\:color-bg-info:hover {
|
|
background: var(--color-bg-info);
|
|
}
|
|
|
|
/* Z-Index utilities
|
|
------------------------------------------------------------------------------*/
|
|
|
|
.-z-1 {
|
|
z-index: -1;
|
|
}
|
|
.z-1 {
|
|
z-index: 1;
|
|
}
|
|
.z-2 {
|
|
z-index: 2;
|
|
}
|
|
|
|
/* Gradient utilities
|
|
------------------------------------------------------------------------------*/
|
|
|
|
.fade-tertiary-left {
|
|
background: linear-gradient(to right, var(--color-bg-primary), transparent);
|
|
}
|
|
|
|
.fade-tertiary-right {
|
|
background: linear-gradient(to left, var(--color-bg-primary), transparent);
|
|
}
|
|
|
|
.fade-tertiary-bottom {
|
|
background: linear-gradient(to top, var(--color-bg-primary), transparent);
|
|
}
|
|
|
|
/* Blue primary button
|
|
------------------------------------------------------------------------------*/
|
|
.btn-primary-matte {
|
|
color: var(--color-text-inverse);
|
|
background-color: var(--color-auto-blue-5);
|
|
border-color: var(--color-btn-primary-border);
|
|
box-shadow: var(--color-btn-primary-shadow),
|
|
var(--color-btn-primary-inset-shadow);
|
|
}
|
|
|
|
.btn-primary-matte:hover {
|
|
background-color: var(--color-auto-blue-6);
|
|
}
|
|
|
|
/* Semibold text
|
|
------------------------------------------------------------------------------*/
|
|
.font-weight-semibold {
|
|
font-weight: $font-weight-semibold;
|
|
}
|
|
|
|
.outline-none {
|
|
outline: none;
|
|
}
|