root/regexper-static
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Updating Header styles to allow right-hand items to reflow

Browse Source
This commit is contained in:
Jeff Avallone 2018-05-31 19:07:11 -04:00
parent efc8f6744a
commit 2fc961725a
1 changed files with 6 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/Header/style.css
View File

@ -1,6 +1,8 @@
@import url('../../globals.css'); @import url('../../globals.css');
.header { .header {
display: flex;
align-items: center;
background: var(--color-green) var(--gradient-green); background: var(--color-green) var(--gradient-green);
box-shadow: 0 0 1rem color(var(--color-black) alpha(0.7)); box-shadow: 0 0 1rem color(var(--color-black) alpha(0.7));
padding: 0 var(--content-margin); padding: 0 var(--content-margin);
@ -25,6 +27,7 @@
} }
& h1 { & h1 {
flex-grow: 1;
font-family: 'Bangers', 'cursive'; font-family: 'Bangers', 'cursive';
font-size: 4rem; font-size: 4rem;
font-weight: normal; font-weight: normal;
@ -41,13 +44,12 @@
& ul { & ul {
@apply --inline-list; @apply --inline-list;
line-height: var(--header-height); text-align: right;
position: absolute;
top: 0;
right: var(--content-margin);
} }
& li { & li {
margin-left: 1em;
& a:hover, & a:hover,
& a:active { & a:active {
text-decoration: underline; text-decoration: underline;