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

add items rows

parent 89c8bfec
......@@ -416,6 +416,177 @@
],
"min": "",
"max": ""
},
"layout_604644034a14d": {
"key": "layout_604644034a14d",
"name": "items",
"label": "Items",
"display": "block",
"sub_fields": [
{
"key": "field_604644134a14e",
"label": "Title",
"name": "title",
"type": "text",
"instructions": "",
"required": 0,
"conditional_logic": 0,
"wrapper": {
"width": "50",
"class": "",
"id": ""
},
"default_value": "",
"placeholder": "",
"prepend": "",
"append": "",
"maxlength": ""
},
{
"key": "field_60464572bf98a",
"label": "Layout",
"name": "layout",
"type": "radio",
"instructions": "",
"required": 0,
"conditional_logic": 0,
"wrapper": {
"width": "50",
"class": "",
"id": ""
},
"choices": {
"columns": "Columns",
"rows": "Rows"
},
"allow_null": 0,
"other_choice": 0,
"default_value": "",
"layout": "horizontal",
"return_format": "value",
"save_other_choice": 0
},
{
"key": "field_604644194a14f",
"label": "Items",
"name": "items",
"type": "repeater",
"instructions": "",
"required": 0,
"conditional_logic": 0,
"wrapper": {
"width": "",
"class": "",
"id": ""
},
"collapsed": "field_6046441e4a150",
"min": 1,
"max": 0,
"layout": "block",
"button_label": "Add item",
"sub_fields": [
{
"key": "field_604644234a151",
"label": "Image",
"name": "img",
"type": "image",
"instructions": "",
"required": 0,
"conditional_logic": 0,
"wrapper": {
"width": "50",
"class": "",
"id": ""
},
"return_format": "id",
"preview_size": "thumbnail",
"library": "all",
"min_width": "",
"min_height": "",
"min_size": "",
"max_width": "",
"max_height": "",
"max_size": "",
"mime_types": ""
},
{
"key": "field_6046441e4a150",
"label": "Title",
"name": "title",
"type": "text",
"instructions": "",
"required": 0,
"conditional_logic": 0,
"wrapper": {
"width": "50",
"class": "",
"id": ""
},
"default_value": "",
"placeholder": "",
"prepend": "",
"append": "",
"maxlength": ""
},
{
"key": "field_604644604a154",
"label": "Description",
"name": "description",
"type": "wysiwyg",
"instructions": "",
"required": 0,
"conditional_logic": 0,
"wrapper": {
"width": "",
"class": "",
"id": ""
},
"default_value": "",
"tabs": "all",
"toolbar": "basic",
"media_upload": 0,
"delay": 0
},
{
"key": "field_604644414a152",
"label": "Text link (text)",
"name": "text_link",
"type": "text",
"instructions": "",
"required": 0,
"conditional_logic": 0,
"wrapper": {
"width": "50",
"class": "",
"id": ""
},
"default_value": "",
"placeholder": "",
"prepend": "",
"append": "",
"maxlength": ""
},
{
"key": "field_604644564a153",
"label": "Tekst link (URL)",
"name": "text_link_url",
"type": "url",
"instructions": "",
"required": 0,
"conditional_logic": 0,
"wrapper": {
"width": "50",
"class": "",
"id": ""
},
"default_value": "",
"placeholder": ""
}
]
}
],
"min": "",
"max": ""
}
},
"button_label": "+ Add Row",
......@@ -440,5 +611,5 @@
"hide_on_screen": "",
"active": true,
"description": "",
"modified": 1615216753
"modified": 1615218150
}
\ No newline at end of file
......@@ -47,6 +47,15 @@ a.btn, .btn, .text-link {
}
}
&--external {
&:after {
content: "\2197";
}
&:hover:after {
transform: translate(2px, -2px);
}
}
&--red {
background: $red;
@include colourBg($bg-yellow, 0deg);
......
......@@ -53,5 +53,9 @@
line-height: 32px;
}
}
&.text-link {
padding: 0 0 0 5px;
}
}
}
\ No newline at end of file
.content-row {
padding: 60px 0;
border-bottom: 1px solid #EEE;
@media only screen and (min-width: $large) {
padding: 120px 0;
......
......@@ -14,6 +14,29 @@
}
}
&--medium {
margin: 0 -15px 50px;
@media only screen and (min-width: $smallmedium) {
margin: 0 -30px;
}
>* {
flex: 0 0 calc(100% - 30px);
margin: 15px;
@media only screen and (min-width: $smallmedium) {
flex: 0 0 calc(50% - 60px);
margin: 30px;
}
@media only screen and (min-width: $medium) {
flex: 0 0 calc(33.3% - 60px);
margin: 30px;
}
}
}
&--large {
margin: 0 -15px 50px;
......
.items-row {
.grid {
display: block;
}
&--columns {
.grid {
@media only screen and (min-width: $large) {
display: flex;
.item {
display: block;
margin-bottom: auto;
img {
width: 100%;
}
&__content {
margin: 0;
}
}
}
}
.container>h3 {
@media only screen and (min-width: $medium) {
text-align: center;
}
}
}
&--rows {
.grid {
display: block;
.item {
img {
@media only screen and (min-width: $medium) {
width: 250px;
}
@media only screen and (min-width: $large) {
width: 320px;
}
}
}
}
}
.item {
margin-bottom: 100px;
img {
margin-bottom: 20px;
width: 160px;
}
h3 {
font-weight: bold;
margin: 0 0 40px;
}
@media only screen and (min-width: $smallmedium) {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
&__content {
flex: 1;
margin-left: 30px;
}
}
}
}
\ No newline at end of file
@import "content-row";
@import "grid";
@import "items";
@import "pinned-content";
@import "list";
\ No newline at end of file
......@@ -10,6 +10,7 @@ if ( ! function_exists( 'makeitopen_setup' ) ) :
add_theme_support( 'title-tag' );
add_theme_support( 'post-thumbnails' );
add_image_size( 'medium-thumb', 600, 400, true );
add_image_size( 'medium-square', 500, 500, true );
add_theme_support('html5', array('search-form', 'gallery', 'caption', 'style' ) );
......
<?php
$layout = get_sub_field('layout');
?>
<div class="content-row items-row items-row--<?php echo $layout; ?>">
<div class="container">
<h3><?php the_sub_field('title'); ?></h3>
<?php
if (have_rows('items')) : ?>
<div class="grid grid--medium">
<?php while (have_rows('items')) : the_row(); ?>
<div class="item">
<?php
$image = get_sub_field('img');
if( $image ) {
echo wp_get_attachment_image( $image, 'medium-square' );
} ?>
<div class="item__content">
<h3><?php the_sub_field('title'); ?></h3>
<?php the_sub_field('description');
$link = get_sub_field('text_link');
$url = get_sub_field('text_link_url');
if ($link && $url) {
echo '<a href="' . $url . '" target="_blank" class="text-link text-link--external">' . $link . '</a>';
} ?>
</div>
</div>
<?php endwhile; ?>
</div>
<?php endif; ?>
</div>
</div>
\ No newline at end of file
......@@ -13,9 +13,9 @@ if ($type === 'manual') {
<div class="content-row">
<div class="container">
<h2>latest news</h2>
<h3>latest news</h3>
<div class="grid">
<div class="grid grid--medium">
<?php foreach ($news_items as $news) {
$news_id = ($type === 'manual') ? $news : $news->ID;
$news_post = get_post($news_id);
......
......@@ -37,13 +37,9 @@
<?php
$resource_items = get_sub_field('resources');
$filters = get_terms( array(
'taxonomy' => 'resource-types',
'hide_empty' => true,
) );
foreach ($resource_items as $resource) {
$resource_post = get_post($resource);
$resource_filters = get_the_terms($resource_post, 'resource-types' );
include(locate_template('template-parts/elements/resource-teaser.php'));
} ?>
<a href="<?php echo get_post_type_archive_link('resources'); ?>" class="text-link"><?php _e('see all resources', 'makeitopen'); ?></a>
......
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