Commit bed4ccb5 authored by Benthe Kuijpers's avatar Benthe Kuijpers
Browse files

items-row changes (font size, img crop, bg options)

parent 02efc5fe
......@@ -567,6 +567,27 @@
"return_format": "array"
}
]
},
{
"key": "field_604f97c2a3f8d",
"label": "Background",
"name": "background",
"type": "clone",
"instructions": "",
"required": 0,
"conditional_logic": 0,
"wrapper": {
"width": "",
"class": "",
"id": ""
},
"clone": [
"field_6040ff3b377be"
],
"display": "seamless",
"layout": "block",
"prefix_label": 0,
"prefix_name": 0
}
],
"min": "",
......@@ -595,5 +616,5 @@
"hide_on_screen": "",
"active": true,
"description": "",
"modified": 1615403207
"modified": 1615828951
}
\ No newline at end of file
......@@ -37,7 +37,7 @@ body {
h1 {
margin: 0;
@include colouredBar($red, $bg-yellow);
@include colouredBar($blue, $bg-yellow);
text-shadow: -3px 3px #FFF, 3px 3px #FFF;
.descender:after {
......
......@@ -15,19 +15,17 @@
.img {
width: 100%;
height: 0;
padding-bottom: 100%;
position: relative;
img {
width: 100%;
&--contain img {
object-position: center center;
}
&--cover {
height: 0;
padding-bottom: 100%;
position: relative;
img {
position: absolute;
}
img {
position: absolute;
width: 100%;
}
}
......@@ -53,17 +51,11 @@
.img {
@media only screen and (min-width: $medium) {
width: 250px;
&--cover {
height: 250px;
}
height: 250px;
}
@media only screen and (min-width: $large) {
width: 320px;
&--cover {
height: 320px;
}
height: 320px;
}
}
}
......@@ -76,16 +68,21 @@
.img {
margin-bottom: 20px;
width: 160px;
height: 160px;
overflow: hidden;
&--cover {
height: 160px;
overflow: hidden;
img {
width: 100%;
height: 100%;
}
img {
width: 100%;
height: 100%;
object-fit: cover;
}
&--cover img {
object-fit: cover;
}
&--contain img {
object-fit: contain;
object-position: top center;
}
}
......@@ -105,4 +102,11 @@
}
}
}
// If there are more than 3 items; smaller header font size
&--max, {
.item h3 {
font-size: 28px;
}
}
}
\ No newline at end of file
<?php
$layout = get_sub_field('layout');
$background = get_sub_field('background');
$total_items = count(get_sub_field('items'));
$amount = ($total_items > 3) ? 'max' : 'min';
?>
<div class="content-row items-row items-row--<?php echo $layout; ?>">
<div class="content-row items-row items-row--<?php echo $layout; ?> content-row--<?php echo $background; ?> items-row--<?php echo $amount; ?>">
<div class="container">
<h3><?php the_sub_field('title'); ?></h3>
<?php
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment