heading-paragraph-four-columns.php 6.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125
  1. <?php
  2. /**
  3. * Title: Heading, Paragraph, and Four Columns
  4. * Slug: exmoor/heading-paragraph-four-columns
  5. * Categories: featured
  6. */
  7. declare( strict_types = 1 );
  8. ?>
  9. <!-- wp:group {"align":"full","style":{"spacing":{"margin":{"top":"0","bottom":"0"},"padding":{"top":"8vw","bottom":"8vw","right":"var:preset|spacing|60","left":"var:preset|spacing|60"}}},"backgroundColor":"secondary","layout":{"type":"constrained"}} -->
  10. <div class="wp-block-group alignfull has-secondary-background-color has-background" style="margin-top:0;margin-bottom:0;padding-top:8vw;padding-right:var(--wp--preset--spacing--60);padding-bottom:8vw;padding-left:var(--wp--preset--spacing--60)">
  11. <!-- wp:group {"align":"wide","layout":{"type":"constrained","justifyContent":"left"}} -->
  12. <div class="wp-block-group alignwide">
  13. <!-- wp:heading {"textAlign":"left","style":{"typography":{"textTransform":"uppercase","fontStyle":"normal","fontWeight":"900","lineHeight":"0.9"}},"fontSize":"xxx-large"} -->
  14. <h2 class="wp-block-heading has-text-align-left has-xxx-large-font-size" style="font-style:normal;font-weight:900;line-height:0.9;text-transform:uppercase"><?php echo wp_kses_post( __( 'Upcoming<br>Tours', 'exmoor' ) ); ?></h2>
  15. <!-- /wp:heading -->
  16. <!-- wp:paragraph {"style":{"spacing":{"margin":{"top":"var:preset|spacing|40"}}}} -->
  17. <p style="margin-top:var(--wp--preset--spacing--40)"><?php echo esc_html__( 'Embark on a journey of discovery with us, where every destination is a new door to a diverse world of people, cultures, traditions, and landscapes.', 'exmoor' ); ?></p>
  18. <!-- /wp:paragraph -->
  19. </div>
  20. <!-- /wp:group -->
  21. <!-- wp:columns {"align":"wide"} -->
  22. <div class="wp-block-columns alignwide">
  23. <!-- wp:column {"style":{"spacing":{"blockGap":"var:preset|spacing|40"}}} -->
  24. <div class="wp-block-column">
  25. <!-- wp:image {"id":3549,"sizeSlug":"large","linkDestination":"none"} -->
  26. <figure class="wp-block-image size-large"><img src="<?php echo esc_url( get_stylesheet_directory_uri() ); ?>/assets/images/StockSnap_RUKEU2R518-768x1024.jpg" alt="" class="wp-image-3549"/></figure>
  27. <!-- /wp:image -->
  28. <!-- wp:group {"style":{"spacing":{"blockGap":"0"}},"layout":{"type":"constrained"}} -->
  29. <div class="wp-block-group">
  30. <!-- wp:heading {"level":3} -->
  31. <h3 class="wp-block-heading"><?php echo esc_html__( 'Muscat', 'exmoor' ); ?></h3>
  32. <!-- /wp:heading -->
  33. <!-- wp:paragraph -->
  34. <p><?php echo esc_html__( 'Thu 25 Sep – Tue, 30 Sep', 'exmoor' ); ?></p>
  35. <!-- /wp:paragraph -->
  36. </div>
  37. <!-- /wp:group -->
  38. <!-- wp:paragraph {"style":{"elements":{"link":{"color":{"text":"var:preset|color|contrast"},":hover":{"color":{"text":"var:preset|color|primary"}}}}},"fontSize":"small"} -->
  39. <p class="has-link-color has-small-font-size" style="font-style:italic;font-weight:400"><a href="#"><?php echo esc_html__( 'Full Details', 'exmoor' ); ?></a>→</p>
  40. <!-- /wp:paragraph -->
  41. </div>
  42. <!-- /wp:column -->
  43. <!-- wp:column {"style":{"spacing":{"blockGap":"var:preset|spacing|40"}}} -->
  44. <div class="wp-block-column">
  45. <!-- wp:image {"id":3563,"sizeSlug":"large","linkDestination":"none"} -->
  46. <figure class="wp-block-image size-large"><img src="<?php echo esc_url( get_stylesheet_directory_uri() ); ?>/assets/images/sea-water-nature-ocean-sky-sport-682791-pxhere.com_-768x1024.jpg" alt="" class="wp-image-3563"/></figure>
  47. <!-- /wp:image -->
  48. <!-- wp:group {"style":{"spacing":{"blockGap":"0"}},"layout":{"type":"constrained"}} -->
  49. <div class="wp-block-group">
  50. <!-- wp:heading {"level":3} -->
  51. <h3 class="wp-block-heading"><?php echo esc_html__( 'The French Riviera', 'exmoor' ); ?></h3>
  52. <!-- /wp:heading -->
  53. <!-- wp:paragraph -->
  54. <p><?php echo esc_html__( 'Thu 25 June – Tue, 30 June', 'exmoor' ); ?></p>
  55. <!-- /wp:paragraph -->
  56. </div>
  57. <!-- /wp:group -->
  58. <!-- wp:paragraph {"style":{"elements":{"link":{"color":{"text":"var:preset|color|contrast"},":hover":{"color":{"text":"var:preset|color|primary"}}}}},"fontSize":"small"} -->
  59. <p class="has-link-color has-small-font-size" style="font-style:italic;font-weight:400"><a href="#"><?php echo esc_html__( 'Full Details', 'exmoor' ); ?></a>→</p>
  60. <!-- /wp:paragraph -->
  61. </div>
  62. <!-- /wp:column -->
  63. <!-- wp:column {"style":{"spacing":{"blockGap":"var:preset|spacing|40"}}} -->
  64. <div class="wp-block-column">
  65. <!-- wp:image {"id":3585,"sizeSlug":"large","linkDestination":"none"} -->
  66. <figure class="wp-block-image size-large"><img src="<?php echo esc_url( get_stylesheet_directory_uri() ); ?>/assets/images/beach-landscape-sea-coast-water-sand-892271-pxhere.com_-1-768x1024.jpg" alt="" class="wp-image-3585"/></figure>
  67. <!-- /wp:image -->
  68. <!-- wp:group {"style":{"spacing":{"blockGap":"0"}},"layout":{"type":"constrained"}} -->
  69. <div class="wp-block-group">
  70. <!-- wp:heading {"level":3} -->
  71. <h3 class="wp-block-heading"><?php echo esc_html__( 'Noordhoek Beach', 'exmoor' ); ?></h3>
  72. <!-- /wp:heading -->
  73. <!-- wp:paragraph -->
  74. <p><?php echo esc_html__( 'Thu 25 Sep – Tue, 30 Sep', 'exmoor' ); ?></p>
  75. <!-- /wp:paragraph -->
  76. </div>
  77. <!-- /wp:group -->
  78. <!-- wp:paragraph {"style":{"elements":{"link":{"color":{"text":"var:preset|color|contrast"},":hover":{"color":{"text":"var:preset|color|primary"}}}}},"fontSize":"small"} -->
  79. <p class="has-link-color has-small-font-size" style="font-style:italic;font-weight:400"><a href="#"><?php echo esc_html__( 'Full Details', 'exmoor' ); ?></a>→</p>
  80. <!-- /wp:paragraph -->
  81. </div>
  82. <!-- /wp:column -->
  83. <!-- wp:column {"style":{"spacing":{"blockGap":"var:preset|spacing|40"}}} -->
  84. <div class="wp-block-column">
  85. <!-- wp:image {"id":3632,"sizeSlug":"large","linkDestination":"none"} -->
  86. <figure class="wp-block-image size-large"><img src="<?php echo esc_url( get_stylesheet_directory_uri() ); ?>/assets/images/StockSnap_YPSVD8SDXM-1-768x1024.jpg" alt="" class="wp-image-3632"/></figure>
  87. <!-- /wp:image -->
  88. <!-- wp:group {"style":{"spacing":{"blockGap":"0"}},"layout":{"type":"constrained"}} -->
  89. <div class="wp-block-group">
  90. <!-- wp:heading {"level":3} -->
  91. <h3 class="wp-block-heading"><?php echo esc_html__( 'Newquay', 'exmoor' ); ?></h3>
  92. <!-- /wp:heading -->
  93. <!-- wp:paragraph -->
  94. <p><?php echo esc_html__( 'Thu, 13 Jul – Wed, 19 Jul', 'exmoor' ); ?></p>
  95. <!-- /wp:paragraph -->
  96. </div>
  97. <!-- /wp:group -->
  98. <!-- wp:paragraph {"style":{"elements":{"link":{"color":{"text":"var:preset|color|contrast"},":hover":{"color":{"text":"var:preset|color|primary"}}}}},"fontSize":"small"} -->
  99. <p class="has-link-color has-small-font-size" style="font-style:italic;font-weight:400"><a href="#"><?php echo esc_html__( 'Full Details', 'exmoor' ); ?></a>→</p>
  100. <!-- /wp:paragraph -->
  101. </div>
  102. <!-- /wp:column -->
  103. </div>
  104. <!-- /wp:columns -->
  105. </div>
  106. <!-- /wp:group -->