Skip to content

Commit 31b746e

Browse files
vinglevingle
committed
RiverLea: Colour change, rebase & auto-gen emphasis colours from one value
1 parent a134568 commit 31b746e

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

41 files changed

+524
-1703
lines changed

‎ext/riverlea/CHANGELOG.md‎

Lines changed: 1 addition & 784 deletions
Large diffs are not rendered by default.

‎ext/riverlea/Civi/Riverlea/StyleLoader.php‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -118,15 +118,19 @@ public function alterBundles($e): void {
118118
}
119119

120120
if ($bundle->name === 'coreStyles') {
121-
foreach (self::CORE_FILES as $file) {
122-
$bundle->addStyleFile('riverlea', "core/css/{$file}");
121+
// queue all core files in order
122+
// between crm-i at -101
123+
// and civicrm.css at -99
124+
$j = count(self::CORE_FILES);
125+
foreach (self::CORE_FILES as $i => $file) {
126+
$bundle->addStyleFile('riverlea', "core/css/{$file}", ['weight' => -100 + ($i / $j)]);
123127
}
124-
// get DynamicCss asset
128+
// get the URL for dynamic css asset (aka "the river")
125129
$riverUrl = \Civi::service('asset_builder')->getUrl(
126130
self::DYNAMIC_FILE,
127131
$this->getCssParams()
128132
);
129-
// queue after core files to ensure variables override
133+
// queue dynamic css late
130134
$bundle->addStyleUrl($riverUrl, ['weight' => 100]);
131135
}
132136
}

‎ext/riverlea/README.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ When you enable CiviCRM, you will see these themes in your usual CiviCRM theme o
1010

1111
## Changelog
1212

13-
Is at [Changelog.md](CHANGELOG.md).
13+
From 6.7 this is on CiviCRM's Gitlab at [lab.civicrm.org/riverlea/CHANGELOG.md](https://lab.civicrm.org/extensions/riverlea/-/blob/main/CHANGELOG.md).
1414

1515
## Version numbering
1616

‎ext/riverlea/core/civi_mail-ang/crmMailing.css‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,7 @@
66
height: 20em;
77
}
88
.crmMailing-recip-est {
9-
background: var(--crm-checkbox-list-bg);
10-
color: var(--crm-checkbox-list-col);
9+
background: var(--crm-c-yellow-light);
1110
font-size: var(--crm-small-font-size);
1211
padding: var(--crm-padding-small);
1312
margin: 0 0 0 var(--crm-m);

‎ext/riverlea/core/css/_base.css‎

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -61,6 +61,7 @@ body {
6161
.crm-container img {
6262
max-inline-size: 100%;
6363
max-block-size: 100%;
64+
block-size: auto;
6465
}
6566
.crm-container img.olTileImage {
6667
max-block-size: unset; /* open street map exception */
@@ -155,7 +156,7 @@ body {
155156
font-size: var(--crm-font-size);
156157
line-height: 1.4;
157158
color: var(--crm-c-text);
158-
background: var(--crm-c-page-background);
159+
background: var(--crm-c-page-bg);
159160
}
160161
.crm-container table,
161162
.crm-container tr,
@@ -287,7 +288,8 @@ dl dl {
287288
.crm-container tr.disabled,
288289
.crm-container tr:has(td.disabled),
289290
.crm-container .table-striped > tbody > tr:has(td.disabled) {
290-
background-color: var(--crm-c-page-background);
291+
background-color: var(--crm-c-page-bg) !important /* vs jquery */;
292+
--crm-striped-bg: var(--crm-c-page-bg) /* for striped rows */;
291293
}
292294
.crm-container tr.disabled td *:not(.btn,button,i,a),
293295
.crm-container td.disabled,
@@ -364,8 +366,8 @@ dl dl {
364366
}
365367
.crm-container code {
366368
display: inline;
367-
background-color: var(--crm-c-code-background);
368-
border: 1px solid var(--crm-c-background4);
369+
background-color: var(--crm-c-code-bg);
370+
border: var(--crm-c-code-border);
369371
color: var(--crm-c-text);
370372
border-radius: 2px;
371373
padding: 2px;
@@ -379,8 +381,8 @@ dl dl {
379381
font-size: var(--crm-font-size) !important /* vs inline css on api3 */;
380382
line-height: 1.4 !important /* vs inline css on api3 */;
381383
color: var(--crm-c-text);
382-
background-color: var(--crm-c-code-background);
383-
border: 1px solid var(--crm-c-background4);
384+
background-color: var(--crm-c-code-bg);
385+
border: var(--crm-c-code-border);
384386
border-radius: var(--crm-roundness);
385387
}
386388
.crm-container pre code {

‎ext/riverlea/core/css/_bootstrap.css‎

Lines changed: 13 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1290,7 +1290,7 @@
12901290
#bootstrap-theme .form-control[disabled],
12911291
#bootstrap-theme .form-control[readonly],
12921292
fieldset[disabled] #bootstrap-theme .form-control {
1293-
background-color: var(--crm-c-background2);
1293+
background-color: var(--crm-c-layer1-bg);
12941294
opacity: 1;
12951295
}
12961296
#bootstrap-theme .form-control[disabled],
@@ -1782,7 +1782,7 @@ fieldset[disabled] #bootstrap-theme .btn-link {
17821782
#bootstrap-theme .btn-link[disabled]:focus,
17831783
fieldset[disabled] #bootstrap-theme .btn-link:hover,
17841784
fieldset[disabled] #bootstrap-theme .btn-link:focus {
1785-
color: var(--crm-c-gray-800);
1785+
color: var(--crm-c-inactive);
17861786
text-decoration: none;
17871787
}
17881788
#bootstrap-theme .input-group-addon {
@@ -1792,7 +1792,7 @@ fieldset[disabled] #bootstrap-theme .btn-link:focus {
17921792
line-height: inherit;
17931793
color: var(--crm-input-color);
17941794
text-align: left;
1795-
background-color: var(--crm-input-background);
1795+
background-color: var(--crm-input-bg);
17961796
/* width: 100%; */
17971797
border-radius: var(--crm-roundness);
17981798
}
@@ -2539,7 +2539,7 @@ fieldset[disabled] #bootstrap-theme .navbar-inverse .btn-link:focus {
25392539
padding-bottom: 30px;
25402540
margin-bottom: 30px;
25412541
color: inherit;
2542-
background-color: var(--crm-c-background);
2542+
background-color: var(--crm-c-container-bg);
25432543
}
25442544
#bootstrap-theme .jumbotron h1,
25452545
#bootstrap-theme .jumbotron .h1 {
@@ -2782,7 +2782,7 @@ fieldset[disabled] #bootstrap-theme .navbar-inverse .btn-link:focus {
27822782
#bootstrap-theme button.list-group-item:focus {
27832783
color: #555;
27842784
text-decoration: none;
2785-
background-color: var(--crm-c-background);
2785+
background-color: var(--crm-c-container-bg);
27862786
}
27872787
#bootstrap-theme button.list-group-item {
27882788
width: 100%;
@@ -2945,7 +2945,7 @@ fieldset[disabled] #bootstrap-theme .navbar-inverse .btn-link:focus {
29452945
min-height: 20px;
29462946
padding: 19px;
29472947
margin-bottom: 20px;
2948-
background-color: var(--crm-c-background);
2948+
background-color: var(--crm-c-container-bg);
29492949
border: var(--crm-c-divider);
29502950
border-radius: var(--crm-c-roundness);
29512951
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
@@ -3395,17 +3395,16 @@ fieldset[disabled] #bootstrap-theme .navbar-inverse .btn-link:focus {
33953395
}
33963396
#bootstrap-theme a.label:hover,
33973397
#bootstrap-theme a.label:focus {
3398-
color: var(--crm-c-text-light);
33993398
text-decoration: none;
34003399
cursor: var(--crm-hover-clickable);
34013400
}
34023401
#bootstrap-theme .label-default {
3403-
background-color: var(--crm-c-text);
3402+
background: var(--crm-c-darkest);
34043403
color: var(--crm-c-text-light);
34053404
}
34063405
#bootstrap-theme .label-default[href]:hover,
34073406
#bootstrap-theme .label-default[href]:focus {
3408-
background-color: var(--crm-c-background4);
3407+
background: color-mix(in srgb, var(--crm-c-darkest) 87.5%, #fff 12.5%);
34093408
}
34103409
#bootstrap-theme .label-primary {
34113410
background: var(--crm-c-primary);
@@ -3421,34 +3420,34 @@ fieldset[disabled] #bootstrap-theme .navbar-inverse .btn-link:focus {
34213420
}
34223421
#bootstrap-theme .label-success[href]:hover,
34233422
#bootstrap-theme .label-success[href]:focus {
3424-
background: linear-gradient(to top,rgba(0, 0, 0, 0.125),rgba(0, 0, 0, 0.125)) var(--crm-c-success);
3423+
background: color-mix(in srgb, var(--crm-c-success) 87.5%, #000 12.5%);
34253424
}
34263425
#bootstrap-theme .label-info {
34273426
background: var(--crm-c-info);
34283427
color: var(--crm-c-info-text);
34293428
}
34303429
#bootstrap-theme .label-info[href]:hover,
34313430
#bootstrap-theme .label-info[href]:focus {
3432-
background: linear-gradient(to top,rgba(0, 0, 0, 0.125),rgba(0, 0, 0, 0.125)) var(--crm-c-info);
3431+
background: color-mix(in srgb, var(--crm-c-info) 87.5%, #000 12.5%);
34333432
}
34343433
#bootstrap-theme .label-warning {
34353434
background: var(--crm-c-warning);
34363435
color: var(--crm-c-warning-text);
34373436
}
34383437
#bootstrap-theme .label-warning[href]:hover,
34393438
#bootstrap-theme .label-warning[href]:focus {
3440-
background: linear-gradient(to top,rgba(0, 0, 0, 0.125),rgba(0, 0, 0, 0.125)) var(--crm-c-warning);
3439+
background: color-mix(in srgb, var(--crm-c-warning) 87.5%, #000 12.5%);
34413440
}
34423441
#bootstrap-theme .label-danger {
34433442
background: var(--crm-c-danger);
34443443
color: var(--crm-c-danger-text);
34453444
}
34463445
#bootstrap-theme .label-danger[href]:hover,
34473446
#bootstrap-theme .label-danger[href]:focus {
3448-
background: linear-gradient(to top,rgba(0, 0, 0, 0.125),rgba(0, 0, 0, 0.125)) var(--crm-c-danger);
3447+
background: color-mix(in srgb, var(--crm-c-danger) 87.5%, #000 12.5%);
34493448
}
34503449
#bootstrap-theme .label i.crm-i {
3451-
color: inherit; /* resets icons inside lables to use the label text colour */
3450+
color: inherit; /* resets icons inside labels to use the label text colour */
34523451
}
34533452

34543453
/* Panels */

‎ext/riverlea/core/css/_cms.css‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
/* Backdrop - html.admin-bar */
88

99
html.admin-bar body {
10-
background-color: var(--crm-c-page-background);
10+
background-color: var(--crm-c-page-bg);
1111
}
1212
html.admin-bar .crm-container {
1313
--crm-page-padding: 0;
@@ -38,13 +38,13 @@ body.page-civicrm .crm-container div.status {
3838
/* D8+ */
3939
body.page-civicrm header.content-header {
4040
margin-bottom: 0;
41-
background-color: var(--crm-c-background);
41+
background-color: var(--crm-c-container-bg);
4242
}
4343
body.page-civicrm main.page-content {
4444
margin-top: 0;
4545
}
4646
body.page-civicrm header + div.layout-container {
47-
background-color: var(--crm-c-page-background) !important;
47+
background-color: var(--crm-c-page-bg) !important;
4848
margin: 0 !important; /* use of important vs some themes */
4949
}
5050
body.page-civicrm .button {
@@ -59,7 +59,7 @@ body.page-civicrm #squeeze #crm-container,
5959
.region-sidebar-first .block-civicrm {
6060
padding: 0;
6161
--crm-page-padding: 0;
62-
--crm-c-page-background: transparent;
62+
--crm-c-page-bg: transparent;
6363
--crm-input-label-width: 12em;
6464
}
6565
body.page-civicrm #squeeze .crm-container ul li:not(.ui-tab) {
@@ -69,7 +69,7 @@ body.page-civicrm #squeeze .crm-container ul li:not(.ui-tab) {
6969

7070
/* D7 Seven */
7171
body.page-civicrm > #branding {
72-
background-color: var(--crm-c-page-background);
72+
background-color: var(--crm-c-page-bg);
7373
}
7474
body.page-civicrm > #branding + #page {
7575
--crm-page-padding: 0.5rem 1.25rem;
@@ -130,15 +130,15 @@ body.page-civicrm .page-content:has(#block-claro-content) {
130130
/* Bootstrap 4 */
131131
body.page-civicrm main > .container:has(#block-bootstrap4-content) {
132132
max-width: 100%;
133-
background: var(--crm-c-page-background);
133+
background: var(--crm-c-page-bg);
134134
}
135135

136136
/******************
137137
WORDPRESS
138138
*******************/
139139

140140
body.toplevel_page_CiviCRM.wp-admin {
141-
background: var(--crm-c-page-background);
141+
background: var(--crm-c-page-bg);
142142
}
143143
body.toplevel_page_CiviCRM #wpcontent {
144144
padding-left: 0; /* resets WP padding */
@@ -208,8 +208,8 @@ html.crm-standalone body {
208208
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue",sans-serif; /* Adds fallback for base font */
209209
}
210210
html.crm-standalone #crm-container:has(.standalone-auth-form) {
211-
background: var(--crm-c-background);
211+
background: var(--crm-c-container-bg);
212212
}
213213
html.crm-standalone .standalone-auth-box {
214-
background: var(--crm-c-page-background);
214+
background: var(--crm-c-page-bg);
215215
}

‎ext/riverlea/core/css/_fixes.css‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -426,7 +426,7 @@ body[class*="page-civicrm-report-"] #report-tab-order-by-elements #optionFieldLi
426426
.crm-container .tag-tree-wrapper div.tag-info {
427427
width: auto;
428428
position: relative;
429-
background: var(--crm-c-background);
429+
background: var(--crm-c-container-bg);
430430
border: 0 solid transparent;
431431
box-shadow: var(--crm-block-shadow);
432432
padding: var(--crm-padding-reg);
@@ -625,7 +625,7 @@ tr.crm-preferences-display-form-block-contact_edit_options td table {
625625
/* Custom searches */
626626
.crm-container > #crm-main-content-wrapper > fieldset {
627627
display: grid;
628-
background: var(--crm-c-background);
628+
background: var(--crm-c-container-bg);
629629
border: 0 solid transparent;
630630
box-shadow: var(--crm-block-shadow);
631631
padding: var(--crm-padding-reg);
@@ -844,7 +844,7 @@ details + .crm-content-block:has(.dataTables_wrapper) {
844844
gap: var(--crm-flex-gap);
845845
}
846846
.crm-mosaico-wizard .crm-mosaico-template-item.thumbnail {
847-
background: var(--crm-c-background2) !important /* vs _template-item.scss */;
847+
background: var(--crm-c-layer1-bg) !important /* vs _template-item.scss */;
848848
border: var(--crm-c-divider) !important /* vs _template-item.scss */;
849849
border-radius: var(--crm-roundness) !important /* vs _template-item.scss */;
850850
}

0 commit comments

Comments
 (0)