add background & gradient border to side panel

This commit is contained in:
Jesse D. McDonald 2020-05-10 17:29:06 -05:00
parent 5f94e931a0
commit 0f3313902c
1 changed files with 15 additions and 7 deletions

View File

@ -27,10 +27,6 @@ body > #page {
flex-flow: row nowrap; flex-flow: row nowrap;
} }
#page.horizontal-layout #board_ui {
border-left: 1px solid black;
}
#board_ui { #board_ui {
display: flex; display: flex;
flex-flow: column nowrap; flex-flow: column nowrap;
@ -38,6 +34,19 @@ body > #page {
align-items: center; align-items: center;
width: 100%; width: 100%;
height: 100%; height: 100%;
background-color: #FFFFF0;
}
#page.horizontal-layout #board_ui {
border-left: 10px solid #C4B28F;
border-image:
linear-gradient(
to right,
#C4B28F,
#F5DEB3 15%,
#C4B28F 45%,
#FFFFF0 80%,
#C4B28F) 1 100%;
} }
#header { #header {
@ -159,7 +168,7 @@ button#settings, button#cb_choose_game {
height: 1.5em; height: 1.5em;
left: 0; left: 0;
bottom: 0.5rem; bottom: 0.5rem;
background: linear-gradient(rgba(255,255,255,0), white); background: linear-gradient(rgba(255,255,240,0),rgba(255,255,240,1));
pointer-events: none; pointer-events: none;
} }
@ -214,6 +223,7 @@ button#settings, button#cb_choose_game {
justify-content: stretch; justify-content: stretch;
align-items: baseline; align-items: baseline;
width: 100%; width: 100%;
z-index: 1;
} }
#cb_names::before { #cb_names::before {
@ -227,7 +237,6 @@ button#settings, button#cb_choose_game {
left: 0.5rem; left: 0.5rem;
width: 3rem; width: 3rem;
height: 3rem; height: 3rem;
z-index: -1;
} }
#cb_names::after { #cb_names::after {
@ -241,7 +250,6 @@ button#settings, button#cb_choose_game {
right: 0.5rem; right: 0.5rem;
width: 3rem; width: 3rem;
height: 3rem; height: 3rem;
z-index: -1;
} }
#cb_names .cb-names-vs { #cb_names .cb-names-vs {