first commit

This commit is contained in:
2025-06-17 11:53:18 +02:00
commit 9f0f7ba12b
8804 changed files with 1369176 additions and 0 deletions

View File

@ -0,0 +1,13 @@
// Badge
.badge {
@include media-breakpoint-down(md) {
white-space: normal;
}
&.bg-secondary {
&:hover {
color: $white;
}
}
}

View File

@ -0,0 +1,44 @@
// Buttons
.btn {
transition: none;
}
@include media-breakpoint-down(sm) {
.btn {
margin-bottom: .25rem;
}
.input-group .btn {
margin-bottom: 0;
}
}
.btn-primary {
color: var(--template-text-light);
background-color: var(--template-bg-dark-60);
border-color: var(--template-bg-dark-60);
&:hover,
&:focus,
&:active {
background-color: var(--template-bg-dark-70);
border-color: var(--template-bg-dark-90);
}
&:not(:disabled):not(.disabled):active,
&:not(:disabled):not(.disabled).active,
.show > &.dropdown-toggle {
background-color: var(--template-bg-dark);
border-color: var(--template-bg-dark);
}
}
.btn-secondary {
background-color: var(--template-bg-dark-60);
border-color: var(--template-bg-dark-60);
}
.input-group-text {
background-color: var(--template-bg-dark);
border-color: var(--template-bg-dark);
}

View File

@ -0,0 +1,49 @@
// Card
// Backport Bootstrap 4 card-columns
.card-columns {
.card {
margin-bottom: $card-spacer-y;
}
@include media-breakpoint-up(sm) {
column-count: 3;
column-gap: 1.25rem;
orphans: 1;
widows: 1;
.card {
display: inline-block; // Don't let them vertically span multiple columns
width: 100%; // Don't let their width change
}
}
}
.content {
.card {
box-shadow: $atum-box-shadow;
}
.card-header {
display: flex;
align-items: center;
padding: 1rem 1rem .75rem;
font-weight: $font-weight-bold;
color: var(--template-bg-dark);
background-color: var(--card-bg);
> [class^="icon-"],
> img {
margin-inline-end: .5rem;
}
}
@if $enable-dark-mode {
@include color-mode(dark) {
.card-header {
color: var(--body-color);
background-color: var(--body-bg);
}
}
}
}

View File

@ -0,0 +1,28 @@
// Collapse
.accordion {
.card-header {
display: block;
font-size: $h5-font-size;
font-weight: $font-weight-bold;
line-height: $headings-line-height;
}
/**
* TODO: This seems fairly specifically built for the menu types view and might be better scoped to
* that view rather than just being overridden for everything.
*/
.list-group-item {
--list-group-color: var(--link-color);
--list-group-bg: var(--white-offset);
}
@if $enable-dark-mode {
@include color-mode(dark) {
.list-group-item {
--list-group-bg: var(--gray-800);
}
}
}
}

View File

@ -0,0 +1,113 @@
@import "../../variables-dark";
// Custom Forms
.custom-select {
@extend .form-select;
}
.form-select {
max-width: $input-max-width;
cursor: pointer;
background: $form-select-background #{"/* rtl:"}$form-select-background-rtl#{"*/"};;
&[multiple] {
padding: 0;
option {
padding: $form-select-multiple-padding-y $form-select-padding-x;
&:checked {
color: var(--template-text-light);
background-color: var(--template-bg-dark) !important;
}
}
}
&.form-select-success,
&.custom-select-success {
color: var(--success);
background-color: var(--success);
border-color: var(--success);
option {
color: $form-select-color;
background-color: var(--white-offset);
}
@if $enable-dark-mode {
@include color-mode(dark) {
option {
background-color: var(--gray-800);
}
}
}
}
&.form-select-danger,
&.custom-select-danger {
color: var(--danger);
background-color: var(--danger);
border-color: var(--danger);
option {
color: $form-select-color;
background-color: var(--white-offset);
}
@if $enable-dark-mode {
@include color-mode(dark) {
option {
background-color: var(--gray-800);
}
}
}
}
&:disabled {
cursor: default;
background-color: var(--gray-200);
background-image: none;
border: 0;
box-shadow: none;
}
@if $enable-dark-mode {
@include color-mode(dark) {
&:disabled {
background-color: var(--gray-800);
}
}
}
optgroup,
option {
color: var(--template-text-dark);
background-color: var(--body-bg);
&:disabled {
background-color: var(--template-bg-dark-5);
}
}
@if $enable-dark-mode {
@include color-mode(dark) {
option {
color: var(--template-text-light);
&:disabled {
background-color: var(--template-bg-dark-90);
}
}
}
}
}
@if $enable-dark-mode {
@include color-mode(dark) {
.form-select {
background: $form-select-background-dark #{"/* rtl:"}$form-select-background-rtl-dark#{"*/"};
}
}
}

View File

@ -0,0 +1,96 @@
// Dropdown
.btn-group .dropdown-menu {
min-width: 100%;
background: var(--body-bg);
box-shadow: $dropdown-box-shadow;
joomla-toolbar-button {
text-align: start;
border: 0;
}
}
.dropdown-menu {
box-shadow: $atum-box-shadow;
}
.dropdown-item {
text-align: start;
border-bottom: 1px solid rgba(0, 0, 0, .1);
&:hover,
&:focus {
.btn-primary + .dropdown-menu & {
background-color: var(--template-bg-dark);
}
.btn-secondary + .dropdown-menu & {
color: var(--template-text-light);
background-color: var(--secondary);
}
.btn-danger + .dropdown-menu & {
background-color: var(--danger);
}
.btn-info + .dropdown-menu & {
background-color: var(--info);
}
.dropdown-status-group .dropdown-menu &:not(.disabled) {
color: var(--template-text-light);
background-color: var(--template-bg-dark);
}
.dropdown-save-group .dropdown-menu &:not(.disabled) {
color: var(--template-text-light);
background-color: var(--success);
}
}
@if $enable-dark-mode {
@include color-mode(dark) {
&:hover,
&:focus {
--dropdown-link-hover-bg: var(--gray-700);
--dropdown-link-hover-color: var(--body-color);
}
}
}
+ .dropdown-item {
border-top: 1px solid rgba(0, 0, 0, .1);
}
.dropdown-status-group .dropdown-menu &:not(.disabled) {
color: var(--action);
}
.dropdown-save-group .dropdown-menu &:not(.disabled) {
color: var(--success);
}
&.first:not(.last) {
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
&.last:not(.first) {
border-top-left-radius: 0;
border-top-right-radius: 0;
}
&:not(.first):not(.last):not(:only-of-type) {
border-radius: 0;
}
}
@if $enable-dark-mode {
@include color-mode(dark) {
.dropdown-item {
border-bottom: 1px solid rgba(255, 255, 255, .1);
}
}
}

View File

@ -0,0 +1,96 @@
// Form
label {
margin-bottom: 0;
}
td .form-control {
display: inline-block;
width: auto;
}
legend {
margin-bottom: 1.1rem;
font-size: 1rem;
font-weight: $font-weight-normal;
}
.checkboxes {
padding-top: 5px;
.checkbox input {
position: static;
margin-left: 0;
}
}
.form-check {
padding-top: 5px;
margin-bottom: 0;
}
.modal label {
width: 100%;
}
// Validation
.invalid {
color: var(--danger);
border-color: var(--danger);
}
.valid {
border-color: var(--success);
}
.form-control-feedback {
display: block;
}
[aria-grabbed="true"] {
box-shadow: 0 0 2px 1px var(--template-bg-dark);
}
select.form-control {
background-color: $form-select-bg;
}
.field-media-wrapper {
display: block;
width: 100%;
max-width: calc(50vw - 5rem);
.field-media-preview {
width: 100%;
max-width: none;
}
.button-select {
background-color: darken($success, 8%);
}
.button-clear {
background-color: darken($danger, 8%);
}
.button-clear > .#{$fa-css-prefix}-check,
.button-select > .#{$fa-css-prefix}-times {
color: $gray-100;
}
@include media-breakpoint-down(lg) {
min-width: 100%;
}
}
// Bootstrap 4 b/c
.form-inline .form-select, .form-inline .custom-select, .form-inline .form-control {
display: inline-block;
width: auto;
}
@include media-breakpoint-down(md) {
.form-inline .form-select, .form-inline .custom-select, .form-inline .form-control {
width: 100%;
}
}

View File

@ -0,0 +1,5 @@
// Lists
.list-unstyled .list-unstyled {
padding-left: 20px;
}

View File

@ -0,0 +1,108 @@
// Modal
.jviewport-height {
&10 {
height: 10vh;
}
&20 {
height: 20vh;
}
&30 {
height: 30vh;
}
&40 {
height: 40vh;
}
&50 {
height: 50vh;
}
&60 {
height: 60vh;
}
&70 {
height: 70vh;
}
&80 {
height: 80vh;
}
&90 {
height: 90vh;
}
&100 {
height: 100vh;
}
}
[class*=jviewport-height] iframe {
height: 100%;
}
.modal-dialog.jviewport-width {
&10 {
width: 10vw;
}
&20 {
width: 20vw;
max-width: none;
}
&30 {
width: 30vw;
max-width: none;
}
&40 {
width: 40vw;
max-width: none;
}
&50 {
width: 50vw;
max-width: none;
}
&60 {
width: 60vw;
max-width: none;
}
&70 {
width: 70vw;
max-width: none;
}
&80 {
width: 80vw;
max-width: none;
}
&90 {
width: 90vw;
max-width: none;
}
&100 {
width: 100vw;
max-width: none;
}
}
.modal-dialog {
@include media-breakpoint-down(md) {
margin: 1.75rem auto;
}
.modal-body {
padding: 0;
}
}

View File

@ -0,0 +1,5 @@
// Pagination
.pagination {
margin: 1rem;
}

View File

@ -0,0 +1,8 @@
// Matches default `<td>` alignment by inheriting `text-align`.
// 1. Fix alignment for Safari
th {
text-align: inherit;
/* stylelint-disable-next-line */
text-align: -webkit-match-parent; // 1
}

View File

@ -0,0 +1,89 @@
// Table
.table {
> :not(:first-child) {
border-top: 2px solid #dee2e6;
}
thead {
th {
font-size: $label-font-size;
}
th,
td {
white-space: nowrap;
.sysinfo & {
white-space: normal;
}
}
a {
color: var(--template-link-color);
&#sorted {
font-weight: $medium-weight;
// This is the same as the bootstrap line because when it's sorted we want to undo the style
color: var(--table-color-state, var(--table-color-type,var(--table-color)));
}
}
.actions,
.actions-th1 {
@include media-breakpoint-down(md) {
width: 28%;
}
}
}
tbody {
tr {
&:hover,
&:focus,
&:active {
background-color: $table-hover-bg;
}
&:last-of-type {
th,
td {
border-bottom: 0;
}
}
}
.itemnumber a.btn,
.itemnumber span.btn {
padding: .1rem .5rem;
text-decoration: none;
}
th {
font-weight: $medium-weight;
}
a:not(.badge):not(.btn):not(.dropdown-item) {
text-decoration: underline;
}
}
th,
td {
label {
margin-bottom: 0;
}
.inactive [class^="#{$jicon-css-prefix}-"],
.inactive [class*=" #{$jicon-css-prefix}-"],
.inactive [class^="#{$fa-css-prefix}-"],
.inactive [class*=" #{$fa-css-prefix}-"] {
color: $gray-400;
}
}
.j-main-container > & {
box-shadow: $atum-box-shadow;
}
}