a11yist/app/assets/stylesheets/application.bootstrap.scss
david c2d1cb6ce7
Some checks failed
/ Run tests (push) Successful in 1m51s
/ Run system tests (push) Failing after 1m58s
/ Build, push and deploy image (push) Successful in 1m21s
Fix notes
2024-11-09 01:00:26 +01:00

167 lines
No EOL
4 KiB
SCSS
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

@font-face {
font-family: 'Lexend';
src: url('Lexend-VariableFont_wght.ttf');
font-display: swap;
}
$font-family-sans-serif: Lexend,
// Cross-platform generic font family (default user interface font)
system-ui,
// Safari for macOS and iOS (San Francisco)
-apple-system,
// Windows
"Segoe UI",
// Android
Roboto,
// Basic web fallback
"Helvetica Neue", Arial,
// Linux
"Noto Sans",
"Liberation Sans",
// Sans serif fallback
sans-serif,
// Emoji fonts
"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
$enable-rounded: false;
@import 'bootstrap/scss/bootstrap';
@font-face {
font-display: block;
font-family: "bootstrap-icons";
src: url("./bootstrap-icons.woff2") format("woff2"),
url("./bootstrap-icons.woff") format("woff");
}
@import 'bootstrap-icons/font/bootstrap-icons';
.rails-bootstrap-forms-date-select select,
.rails-bootstrap-forms-time-select select,
.rails-bootstrap-forms-datetime-select select {
display: inline-block;
width: auto;
}
.rails-bootstrap-forms-error-summary {
margin-top: 10px;
}
@import "trix/dist/trix";
/*
* Provides a drop-in pointer for the default Trix stylesheet that will format the toolbar and
* the trix-editor content (whether displayed or under editing). Feel free to incorporate this
* inclusion directly in any other asset bundle and remove this file.
*
*= require trix
*/
/*
* We need to override trix.csss image gallery styles to accommodate the
* <action-text-attachment> element we wrap around attachments. Otherwise,
* images in galleries will be squished by the max-width: 33%; rule.
*/
.trix-content .attachment-gallery>action-text-attachment,
.trix-content .attachment-gallery>.attachment {
flex: 1 0 33%;
padding: 0 0.5em;
max-width: 33%;
}
.trix-content .attachment-gallery.attachment-gallery--2>action-text-attachment,
.trix-content .attachment-gallery.attachment-gallery--2>.attachment,
.trix-content .attachment-gallery.attachment-gallery--4>action-text-attachment,
.trix-content .attachment-gallery.attachment-gallery--4>.attachment {
flex-basis: 50%;
max-width: 50%;
}
.trix-content action-text-attachment .attachment {
padding: 0 !important;
max-width: 100% !important;
}
/* Fix trix dark mode */
.trix-button-row {
.trix-button-group {
border: var(--bs-border-width) solid var(--bs-border-color);
.trix-button {
border: 0;
padding: var(--bs-padding)
}
}
}
[data-bs-theme=dark] {
.trix-button-row {
.trix-button-group {
.trix-button {
background-color: transparent !important;
filter: invert(100%) !important;
}
}
}
}
/* end fix trix dark mode */
.trix-content {
pre {
background-color: var(--bs-secondary-bg) !important;
color: var(--bs-secondary-color) !important;
border: var(--bs-border-width) solid var(--bs-border-color) !important;
border-radius: 0 !important;
}
p {
margin-bottom: 0.6rem;
}
p:last-child {
margin-bottom: 0;
}
}
trix-toolbar .trix-dialog {
background: var(--bs-secondary-bg) !important;
background-color: var(--bs-secondary-bg) !important;
color: var(--bs-secondary-color) !important;
border: var(--bs-border-width) solid var(--bs-border-color) !important;
border-radius: 0 !important;
box-shadow: none;
font-size: 1.1rem;
}
trix-toolbar .trix-button {
background: var(--bs-secondary-bg) !important;
background-color: var(--bs-secondary-bg) !important;
color: var(--bs-secondary-color) !important;
border: var(--bs-border-width) solid var(--bs-border-color) !important;
border-radius: 0 !important;
}
trix-toolbar .trix-input--dialog {
background: var(--bs-secondary-bg) !important;
background-color: var(--bs-secondary-bg) !important;
color: var(--bs-secondary-color) !important;
border: var(--bs-border-width) solid var(--bs-border-color) !important;
border-radius: 0 !important;
}
trix-toolbar .trix-dialog--link {
max-width: 900px;
}
/* trix-editor.trix-content {
min-height: 350px;
overflow-y: auto;
} */
@import "./layout";