|
@@ -5,6 +5,9 @@
|
|
|
--text-light: #52616f;
|
|
--text-light: #52616f;
|
|
|
--border: #dce2e7;
|
|
--border: #dce2e7;
|
|
|
--cui-primary: #72889b;
|
|
--cui-primary: #72889b;
|
|
|
|
|
+ --gc-button-orange: #c45500;
|
|
|
|
|
+ --gc-button-orange-hover: #a74700;
|
|
|
|
|
+ --gc-button-orange-active: #8f3e00;
|
|
|
font-size: 1.0625rem;
|
|
font-size: 1.0625rem;
|
|
|
width: 100%;
|
|
width: 100%;
|
|
|
padding: 0 0 2rem;
|
|
padding: 0 0 2rem;
|
|
@@ -31,7 +34,7 @@ body:has(.gc-detail-page) { max-width: 1840px; }
|
|
|
.gc-context-heading h1 { margin: .25rem 0; font-size: clamp(1.325rem, 1.6vw, 1.75rem); line-height: 1.4; font-weight: 700; overflow-wrap: anywhere; }
|
|
.gc-context-heading h1 { margin: .25rem 0; font-size: clamp(1.325rem, 1.6vw, 1.75rem); line-height: 1.4; font-weight: 700; overflow-wrap: anywhere; }
|
|
|
.gc-context-heading p { margin: 0; font-size: 1.0625rem; }
|
|
.gc-context-heading p { margin: 0; font-size: 1.0625rem; }
|
|
|
.gc-context-heading p span { color: #52616f; }
|
|
.gc-context-heading p span { color: #52616f; }
|
|
|
-.gc-detail-page .gc-back-link { padding: 0; font-size: 1rem; color: #3c5263; text-decoration: none; }
|
|
|
|
|
|
|
+.gc-detail-page .gc-back-link { font-size: 1rem; text-decoration: none; }
|
|
|
.gc-context-metrics { display: flex; gap: .65rem; flex-wrap: wrap; }
|
|
.gc-context-metrics { display: flex; gap: .65rem; flex-wrap: wrap; }
|
|
|
.gc-metric { display: flex; flex-direction: column; gap: .15rem; padding: .6rem .85rem; border-radius: 8px; }
|
|
.gc-metric { display: flex; flex-direction: column; gap: .15rem; padding: .6rem .85rem; border-radius: 8px; }
|
|
|
.gc-metric span { font-size: 1rem; }
|
|
.gc-metric span { font-size: 1rem; }
|
|
@@ -57,8 +60,37 @@ body:has(.gc-detail-page) { max-width: 1840px; }
|
|
|
.gc-data-more summary { cursor: pointer; padding: .65rem 1rem; font-size: 1rem; font-weight: 600; color: #354f63; }
|
|
.gc-data-more summary { cursor: pointer; padding: .65rem 1rem; font-size: 1rem; font-weight: 600; color: #354f63; }
|
|
|
.gc-data-more[open] summary { background: #f4f6f8; }
|
|
.gc-data-more[open] summary { background: #f4f6f8; }
|
|
|
.gc-detail-page .btn { white-space: normal !important; border-radius: 6px; font-size: 1.0625rem; padding: .5rem .75rem; }
|
|
.gc-detail-page .btn { white-space: normal !important; border-radius: 6px; font-size: 1.0625rem; padding: .5rem .75rem; }
|
|
|
-/* Dark text on the exact corporate action color meets text contrast requirements. */
|
|
|
|
|
-.gc-detail-page .btn-primary { --cui-btn-bg: #72889b; --cui-btn-border-color: #72889b; --cui-btn-color: #101b24; --cui-btn-hover-bg: #c3ccd4; --cui-btn-hover-color: #101b24; --cui-btn-hover-border-color: #72889b; --cui-btn-active-bg: #b1bcc7; --cui-btn-active-color: #101b24; }
|
|
|
|
|
|
|
+/* Orange gives the main action a clear emphasis against the blue-grey panels. */
|
|
|
|
|
+.gc-detail-page .btn-primary {
|
|
|
|
|
+ --cui-btn-bg: var(--gc-button-orange);
|
|
|
|
|
+ --cui-btn-border-color: var(--gc-button-orange);
|
|
|
|
|
+ --cui-btn-color: #fff;
|
|
|
|
|
+ --cui-btn-hover-bg: var(--gc-button-orange-hover);
|
|
|
|
|
+ --cui-btn-hover-border-color: var(--gc-button-orange-hover);
|
|
|
|
|
+ --cui-btn-hover-color: #fff;
|
|
|
|
|
+ --cui-btn-active-bg: var(--gc-button-orange-active);
|
|
|
|
|
+ --cui-btn-active-border-color: var(--gc-button-orange-active);
|
|
|
|
|
+ --cui-btn-active-color: #fff;
|
|
|
|
|
+ --cui-btn-disabled-bg: var(--gc-button-orange);
|
|
|
|
|
+ --cui-btn-disabled-border-color: var(--gc-button-orange);
|
|
|
|
|
+ --cui-btn-disabled-color: #fff;
|
|
|
|
|
+ --cui-btn-focus-shadow-rgb: 196, 85, 0;
|
|
|
|
|
+}
|
|
|
|
|
+.gc-detail-page .btn-outline-primary {
|
|
|
|
|
+ --cui-btn-color: var(--gc-button-orange);
|
|
|
|
|
+ --cui-btn-bg: #fff;
|
|
|
|
|
+ --cui-btn-border-color: var(--gc-button-orange);
|
|
|
|
|
+ --cui-btn-hover-bg: #fff1e6;
|
|
|
|
|
+ --cui-btn-hover-border-color: var(--gc-button-orange-hover);
|
|
|
|
|
+ --cui-btn-hover-color: var(--gc-button-orange-hover);
|
|
|
|
|
+ --cui-btn-active-bg: #ffe1c7;
|
|
|
|
|
+ --cui-btn-active-border-color: var(--gc-button-orange-active);
|
|
|
|
|
+ --cui-btn-active-color: var(--gc-button-orange-active);
|
|
|
|
|
+ --cui-btn-disabled-color: var(--gc-button-orange);
|
|
|
|
|
+ --cui-btn-disabled-border-color: var(--gc-button-orange);
|
|
|
|
|
+ --cui-btn-focus-shadow-rgb: 196, 85, 0;
|
|
|
|
|
+}
|
|
|
|
|
+.gc-detail-page :is(.gc-back-link, .gc-form-actions > a) { --cui-btn-bg: #fff; }
|
|
|
.gc-detail-page .btn-outline-secondary { --cui-btn-color: #354f63; --cui-btn-border-color: #b1bcc7; --cui-btn-hover-bg: #cdd4da; --cui-btn-hover-color: #182630; --cui-btn-hover-border-color: #72889b; }
|
|
.gc-detail-page .btn-outline-secondary { --cui-btn-color: #354f63; --cui-btn-border-color: #b1bcc7; --cui-btn-hover-bg: #cdd4da; --cui-btn-hover-color: #182630; --cui-btn-hover-border-color: #72889b; }
|
|
|
.gc-detail-page .btn-link { color: #354f63; }
|
|
.gc-detail-page .btn-link { color: #354f63; }
|
|
|
.gc-detail-page .gc-workflow-form { margin: 0; padding: 1rem; --cui-gutter-x: 0; --cui-gutter-y: .75rem; }
|
|
.gc-detail-page .gc-workflow-form { margin: 0; padding: 1rem; --cui-gutter-x: 0; --cui-gutter-y: .75rem; }
|