diff --git a/web/profiles/custom/yalesites_profile/config/sync/core.entity_form_display.block_content.cta_banner.default.yml b/web/profiles/custom/yalesites_profile/config/sync/core.entity_form_display.block_content.cta_banner.default.yml index 357206e57b..8956dbd94a 100644 --- a/web/profiles/custom/yalesites_profile/config/sync/core.entity_form_display.block_content.cta_banner.default.yml +++ b/web/profiles/custom/yalesites_profile/config/sync/core.entity_form_display.block_content.cta_banner.default.yml @@ -5,6 +5,7 @@ dependencies: config: - block_content.type.cta_banner - field.field.block_content.cta_banner.field_heading + - field.field.block_content.cta_banner.field_heading_level - field.field.block_content.cta_banner.field_instructions - field.field.block_content.cta_banner.field_link - field.field.block_content.cta_banner.field_media @@ -39,6 +40,12 @@ content: maxlength_js: 50 maxlength_js_label: 'Content limited to @limit characters, remaining: @remaining' maxlength_js_enforce: false + field_heading_level: + type: options_select + weight: 16 + region: content + settings: { } + third_party_settings: { } field_instructions: type: markup weight: 0 diff --git a/web/profiles/custom/yalesites_profile/config/sync/core.entity_form_display.block_content.grand_hero.default.yml b/web/profiles/custom/yalesites_profile/config/sync/core.entity_form_display.block_content.grand_hero.default.yml index e8ebeec9a3..ce2a8e3d16 100644 --- a/web/profiles/custom/yalesites_profile/config/sync/core.entity_form_display.block_content.grand_hero.default.yml +++ b/web/profiles/custom/yalesites_profile/config/sync/core.entity_form_display.block_content.grand_hero.default.yml @@ -5,6 +5,7 @@ dependencies: config: - block_content.type.grand_hero - field.field.block_content.grand_hero.field_heading + - field.field.block_content.grand_hero.field_heading_level - field.field.block_content.grand_hero.field_instructions - field.field.block_content.grand_hero.field_link - field.field.block_content.grand_hero.field_media @@ -39,6 +40,12 @@ content: maxlength_js: 50 maxlength_js_label: 'Content limited to @limit characters, remaining: @remaining' maxlength_js_enforce: false + field_heading_level: + type: options_select + weight: 10 + region: content + settings: { } + third_party_settings: { } field_instructions: type: markup weight: 0 diff --git a/web/profiles/custom/yalesites_profile/config/sync/core.entity_view_display.block_content.cta_banner.default.yml b/web/profiles/custom/yalesites_profile/config/sync/core.entity_view_display.block_content.cta_banner.default.yml index 5958d59316..7fb869430f 100644 --- a/web/profiles/custom/yalesites_profile/config/sync/core.entity_view_display.block_content.cta_banner.default.yml +++ b/web/profiles/custom/yalesites_profile/config/sync/core.entity_view_display.block_content.cta_banner.default.yml @@ -5,6 +5,7 @@ dependencies: config: - block_content.type.cta_banner - field.field.block_content.cta_banner.field_heading + - field.field.block_content.cta_banner.field_heading_level - field.field.block_content.cta_banner.field_instructions - field.field.block_content.cta_banner.field_link - field.field.block_content.cta_banner.field_media @@ -27,6 +28,13 @@ content: third_party_settings: { } weight: 1 region: content + field_heading_level: + type: list_key + label: hidden + settings: { } + third_party_settings: { } + weight: 6 + region: content field_link: type: link_separate label: hidden diff --git a/web/profiles/custom/yalesites_profile/config/sync/core.entity_view_display.block_content.grand_hero.default.yml b/web/profiles/custom/yalesites_profile/config/sync/core.entity_view_display.block_content.grand_hero.default.yml index e67117b3fa..fed2818560 100644 --- a/web/profiles/custom/yalesites_profile/config/sync/core.entity_view_display.block_content.grand_hero.default.yml +++ b/web/profiles/custom/yalesites_profile/config/sync/core.entity_view_display.block_content.grand_hero.default.yml @@ -5,6 +5,7 @@ dependencies: config: - block_content.type.grand_hero - field.field.block_content.grand_hero.field_heading + - field.field.block_content.grand_hero.field_heading_level - field.field.block_content.grand_hero.field_instructions - field.field.block_content.grand_hero.field_link - field.field.block_content.grand_hero.field_media @@ -27,6 +28,13 @@ content: third_party_settings: { } weight: 1 region: content + field_heading_level: + type: list_key + label: hidden + settings: { } + third_party_settings: { } + weight: 6 + region: content field_link: type: link_separate label: hidden diff --git a/web/profiles/custom/yalesites_profile/config/sync/field.field.block_content.cta_banner.field_heading_level.yml b/web/profiles/custom/yalesites_profile/config/sync/field.field.block_content.cta_banner.field_heading_level.yml new file mode 100644 index 0000000000..834c057cfa --- /dev/null +++ b/web/profiles/custom/yalesites_profile/config/sync/field.field.block_content.cta_banner.field_heading_level.yml @@ -0,0 +1,23 @@ +uuid: c4cb4f27-4116-41c1-bf7e-3be014652c3a +langcode: en +status: true +dependencies: + config: + - block_content.type.cta_banner + - field.storage.block_content.field_heading_level + module: + - options +id: block_content.cta_banner.field_heading_level +field_name: field_heading_level +entity_type: block_content +bundle: cta_banner +label: 'Heading Level' +description: 'Optionally override heading level for this banner' +required: true +translatable: false +default_value: + - + value: '2' +default_value_callback: '' +settings: { } +field_type: list_string diff --git a/web/profiles/custom/yalesites_profile/config/sync/field.field.block_content.grand_hero.field_heading_level.yml b/web/profiles/custom/yalesites_profile/config/sync/field.field.block_content.grand_hero.field_heading_level.yml new file mode 100644 index 0000000000..8880554a31 --- /dev/null +++ b/web/profiles/custom/yalesites_profile/config/sync/field.field.block_content.grand_hero.field_heading_level.yml @@ -0,0 +1,23 @@ +uuid: 7b19e30a-e34c-4869-8522-0ec9074beca3 +langcode: en +status: true +dependencies: + config: + - block_content.type.grand_hero + - field.storage.block_content.field_heading_level + module: + - options +id: block_content.grand_hero.field_heading_level +field_name: field_heading_level +entity_type: block_content +bundle: grand_hero +label: 'Heading Level' +description: 'Optionally override heading level for this banner' +required: true +translatable: true +default_value: + - + value: '2' +default_value_callback: '' +settings: { } +field_type: list_string diff --git a/web/profiles/custom/yalesites_profile/config/sync/field.storage.block_content.field_heading_level.yml b/web/profiles/custom/yalesites_profile/config/sync/field.storage.block_content.field_heading_level.yml new file mode 100644 index 0000000000..fee4557001 --- /dev/null +++ b/web/profiles/custom/yalesites_profile/config/sync/field.storage.block_content.field_heading_level.yml @@ -0,0 +1,27 @@ +uuid: 55bae3c6-a2a3-4e10-85ac-63cc9eefc787 +langcode: en +status: true +dependencies: + module: + - block_content + - options +id: block_content.field_heading_level +field_name: field_heading_level +entity_type: block_content +type: list_string +settings: + allowed_values: + - + value: '1' + label: H1 + - + value: '2' + label: H2 + allowed_values_function: '' +module: options +locked: false +cardinality: 1 +translatable: true +indexes: { } +persist_with_no_fields: false +custom_storage: false diff --git a/web/profiles/custom/yalesites_profile/modules/custom/ys_alert/css/ys_alert.css b/web/profiles/custom/yalesites_profile/modules/custom/ys_alert/css/ys_alert.css index 0982b4983e..c91b796c8c 100644 --- a/web/profiles/custom/yalesites_profile/modules/custom/ys_alert/css/ys_alert.css +++ b/web/profiles/custom/yalesites_profile/modules/custom/ys_alert/css/ys_alert.css @@ -86,7 +86,3 @@ justify-content: flex-end; border-top: none; } - -.ys-alert-settings .js-form-type-checkbox { - background-color: var(--darkest-gray); -} diff --git a/web/profiles/custom/yalesites_profile/modules/custom/ys_core/ys_core.info.yml b/web/profiles/custom/yalesites_profile/modules/custom/ys_core/ys_core.info.yml index 0a1d85fde8..5094cd944c 100644 --- a/web/profiles/custom/yalesites_profile/modules/custom/ys_core/ys_core.info.yml +++ b/web/profiles/custom/yalesites_profile/modules/custom/ys_core/ys_core.info.yml @@ -3,5 +3,3 @@ type: module description: YaleSites Core Configuation core_version_requirement: '^9 || ^10' package: YaleSites -dependencies: - - menu_item_extras diff --git a/web/profiles/custom/yalesites_profile/modules/custom/ys_core/ys_core.module b/web/profiles/custom/yalesites_profile/modules/custom/ys_core/ys_core.module index 1ccdbae8d4..087aaad0fd 100644 --- a/web/profiles/custom/yalesites_profile/modules/custom/ys_core/ys_core.module +++ b/web/profiles/custom/yalesites_profile/modules/custom/ys_core/ys_core.module @@ -6,12 +6,10 @@ */ use Drupal\Core\Cache\Cache; -use Drupal\Core\Entity\Entity\EntityFormDisplay; use Drupal\Core\Form\FormStateInterface; use Drupal\Core\Render\Element; use Drupal\Core\Routing\RouteMatchInterface; use Drupal\Core\Url; -use Drupal\menu_item_extras\Entity\MenuItemExtrasMenuLinkContent; /** * @file @@ -317,91 +315,3 @@ function ys_core_preprocess_image_widget(&$variables) { function ys_core_taxonomy_term_update() { Cache::invalidateTags(['rendered']); } - -/** - * The following functions add menu item extras fields to node add/edit forms. - * - * @see https://www.drupal.org/project/menu_item_extras/issues/2992096#comment-14140361 - */ - -/** - * Implements hook_form_FORM_ID_alter(). - */ -function ys_core_form_node_page_edit_form_alter(&$form, FormStateInterface $form_state, $form_id) { - ys_core_page_form_alter($form, $form_state); -} - -/** - * Implements hook_form_FORM_ID_alter(). - */ -function ys_core_form_node_page_form_alter(&$form, FormStateInterface $form_state, $form_id) { - ys_core_page_form_alter($form, $form_state); -} - -/** - * THe Drupal backend cache renderer service. - * - * @var array $form - * The form array. - * @var Drupal\Core\Form\FormStateInterface $form_state - * The current form state. - */ -function ys_core_page_form_alter(&$form, FormStateInterface $form_state) { - - // Add menu link fields to node form. - if ($link = _ys_core_get_link($form_state)) { - $form_display = EntityFormDisplay::load('menu_link_content.' . $link->getMenuName() . '.default'); - assert($form_display instanceof EntityFormDisplay); - $form['menu']['link']['extra'] = [ - '#type' => 'container', - '#parents' => ['menu', 'extra'], - ]; - $form_display->buildForm($link, $form['menu']['link']['extra'], $form_state); - // Only keep custom fields, other properties already are in the form. - foreach (Element::children($form['menu']['link']['extra']) as $key) { - if (strpos($key, 'field_') !== 0) { - unset($form['menu']['link']['extra'][$key]); - } - } - - foreach (array_keys($form['actions']) as $action) { - if ($action != 'preview' && isset($form['actions'][$action]['#type']) && $form['actions'][$action]['#type'] === 'submit') { - $form['actions'][$action]['#submit'][] = 'ys_core_save_menu_link_fields'; - } - } - } -} - -/** - * Saves the menu item extras when on the node add/edit pages. - * - * @throws \Drupal\Core\Entity\EntityStorageException - */ -function ys_core_save_menu_link_fields(array $form, FormStateInterface $form_state) { - if ($link = _ys_core_get_link($form_state)) { - $form_display = EntityFormDisplay::load('menu_link_content.' . $link->getMenuName() . '.default'); - assert($form_display instanceof EntityFormDisplay); - $form_display->extractFormValues($link, $form['menu']['link']['extra'], $form_state); - $link->save(); - } -} - -/** - * Gets any menu item extras content. - * - * @return Drupal\menu_item_extras\Entity\MenuItemExtrasMenuLinkContent - * Menu item extras content. - */ -function _ys_core_get_link(FormStateInterface $form_state) { - /** @var Drupal\node\Entity $form_state */ - $node = $form_state->getFormObject()->getEntity(); - $defaults = menu_ui_get_menu_link_defaults($node); - if ($mlid = $defaults['entity_id']) { - return MenuItemExtrasMenuLinkContent::load($mlid); - } - return MenuItemExtrasMenuLinkContent::create($defaults); -} - -/** - * End allow menu item extras fields to be included on node add and edit forms. - */ diff --git a/web/profiles/custom/yalesites_profile/modules/custom/ys_views_basic/assets/css/views-basic.css b/web/profiles/custom/yalesites_profile/modules/custom/ys_views_basic/assets/css/views-basic.css index b7ea75ae32..df8999ceda 100644 --- a/web/profiles/custom/yalesites_profile/modules/custom/ys_views_basic/assets/css/views-basic.css +++ b/web/profiles/custom/yalesites_profile/modules/custom/ys_views_basic/assets/css/views-basic.css @@ -2,20 +2,6 @@ * @todo Possibly move these styles into admin theme. */ -/* set variables */ -.layout-builder-configure-block { - --color-border: var(--wool); - --color-border-lightest: var(--color-basic-white); - --color-link-hover: hsl(210, 100%, 21%); - --color-link-border: #187e9b; - --color-background-primary: var(--color-basic-white); - --color-background-hover: var(--dark-theme-gray); - --color-border-hover: var(--darkest-gray); - --color-text-lighter: #2D424D; - --color-text-primary: var(--color-gray-800); -} - - /* General styles */ .views-basic--params { display: none; @@ -61,22 +47,26 @@ } /* base for labels */ -.glb-form-type--radio label { +.glb-form-type--radio label.glb-form-item__label.glb-option { + display: flex !important; + align-items: center; + flex-direction: column; + gap: 1rem; flex: 1 auto; - padding: var(--size-spacing-6) var(--size-spacing-4); - border-radius: 0.25rem; - border: 2px solid var(--color-border); + border: 2px solid var(--wool); aspect-ratio: 2/1; - display: block !important; text-align: left; - background: var(--dark-theme-gray); - border: 2px solid var(--color-border); + background-color: var(--dark-theme-gray); padding: var(--size-spacing-4) var(--size-spacing-5); - color: var(--color-text-primary); + color: var(--darkest-gray); border-radius: 0.25rem; margin-bottom: var(--size-spacing-4); } +.glb-form-type--radio label.glb-form-item__label.glb-option:hover { + border-color: var(--darkest-gray); +} + /****** /******** Input styles @@ -223,15 +213,15 @@ .layout-builder-configure-block .form-item-settings-block-form-group-user-selection-entity-and-view-mode-entity-types:focus label, .layout-builder-configure-block .form-item-settings-block-form-group-user-selection-entity-and-view-mode-view-mode:hover label, .layout-builder-configure-block .form-item-settings-block-form-group-user-selection-entity-and-view-mode-view-mode:focus label { - background-color: var(--color-background-hover); - border-color: var(--color-border-hover); + background-color: var(--dark-theme-gray); + border-color: var(--darkest-gray); } .layout-builder-configure-block .glb-form-type--radio input[checked="checked"] + label, .layout-builder-configure-block .glb-form-type--radio input[checked="checked"] + label:hover, .layout-builder-configure-block .glb-form-type--radio:hover input[checked="checked"] + label { - background-color: var(--color-text-primary); - color: var(--color-background-primary) !important; + background-color: var(--darkest-gray); + color: var(--wool) !important; } @@ -247,8 +237,8 @@ } .form-item-settings-block-form-group-user-selection-entity-and-view-mode-entity-types input[value="post"][checked="checked"] + label { - background-color: var(--color-text-primary); - color: var(--color-background-primary); + background-color: var(--darkest-gray); + color: var(--wool); } @@ -260,8 +250,8 @@ } .form-item-settings-block-form-group-user-selection-entity-and-view-mode-entity-types input[value="event"][checked="checked"] + label { - background-color: var(--color-text-primary); - color: var(--color-background-primary); + background-color: var(--darkest-gray); + color: var(--wool); } /* Pages */ @@ -272,8 +262,8 @@ } .form-item-settings-block-form-group-user-selection-entity-and-view-mode-entity-types input[value="page"][checked="checked"] + label { - background-color: var(--color-text-primary); - color: var(--color-background-primary); + background-color: var(--darkest-gray); + color: var(--wool); } /* Profiles */ @@ -284,8 +274,8 @@ } .form-item-settings-block-form-group-user-selection-entity-and-view-mode-entity-types input[value="profile"][checked="checked"] + label { - background-color: var(--color-text-primary); - color: var(--color-background-primary); + background-color: var(--darkest-gray); + color: var(--wool); } /* diff --git a/web/profiles/custom/yalesites_profile/modules/custom/ys_views_basic/assets/icons/event-time-all.svg b/web/profiles/custom/yalesites_profile/modules/custom/ys_views_basic/assets/icons/event-time-all.svg new file mode 100644 index 0000000000..5e8d11320f --- /dev/null +++ b/web/profiles/custom/yalesites_profile/modules/custom/ys_views_basic/assets/icons/event-time-all.svg @@ -0,0 +1,3 @@ + + + diff --git a/web/profiles/custom/yalesites_profile/modules/custom/ys_views_basic/assets/icons/event-time-future.svg b/web/profiles/custom/yalesites_profile/modules/custom/ys_views_basic/assets/icons/event-time-future.svg new file mode 100644 index 0000000000..30f8f043cd --- /dev/null +++ b/web/profiles/custom/yalesites_profile/modules/custom/ys_views_basic/assets/icons/event-time-future.svg @@ -0,0 +1,4 @@ + + + + diff --git a/web/profiles/custom/yalesites_profile/modules/custom/ys_views_basic/assets/icons/event-time-past.svg b/web/profiles/custom/yalesites_profile/modules/custom/ys_views_basic/assets/icons/event-time-past.svg new file mode 100644 index 0000000000..b87e2948f4 --- /dev/null +++ b/web/profiles/custom/yalesites_profile/modules/custom/ys_views_basic/assets/icons/event-time-past.svg @@ -0,0 +1,4 @@ + + + + diff --git a/web/profiles/custom/yalesites_profile/modules/custom/ys_views_basic/assets/js/views-basic.js b/web/profiles/custom/yalesites_profile/modules/custom/ys_views_basic/assets/js/views-basic.js index 3089e277fc..a19e16d062 100644 --- a/web/profiles/custom/yalesites_profile/modules/custom/ys_views_basic/assets/js/views-basic.js +++ b/web/profiles/custom/yalesites_profile/modules/custom/ys_views_basic/assets/js/views-basic.js @@ -26,7 +26,9 @@ const radioGroups = [ 'input[name="settings[block_form][group_user_selection][entity_and_view_mode][entity_types]"]', 'input[name="settings[block_form][group_user_selection][entity_and_view_mode][view_mode]"]', - 'input[name="settings[block_form][group_user_selection][filter_and_sort][term_operator]"]', + 'input[name="settings[block_form][group_user_selection][filter_options][term_operator]"', + 'input[name="settings[block_form][group_user_selection][filter_and_sort][term_operator]"', + 'input[name="settings[block_form][group_user_selection][entity_specific][event_time_period]"]' ]; // Apply the function to each radio input group diff --git a/web/profiles/custom/yalesites_profile/modules/custom/ys_views_basic/src/Plugin/Field/FieldWidget/ViewsBasicDefaultWidget.php b/web/profiles/custom/yalesites_profile/modules/custom/ys_views_basic/src/Plugin/Field/FieldWidget/ViewsBasicDefaultWidget.php index 4f35d46c8a..0f2605d626 100644 --- a/web/profiles/custom/yalesites_profile/modules/custom/ys_views_basic/src/Plugin/Field/FieldWidget/ViewsBasicDefaultWidget.php +++ b/web/profiles/custom/yalesites_profile/modules/custom/ys_views_basic/src/Plugin/Field/FieldWidget/ViewsBasicDefaultWidget.php @@ -159,6 +159,11 @@ public function formElement( $form['group_user_selection']['entity_specific'] = [ '#type' => 'container', + '#attributes' => [ + 'class' => [ + 'grouped-items', + ], + ], ]; $form['group_user_selection']['options'] = [ @@ -274,9 +279,9 @@ public function formElement( '#type' => 'radios', '#title' => $this->t('Event Time Period'), '#options' => [ - 'future' => $this->t('Future Events'), - 'past' => $this->t('Past Events'), - 'all' => $this->t('All Events'), + 'future' => $this->t('Future Events') . 'Future Events icon showing a calendar with a future-pointing arrow to the right.', + 'past' => $this->t('Past Events') . 'Past Events icon showing a calendar with a past-pointing arrow to the left.', + 'all' => $this->t('All Events') . 'All Events icon showing a calendar.', ], '#default_value' => ($items[$delta]->params) ? $this->viewsBasicManager->getDefaultParamValue('event_time_period', $items[$delta]->params) : 'future', '#states' => [ diff --git a/web/themes/custom/ys_admin_theme/css/gin-color-overrides.css b/web/themes/custom/ys_admin_theme/css/gin-color-overrides.css index b78942c9f1..929b7ca336 100644 --- a/web/themes/custom/ys_admin_theme/css/gin-color-overrides.css +++ b/web/themes/custom/ys_admin_theme/css/gin-color-overrides.css @@ -33,7 +33,7 @@ --gin-bg-input: var(--darkest-gray) !important; --gin-border-color: var(--wool) !important; --gin-border-color-table-header: var(--darkest-gray) !important; - --gin-border-color-form-element: var(--light-gray) !important; + --gin-border-color-form-element: var(--darkest-gray) !important; --gin-bg-app: var(--darkest-gray); --gin-bg-layer3: var(--dark-theme-gray-hover); --colorGinText: var(--darkest-gray); @@ -42,7 +42,7 @@ --gin-color-button-text: var(--dark-theme-gray-hover); --gin-color-button-text-hover: var(--dark-theme-gray-hover); --gin-border-color-layer2: #A8A8A8 !important; - --gin-pattern-fallback: var(--wool); + --gin-pattern-fallback: var(--light-gray); --dropbutton-extrasmall-toggle-size: 1.5rem; } diff --git a/web/themes/custom/ys_admin_theme/css/gin-custom.css b/web/themes/custom/ys_admin_theme/css/gin-custom.css index 1e6de31428..bb76a05335 100644 --- a/web/themes/custom/ys_admin_theme/css/gin-custom.css +++ b/web/themes/custom/ys_admin_theme/css/gin-custom.css @@ -153,6 +153,16 @@ color: var(--wool) !important; } +/* Secondary buttons */ +.gin--dark-mode .form-actions .button { + color: var(--gin-color-primary); + background-color: var(--darkest-gray); +} + +.gin--dark-mode .form-actions .button:focus { + background-color: var(--wool); +} + /* icons */ .action-link:hover::before { background: var(--robin-egg) !important; @@ -169,12 +179,21 @@ opacity: 0.8; } +/* checkboxes */ +.gin--dark-mode :not(.glb-form-checkboxes):not(td):not(.media-library-item__click-to-select-checkbox):not(.field-content) > .glb-form-checkbox:checked + .glb-checkbox-toggle { + background-color: var(--robin-egg) !important; +} + +.gin--dark-mode :not(.form-checkboxes):not(td):not(.tabledrag-cell-content__item):not(.media-library-item__click-to-select-checkbox):not(.field-content) > .form-type--checkbox .checkbox-toggle__inner::before { + background-color: var(--dark-theme-gray) !important; +} + .gin--dark-mode :not(.form-checkboxes):not(td):not(.tabledrag-cell-content__item):not(.media-library-item__click-to-select-checkbox):not(.field-content) > .form-type--checkbox input:checked ~ .checkbox-toggle .checkbox-toggle__inner::before { background-color: var(--darkest-gray) !important; } .gin--dark-mode .form-boolean--type-checkbox:not(:checked) + .checkbox-toggle .checkbox-toggle__inner { - background-color: var(--dark-theme-gray) !important; + background-color: var(--light-gray) !important; } .gin--dark-mode table th { @@ -277,6 +296,22 @@ background-color: var(--wool); } +.gin--dark-mode[dir=ltr] .media-library-item img { + background-image: unset !important; +} + +.gin--dark-mode .media-library-item .form-item { + border: 2px solid var(--darkest-gray); + padding: 0; + border-radius: 0.25rem; +} + +.gin--dark-mode .media-library-item .media-library-item__remove:link, +.gin--dark-mode .media-library-item .media-library-item__remove:not(:hover):not(:checked), +.gin--dark-mode .media-library-item .media-library-item__edit:not(:hover):not(:checked) { + border-color: var(--darkest-gray) !important; +} + /* Embed component */ .gin--dark-mode .ui-dialog .ui-widget-content.ui-dialog-content h2 { color: var(--wool); @@ -305,6 +340,59 @@ background: var(--gin-color-danger) !important; } +/* Legend */ +.gin--dark-mode legend { + display: block; + margin: 0; + border: 0; + padding: 0; + width: 100%; + float: none; +} + +.gin--dark-mode .fieldset-legend.fieldset__label, +.gin--dark-mode .fieldset__legend.fieldset__legend--visible .fieldset__label { + display: block; + color: var(--darkest-gray) !important; + background-color: var(--wool); + border-top-left-radius: 0.5rem; + border-top-right-radius: 0.5rem; + padding-top: 0.5rem; + padding-bottom: 0.5rem; + border: 0.15rem solid var(--gin-border-color); + margin-left: -0.15rem; + margin-right: -0.15rem; +} + +.gin--dark-mode .fieldset__label.fieldset__label--group { + padding-left: 1.5rem; + padding-right: 1.5rem; +} + +.gin--dark-mode #edit-footer-logos .fieldset-wrapper { + padding: 1rem; +} + +.gin--dark-mode #edit-footer-logos fieldset + .form-item { + margin-top: 1rem; +} + +.gin--dark-mode fieldset > legend + .fieldset-wrapper { + padding: 1rem; +} + +/* Messages */ +.gin--dark-mode .messages, +.gin--dark-mode .glb-messages { + outline: 0.15rem solid var(--wool); +} + +/* Radios */ +.gin--dark-mode .form-type--radio .form-radio { + border: 1px solid var(--wool); + background-color: var(--darkest-gray); +} + /* stylelint-enable */ /*# sourceMappingURL=gin-custom.css.map */ diff --git a/web/themes/custom/ys_admin_theme/css/gin-custom.css.map b/web/themes/custom/ys_admin_theme/css/gin-custom.css.map index bc92ce1048..716556b0fe 100644 --- a/web/themes/custom/ys_admin_theme/css/gin-custom.css.map +++ b/web/themes/custom/ys_admin_theme/css/gin-custom.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["../scss/gin-custom.scss"],"names":[],"mappings":"AAAA;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;AAAA;EAEE;;;AAIJ;EACE;EACA;;;AAIF;EACE;;;AAIF;EACE;;;AAGF;EACE;;;AAIF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAQE;;;AAIF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAqCE;;;AAGF;AACA;AAAA;EAEE;;;AAGF;AACA;AAAA;EAEE;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAIF;AAAA;EAEE;;;AAIF;EACE;;;AAIF;EACE;;;AAMF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAUE;;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAUE;EACA;;;AAGF;EACE;;;AAGF;AAAA;EAEE;EACA;;;AAGF;AACA;EACE;;;AAGF;AACA;AAAA;EAEE;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AACA;EACE;;;AAGF;AACA;EACE;EACA;;;AAGF;EACE;;;AAGF;AACA;EACE;EACA;;;AAKF;EACE;;;AAGF;EACE;EACA;;;AAIF;EACE;;;AAGF;AACA;EACE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAEF;EACE;EACA;;;AAKF;AAAA;EAEE;EACA;EACA;;;AAGF;AACA;EACE;;;AAGF;AACA;EACE;;;AAGF;AACA;EACE;;;AAGF;AACA;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;AACA;EACE;;;AAGF;AACA;EACE;;;AAGF;EACE;;;AAGF","file":"gin-custom.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["../scss/gin-custom.scss"],"names":[],"mappings":"AAAA;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;AAAA;EAEE;;;AAIJ;EACE;EACA;;;AAIF;EACE;;;AAIF;EACE;;;AAGF;EACE;;;AAIF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAQE;;;AAIF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAqCE;;;AAGF;AACA;AAAA;EAEE;;;AAGF;AACA;AAAA;EAEE;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAIF;AAAA;EAEE;;;AAIF;EACE;;;AAIF;EACE;;;AAMF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAUE;;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAUE;EACA;;;AAGF;EACE;;;AAGF;AAAA;EAEE;EACA;;;AAGF;AACA;EACE;EACA;;;AAGF;EACE;;;AAGF;AACA;EACE;;;AAGF;AACA;AAAA;EAEE;;;AAGF;EACE;EACA;;;AAGF;AACA;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAIF;AACA;EACE;;;AAGF;AACA;EACE;EACA;;;AAGF;EACE;;;AAGF;AACA;EACE;EACA;;;AAKF;EACE;;;AAGF;EACE;EACA;;;AAIF;EACE;;;AAGF;AACA;EACE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAEF;EACE;EACA;;;AAKF;AAAA;EAEE;EACA;EACA;;;AAGF;AACA;EACE;;;AAGF;AACA;EACE;;;AAGF;AACA;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;AAAA;AAAA;EAGE;;;AAGF;AACA;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;AACA;EACE;;;AAGF;AACA;EACE;;;AAGF;EACE;;;AAGF;AACA;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AACA;AAAA;EAEE;;;AAGF;AACA;EACE;EACA;;;AAGF","file":"gin-custom.css"} \ No newline at end of file diff --git a/web/themes/custom/ys_admin_theme/scss/gin-color-overrides.scss b/web/themes/custom/ys_admin_theme/scss/gin-color-overrides.scss index c5f876a0cb..ffb2abe8c9 100644 --- a/web/themes/custom/ys_admin_theme/scss/gin-color-overrides.scss +++ b/web/themes/custom/ys_admin_theme/scss/gin-color-overrides.scss @@ -34,7 +34,7 @@ --gin-bg-input: var(--darkest-gray) !important; --gin-border-color: var(--wool) !important; --gin-border-color-table-header: var(--darkest-gray) !important; - --gin-border-color-form-element: var(--light-gray) !important; + --gin-border-color-form-element: var(--darkest-gray) !important; --gin-bg-app: var(--darkest-gray); --gin-bg-layer3: var(--dark-theme-gray-hover); --colorGinText: var(--darkest-gray); @@ -43,7 +43,7 @@ --gin-color-button-text: var(--dark-theme-gray-hover); --gin-color-button-text-hover: var(--dark-theme-gray-hover); --gin-border-color-layer2: #A8A8A8 !important; - --gin-pattern-fallback: var(--wool); + --gin-pattern-fallback: var(--light-gray); --dropbutton-extrasmall-toggle-size: 1.5rem; } } diff --git a/web/themes/custom/ys_admin_theme/scss/gin-custom.scss b/web/themes/custom/ys_admin_theme/scss/gin-custom.scss index c949c56277..046525a7b0 100644 --- a/web/themes/custom/ys_admin_theme/scss/gin-custom.scss +++ b/web/themes/custom/ys_admin_theme/scss/gin-custom.scss @@ -165,6 +165,16 @@ color: var(--wool) !important; } +/* Secondary buttons */ +.gin--dark-mode .form-actions .button { + color: var(--gin-color-primary); + background-color: var(--darkest-gray); +} + +.gin--dark-mode .form-actions .button:focus { + background-color: var(--wool); +} + /* icons */ .action-link:hover::before { background: var(--robin-egg) !important; @@ -181,12 +191,21 @@ opacity: 0.8; } +/* checkboxes */ +.gin--dark-mode :not(.glb-form-checkboxes):not(td):not(.media-library-item__click-to-select-checkbox):not(.field-content) > .glb-form-checkbox:checked + .glb-checkbox-toggle { + background-color: var(--robin-egg) !important; +} + +.gin--dark-mode :not(.form-checkboxes):not(td):not(.tabledrag-cell-content__item):not(.media-library-item__click-to-select-checkbox):not(.field-content) > .form-type--checkbox .checkbox-toggle__inner::before { + background-color: var(--dark-theme-gray) !important; +} + .gin--dark-mode :not(.form-checkboxes):not(td):not(.tabledrag-cell-content__item):not(.media-library-item__click-to-select-checkbox):not(.field-content) > .form-type--checkbox input:checked ~ .checkbox-toggle .checkbox-toggle__inner::before { background-color: var(--darkest-gray) !important; } .gin--dark-mode .form-boolean--type-checkbox:not(:checked) + .checkbox-toggle .checkbox-toggle__inner { - background-color: var(--dark-theme-gray) !important; + background-color: var(--light-gray) !important; } .gin--dark-mode table th { @@ -197,6 +216,7 @@ background: var(--dark-theme-gray); } + /* checkbox spacing */ .gin--dark-mode .js-form-type-checkbox.form-type--checkbox { padding: 0.5rem; @@ -293,6 +313,22 @@ background-color: var(--wool); } +.gin--dark-mode[dir="ltr"] .media-library-item img { + background-image: unset !important; +} + +.gin--dark-mode .media-library-item .form-item { + border: 2px solid var(--darkest-gray); + padding: 0; + border-radius: 0.25rem; +} + +.gin--dark-mode .media-library-item .media-library-item__remove:link, +.gin--dark-mode .media-library-item .media-library-item__remove:not(:hover):not(:checked), +.gin--dark-mode .media-library-item .media-library-item__edit:not(:hover):not(:checked) { + border-color: var(--darkest-gray) !important; +} + /* Embed component */ .gin--dark-mode .ui-dialog .ui-widget-content.ui-dialog-content h2 { color: var(--wool); @@ -321,4 +357,57 @@ background: var(--gin-color-danger) !important; } +/* Legend */ +.gin--dark-mode legend { + display: block; + margin: 0; + border: 0; + padding: 0; + width: 100%; + float: none; +} + +.gin--dark-mode .fieldset-legend.fieldset__label, +.gin--dark-mode .fieldset__legend.fieldset__legend--visible .fieldset__label { + display: block; + color: var(--darkest-gray) !important; + background-color: var(--wool); + border-top-left-radius: 0.5rem; + border-top-right-radius: 0.5rem; + padding-top: 0.5rem; + padding-bottom: 0.5rem; + border: 0.15rem solid var(--gin-border-color); + margin-left: -0.15rem; + margin-right: -0.15rem; +} + +.gin--dark-mode .fieldset__label.fieldset__label--group { + padding-left: 1.5rem; + padding-right: 1.5rem; +} + +.gin--dark-mode #edit-footer-logos .fieldset-wrapper { + padding: 1rem; +} + +.gin--dark-mode #edit-footer-logos fieldset + .form-item { + margin-top: 1rem; +} + +.gin--dark-mode fieldset > legend + .fieldset-wrapper { + padding: 1rem; +} + +/* Messages */ +.gin--dark-mode .messages, +.gin--dark-mode .glb-messages { + outline: 0.15rem solid var(--wool); +} + +/* Radios */ +.gin--dark-mode .form-type--radio .form-radio { + border: 1px solid var(--wool); + background-color: var(--darkest-gray); +} + /* stylelint-enable */