raggedstaff/openfoodnetwork
1
0
Fork 0
mirror of https://github.com/openfoodfoundation/openfoodnetwork synced 2026-04-01 06:41:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

First pass at new table colours

Browse Source 
There is more to do, for example the dropshadows.

I've continued with the unopinionated colour naming (eg color-7), but would like to consider giving them more meaningfule names..
This commit is contained in:
David Cook
2023-06-01 14:42:34 +10:00
parent 2ae91bdbe2
commit fb17a679c0
2 changed files with 12 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
app/webpacker/css/admin_v3/globals/variables.scss
View File

@@ -18,7 +18,7 @@ $color-link-hover: $color-2 !default;
$color-link-active: $color-2 !default;
$color-link-focus: $color-2 !default;
$color-link-visited: $color-3 !default;
$color-border: very-light($color-3, 12) !default;
$color-border: $color-7 !default;
// Basic flash colors
$color-success: $color-2 !default;
@@ -26,9 +26,8 @@ $color-notice: $color-6 !default;
$color-error: $color-5 !default;
// Table colors
$color-tbl-odd: $color-1 !default;
$color-tbl-even: very-light($color-3, 4) !default;
$color-tbl-thead: very-light($color-3, 4) !default;
$color-tbl-cell-bg: $color-1 !default;
$color-tbl-thead-bg: $color-7 !default;
// Button colors
$color-btn-bg: $color-3 !default;
@@ -62,8 +61,8 @@ $color-sel-hover-text: $color-1 !default;
// Text inputs colors
$color-txt-brd: $color-border !default;
$color-txt-text: $color-3 !default;
$color-txt-hover-brd: $color-2 !default;
$color-txt-text: $color-8 !default;
$color-txt-hover-brd: $color-3 !default;
// States label colors
$color-ste-complete-bg: $color-success !default;
@@ -127,7 +126,7 @@ $actions-brd-colors: $color-action-edit-brd, $color-action-clone-brd
// Sizes
//--------------------------------------------------------------
$body-font-size: 13px !default;
$body-font-size: 14px !default;
$h6-size: $body-font-size + 2 !default;
$h5-size: $h6-size + 2 !default;

22
app/webpacker/css/admin_v3/shared/tables.scss
View File

@@ -6,9 +6,9 @@ table {
th,
td {
padding: 7px 5px;
border-right: 1px solid $color-border;
border-bottom: 1px solid $color-border;
background: $color-tbl-cell-bg;
vertical-align: middle;
text-align: left;
text-overflow: ellipsis;
img {
@@ -129,27 +129,17 @@ table {
thead {
th {
padding: 10px;
border-top: 1px solid $color-border;
border-bottom: none;
background-color: $color-tbl-thead;
text-transform: uppercase;
font-size: 85%;
background-color: $color-tbl-thead-bg;
font-size: 13px;
font-weight: $font-weight-bold;
}
}
tbody {
tr {
&:first-child th,
&:first-child td {
border-top: 1px solid $color-border;
}
&.even td {
background-color: $color-tbl-even;
img {
border: 1px solid very-light($color-3, 6);
}
td {
border-top: 4px solid $color-border; // TODO: Let the table background colour come through, to enable drop shadows
}
&:hover td {