add composer-unused, comprehensive docs, and project restructure
- Add icanhazstring/composer-unused as dev dependency for dependency hygiene checks - Add German documentation (docs/) covering architecture, conventions, workflows, and developer checklists - Add API layer (ApiAuth, ApiBootstrap, ApiResponse), audit, scheduler, custom fields, and SSO services - Add Microsoft OIDC SSO, API token management, and user lifecycle features - Add swagger-ui vendor integration and OpenAPI spec - Add production Docker setup and bin/ scripts - Update composer dependencies, config, templates, and frontend assets throughout Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -1,3 +1,4 @@
|
||||
@layer components {
|
||||
.badge[role="button"],
|
||||
.badge {
|
||||
display: inline-flex;
|
||||
@@ -68,6 +69,18 @@
|
||||
border-color: var(--badge-info-border);
|
||||
}
|
||||
|
||||
.badge[data-variant="primary"] {
|
||||
background: var(--badge-info-bg);
|
||||
color: var(--badge-info-color);
|
||||
border-color: var(--badge-info-border);
|
||||
}
|
||||
|
||||
.badge[data-variant="secondary"] {
|
||||
background: var(--badge-neutral-bg);
|
||||
color: var(--badge-neutral-color);
|
||||
border-color: var(--badge-neutral-border);
|
||||
}
|
||||
|
||||
.badge[data-variant="warn"] {
|
||||
background: var(--badge-warn-bg);
|
||||
color: var(--badge-warn-color);
|
||||
@@ -105,3 +118,4 @@
|
||||
display: flex;
|
||||
gap: 0.35rem;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,60 +1,66 @@
|
||||
blockquote {
|
||||
--blockquote-bg: var(--app-blockquote-background-color);
|
||||
--blockquote-color: inherit;
|
||||
--blockquote-border: var(--app-blockquote-border-color);
|
||||
--blockquote-footer-color: var(--app-blockquote-footer-color);
|
||||
@layer components {
|
||||
blockquote {
|
||||
--blockquote-bg: var(--app-blockquote-background-color);
|
||||
--blockquote-color: inherit;
|
||||
--blockquote-border: var(--app-blockquote-border-color);
|
||||
--blockquote-footer-color: var(--app-blockquote-footer-color);
|
||||
|
||||
display: block;
|
||||
margin: var(--app-typography-spacing-vertical) 0;
|
||||
padding: var(--app-spacing);
|
||||
border-right: none;
|
||||
border-left: 0.25rem solid var(--app-blockquote-border-color);
|
||||
border-inline-start: 0.25rem solid var(--app-blockquote-border-color);
|
||||
border-inline-end: none;
|
||||
background-color: var(--blockquote-bg);
|
||||
color: var(--blockquote-color);
|
||||
border-left-color: var(--blockquote-border);
|
||||
border-inline-start-color: var(--blockquote-border);
|
||||
border-radius: var(--app-border-radius);
|
||||
}
|
||||
display: block;
|
||||
margin: var(--app-typography-spacing-vertical) 0;
|
||||
padding: var(--app-spacing);
|
||||
border-right: none;
|
||||
border-left: 0.25rem solid var(--app-blockquote-border-color);
|
||||
border-inline-start: 0.25rem solid var(--app-blockquote-border-color);
|
||||
border-inline-end: none;
|
||||
background-color: var(--blockquote-bg);
|
||||
color: var(--blockquote-color);
|
||||
border-left-color: var(--blockquote-border);
|
||||
border-inline-start-color: var(--blockquote-border);
|
||||
border-radius: var(--app-border-radius);
|
||||
}
|
||||
blockquote p:last-child {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
blockquote footer {
|
||||
margin-top: calc(var(--app-typography-spacing-vertical) * 0.5);
|
||||
color: var(--blockquote-footer-color);
|
||||
}
|
||||
blockquote footer {
|
||||
margin-top: calc(var(--app-typography-spacing-vertical) * 0.5);
|
||||
color: var(--blockquote-footer-color);
|
||||
}
|
||||
|
||||
blockquote[data-variant="success"] {
|
||||
--blockquote-bg: var(--badge-success-bg);
|
||||
--blockquote-color: var(--badge-success-color);
|
||||
--blockquote-border: var(--badge-success-border);
|
||||
--blockquote-footer-color: var(--badge-success-color);
|
||||
}
|
||||
blockquote[data-variant="success"] {
|
||||
--blockquote-bg: var(--badge-success-bg);
|
||||
--blockquote-color: var(--badge-success-color);
|
||||
--blockquote-border: var(--badge-success-border);
|
||||
--blockquote-footer-color: var(--badge-success-color);
|
||||
}
|
||||
|
||||
blockquote[data-variant="danger"] {
|
||||
--blockquote-bg: var(--badge-danger-bg);
|
||||
--blockquote-color: var(--badge-danger-color);
|
||||
--blockquote-border: var(--badge-danger-border);
|
||||
--blockquote-footer-color: var(--badge-danger-color);
|
||||
}
|
||||
blockquote[data-variant="error"],
|
||||
blockquote[data-variant="danger"] {
|
||||
--blockquote-bg: var(--badge-danger-bg);
|
||||
--blockquote-color: var(--badge-danger-color);
|
||||
--blockquote-border: var(--badge-danger-border);
|
||||
--blockquote-footer-color: var(--badge-danger-color);
|
||||
}
|
||||
|
||||
blockquote[data-variant="info"] {
|
||||
--blockquote-bg: var(--badge-info-bg);
|
||||
--blockquote-color: var(--badge-info-color);
|
||||
--blockquote-border: var(--badge-info-border);
|
||||
--blockquote-footer-color: var(--badge-info-color);
|
||||
}
|
||||
blockquote[data-variant="info"] {
|
||||
--blockquote-bg: var(--badge-info-bg);
|
||||
--blockquote-color: var(--badge-info-color);
|
||||
--blockquote-border: var(--badge-info-border);
|
||||
--blockquote-footer-color: var(--badge-info-color);
|
||||
}
|
||||
|
||||
blockquote[data-variant="warn"],
|
||||
blockquote[data-variant="warning"] {
|
||||
--blockquote-bg: var(--badge-warn-bg);
|
||||
--blockquote-color: var(--badge-warn-color);
|
||||
--blockquote-border: var(--badge-warn-border);
|
||||
--blockquote-footer-color: var(--badge-warn-color);
|
||||
}
|
||||
blockquote[data-variant="warn"],
|
||||
blockquote[data-variant="warning"] {
|
||||
--blockquote-bg: var(--badge-warn-bg);
|
||||
--blockquote-color: var(--badge-warn-color);
|
||||
--blockquote-border: var(--badge-warn-border);
|
||||
--blockquote-footer-color: var(--badge-warn-color);
|
||||
}
|
||||
|
||||
blockquote[data-variant="neutral"] {
|
||||
--blockquote-bg: var(--badge-neutral-bg);
|
||||
--blockquote-color: var(--badge-neutral-color);
|
||||
--blockquote-border: var(--badge-neutral-border);
|
||||
--blockquote-footer-color: var(--badge-neutral-color);
|
||||
blockquote[data-variant="neutral"] {
|
||||
--blockquote-bg: var(--badge-neutral-bg);
|
||||
--blockquote-color: var(--badge-neutral-color);
|
||||
--blockquote-border: var(--badge-neutral-border);
|
||||
--blockquote-footer-color: var(--badge-neutral-color);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
@layer components {
|
||||
.brand {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -28,4 +29,5 @@ img.brand-logo {
|
||||
|
||||
.badge:empty {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
@layer components {
|
||||
.app-breadcrumb {
|
||||
margin-bottom: 5px;
|
||||
display: flex;
|
||||
@@ -9,4 +10,5 @@
|
||||
.app-breadcrumb a {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
@layer components {
|
||||
.danger:is(button, [type="submit"], [type="button"], [role="button"]) {
|
||||
--app-background-color: var(--app-notice-error-border-color);
|
||||
--app-border-color: var(--app-notice-error-border-color);
|
||||
@@ -42,3 +43,4 @@
|
||||
var(--app-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),
|
||||
0 0 0 var(--app-outline-width) var(--app-form-element-invalid-focus-color);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
@layer components {
|
||||
.app-dashboard-titlebar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -52,4 +53,5 @@
|
||||
|
||||
.app-dashboard-titlebar h1 a:hover i {
|
||||
background: var(--app-border);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
.app-details-titlebar {
|
||||
@layer components {
|
||||
.app-details-titlebar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
@@ -7,33 +8,38 @@
|
||||
border-bottom: 1px solid var(--app-border);
|
||||
padding-block-end: var(--app-spacing);
|
||||
margin-bottom: calc(var(--app-spacing) * 2);
|
||||
}
|
||||
}
|
||||
|
||||
.app-details-titlebar h1,
|
||||
.app-details-titlebar h2,
|
||||
.app-details-titlebar h3,
|
||||
.app-details-titlebar h4,
|
||||
.app-details-titlebar h5,
|
||||
.app-details-titlebar h6 {
|
||||
margin: 0;
|
||||
}
|
||||
.app-details-titlebar h1,
|
||||
.app-details-titlebar h2,
|
||||
.app-details-titlebar h3,
|
||||
.app-details-titlebar h4,
|
||||
.app-details-titlebar h5,
|
||||
.app-details-titlebar h6 {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.app-details-titlebar button,
|
||||
.app-details-titlebar [role="button"] {
|
||||
--app-button-padding-horizontal: 10px;
|
||||
--app-button-padding-vertical: 6px;
|
||||
font-size: 13px;
|
||||
margin: 0;
|
||||
}
|
||||
.app-details-titlebar button,
|
||||
.app-details-titlebar [role="button"] {
|
||||
--app-button-padding-horizontal: 10px;
|
||||
--app-button-padding-vertical: 6px;
|
||||
font-size: 13px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.app-details-titlebar-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.app-details-titlebar button i,
|
||||
.app-details-titlebar [role="button"] i {
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.app-details-titlebar h1 i {
|
||||
.app-details-titlebar-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.app-details-titlebar h1 i {
|
||||
background: var(--app-background-color);
|
||||
width: 35px;
|
||||
height: 29px;
|
||||
@@ -46,42 +52,43 @@
|
||||
border: 1px solid var(--app-border);
|
||||
color: var(--app-muted-color);
|
||||
box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.app-details-titlebar h1:has(i) {
|
||||
.app-details-titlebar h1:has(i) {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 7px;
|
||||
line-height: 1;
|
||||
}
|
||||
.app-details-titlebar details.dropdown {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
.app-details-titlebar details.dropdown {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.app-details-titlebar details.dropdown summary:after {
|
||||
.app-details-titlebar details.dropdown summary:after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.app-details-titlebar details.dropdown li {
|
||||
padding: 0!important;
|
||||
margin: 0!important;
|
||||
.app-details-titlebar details.dropdown li {
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
border-bottom: 1px solid var(--app-border);
|
||||
}
|
||||
}
|
||||
|
||||
.app-details-titlebar details.dropdown li:last-child {
|
||||
.app-details-titlebar details.dropdown li:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
|
||||
.app-details-titlebar details.dropdown ul {
|
||||
padding: 0!important;
|
||||
margin: 0!important;
|
||||
}
|
||||
.app-details-titlebar details.dropdown ul {
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.app-details-titlebar details.dropdown li button,
|
||||
.app-details-titlebar details.dropdown li [role=button] {
|
||||
margin: 0!important;
|
||||
.app-details-titlebar details.dropdown li button,
|
||||
.app-details-titlebar details.dropdown li [role="button"] {
|
||||
margin: 0 !important;
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,7 +1,22 @@
|
||||
@layer components {
|
||||
.app-details-container aside {
|
||||
padding-top: var(--app-spacing);
|
||||
}
|
||||
|
||||
.app-details-aside-actions {
|
||||
display: grid;
|
||||
gap: calc(var(--app-spacing) * 0.5);
|
||||
}
|
||||
|
||||
.app-details-aside-actions form {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.app-details-aside-actions a[role="button"],
|
||||
.app-details-aside-actions button {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.user-avatar-block,
|
||||
.entity-avatar-block {
|
||||
--avatar-size: 96px;
|
||||
@@ -54,7 +69,7 @@
|
||||
.avatar-square .user-avatar-placeholder,
|
||||
.avatar-square .entity-avatar-image,
|
||||
.avatar-square .entity-avatar-placeholder {
|
||||
border-radius: var(--app-radius);
|
||||
border-radius: var(--app-border-radius);
|
||||
}
|
||||
|
||||
.avatar-ratio-1-1 {
|
||||
@@ -102,13 +117,15 @@
|
||||
.app-details-container .app-breadcrumb {
|
||||
padding-top: calc(var(--app-spacing) * 2);
|
||||
position: sticky;
|
||||
top: 20px;
|
||||
top: 16px;
|
||||
z-index: 10;
|
||||
background: var(--app-background-color);
|
||||
}
|
||||
|
||||
.app-details-container .app-details-titlebar {
|
||||
position: sticky;
|
||||
top: 69px;
|
||||
top: 64px;
|
||||
z-index: 10;
|
||||
background: var(--app-background-color);
|
||||
}
|
||||
|
||||
@@ -146,5 +163,4 @@
|
||||
min-height: 100vh;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
@layer components {
|
||||
.notice {
|
||||
--app-notice-border-color: var(--app-muted-border-color);
|
||||
--app-notice-background-color: var(--app-card-background-color);
|
||||
@@ -127,4 +128,5 @@
|
||||
|
||||
.notice li {
|
||||
list-style: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,62 +1,103 @@
|
||||
.form-hint {
|
||||
font-size: small;
|
||||
}
|
||||
@layer components {
|
||||
.form-hint {
|
||||
font-size: small;
|
||||
}
|
||||
|
||||
ul.form-hint-list {
|
||||
margin: 0;
|
||||
padding-left: var(--app-spacing);
|
||||
}
|
||||
ul.form-hint-list {
|
||||
margin: 0;
|
||||
padding-left: var(--app-spacing);
|
||||
}
|
||||
|
||||
ul.form-hint-list li {
|
||||
margin: 0;
|
||||
}
|
||||
ul.form-hint-list li {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
ul.form-hint-list li.is-valid {
|
||||
color: var(--app-form-element-valid-border-color);
|
||||
}
|
||||
ul.form-hint-list li.is-valid {
|
||||
color: var(--app-form-element-valid-border-color);
|
||||
}
|
||||
|
||||
ul.form-hint-list li.is-invalid {
|
||||
color: var(--app-form-element-invalid-border-color);
|
||||
}
|
||||
ul.form-hint-list li.is-invalid {
|
||||
color: var(--app-form-element-invalid-border-color);
|
||||
}
|
||||
|
||||
ul.form-hint-list li.is-valid:after {
|
||||
content: "\F26B";
|
||||
font-family: "Bootstrap-icons";
|
||||
margin-left: 4px;
|
||||
font-size: 10px;
|
||||
}
|
||||
ul.form-hint-list li.is-valid:after {
|
||||
content: "\F26B";
|
||||
font-family: "Bootstrap-icons";
|
||||
margin-left: 4px;
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
ul.form-hint-list li.is-invalid:after {
|
||||
content: "\F33A";
|
||||
font-family: "Bootstrap-icons";
|
||||
margin-left: 4px;
|
||||
font-size: 10px;
|
||||
}
|
||||
ul.form-hint-list li.is-invalid:after {
|
||||
content: "\F33A";
|
||||
font-family: "Bootstrap-icons";
|
||||
margin-left: 4px;
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
label:has([type="checkbox"], [type="radio"]) {
|
||||
display: flex;
|
||||
line-height: 1;
|
||||
align-items: center;
|
||||
}
|
||||
label:has([type="checkbox"], [type="radio"]) {
|
||||
display: flex;
|
||||
line-height: 1;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
input[type="color"] {
|
||||
input[type="color"] {
|
||||
padding: 0;
|
||||
width: 42px;
|
||||
border: 0;
|
||||
margin: 0;
|
||||
height: 42px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
}
|
||||
|
||||
label:has(input[type="color"]) {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
label:has(input[type="color"]) {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
small.muted {
|
||||
small.muted {
|
||||
display: block;
|
||||
width: 100%;
|
||||
color: var(--app-muted-color);
|
||||
}
|
||||
}
|
||||
a.muted {
|
||||
color: var(--app-muted-color);
|
||||
}
|
||||
|
||||
label.app-field:has(input[type="checkbox"][disabled]),
|
||||
label.app-field:has(input[type="radio"][disabled]) {
|
||||
cursor: not-allowed;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
label.app-field:has(input[type="checkbox"][disabled]) > span,
|
||||
label.app-field:has(input[type="radio"][disabled]) > span {
|
||||
color: var(--app-muted-color);
|
||||
}
|
||||
|
||||
input[type="checkbox"][disabled],
|
||||
input[type="radio"][disabled] {
|
||||
--app-border-color: var(--app-muted-border-color);
|
||||
--app-background-color: var(--app-form-element-background-color);
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
input[type="checkbox"][disabled]:checked,
|
||||
input[type="checkbox"][disabled]:indeterminate,
|
||||
input[type="radio"][disabled]:checked {
|
||||
--app-border-color: var(--app-muted-border-color);
|
||||
--app-background-color: var(--app-muted-border-color);
|
||||
}
|
||||
|
||||
fieldset[aria-disabled="true"] {
|
||||
border-color: var(--app-muted-border-color);
|
||||
}
|
||||
|
||||
fieldset[aria-disabled="true"] .muted,
|
||||
fieldset[aria-disabled="true"] legend small {
|
||||
color: var(--app-muted-color);
|
||||
}
|
||||
label:has(.badge) > span {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,7 +1,9 @@
|
||||
@layer components {
|
||||
.app-list-table table {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.app-list-table {
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
@layer components {
|
||||
.app-list-tabs {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
@@ -29,3 +30,4 @@
|
||||
color: var(--app-color);
|
||||
border-color: var(--list-tabs-active);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,36 +1,38 @@
|
||||
.app-list-titlebar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
margin-bottom: calc(var(--app-spacing) * 1);
|
||||
}
|
||||
@layer components {
|
||||
.app-list-titlebar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
margin-bottom: calc(var(--app-spacing) * 1);
|
||||
}
|
||||
|
||||
.app-list-titlebar h1,
|
||||
.app-list-titlebar h2,
|
||||
.app-list-titlebar h3,
|
||||
.app-list-titlebar h4,
|
||||
.app-list-titlebar h5,
|
||||
.app-list-titlebar h6 {
|
||||
margin: 0;
|
||||
}
|
||||
.app-list-titlebar h1,
|
||||
.app-list-titlebar h2,
|
||||
.app-list-titlebar h3,
|
||||
.app-list-titlebar h4,
|
||||
.app-list-titlebar h5,
|
||||
.app-list-titlebar h6 {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.app-list-titlebar button,
|
||||
.app-list-titlebar [role="button"] {
|
||||
--app-button-padding-horizontal: 10px;
|
||||
--app-button-padding-vertical: 6px;
|
||||
font-size: 13px;
|
||||
margin: 0;
|
||||
}
|
||||
.app-list-titlebar button,
|
||||
.app-list-titlebar [role="button"] {
|
||||
--app-button-padding-horizontal: 10px;
|
||||
--app-button-padding-vertical: 6px;
|
||||
font-size: 13px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.app-list-titlebar-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
.app-list-titlebar-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.app-list-titlebar h1 i {
|
||||
.app-list-titlebar h1 i {
|
||||
background: var(--app-muted-border-color);
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
@@ -39,41 +41,43 @@
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
.app-list-titlebar h1:has(i) {
|
||||
.app-list-titlebar h1:has(i) {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 7px;
|
||||
}
|
||||
}
|
||||
|
||||
.app-list-titlebar details.dropdown {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.app-list-titlebar details.dropdown {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.app-list-titlebar details.dropdown summary:after {
|
||||
.app-list-titlebar details.dropdown summary:after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.app-list-titlebar details.dropdown li {
|
||||
padding: 0!important;
|
||||
margin: 0!important;
|
||||
.app-list-titlebar details.dropdown li {
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
border-bottom: 1px solid var(--app-border);
|
||||
}
|
||||
}
|
||||
|
||||
.app-list-titlebar details.dropdown li:last-child {
|
||||
.app-list-titlebar details.dropdown li:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
|
||||
.app-list-titlebar details.dropdown ul {
|
||||
padding: 0!important;
|
||||
margin: 0!important;
|
||||
}
|
||||
.app-list-titlebar details.dropdown ul {
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.app-list-titlebar details.dropdown li button, .app-list-titlebar details.dropdown li [role=button] {
|
||||
.app-list-titlebar details.dropdown li button,
|
||||
.app-list-titlebar details.dropdown li [role="button"] {
|
||||
margin: 0 !important;
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
@layer components {
|
||||
.app-list-toolbar {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
@@ -74,4 +75,5 @@
|
||||
padding: 0 !important;
|
||||
padding-left: 3px !important;
|
||||
font-size: 11px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
@layer components {
|
||||
|
||||
|
||||
.app-page-copy .app-field {
|
||||
@@ -7,4 +8,5 @@
|
||||
|
||||
.app-page-copy .app-field [role="group"] {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
@layer components {
|
||||
.app-page-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -71,4 +72,5 @@ label.app-field > small {
|
||||
|
||||
.app-details-aside-section button {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,570 +0,0 @@
|
||||
.app-profile-card {
|
||||
border: 1px solid var(--app-border);
|
||||
background: var(--app-card-background-color);
|
||||
overflow: hidden;
|
||||
border-radius: var(--app-border-radius);
|
||||
margin-bottom: var(--app-spacing);
|
||||
}
|
||||
|
||||
.app-profile-header {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
padding: 0 calc(var(--app-spacing) * 1) 0 calc(var(--app-spacing) * 1);
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
margin-top: -42px;
|
||||
z-index: 1;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.app-profile-meta h2 {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.app-profile-meta p {
|
||||
margin: 0.25rem 0 0;
|
||||
color: var(--app-muted-color);
|
||||
}
|
||||
|
||||
.app-profile-body {
|
||||
border: 1px solid var(--app-border);
|
||||
background: var(--app-card-background-color);
|
||||
overflow: hidden;
|
||||
border-radius: var(--app-border-radius);
|
||||
margin-bottom: var(--app-spacing);
|
||||
}
|
||||
|
||||
.app-profile-body [data-tab-panel] {
|
||||
padding-inline: var(--app-spacing);
|
||||
}
|
||||
|
||||
.app-profile-body [data-tab-panel]:not(:has(p)) {
|
||||
padding-block-end: var(--app-spacing);
|
||||
}
|
||||
|
||||
.app-profile-table {
|
||||
width: 100%;
|
||||
border: 1px solid var(--app-border);
|
||||
border-radius: var(--app-border-radius);
|
||||
border-collapse: separate;
|
||||
border-spacing: 0;
|
||||
background: transparent;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.app-profile-table th,
|
||||
.app-profile-table td {
|
||||
padding: 0.55rem 0.75rem;
|
||||
background: transparent;
|
||||
border-bottom: 1px solid var(--app-border);
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.app-profile-table thead th {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.app-profile-table tr:last-child td {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
@keyframes ani-app-profile-banner {
|
||||
0% {
|
||||
--c-0: hsla(212, 0%, 0%, 1);
|
||||
--s-start-0: 14.489998991212337%;
|
||||
--s-end-0: 72%;
|
||||
--y-0: 93%;
|
||||
--x-0: 93%;
|
||||
--c-1: hsla(212, 0%, 0%, 1);
|
||||
--s-start-1: 0%;
|
||||
--s-end-1: 45%;
|
||||
--y-1: 9%;
|
||||
--x-1: 26%;
|
||||
--x-2: 15%;
|
||||
--s-start-2: 2.9253667596993065%;
|
||||
--s-end-2: 22.388851682060018%;
|
||||
--c-2: hsla(257, 91%, 27%, 0.35);
|
||||
--y-2: 79%;
|
||||
--x-3: 40%;
|
||||
--s-start-3: 3.985353824694249%;
|
||||
--s-end-3: 47.580278608924694%;
|
||||
--y-3: 104%;
|
||||
--c-3: hsla(212, 100%, 50%, 0.5);
|
||||
--y-4: 60%;
|
||||
--x-4: 0%;
|
||||
--c-4: hsla(224, 72%, 36%, 1);
|
||||
--s-start-4: 2.391200382592061%;
|
||||
--s-end-4: 29.307684556768592%;
|
||||
--s-start-5: 2.9253667596993065%;
|
||||
--s-end-5: 22.388851682060018%;
|
||||
--y-5: 37%;
|
||||
--c-5: hsla(248, 52%, 24%, 1);
|
||||
--x-5: 92%;
|
||||
--x-6: 101%;
|
||||
--y-6: 16%;
|
||||
--s-start-6: 13.173642363290591%;
|
||||
--s-end-6: 31.747336520355095%;
|
||||
--c-6: hsla(212, 100%, 50%, 0.19);
|
||||
--y-7: 13%;
|
||||
--s-start-7: 1%;
|
||||
--s-end-7: 31%;
|
||||
--x-7: 90%;
|
||||
--c-7: hsla(227, 98%, 53%, 1);
|
||||
--y-8: 56%;
|
||||
--s-start-8: 3.985353824694249%;
|
||||
--s-end-8: 13.103042116379756%;
|
||||
--c-8: hsla(166, 71%, 60%, 0.32);
|
||||
--x-8: 104%;
|
||||
--c-9: hsla(219, 83%, 23%, 0.18);
|
||||
--s-start-9: 18.597054544690312%;
|
||||
--s-end-9: 31%;
|
||||
--x-9: 97%;
|
||||
--y-9: 19%;
|
||||
}
|
||||
|
||||
100% {
|
||||
--c-0: hsla(306, 0%, 0%, 1);
|
||||
--s-start-0: 2.391200382592061%;
|
||||
--s-end-0: 43.902064173373226%;
|
||||
--y-0: 9%;
|
||||
--x-0: 7%;
|
||||
--c-1: hsla(306, 0%, 0%, 1);
|
||||
--s-start-1: 9%;
|
||||
--s-end-1: 54.805582404585024%;
|
||||
--y-1: 93%;
|
||||
--x-1: 96%;
|
||||
--x-2: -2%;
|
||||
--s-start-2: 3%;
|
||||
--s-end-2: 26.722813338714598%;
|
||||
--c-2: hsla(166, 72%, 60%, 1);
|
||||
--y-2: 103%;
|
||||
--x-3: 33%;
|
||||
--s-start-3: 2.391200382592061%;
|
||||
--s-end-3: 32.0689540200964%;
|
||||
--y-3: 82%;
|
||||
--c-3: hsla(180, 100%, 50%, 0.26);
|
||||
--y-4: 81%;
|
||||
--x-4: 37%;
|
||||
--c-4: hsla(212, 88%, 26%, 0.58);
|
||||
--s-start-4: 4.40642490323111%;
|
||||
--s-end-4: 37.23528104246256%;
|
||||
--s-start-5: 3%;
|
||||
--s-end-5: 32.537089799783296%;
|
||||
--y-5: 99%;
|
||||
--c-5: hsla(271, 98%, 53%, 0.31);
|
||||
--x-5: 54%;
|
||||
--x-6: 104%;
|
||||
--y-6: 43%;
|
||||
--s-start-6: 6%;
|
||||
--s-end-6: 42.501105312974815%;
|
||||
--c-6: hsla(262, 100%, 50%, 0.15);
|
||||
--y-7: -16%;
|
||||
--s-start-7: 5%;
|
||||
--s-end-7: 13.10107024898374%;
|
||||
--x-7: 104%;
|
||||
--c-7: hsla(298, 36%, 23%, 1);
|
||||
--y-8: 30%;
|
||||
--s-start-8: 2.391200382592061%;
|
||||
--s-end-8: 27.141813016850573%;
|
||||
--c-8: hsla(180, 100%, 50%, 0.11);
|
||||
--x-8: 97%;
|
||||
--c-9: hsla(219, 83%, 23%, 0.59);
|
||||
--s-start-9: 5%;
|
||||
--s-end-9: 21.32164536610654%;
|
||||
--x-9: 78%;
|
||||
--y-9: 4%;
|
||||
}
|
||||
}
|
||||
|
||||
@property --c-0 {
|
||||
syntax: "<color>";
|
||||
inherits: false;
|
||||
initial-value: hsla(212, 0%, 0%, 1);
|
||||
}
|
||||
|
||||
@property --s-start-0 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 14.489998991212337%;
|
||||
}
|
||||
|
||||
@property --s-end-0 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 72%;
|
||||
}
|
||||
|
||||
@property --y-0 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 93%;
|
||||
}
|
||||
|
||||
@property --x-0 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 93%;
|
||||
}
|
||||
|
||||
@property --c-1 {
|
||||
syntax: "<color>";
|
||||
inherits: false;
|
||||
initial-value: hsla(212, 0%, 0%, 1);
|
||||
}
|
||||
|
||||
@property --s-start-1 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 0%;
|
||||
}
|
||||
|
||||
@property --s-end-1 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 45%;
|
||||
}
|
||||
|
||||
@property --y-1 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 9%;
|
||||
}
|
||||
|
||||
@property --x-1 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 26%;
|
||||
}
|
||||
|
||||
@property --x-2 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 15%;
|
||||
}
|
||||
|
||||
@property --s-start-2 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 2.9253667596993065%;
|
||||
}
|
||||
|
||||
@property --s-end-2 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 22.388851682060018%;
|
||||
}
|
||||
|
||||
@property --c-2 {
|
||||
syntax: "<color>";
|
||||
inherits: false;
|
||||
initial-value: hsla(257, 91%, 27%, 0.35);
|
||||
}
|
||||
|
||||
@property --y-2 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 79%;
|
||||
}
|
||||
|
||||
@property --x-3 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 40%;
|
||||
}
|
||||
|
||||
@property --s-start-3 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 3.985353824694249%;
|
||||
}
|
||||
|
||||
@property --s-end-3 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 47.580278608924694%;
|
||||
}
|
||||
|
||||
@property --y-3 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 104%;
|
||||
}
|
||||
|
||||
@property --c-3 {
|
||||
syntax: "<color>";
|
||||
inherits: false;
|
||||
initial-value: hsla(212, 100%, 50%, 0.5);
|
||||
}
|
||||
|
||||
@property --y-4 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 60%;
|
||||
}
|
||||
|
||||
@property --x-4 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 0%;
|
||||
}
|
||||
|
||||
@property --c-4 {
|
||||
syntax: "<color>";
|
||||
inherits: false;
|
||||
initial-value: hsla(224, 72%, 36%, 1);
|
||||
}
|
||||
|
||||
@property --s-start-4 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 2.391200382592061%;
|
||||
}
|
||||
|
||||
@property --s-end-4 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 29.307684556768592%;
|
||||
}
|
||||
|
||||
@property --s-start-5 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 2.9253667596993065%;
|
||||
}
|
||||
|
||||
@property --s-end-5 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 22.388851682060018%;
|
||||
}
|
||||
|
||||
@property --y-5 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 37%;
|
||||
}
|
||||
|
||||
@property --c-5 {
|
||||
syntax: "<color>";
|
||||
inherits: false;
|
||||
initial-value: hsla(248, 52%, 24%, 1);
|
||||
}
|
||||
|
||||
@property --x-5 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 92%;
|
||||
}
|
||||
|
||||
@property --x-6 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 101%;
|
||||
}
|
||||
|
||||
@property --y-6 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 16%;
|
||||
}
|
||||
|
||||
@property --s-start-6 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 13.173642363290591%;
|
||||
}
|
||||
|
||||
@property --s-end-6 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 31.747336520355095%;
|
||||
}
|
||||
|
||||
@property --c-6 {
|
||||
syntax: "<color>";
|
||||
inherits: false;
|
||||
initial-value: hsla(212, 100%, 50%, 0.19);
|
||||
}
|
||||
|
||||
@property --y-7 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 13%;
|
||||
}
|
||||
|
||||
@property --s-start-7 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 1%;
|
||||
}
|
||||
|
||||
@property --s-end-7 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 31%;
|
||||
}
|
||||
|
||||
@property --x-7 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 90%;
|
||||
}
|
||||
|
||||
@property --c-7 {
|
||||
syntax: "<color>";
|
||||
inherits: false;
|
||||
initial-value: hsla(227, 98%, 53%, 1);
|
||||
}
|
||||
|
||||
@property --y-8 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 56%;
|
||||
}
|
||||
|
||||
@property --s-start-8 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 3.985353824694249%;
|
||||
}
|
||||
|
||||
@property --s-end-8 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 13.103042116379756%;
|
||||
}
|
||||
|
||||
@property --c-8 {
|
||||
syntax: "<color>";
|
||||
inherits: false;
|
||||
initial-value: hsla(166, 71%, 60%, 0.32);
|
||||
}
|
||||
|
||||
@property --x-8 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 104%;
|
||||
}
|
||||
|
||||
@property --c-9 {
|
||||
syntax: "<color>";
|
||||
inherits: false;
|
||||
initial-value: hsla(219, 83%, 23%, 0.18);
|
||||
}
|
||||
|
||||
@property --s-start-9 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 18.597054544690312%;
|
||||
}
|
||||
|
||||
@property --s-end-9 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 31%;
|
||||
}
|
||||
|
||||
@property --x-9 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 97%;
|
||||
}
|
||||
|
||||
@property --y-9 {
|
||||
syntax: "<percentage>";
|
||||
inherits: false;
|
||||
initial-value: 19%;
|
||||
}
|
||||
|
||||
.app-profile-banner {
|
||||
--c-0: hsla(212, 0%, 0%, 1);
|
||||
--y-0: 93%;
|
||||
--x-0: 93%;
|
||||
--c-1: hsla(212, 0%, 0%, 1);
|
||||
--y-1: 9%;
|
||||
--x-1: 26%;
|
||||
--x-2: 15%;
|
||||
--c-2: hsla(257, 91%, 27%, 0.35);
|
||||
--y-2: 79%;
|
||||
--x-3: 40%;
|
||||
--y-3: 104%;
|
||||
--c-3: hsla(212, 100%, 50%, 0.5);
|
||||
--y-4: 60%;
|
||||
--x-4: 0%;
|
||||
--c-4: hsla(224, 72%, 36%, 1);
|
||||
--y-5: 37%;
|
||||
--c-5: hsla(248, 52%, 24%, 1);
|
||||
--x-5: 92%;
|
||||
--x-6: 101%;
|
||||
--y-6: 16%;
|
||||
--c-6: hsla(212, 100%, 50%, 0.19);
|
||||
--y-7: 13%;
|
||||
--x-7: 90%;
|
||||
--c-7: hsla(227, 98%, 53%, 1);
|
||||
--y-8: 56%;
|
||||
--c-8: hsla(166, 71%, 60%, 0.32);
|
||||
--x-8: 104%;
|
||||
--c-9: hsla(219, 83%, 23%, 0.18);
|
||||
--x-9: 97%;
|
||||
--y-9: 19%;
|
||||
background-color: hsla(305, 0%, 0%, 1);
|
||||
background-image:
|
||||
radial-gradient(
|
||||
circle at var(--x-0) var(--y-0),
|
||||
var(--c-0) var(--s-start-0),
|
||||
transparent var(--s-end-0)
|
||||
),
|
||||
radial-gradient(
|
||||
circle at var(--x-1) var(--y-1),
|
||||
var(--c-1) var(--s-start-1),
|
||||
transparent var(--s-end-1)
|
||||
),
|
||||
radial-gradient(
|
||||
circle at var(--x-2) var(--y-2),
|
||||
var(--c-2) var(--s-start-2),
|
||||
transparent var(--s-end-2)
|
||||
),
|
||||
radial-gradient(
|
||||
circle at var(--x-3) var(--y-3),
|
||||
var(--c-3) var(--s-start-3),
|
||||
transparent var(--s-end-3)
|
||||
),
|
||||
radial-gradient(
|
||||
circle at var(--x-4) var(--y-4),
|
||||
var(--c-4) var(--s-start-4),
|
||||
transparent var(--s-end-4)
|
||||
),
|
||||
radial-gradient(
|
||||
circle at var(--x-5) var(--y-5),
|
||||
var(--c-5) var(--s-start-5),
|
||||
transparent var(--s-end-5)
|
||||
),
|
||||
radial-gradient(
|
||||
circle at var(--x-6) var(--y-6),
|
||||
var(--c-6) var(--s-start-6),
|
||||
transparent var(--s-end-6)
|
||||
),
|
||||
radial-gradient(
|
||||
circle at var(--x-7) var(--y-7),
|
||||
var(--c-7) var(--s-start-7),
|
||||
transparent var(--s-end-7)
|
||||
),
|
||||
radial-gradient(
|
||||
circle at var(--x-8) var(--y-8),
|
||||
var(--c-8) var(--s-start-8),
|
||||
transparent var(--s-end-8)
|
||||
),
|
||||
radial-gradient(
|
||||
circle at var(--x-9) var(--y-9),
|
||||
var(--c-9) var(--s-start-9),
|
||||
transparent var(--s-end-9)
|
||||
);
|
||||
animation: ani-app-profile-banner 10s linear infinite alternate;
|
||||
background-blend-mode:
|
||||
normal, normal, normal, normal, normal, normal, normal, normal, normal,
|
||||
normal;
|
||||
will-change: transform, opacity;
|
||||
contain: paint;
|
||||
height: 160px;
|
||||
}
|
||||
@@ -1,5 +1,49 @@
|
||||
@layer components {
|
||||
.app-search {
|
||||
padding: 0 var(--app-spacing);
|
||||
position: relative;
|
||||
padding: 0 var(--app-spacing);
|
||||
margin-bottom: var(--app-spacing);
|
||||
}
|
||||
|
||||
.app-search-shortcut {
|
||||
position: absolute;
|
||||
right: calc(var(--app-spacing) + 0.5rem);
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
border: 1px solid var(--app-border);
|
||||
border-radius: 6px;
|
||||
background: var(--app-card-background-color);
|
||||
color: var(--app-muted-color);
|
||||
font-size: 0.75rem;
|
||||
line-height: 1;
|
||||
padding: 0.2rem 0.4rem;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.app-search-empty-state {
|
||||
margin: var(--app-spacing);
|
||||
padding: 1rem;
|
||||
border: 1px dashed var(--app-border);
|
||||
border-radius: var(--app-border-radius);
|
||||
text-align: center;
|
||||
color: var(--app-muted-color);
|
||||
font-size: 0.9rem;
|
||||
cursor: text;
|
||||
}
|
||||
|
||||
.app-search-empty-state .bi-search {
|
||||
display: inline-block;
|
||||
font-size: 1.25rem;
|
||||
margin-bottom: 0.5rem;
|
||||
color: var(--app-color);
|
||||
}
|
||||
|
||||
.app-search-empty-state p {
|
||||
margin: 0 0 0.25rem;
|
||||
}
|
||||
|
||||
.app-search-empty-state small {
|
||||
display: block;
|
||||
}
|
||||
|
||||
ul.app-search-results {
|
||||
@@ -14,21 +58,23 @@ ul.app-search-results > li > a {
|
||||
ul.app-search-results .badge {
|
||||
font-size: 10px;
|
||||
padding: 1px;
|
||||
min-width: 20px;
|
||||
min-width: 18px;
|
||||
text-align: center;
|
||||
border-radius: 999px;
|
||||
background: var(--app-accordion-border-color);
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 20px;
|
||||
height: 18px;
|
||||
position: relative;
|
||||
top: -1px;
|
||||
}
|
||||
|
||||
ul.app-search-preview {
|
||||
position: relative;
|
||||
font-size: 11px;
|
||||
padding: 0 0 0 20px;
|
||||
margin: 6px 0 1.5rem 10px;
|
||||
padding: 0 0 0 0;
|
||||
margin: 0;
|
||||
opacity: 0.75;
|
||||
list-style: none;
|
||||
}
|
||||
@@ -86,6 +132,8 @@ input#side-search {
|
||||
--app-form-element-spacing-vertical: 6px;
|
||||
height: auto;
|
||||
font-size: 13px;
|
||||
padding-right: 3rem;
|
||||
margin-bottom:0;
|
||||
}
|
||||
|
||||
ul.app-search-preview:has(li) {
|
||||
@@ -137,3 +185,4 @@ ul.app-search-preview:has(li) {
|
||||
color: var(--app-muted-color);
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,9 +1,24 @@
|
||||
@layer components {
|
||||
.app-tabs {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--app-spacing);
|
||||
}
|
||||
|
||||
/* No-JS fallback: show only first tab panel. */
|
||||
html.no-js [data-tabs] [data-tab-panel] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
html.no-js [data-tabs] [data-tab-panel]:first-of-type {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* JS mode: keep panels hidden until tab init completed (prevents flash). */
|
||||
html.js [data-tabs]:not([data-tabs-ready="1"]) [data-tab-panel] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.app-tabs-nav {
|
||||
display: flex;
|
||||
border-bottom: 1px solid var(--tabs-border);
|
||||
@@ -42,6 +57,21 @@
|
||||
border-color: var(--tabs-active);
|
||||
}
|
||||
|
||||
.app-tabs-nav button.has-invalid,
|
||||
.app-tabs-nav a.has-invalid {
|
||||
color: var(--app-danger, #dc3545) !important;
|
||||
}
|
||||
|
||||
[data-tab-panel][hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
html.js [data-tabs][data-tabs-ready="1"] [data-tab-panel]:not([hidden]) {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Safety fallback when JS is available but the ready marker is missing. */
|
||||
html:not(.no-js) [data-tabs] [data-tab-panel]:not([hidden]) {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,74 +1,83 @@
|
||||
.app-tiles {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
|
||||
gap: calc(var(--app-spacing) * 1);
|
||||
margin-bottom: calc(var(--app-spacing) * 2);
|
||||
}
|
||||
@layer components {
|
||||
.app-tiles {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
|
||||
gap: calc(var(--app-spacing) * 1);
|
||||
margin-bottom: calc(var(--app-spacing) * 2);
|
||||
}
|
||||
|
||||
.app-stats-table {
|
||||
overflow: auto;
|
||||
border: 1px solid var(--app-border);
|
||||
border-radius: var(--app-border-radius);
|
||||
margin-bottom: calc(var(--app-spacing) * 1);
|
||||
}
|
||||
.app-stats-table {
|
||||
overflow: auto;
|
||||
border: 1px solid var(--app-border);
|
||||
border-radius: var(--app-border-radius);
|
||||
margin-bottom: calc(var(--app-spacing) * 1);
|
||||
}
|
||||
|
||||
.app-stats-table th {
|
||||
border-top: 0;
|
||||
}
|
||||
.app-stats-table th {
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
.app-stats-table table {
|
||||
margin: 0;
|
||||
}
|
||||
.app-stats-table table {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.app-stats-table table tr:last-child td {
|
||||
border-bottom: 0;
|
||||
}
|
||||
.app-stats-table table tr:last-child td {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.app-tile {
|
||||
--tile-icon-bg: var(--app-tile-icon-bg);
|
||||
--tile-icon-color: var(--app-tile-icon-color);
|
||||
--tile-count-color: var(--app-tile-count-color);
|
||||
--tile-label-color: var(--app-tile-label-color);
|
||||
--tile-link-color: var(--app-tile-link-color);
|
||||
position: relative;
|
||||
display: block;
|
||||
padding: calc(var(--app-spacing) * 1);
|
||||
border: 1px solid var(--app-tile-border);
|
||||
border-radius: calc(var(--app-border-radius) * 1.1);
|
||||
background: var(--app-tile-bg);
|
||||
color: var(--app-tile-label-color);
|
||||
text-decoration: none;
|
||||
transition:
|
||||
transform var(--app-transition),
|
||||
box-shadow var(--app-transition),
|
||||
border-color var(--app-transition);
|
||||
}
|
||||
.app-stats-table-empty {
|
||||
padding: var(--app-spacing);
|
||||
}
|
||||
|
||||
.app-tile:hover {
|
||||
box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
|
||||
}
|
||||
.app-stats-table-explanation {
|
||||
padding: var(--app-spacing);
|
||||
}
|
||||
|
||||
.app-tile-icon {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-radius: 10px;
|
||||
background: var(--tile-icon-bg);
|
||||
color: var(--tile-icon-color);
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
.app-tile {
|
||||
--tile-icon-bg: var(--app-tile-icon-bg);
|
||||
--tile-icon-color: var(--app-tile-icon-color);
|
||||
--tile-count-color: var(--app-tile-count-color);
|
||||
--tile-label-color: var(--app-tile-label-color);
|
||||
--tile-link-color: var(--app-tile-link-color);
|
||||
position: relative;
|
||||
display: block;
|
||||
padding: calc(var(--app-spacing) * 1);
|
||||
border: 1px solid var(--app-tile-border);
|
||||
border-radius: calc(var(--app-border-radius) * 1.1);
|
||||
background: var(--app-tile-bg);
|
||||
color: var(--app-tile-label-color);
|
||||
text-decoration: none;
|
||||
transition:
|
||||
transform var(--app-transition),
|
||||
box-shadow var(--app-transition),
|
||||
border-color var(--app-transition);
|
||||
}
|
||||
|
||||
.app-tile-count {
|
||||
position: absolute;
|
||||
top: calc(var(--app-spacing) * 1);
|
||||
right: calc(var(--app-spacing) * 1);
|
||||
font-weight: 700;
|
||||
color: var(--tile-count-color);
|
||||
}
|
||||
.app-tile:hover {
|
||||
box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
|
||||
}
|
||||
|
||||
.app-tile-label {
|
||||
.app-tile-icon {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-radius: 10px;
|
||||
background: var(--tile-icon-bg);
|
||||
color: var(--tile-icon-color);
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
|
||||
.app-tile-count {
|
||||
position: absolute;
|
||||
top: calc(var(--app-spacing) * 1);
|
||||
right: calc(var(--app-spacing) * 1);
|
||||
font-weight: 700;
|
||||
color: var(--tile-count-color);
|
||||
}
|
||||
|
||||
.app-tile-label {
|
||||
display: block;
|
||||
margin-top: calc(var(--app-spacing) * 1);
|
||||
color: var(--tile-label-color);
|
||||
@@ -76,55 +85,56 @@
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
max-width: 191px;
|
||||
}
|
||||
}
|
||||
|
||||
.app-tile-link {
|
||||
position: absolute;
|
||||
right: calc(var(--app-spacing) * 1);
|
||||
bottom: calc(var(--app-spacing) * 1);
|
||||
color: var(--tile-link-color);
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
.app-tile-link {
|
||||
position: absolute;
|
||||
right: calc(var(--app-spacing) * 1);
|
||||
bottom: calc(var(--app-spacing) * 1);
|
||||
color: var(--tile-link-color);
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.app-tile.is-small {
|
||||
padding: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
min-height: 50px;
|
||||
}
|
||||
.app-tile.is-small span.app-tile-icon {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
border-radius: 6px;
|
||||
font-size: 12px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.app-tile.is-small {
|
||||
padding: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
min-height: 50px;
|
||||
}
|
||||
.app-tile.is-small span.app-tile-icon {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
border-radius: 6px;
|
||||
font-size: 12px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.app-tile.is-small .app-tile-link {
|
||||
.app-tile.is-small .app-tile-link {
|
||||
bottom: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.app-tile.is-small .app-tile-count {
|
||||
.app-tile.is-small .app-tile-count {
|
||||
position: static;
|
||||
margin-right: 5px;
|
||||
display: block;
|
||||
}
|
||||
.app-tile.is-small .app-tile-label {
|
||||
margin-top: 0;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
.app-tile.is-small .app-tile-label {
|
||||
margin-top: 0;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.app-stats-table-header {
|
||||
border-bottom: 1px solid var(--app-border);
|
||||
padding: 4px 10px 4px 10px;
|
||||
text-transform: uppercase;
|
||||
font-size: 13px;
|
||||
letter-spacing: 0.4px;
|
||||
background: var(--app-blockquote-background-color);
|
||||
}
|
||||
.app-stats-table-header {
|
||||
border-bottom: 1px solid var(--app-border);
|
||||
padding: 4px 10px 4px 10px;
|
||||
text-transform: uppercase;
|
||||
font-size: 13px;
|
||||
letter-spacing: 0.4px;
|
||||
background: var(--app-blockquote-background-color);
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.app-tiles {
|
||||
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
|
||||
@media (max-width: 640px) {
|
||||
.app-tiles {
|
||||
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
@layer components {
|
||||
[data-tooltip] {
|
||||
--app-card-background-color: inherit;
|
||||
position: relative;
|
||||
@@ -97,3 +98,4 @@
|
||||
left: auto;
|
||||
transform: translate(calc(-1 * (var(--tooltip-offset) - 2px)), -50%) rotate(45deg);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,74 +0,0 @@
|
||||
.codex-editor {
|
||||
font-family: var(--app-font-family);
|
||||
color: var(--app-color);
|
||||
}
|
||||
|
||||
.ce-block__content {
|
||||
max-width: 90%;
|
||||
}
|
||||
|
||||
.ce-toolbar__content,
|
||||
.ce-inline-toolbar {
|
||||
border-radius: var(--app-border-radius);
|
||||
}
|
||||
|
||||
.ce-inline-toolbar {
|
||||
box-shadow: var(--app-box-shadow);
|
||||
}
|
||||
|
||||
.ce-toolbar__content {
|
||||
max-width: 90%;
|
||||
}
|
||||
|
||||
input.cdx-search-field__input {
|
||||
margin: 0;
|
||||
padding: 5px;
|
||||
height: auto;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.cdx-search-field__icon {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.ce-popover__items button {
|
||||
background: transparent;
|
||||
color: inherit;
|
||||
padding: inherit;
|
||||
border: 0;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
display: flex;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
input.ce-inline-tool-input.ce-inline-tool-input--showed {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
table.tc-table {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.tc-cell {
|
||||
border-left: 1px solid var(--color-border);
|
||||
}
|
||||
|
||||
.ce-toolbar__actions {
|
||||
right: calc(100% + 10px)!important;
|
||||
background-color: white!important;
|
||||
}
|
||||
|
||||
.ce-block--selected .ce-block__content {
|
||||
background: var(--app-table-row-stripped-background-color);
|
||||
}
|
||||
|
||||
.ce-inline-tool svg {
|
||||
color: black;
|
||||
}
|
||||
|
||||
.ce-popover--inline .ce-popover-item__icon svg {
|
||||
color: black;
|
||||
}
|
||||
@@ -1,212 +0,0 @@
|
||||
.gridjs-container {
|
||||
color: var(--app-color);
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.gridjs-wrapper {
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
background-color: var(--app-background-color);
|
||||
border-top: var(--app-border-width) solid var(--app-table-border-color);
|
||||
padding-block-end: 1rem;
|
||||
min-height: 515px;
|
||||
}
|
||||
|
||||
.gridjs-footer {
|
||||
background-color: var(--app-background-color);
|
||||
border: 0;
|
||||
border-top: 0;
|
||||
box-shadow: none;
|
||||
color: var(--app-muted-color);
|
||||
padding: 1rem 0 0;
|
||||
}
|
||||
|
||||
.gridjs-table {
|
||||
color: var(--app-color);
|
||||
}
|
||||
|
||||
th.gridjs-th {
|
||||
padding: calc(var(--app-spacing) / 2) var(--app-spacing);
|
||||
border: none;
|
||||
border-bottom: var(--app-border-width) solid var(--app-table-border-color);
|
||||
background-color: var(--app-background-color);
|
||||
color: var(--app-color);
|
||||
font-weight: var(--app-font-weight);
|
||||
text-align: left;
|
||||
text-align: start;
|
||||
}
|
||||
|
||||
button.gridjs-sort {
|
||||
height: 15px;
|
||||
}
|
||||
|
||||
th.gridjs-th-sort:hover,
|
||||
th.gridjs-th-sort:focus {
|
||||
background-color: var(--app-table-row-stripped-background-color);
|
||||
}
|
||||
|
||||
td.gridjs-td {
|
||||
background-color: var(--app-background-color);
|
||||
border: none;
|
||||
border-color: var(--app-table-border-color);
|
||||
padding: calc(var(--app-spacing) / 2) var(--app-spacing);
|
||||
border-bottom: var(--app-border-width) solid var(--app-table-border-color);
|
||||
background-color: var(--app-background-color);
|
||||
color: var(--app-color);
|
||||
font-weight: var(--app-font-weight);
|
||||
text-align: left;
|
||||
text-align: start;
|
||||
}
|
||||
|
||||
.gridjs-search {
|
||||
float: none;
|
||||
}
|
||||
|
||||
.gridjs-search-input {
|
||||
width: min(320px, 100%);
|
||||
}
|
||||
|
||||
input.gridjs-input {
|
||||
background-color: var(--app-background-color);
|
||||
border: var(--app-border-width) solid var(--app-form-element-border-color);
|
||||
border-radius: var(--app-border-radius);
|
||||
color: var(--app-color);
|
||||
font-size: 0.95rem;
|
||||
padding: 0.5rem 0.75rem;
|
||||
}
|
||||
|
||||
input.gridjs-input:focus {
|
||||
border-color: var(--app-primary);
|
||||
box-shadow: 0 0 0 var(--app-outline-width) var(--app-primary-focus);
|
||||
}
|
||||
|
||||
.gridjs-pagination {
|
||||
color: var(--app-muted-color);
|
||||
}
|
||||
|
||||
.gridjs-pagination .gridjs-pages button {
|
||||
background-color: var(--app-background-color);
|
||||
border: var(--app-border-width) solid var(--app-table-border-color);
|
||||
color: var(--app-color);
|
||||
padding: 1px 10px;
|
||||
}
|
||||
|
||||
.gridjs-pagination .gridjs-pages button:hover {
|
||||
background-color: var(--app-primary-hover-background);
|
||||
border-color: var(--app-primary-hover-border);
|
||||
color: var(--app-primary-inverse);
|
||||
}
|
||||
|
||||
.gridjs-pagination .gridjs-pages button:focus {
|
||||
box-shadow: 0 0 0 var(--app-outline-width) var(--app-primary-focus);
|
||||
}
|
||||
|
||||
.gridjs-pagination .gridjs-pages button.gridjs-currentPage {
|
||||
background-color: var(--app-primary) !important;
|
||||
font-weight: 400;
|
||||
padding: 2px 10px;
|
||||
color: var(--app-secondary-inverse) !important;
|
||||
}
|
||||
|
||||
.gridjs-pagination .gridjs-pages button:disabled, .gridjs-pagination .gridjs-pages button[disabled] {
|
||||
background-color: var(--app-background-color);
|
||||
color: var(--app-muted-color);
|
||||
cursor: default;
|
||||
padding: 2px 10px;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.gridjs-pagination .gridjs-pages {
|
||||
display: inline-flex;
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
.gridjs-loading-bar {
|
||||
background-color: var(--app-background-color);
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.grid-avatar {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-radius: 999px;
|
||||
border: 1px solid var(--app-muted-border-color);
|
||||
background: var(--app-card-background-color);
|
||||
object-fit: contain;
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
.grid-avatar-placeholder {
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-weight: 600;
|
||||
color: var(--app-muted-color);
|
||||
font-size: 11px;
|
||||
background: var(--app-background-color);
|
||||
}
|
||||
|
||||
.gridjs-loading-bar:after {
|
||||
background-image: linear-gradient(
|
||||
90deg,
|
||||
transparent,
|
||||
var(--app-primary-focus),
|
||||
transparent
|
||||
);
|
||||
}
|
||||
|
||||
/* .gridjs-container:not(.gridjs-has-loaded) .gridjs-message.gridjs-notfound {
|
||||
display: none;
|
||||
} */
|
||||
|
||||
.gridjs-container.gridjs-is-updating .gridjs-message.gridjs-notfound {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.gridjs-pages button {
|
||||
background: var(--app-form-element-background-color) !important;
|
||||
color: var(--app-contrast) !important;
|
||||
}
|
||||
|
||||
.gridjs-summary {
|
||||
font-size: small;
|
||||
}
|
||||
|
||||
tr.gridjs-tr {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
tr.gridjs-tr:hover td {
|
||||
background: var(--app-table-row-stripped-background-color);
|
||||
}
|
||||
|
||||
html[data-theme=dark] button.gridjs-sort,
|
||||
html[data-theme=dark] button.gridjs-sort-neutral {
|
||||
filter: invert(1);
|
||||
}
|
||||
|
||||
html[data-theme=dark-green] button.gridjs-sort,
|
||||
html[data-theme=dark-green] button.gridjs-sort-neutral {
|
||||
filter: invert(1);
|
||||
}
|
||||
|
||||
.gridjs-tbody, td.gridjs-td {
|
||||
background-color: var(--app-background-color)
|
||||
}
|
||||
|
||||
.gridjs-table input[data-grid-select-all] {
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
margin: 0;
|
||||
border-radius: 4px;
|
||||
border-width: .5px;
|
||||
}
|
||||
|
||||
.gridjs-th-content:has(input[data-grid-select-all]) {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.gridjs-pagination .gridjs-pages button:last-child {
|
||||
border-right: none;
|
||||
}
|
||||
@@ -1,103 +0,0 @@
|
||||
|
||||
/* Overrides for MultiSelect */
|
||||
.multi-select {
|
||||
--spacing-smaller: 3px;
|
||||
--spacing-small: 5px;
|
||||
--spacing-medium: 7px;
|
||||
--spacing-large: 12px;
|
||||
--font-size: 12px;
|
||||
--font-size-large: 14px;
|
||||
--font-size-larger: 16px;
|
||||
--line-height: 16px;
|
||||
--line-height-larger: 20px;
|
||||
--primary-color: var(--app-primary);
|
||||
--text-color-dark: var(--app-contrast);
|
||||
--text-color: var(--app-muted-color);
|
||||
--text-color-light: var(--app-muted-color);
|
||||
--border-color: var(--app-form-element-border-color);
|
||||
--border-color-light: var(--app-muted-border-color);
|
||||
--input-placeholder: var(--app-form-element-placeholder-color);
|
||||
--input-background: var(--app-form-element-background-color);
|
||||
--input-border: var(--app-form-element-border-color);
|
||||
--input-border-active: var(--app-primary-focus);
|
||||
--input-border-invalid: var(--app-form-element-invalid-border-color);
|
||||
--input-outline-invalid: var(--app-form-element-invalid-active-shadow);
|
||||
--input-color: var(--app-form-element-color);
|
||||
--input-disabled: var(--app-form-element-disabled-background-color);
|
||||
--input-min-height: calc(
|
||||
1rem * var(--app-line-height) + var(--app-form-element-spacing-vertical) *
|
||||
2 + var(--app-border-width) * 2
|
||||
);
|
||||
--options-height: 40dvh;
|
||||
--option-background: var(--badge-neutral-bg);
|
||||
--border-radius: var(--app-border-radius);
|
||||
--icon-size: 12px;
|
||||
--icon-space: 30px;
|
||||
--checkbox-size: 16px;
|
||||
--checkbox-radius: 4px;
|
||||
--checkbox-border: var(--app-form-element-border-color);
|
||||
--checkbox-background: var(--app-form-element-background-color);
|
||||
--checkbox-active: var(--app-form-element-background-color);
|
||||
--checkbox-thickness: 2px;
|
||||
}
|
||||
|
||||
.multi-select
|
||||
.multi-select-options
|
||||
.multi-select-option
|
||||
.multi-select-option-radio,
|
||||
.multi-select
|
||||
.multi-select-options
|
||||
.multi-select-all
|
||||
.multi-select-option-radio {
|
||||
padding: 2px;
|
||||
}
|
||||
.multi-select
|
||||
.multi-select-options
|
||||
.multi-select-option
|
||||
.multi-select-option-radio,
|
||||
.multi-select
|
||||
.multi-select-options
|
||||
.multi-select-all
|
||||
.multi-select-option-radio {
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
.multi-select {
|
||||
margin-bottom: var(--app-spacing);
|
||||
}
|
||||
|
||||
.multi-select.disabled {
|
||||
opacity: 0.65;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.multi-select.disabled .multi-select-header,
|
||||
.multi-select.disabled .multi-select-options {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.multi-select .multi-select-header {
|
||||
background: var(--app-form-element-background-color);
|
||||
}
|
||||
|
||||
.multi-select .multi-select-options {
|
||||
background: var(--app-form-element-background-color);
|
||||
}
|
||||
|
||||
.multi-select .multi-select-header .multi-select-header-option {
|
||||
border: 1px solid var(--app-border);
|
||||
}
|
||||
|
||||
.multi-select .multi-select-header {
|
||||
padding-left: 7px;
|
||||
}
|
||||
|
||||
.multi-select .multi-select-option.is-disabled {
|
||||
opacity: 0.45;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.multi-select .multi-select-all.is-disabled {
|
||||
opacity: 0.45;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
Reference in New Issue
Block a user