arcHIVE-tech/arc-hive-HTML-template
arcHIVE-tech
/
arc-hive-HTML-template
4
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

aligned top menu and footer for smaller and medium devices

This commit is contained in:
jorge 2021-07-06 11:38:06 +02:00
parent 9b578134a8
commit c4bfadae9b
4 changed files with 28 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/assets/scss/global/_branding.scss
View File

@ -24,8 +24,6 @@
}
&.eu{
&::before {
max-width: 15rem;
// background-image: url('../img/eu_flag_creative_europe_co_funded_black_right.svg');
background-image: url('../img/eu_flag_creative_europe_co_funded_left.svg');
}
}

6
src/assets/scss/modules/_content.scss
View File

@ -163,12 +163,13 @@ main {
main {
@include xy-grid;
article{
// text-align:center;
@include card-container();
@include breakpoint(small){
@include xy-cell();
font-size: $global-font-size*0.7;
}
@include breakpoint(medium){
font-size: $global-font-size*1;
}
@include breakpoint(large){
}
@ -249,11 +250,12 @@ main {
@include xy-grid();
.slide {
@include xy-grid;
justify-content: center;
@include breakpoint(small){
width: 100vw;
margin: 0;
padding: $global-padding * 3;
.textwidget {
padding: $global-padding * 3;
}
}
@include breakpoint(medium){

17
src/assets/scss/modules/_footer.scss
View File

@ -31,9 +31,19 @@ footer {
}
&.eu {
&::before {
margin-top:unset;
max-width:100%;
max-height: 4rem;
@include breakpoint(small) {
// background-image: url('../img/eu_flag_creative_europe_co_funded_black_right.svg');
background-position-x: right;
max-width: 50vw;
margin-top:unset;
}
@include breakpoint(medium) {
background-position-x: left;
margin-top:unset;
max-width:100%;
max-height: 4rem;
}
}
}
}
@ -76,4 +86,3 @@ footer {
}
}
}

16
src/assets/scss/modules/_header.scss
View File

@ -10,14 +10,14 @@
min-width: 14rem;
text-align: center;
}
@include breakpoint(medium){
@include breakpoint(large){
@include xy-cell(shrink);
@include flex-align(left, middle);
text-align: unset;
}
}
nav {
@include breakpoint(small){
@include breakpoint(small) {
@include xy-cell(12);
@include flex;
@include flex-align(center, middle);
@ -32,17 +32,23 @@
padding: 0;
font-size: 0.8rem;
}
.menu a {
padding: $global-padding*0.7 $global-padding*0.5;
}
}
@include breakpoint(medium){
@include breakpoint(medium) {
menu {
font-size: $global-font-size*1.5;
}
}
@include breakpoint(large) {
@include xy-cell(auto);
@include flex;
@include flex-align(right, middle);
menu {
margin: inherit;
padding: inherit;
font-size: $global-font-size*1.5;
}
}
}
}