198 lines
4.4 KiB
CSS
198 lines
4.4 KiB
CSS
/* Base link styles - outline removed for mouse interaction only */
|
|
a, a:hover, a:link, a:active {
|
|
outline: none;
|
|
color: var(--primary-color);
|
|
text-decoration: none;
|
|
}
|
|
|
|
/* Accessible keyboard focus indicator - WCAG 2.1 AA compliant */
|
|
a:focus {
|
|
color: var(--primary-color);
|
|
text-decoration: none;
|
|
}
|
|
|
|
a:focus-visible {
|
|
outline: 2px solid var(--primary-color);
|
|
outline-offset: 2px;
|
|
border-radius: var(--element-radius);
|
|
}
|
|
|
|
body a:hover {
|
|
text-decoration: underline;
|
|
text-decoration-thickness: 2px;
|
|
text-underline-offset: 2px;
|
|
color: var(--primary-font-color);
|
|
}
|
|
|
|
/* Focus styles for interactive elements */
|
|
button:focus-visible,
|
|
input:focus-visible,
|
|
select:focus-visible,
|
|
textarea:focus-visible,
|
|
[role="button"]:focus-visible,
|
|
[tabindex]:focus-visible {
|
|
outline: 2px solid var(--primary-color);
|
|
outline-offset: 2px;
|
|
}
|
|
|
|
label, input, textarea, select, button {
|
|
font-size: var(--base-font-size);
|
|
}
|
|
|
|
h1, h2, h3, h4, h5 {
|
|
font-weight: var(--font-weight-body);
|
|
line-height: normal;
|
|
}
|
|
|
|
h1 { font-size:var(--font-size-xxl);}
|
|
h2 { font-size:var(--font-size-xl);}
|
|
h3 { font-size:var(--font-size-xl); font-weight:var(--font-weight-bold);}
|
|
h4 { font-size:var(--base-font-size); font-weight:var(--font-weight-bold);}
|
|
h5 { font-size:var(--base-font-size); font-weight:var(--font-weight-bold);}
|
|
|
|
h1 small {
|
|
font-size: var(--font-size-s);
|
|
color:var(--primary-font-color);
|
|
}
|
|
|
|
|
|
.label-default {
|
|
background: var(--neutral);
|
|
color:var(--primary-font-color);
|
|
}
|
|
|
|
.label-important, .label-warning,
|
|
.label-success, .label-info, .label-inverse,
|
|
.label-default, .label-primary, .label-danger {
|
|
padding: 2px 8px;
|
|
color: #fff;
|
|
margin-left: 4px;
|
|
border-radius: var(--element-radius);
|
|
}
|
|
|
|
|
|
.dropdown [class*="label-"]:hover {
|
|
background: var(--dropdown-link-hover-bg) !important;
|
|
color:var(--dropdown-link-hover-color) !important;
|
|
}
|
|
|
|
a .label:after,
|
|
a .label-important:after, a .label-warning:after,
|
|
a .label-success:after, a .label-info:after, .label-inverse:after,
|
|
a .label-default:after, a .label-primary:after {
|
|
display: inline-block;
|
|
width: 0;
|
|
height: 0;
|
|
vertical-align: middle;
|
|
border-top: 4px solid #fff;
|
|
border-right: 4px solid transparent;
|
|
border-left: 4px solid transparent;
|
|
content: "";
|
|
margin-left: 2px;
|
|
}
|
|
|
|
a .label.feature-label {
|
|
background: var(--element-gradient);
|
|
margin-top: 4px;
|
|
display: block;
|
|
position:absolute;
|
|
top:4px;
|
|
right:0px;
|
|
border-radius: var(--element-radius);
|
|
padding: 1px 4px;
|
|
color:var(--main-action-color);
|
|
}
|
|
|
|
a .label.feature-label:after {
|
|
border:none;
|
|
margin:0px;
|
|
}
|
|
|
|
.nav .label.feature-label {
|
|
}
|
|
|
|
.pagetitle {
|
|
}
|
|
|
|
.pagetitle h1 {
|
|
font-size: var(--font-size-xl);
|
|
/* Dark text now that the header is a white/glass card (was white on the
|
|
gradient). --primary-font-color adapts in dark mode. */
|
|
color: var(--primary-font-color);
|
|
line-height: 1.2;
|
|
/* Reset the Bootstrap default h1 margin (0.67em 0); the auto-height header
|
|
card owns the vertical rhythm via its own padding. */
|
|
margin: 0;
|
|
}
|
|
|
|
.pagetitle h1 a {
|
|
color: var(--primary-font-color);
|
|
text-decoration:underline;
|
|
}
|
|
|
|
.pagetitle h5 {
|
|
text-transform: uppercase;
|
|
font-size: var(--font-size-xs);
|
|
color: var(--secondary-font-color);
|
|
/* Reset the Bootstrap default heading margin so the subtitle sits tight
|
|
under the title inside the auto-height header card. */
|
|
margin: 0;
|
|
}
|
|
|
|
.maincontentinner .subtitle,
|
|
.stickyHeader .subtitle {
|
|
|
|
font-size: var(--font-size-xl);
|
|
color: var(--primary-font-color);
|
|
font-weight: var(--font-weight-medium);
|
|
}
|
|
|
|
.maincontentinner .subtitle {
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.grid-stack-item-content .stickyHeader .subtitle {
|
|
margin: 0;
|
|
}
|
|
|
|
|
|
|
|
.subtitle {
|
|
font-size: var(--base-font-size);
|
|
color: var(--secondary-font-color);
|
|
margin-bottom: 4px;
|
|
}
|
|
|
|
.subtitle2 {
|
|
font-size: var(--base-font-size);
|
|
text-transform: uppercase;
|
|
color: var(--primary-font-color);
|
|
margin-bottom: 4px;
|
|
}
|
|
|
|
|
|
blockquote {
|
|
font-family: 'PT Serif', Georgia, "Times New Roman", Times, serif;
|
|
font-style: italic;
|
|
padding-left: 40px;
|
|
}
|
|
|
|
blockquote p {
|
|
margin: 0 !important;
|
|
}
|
|
|
|
blockquote.pull-right {
|
|
background-position: right 5px;
|
|
padding: 0 40px 0 0;
|
|
border-right: 0;
|
|
}
|
|
|
|
.maincontent > h2 {
|
|
color:var(--main-action-color);
|
|
}
|
|
|
|
a.danger,
|
|
a.delete {
|
|
color:var(--red) !important;
|
|
}
|