work.php
2.93 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
<?php
/**
* Work Block Template.
*
* @param array $block The block settings and attributes.
* @param string $content The block inner HTML (empty).
* @param bool $is_preview True during AJAX preview.
* @param (int|string) $post_id The post ID this block is saved to.
*/
?>
<?php if( have_rows('work') ): ?>
<?php $rowCount = count( get_field('work') ); //GET THE COUNT ?>
<?php $i = 1; ?>
<div class="tiles">
<?php while( the_repeater_field('work') ): ?>
<div class="tile <?php if($i == $rowCount): ?> last <?php endif; ?>">
<div class="tile_image" style="background-image:url(<?php the_sub_field('background_image'); ?>);">
<div class="hover_content">
<?php the_sub_field('hover_text'); ?>
</div>
<div class="tile_content">
<div class="title-mobile">
<h3> <?php the_sub_field('content_title'); ?> </h3>
</div>
<div class="image">
<?php $image = get_sub_field('content_image'); ?>
<img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" />
</div>
<div class="text">
<div>
<h3><?php the_sub_field('content_title'); ?> </h3>
<?php the_sub_field('content'); ?>
</div>
<a class="whole-story" href="#">Get the whole story… </a>
</div>
</div>
</div>
<div class="tile_content mobile">
<div class="title-mobile">
<h3> <?php the_sub_field('content_title'); ?> </h3>
</div>
<div class="image">
<?php $image = get_sub_field('content_image'); ?>
<img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" />
</div>
<div class="text">
<div>
<h3><?php the_sub_field('content_title'); ?> </h3>
<?php the_sub_field('content'); ?>
</div>
<a class="whole-story" href="#">Get the whole story… </a>
</div>
</div>
</div>
<?php $i++; ?>
<?php endwhile; ?>
<br clear="both">
</div>
<?php endif; ?>
<!--
<div class="tiles">
<div class="tile"><span>1</span></div>
<div class="tile"><span>2</span></div>
<div class="tile"><span>3</span></div>
<div class="tile"><span>4</span></div>
<div class="tile"><span>5</span></div>
<div class="tile last"><span>6</span></div>
</div> -->