arbetsformedlingen/mina-sidor-fa-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added some digi-core components and removed some old/unused css

Browse Source
This commit is contained in:
Erik Tiekstra
2021-03-23 15:47:53 +01:00
committed by Erik Tiekstra
parent 507a61a2ef
commit f7537671f3
49 changed files with 106 additions and 561 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
apps/dafa-web/src/app/components/navigation/navigation.component.scss
View File

@@ -1,21 +1,19 @@
@import 'mixins/list';
@import 'variables/breakpoints';
@import 'variables/colors';
@import 'variables/gutters';
@import 'variables/typography';
@import 'variables/navigation';
.navigation {
background-color: $af__color-primary;
border-bottom: 1px solid $af__color-background-dark-gray;
background-color: var(--digi--ui--color--background--profile);
border-bottom: 1px solid var(--digi--ui--color--background--off);
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 $af__gutter-m;
padding: 0 var(--digi--layout--gutter);
height: $dafa__navigation-height;
@media (min-width: $af__breakpoint-m) {
@media (min-width: $digi--layout--breakpoint--m) {
height: $dafa__navigation-height-large;
}
@@ -29,7 +27,7 @@
height: $dafa__navigation-height / 2.5;
vertical-align: middle;
@media (min-width: $af__breakpoint-m) {
@media (min-width: $digi--layout--breakpoint--m) {
height: $dafa__navigation-height-large / 2.5;
}
}
@@ -43,10 +41,10 @@
&__item {
display: flex;
align-items: center;
border-left: 1px solid $af__color-background-dark-gray;
border-left: 1px solid var(--digi--ui--color--background--off);
&--no-link {
padding: 0 $af__gutter-m;
padding: 0 var(--digi--layout--gutter);
flex-direction: column;
}
@@ -55,7 +53,7 @@
}
&:last-child {
border-right: 1px solid $af__color-background-dark-gray;
border-right: 1px solid var(--digi--ui--color--background--off);
}
}
@@ -66,17 +64,17 @@
flex-direction: column;
align-items: center;
justify-content: center;
font-size: $af__font-size-xs;
color: $af__color-text-light;
font-size: --digi--typography--font-size--xs;
color: var(--digi--typography--color--text--light);
width: 7rem;
height: 100%;
font-weight: $af__font-weight-normal;
font-weight: var(--digi--typography--font-weight);
text-decoration: none;
}
&__link {
&:hover {
background-color: $af__color-interactive;
background-color: $digi--ui--color--primary-light;
}
&--active {
@@ -87,12 +85,12 @@
bottom: 0;
left: 0;
height: 5px;
background-color: $af__color-secondary;
background-color: $digi--ui--color--secondary;
}
}
}
&__text {
margin-top: $af__gutter-xs;
margin-top: var(--digi--layout--gutter--xs);
}
}