Files
subtle-storm/app/assets/stylesheets/application.css
T

96 lines
2.1 KiB
CSS

/*
* This is a manifest file that'll be compiled into application.css.
*
* With Propshaft, assets are served efficiently without preprocessing steps. You can still include
* application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
* cascading order, meaning styles declared later in the document or manifest will override earlier ones,
* depending on specificity.
*
* Consider organizing styles into separate files for maintainability.
*/
body {
display: flex;
flex-flow: row nowrap;
}
site-sidebar {
--background: var(--pico-primary);
--color: white;
h1, h2, h3, h4, h5, h6, p {
color: var(--color);
}
}
.links, .buttons {
display: flex;
flex-flow: row wrap;
gap: 1em;
padding: 0;
li {
list-style: none;
}
}
:root {
--error-color: #861D13; /* Pico red 700 */
--error-bg: #F8DCD6; /* Pico red 100 */
/* For jade, light on dark looks better */
--success-color: #70FCBA; /* Pico jade 100 */
--success-bg: #015234; /* Pico jade 700 */
--backlog-color: #424751; /* Pico zinc 700 */
--backlog-bg: #E0E3E7; /* Pico zinc 100 */
--analysis-color: #5B4200; /* Pico amber 700 */
--analysis-bg: #FDDEA6; /* Pico amber 100 */
--info-color: #014C75; /* Pico azure 700 */
--info-bg: #D1E5FB; /* Pico azure 100 */
}
form {
.field-with-errors {
input, select, textarea {
border-color: var(--error-color);
&:has(+ .error-text) {
margin-bottom: 0;
}
}
.error-text {
color: var(--error-color);
margin-bottom: var(--pico-spacing);
}
}
}
table {
/* TODO: maybe extract into a separate file */
details.dropdown {
margin: 0;
}
}
a[target=_blank]::after {
content: url("mingcute/external_link_line.svg");
display: inline-block;
scale: 0.7;
transform-origin: 0 50%;
}
.row {
display: flex;
flex-flow: row nowrap;
align-items: baseline;
gap: 1em;
> * {
margin: 0;
}
> .right {
margin-left: auto;
}
}