PrivateCoffee/wishthis
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Increase grid gutter width

Browse source 
Since the card ribbon would show over the next cards overlay
This commit is contained in:
Jay Trees 2022-03-25 12:39:41 +01:00
parent 472d0e2488
commit 013c0b5d94
5 changed files with 47 additions and 47 deletions
Download patch file Download diff file Expand all files Collapse all files

44
semantic/dist/components/grid.css vendored
View file

@ -36,8 +36,8 @@
.ui.grid { .ui.grid {
margin-top: -0.5rem; margin-top: -0.5rem;
margin-bottom: -0.5rem; margin-bottom: -0.5rem;
margin-left: -0.5rem; margin-left: -0.5625rem;
margin-right: -0.5rem; margin-right: -0.5625rem;
} }
.ui.relaxed.grid { .ui.relaxed.grid {
margin-left: -1.5rem; margin-left: -1.5rem;
@ -64,13 +64,13 @@
position: relative; position: relative;
display: inline-block; display: inline-block;
width: 6.25%; width: 6.25%;
padding-left: 0.5rem; padding-left: 0.5625rem;
padding-right: 0.5rem; padding-right: 0.5625rem;
vertical-align: top; vertical-align: top;
} }
.ui.grid > * { .ui.grid > * {
padding-left: 0.5rem; padding-left: 0.5625rem;
padding-right: 0.5rem; padding-right: 0.5625rem;
} }
/*------------------- /*-------------------
@ -148,7 +148,7 @@
-webkit-box-flex: 1; -webkit-box-flex: 1;
-ms-flex-positive: 1; -ms-flex-positive: 1;
flex-grow: 1; flex-grow: 1;
margin: 0.5rem 0.5rem; margin: 0.5rem 0.5625rem;
} }
.ui.grid .column + .ui.vertical.divider { .ui.grid .column + .ui.vertical.divider {
height: calc(50% - 0.5rem); height: calc(50% - 0.5rem);
@ -1092,9 +1092,9 @@
content: ""; content: "";
top: 0; top: 0;
left: 0; left: 0;
width: calc(100% - 1rem); width: calc(100% - 1.125rem);
height: 1px; height: 1px;
margin: 0 0.5rem; margin: 0 0.5625rem;
-webkit-box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15); box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15);
} }
@ -1810,7 +1810,7 @@
margin: 0 0 !important; margin: 0 0 !important;
-webkit-box-shadow: none !important; -webkit-box-shadow: none !important;
box-shadow: none !important; box-shadow: none !important;
padding: 0.5rem 0.5rem; padding: 0.5rem 0.5625rem;
} }
.ui.stackable.grid:not(.vertically) > .row { .ui.stackable.grid:not(.vertically) > .row {
margin: 0; margin: 0;
@ -1827,8 +1827,8 @@
/* Don't pad inside segment or nested grid */ /* Don't pad inside segment or nested grid */
.ui.grid .ui.stackable.grid, .ui.grid .ui.stackable.grid,
.ui.segment:not(.vertical) .ui.stackable.page.grid { .ui.segment:not(.vertical) .ui.stackable.page.grid {
margin-left: -0.5rem !important; margin-left: -0.5625rem !important;
margin-right: -0.5rem !important; margin-right: -0.5625rem !important;
} }
/* Divided Stackable */ /* Divided Stackable */
@ -1999,16 +1999,16 @@
-----------------*/ -----------------*/
.ui.ui.ui.compact.grid { .ui.ui.ui.compact.grid {
margin: -0.25rem; margin: -0.28125rem;
} }
.ui.ui.ui.compact.grid > .column:not(.row), .ui.ui.ui.compact.grid > .column:not(.row),
.ui.ui.ui.compact.grid > .row > .column { .ui.ui.ui.compact.grid > .row > .column {
padding-left: 0.25rem; padding-left: 0.28125rem;
padding-right: 0.25rem; padding-right: 0.28125rem;
} }
.ui.ui.ui.compact.grid > * { .ui.ui.ui.compact.grid > * {
padding-left: 0.25rem; padding-left: 0.28125rem;
padding-right: 0.25rem; padding-right: 0.28125rem;
} }
/* Row */ /* Row */
@ -2040,16 +2040,16 @@
-----------------*/ -----------------*/
.ui.ui.ui[class*="very compact"].grid { .ui.ui.ui[class*="very compact"].grid {
margin: -0.125rem; margin: -0.140625rem;
} }
.ui.ui.ui[class*="very compact"].grid > .column:not(.row), .ui.ui.ui[class*="very compact"].grid > .column:not(.row),
.ui.ui.ui[class*="very compact"].grid > .row > .column { .ui.ui.ui[class*="very compact"].grid > .row > .column {
padding-left: 0.125rem; padding-left: 0.140625rem;
padding-right: 0.125rem; padding-right: 0.140625rem;
} }
.ui.ui.ui[class*="very compact"].grid > * { .ui.ui.ui[class*="very compact"].grid > * {
padding-left: 0.125rem; padding-left: 0.140625rem;
padding-right: 0.125rem; padding-right: 0.140625rem;
} }
/* Row */ /* Row */

2
semantic/dist/components/grid.min.css vendored
View file

File diff suppressed because one or more lines are too long

44
semantic/dist/semantic.css vendored
View file

@ -854,8 +854,8 @@ body .ui.inverted:not(.dimmer)::-webkit-scrollbar-thumb:hover {
.ui.grid { .ui.grid {
margin-top: -0.5rem; margin-top: -0.5rem;
margin-bottom: -0.5rem; margin-bottom: -0.5rem;
margin-left: -0.5rem; margin-left: -0.5625rem;
margin-right: -0.5rem; margin-right: -0.5625rem;
} }
.ui.relaxed.grid { .ui.relaxed.grid {
@ -885,14 +885,14 @@ body .ui.inverted:not(.dimmer)::-webkit-scrollbar-thumb:hover {
position: relative; position: relative;
display: inline-block; display: inline-block;
width: 6.25%; width: 6.25%;
padding-left: 0.5rem; padding-left: 0.5625rem;
padding-right: 0.5rem; padding-right: 0.5625rem;
vertical-align: top; vertical-align: top;
} }
.ui.grid > * { .ui.grid > * {
padding-left: 0.5rem; padding-left: 0.5625rem;
padding-right: 0.5rem; padding-right: 0.5625rem;
} }
/*------------------- /*-------------------
@ -974,7 +974,7 @@ body .ui.inverted:not(.dimmer)::-webkit-scrollbar-thumb:hover {
-webkit-box-flex: 1; -webkit-box-flex: 1;
-ms-flex-positive: 1; -ms-flex-positive: 1;
flex-grow: 1; flex-grow: 1;
margin: 0.5rem 0.5rem; margin: 0.5rem 0.5625rem;
} }
.ui.grid .column + .ui.vertical.divider { .ui.grid .column + .ui.vertical.divider {
@ -2065,9 +2065,9 @@ body .ui.inverted:not(.dimmer)::-webkit-scrollbar-thumb:hover {
content: ""; content: "";
top: 0; top: 0;
left: 0; left: 0;
width: calc(100% - 1rem); width: calc(100% - 1.125rem);
height: 1px; height: 1px;
margin: 0 0.5rem; margin: 0 0.5625rem;
-webkit-box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15); box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15);
} }
@ -2880,7 +2880,7 @@ body .ui.inverted:not(.dimmer)::-webkit-scrollbar-thumb:hover {
margin: 0 0 !important; margin: 0 0 !important;
-webkit-box-shadow: none !important; -webkit-box-shadow: none !important;
box-shadow: none !important; box-shadow: none !important;
padding: 0.5rem 0.5rem; padding: 0.5rem 0.5625rem;
} }
.ui.stackable.grid:not(.vertically) > .row { .ui.stackable.grid:not(.vertically) > .row {
@ -2900,8 +2900,8 @@ body .ui.inverted:not(.dimmer)::-webkit-scrollbar-thumb:hover {
.ui.grid .ui.stackable.grid, .ui.grid .ui.stackable.grid,
.ui.segment:not(.vertical) .ui.stackable.page.grid { .ui.segment:not(.vertical) .ui.stackable.page.grid {
margin-left: -0.5rem !important; margin-left: -0.5625rem !important;
margin-right: -0.5rem !important; margin-right: -0.5625rem !important;
} }
/* Divided Stackable */ /* Divided Stackable */
@ -3093,18 +3093,18 @@ body .ui.inverted:not(.dimmer)::-webkit-scrollbar-thumb:hover {
-----------------*/ -----------------*/
.ui.ui.ui.compact.grid { .ui.ui.ui.compact.grid {
margin: -0.25rem; margin: -0.28125rem;
} }
.ui.ui.ui.compact.grid > .column:not(.row), .ui.ui.ui.compact.grid > .column:not(.row),
.ui.ui.ui.compact.grid > .row > .column { .ui.ui.ui.compact.grid > .row > .column {
padding-left: 0.25rem; padding-left: 0.28125rem;
padding-right: 0.25rem; padding-right: 0.28125rem;
} }
.ui.ui.ui.compact.grid > * { .ui.ui.ui.compact.grid > * {
padding-left: 0.25rem; padding-left: 0.28125rem;
padding-right: 0.25rem; padding-right: 0.28125rem;
} }
/* Row */ /* Row */
@ -3140,18 +3140,18 @@ body .ui.inverted:not(.dimmer)::-webkit-scrollbar-thumb:hover {
-----------------*/ -----------------*/
.ui.ui.ui[class*="very compact"].grid { .ui.ui.ui[class*="very compact"].grid {
margin: -0.125rem; margin: -0.140625rem;
} }
.ui.ui.ui[class*="very compact"].grid > .column:not(.row), .ui.ui.ui[class*="very compact"].grid > .column:not(.row),
.ui.ui.ui[class*="very compact"].grid > .row > .column { .ui.ui.ui[class*="very compact"].grid > .row > .column {
padding-left: 0.125rem; padding-left: 0.140625rem;
padding-right: 0.125rem; padding-right: 0.140625rem;
} }
.ui.ui.ui[class*="very compact"].grid > * { .ui.ui.ui[class*="very compact"].grid > * {
padding-left: 0.125rem; padding-left: 0.140625rem;
padding-right: 0.125rem; padding-right: 0.140625rem;
} }
/* Row */ /* Row */

2
semantic/dist/semantic.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
semantic/src/themes/default/collections/grid.variables
View file

@ -16,7 +16,7 @@
@minWidth: 320px; @minWidth: 320px;
@gutterWidth: 1rem; @gutterWidth: 1.125rem; /** 1rem + 2px card shadow */
@rowSpacing: 1rem; @rowSpacing: 1rem;
@tableWidth: e(%("calc(100%% + %d)", @gutterWidth)); @tableWidth: e(%("calc(100%% + %d)", @gutterWidth));