pk/atst
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

remove/reorganize some css

Browse Source
This commit is contained in:
Andrew Croce 2018-07-20 08:24:54 -04:00
parent 6ebbdfc64d
commit ccef45b78c
5 changed files with 55 additions and 117 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
scss/components/_layout.scss Normal file
View File

@ -0,0 +1,31 @@
body {
background-color: $color-gray-lightest;
display: flex;
flex-direction: column;
justify-content: flex-start;
min-height: 100vh;
> footer {
margin-top: auto;
}
}
.global-layout {
display: flex;
flex-wrap: nowrap;
flex-grow: 1;
.global-navigation {
margin-top: -1px;
}
.global-panel-container {
margin: $gap;
max-width: $site-max-width;
overflow: auto;
@include media($medium-screen) {
margin: $gap * 2;
}
}
}

16
scss/core/_base.scss
View File

@ -1,16 +0,0 @@
/*
* Base Styles
* @source https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_base.scss
*/
body {
background-color: $color-gray-lightest;
display: flex;
flex-direction: column;
justify-content: flex-start;
min-height: 100vh;
> footer {
margin-top: auto;
}
}

68
scss/sections/_sidenav.scss → scss/elements/_sidenav.scss
View File

@ -1,15 +1,13 @@
.sidenav {
@include grid-pad;
@include panel-margin;
width: 100%;
flex-shrink: 0;
ul {
list-style: none;
margin: 0;
padding: 0;
@include media($large-screen) {
width: 21rem;
}
@include media($xlarge-screen) {
width: 30rem;
li {
margin: 0;
display: block;
}
}
.sidenav__link {
@ -18,10 +16,10 @@
padding: $gap ($gap * 2);
color: $color-black;
text-decoration: none;
white-space: nowrap;
&:hover {
background-color: $color-white;
color: $color-primary;
.sidenav__link-icon {
margin-left: - ($gap * .5);
}
&.sidenav__link--disabled {
@ -35,60 +33,42 @@
color: $color-primary;
box-shadow: inset .4rem 0 0 0 $color-primary;
.sidenav__link-icon {
@include icon-style-active;
}
+ ul {
background-color: $color-white;
.sidenav__link {
&--active {
@include h5;
box-shadow: none;
color: $color-primary;
}
}
}
}
+ ul {
padding-bottom: $gap / 2;
li {
.sidenav__link {
@include h5;
padding: ($gap * .75) ($gap * 3);
border: 0;
@include h5;
font-weight: normal;
}
&:last-child {
.sidenav__link {
padding-bottom: $gap * 1.5;
}
}
}
}
}
ul {
list-style: none;
margin: 0;
padding: 0;
&:hover {
color: $color-primary;
li {
margin: 0;
display: block;
}
}
> ul {
@include panel-margin;
&:last-child {
margin: 0;
}
> li {
&:last-child {
> .sidenav__link {
border-bottom: 1px solid $color-black;
}
.sidenav__link-icon {
@include icon-style-active;
}
}
}
}

3
scss/sections/_main.scss
View File

@ -1,3 +0,0 @@
section {
margin-bottom: 10rem;
}

54
scss/sections/_topbar.scss
View File

@ -1,54 +0,0 @@
.topbar {
background-color: $color-white;
height: $topbar-height;
border-bottom: 1px solid $color-black;
.topbar__navigation {
display: flex;
flex-direction: row;
align-items: stretch;
justify-content: flex-end;
> .topbar__link {
@include h5;
color: $color-primary;
display: inline-block;
height: $topbar-height;
line-height: $topbar-height;
padding: 0 ($gap * 2);
text-decoration: none;
> span {
display: inline-block;
height: $topbar-height;
line-height: $topbar-height;
}
&.topbar__link--primary {
margin-right: auto;
> span {
@include nav-border;
}
&:hover {
color: $color-white;
background-color: $color-primary-darkest;
}
}
&.topbar__link--secondary {
font-weight: normal;
> span {
@include nav-border;
border-bottom-width: 0;
}
&:hover {
> span {
@include nav-border;
}
}
}
}
}
}