Hooked up bg e css hovers.

This commit is contained in:
kor 2018-07-18 22:12:02 +12:00
parent 1ca0582cf8
commit 8ddf1852be

17
asset/style.css vendored
View File

@ -67,6 +67,9 @@ body {
left: 0px; left: 0px;
top: 0px; top: 0px;
} }
.menu:hover {
background: var(--color-menu-bg-e);
}
.menu a { .menu a {
color: var(--color-menu-item-i); color: var(--color-menu-item-i);
} }
@ -84,8 +87,8 @@ body {
/* MENU ITEMS */ /* MENU ITEMS */
.menu-item { .menu-item {
padding-top: calc(var(--menu-item-vert-sep) / 2);
padding-bottom: calc(var(--menu-item-vert-sep) / 2); padding-bottom: calc(var(--menu-item-vert-sep) / 2);
padding-top: calc(var(--menu-item-vert-sep) / 2);
font-size: var(--type-icon-size); font-size: var(--type-icon-size);
box-sizing: border-box; box-sizing: border-box;
margin: 0px auto; margin: 0px auto;
@ -147,8 +150,12 @@ body {
/* CONTENT */ /* CONTENT */
.container { .container {
background: var(--color-main-bg-i);
margin-left: var(--menu-width); margin-left: var(--menu-width);
} }
.container:hover {
background: var(--color-main-bg-e);
}
.grid { .grid {
margin: var(--size-gutter) auto; margin: var(--size-gutter) auto;
} }
@ -160,8 +167,8 @@ body {
} }
.grid-item, .grid-item--width2 { .grid-item, .grid-item--width2 {
border-radius: var(--size-item-corner); border-radius: var(--size-item-corner);
margin-bottom: var(--size-gutter);
background: var(--color-content-bg-i); background: var(--color-content-bg-i);
margin-bottom: var(--size-gutter);
width: var(--size-grid-column); width: var(--size-grid-column);
padding: var(--size-gutter); padding: var(--size-gutter);
box-sizing: border-box; box-sizing: border-box;
@ -225,11 +232,11 @@ body {
/* TYPE */ /* TYPE */
.grid-item a .type { .grid-item a .type {
width: calc(var(--type-icon-size)*2 + var(--size-gutter));
color: var(--color-content-item-s); color: var(--color-content-item-s);
padding-bottom: var(--size-gutter);
font-size: var(--type-icon-size); font-size: var(--type-icon-size);
padding-top: var(--size-gutter); padding-top: var(--size-gutter);
padding-bottom: var(--size-gutter);
width: calc(var(--type-icon-size)*2 + var(--size-gutter));
vertical-align: top; vertical-align: top;
text-align: center; text-align: center;
position: absolute; position: absolute;
@ -273,8 +280,8 @@ body {
/* SMALL ICONS */ /* SMALL ICONS */
.textIcon { .textIcon {
color: var(--color-content-item-s);
margin-right: var(--size-item-elem-sep); margin-right: var(--size-item-elem-sep);
color: var(--color-content-item-s);
} }
.grid-item:hover .textIcon { .grid-item:hover .textIcon {
color: var(--color-content-item-i); color: var(--color-content-item-i);