hangar-tech/biofriction-wp-theme
hangar-tech
/
biofriction-wp-theme
3
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

gallery in home page for media queries

This commit is contained in:
jorge 2021-10-26 13:28:24 +02:00
parent c5ffdd0723
commit 8d4ca91ebe
4 changed files with 80 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
biofriction-theme/dist/assets/css/app.css vendored
View File

File diff suppressed because one or more lines are too long

10
biofriction-theme/src/assets/scss/components/_tags.scss
View File

@ -1,9 +1,9 @@
.bfr_category_tags { .bfr_category_tags {
font-family: $header-font-family; font-family: $header-font-family;
position: relative; // position: relative;
top:-1rem; // top:-1rem;
text-align: center; // text-align: center;
z-index: 100; // z-index: 100;
.tag-cloud-link::before { .tag-cloud-link::before {
content: '#'; content: '#';
// display: inline-block; // display: inline-block;
@ -28,5 +28,3 @@
display:block; display:block;
} }
} }

18
biofriction-theme/src/assets/scss/modules/_header.scss
View File

@ -18,16 +18,14 @@
background-image: url('../images/biofriction-logo-moving-trans-loosy-100.gif'); background-image: url('../images/biofriction-logo-moving-trans-loosy-100.gif');
} }
.bfr_category_tags { // .bfr_category_tags {
// display:flex; // max-width: calc(66vw - 4rem);
// justify-content:center; // margin: 0 auto;
max-width: calc(66vw - 4rem); // a {
margin: 0 auto; // display:inline-block;
a { // margin-bottom: auto;
display:inline-block; // }
margin-bottom: auto; // }
}
}
} }
} }
} }

83
biofriction-theme/src/assets/scss/templates/_bfrtemplates.scss
View File

@ -166,47 +166,92 @@ $grid-column-width:$grid-row-width/$grid-column-count;
.bfr_category_title{ .bfr_category_title{
display:none; display:none;
} }
// homepage 2021 // homepage 2021
.homepage-2021 { //&.main-container .homepage-2021 { //&.main-container
@include breakpoint(small) {
.entry-content { .entry-content {
display:flex;
flex-flow: row;
flex-wrap: wrap;
position: relative; position: relative;
& > * { & > * {
flex-basis: 51%; float:left;
clear:both;
margin-left: $global-margin;
} }
} }
.fp-gallery { .fp-gallery {
flex-basis: 45%;
max-width: 45%;
margin-left: auto;
position:absolute; position:absolute;
top:0; top:0;
right: $global-margin; right: 0;
// .fp-gallery-item {
// }
// .fp-gallery-icon {
// }
img {
object-fit: cover;
object-position: center;
border-radius: $button-radius;
} }
}
@include breakpoint(small) {
$homepage2021-gallery-square-side: $global-margin*8;
$homepage2021-gallery-square-size: $homepage2021-gallery-square-side+$global-margin;
.entry-content {
min-height: $homepage2021-gallery-square-size*14;
& > * {
max-width: 55%;
}
}
.fp-gallery {
max-width: 40%;
.fp-gallery-item { .fp-gallery-item {
display:flex; width: $homepage2021-gallery-square-side;
align-items: center; }
width: 100%; // .fp-gallery-icon {
// }
img {
height: $homepage2021-gallery-square-side;
}
} }
} }
@include breakpoint(medium) { @include breakpoint(medium) {
.fp-gallery { $homepage2021-gallery-square-side: $global-margin*8;
max-height: 90vw; $homepage2021-gallery-square-size: $homepage2021-gallery-square-side+$global-margin;
overflow: hidden; .entry-content {
min-height: $homepage2021-gallery-square-size*7;
& > * {
max-width: 48%;
} }
}
.fp-gallery {
max-width: 45%;
.fp-gallery-item { .fp-gallery-item {
width:40%; width: $homepage2021-gallery-square-side;
}
// .fp-gallery-icon {
// }
img {
height: $homepage2021-gallery-square-side;
}
} }
} }
@include breakpoint(xlarge) { @include breakpoint(xlarge) {
.fp-gallery { $homepage2021-gallery-square-side: $global-margin*9;
$homepage2021-gallery-square-size: $homepage2021-gallery-square-side+$global-margin;
.entry-content {
min-height: $homepage2021-gallery-square-size*6;
& > * {
max-width: 48%;
} }
}
.fp-gallery {
max-width: 45%;
.fp-gallery-item { .fp-gallery-item {
width:26%; width: $homepage2021-gallery-square-side;
}
// .fp-gallery-icon {
// }
img {
height: $homepage2021-gallery-square-side;
}
} }
} }
} }