Blender-org web-assets v2 upgrade #104116

Merged
Márton Lente merged 56 commits from web-assets-v2-upgrade into main 2024-08-13 17:27:59 +02:00
15 changed files with 116 additions and 118 deletions
Showing only changes of commit b850d23e0d - Show all commits

View File

@ -45,10 +45,10 @@ $style = get_field('style');
<?php if (!isset($show_block) or $show_block): ?> <?php if (!isset($show_block) or $show_block): ?>
<div id="<?php echo esc_attr($id); ?>" class="<?php echo esc_attr($className); ?>"> <div id="<?php echo esc_attr($id); ?>" class="<?php echo esc_attr($className); ?>">
<div class="cards-list card-layout-<?=$card_layout?> card-aspect-ratio-<?=$cards_aspect_ratio?>"> <div class="cards card-layout-<?=$card_layout?> card-aspect-ratio-<?=$cards_aspect_ratio?>">
<style> <style>
#<?=$id?> .cards-list { #<?=$id?> .cards {
--cards-list-items-per-row: <?=($cards_per_row ? $cards_per_row : '4')?>; --cards-items-per-row: <?=($cards_per_row ? $cards_per_row : '4')?>;
} }
</style> </style>
<?php foreach ($cards_list as $card_item): <?php foreach ($cards_list as $card_item):
@ -71,34 +71,34 @@ $style = get_field('style');
?> ?>
<?php if ($card_enabled): ?> <?php if ($card_enabled): ?>
<div class="cards-list-item-outer<?=($is_image_only ? ' is-image-only' : '')?> card-aspect-ratio-<?=$card_aspect_ratio?>" <?=($card_width ? 'style="grid-column: span ' . $card_width . '"' : '')?>> <div class="cards-item<?=($is_image_only ? ' is-img-only' : '')?> card-aspect-ratio-<?=$card_aspect_ratio?>" <?=($card_width ? 'style="grid-column: span ' . $card_width . '"' : '')?>>
<div class="cards-list-item-inner" style="<?=($card_color_bg ? 'background-color: ' . $card_color_bg . ';' : '')?><?=($card_color_text ? 'color: ' . $card_color_text . ';' : '')?>"> <div class="cards-item-content" style="<?=($card_color_bg ? 'background-color: ' . $card_color_bg . ';' : '')?><?=($card_color_text ? 'color: ' . $card_color_text . ';' : '')?>">
<?php if ($card_thumbnail): ?> <?php if ($card_thumbnail): ?>
<?php if ($card_url): ?> <?php if ($card_url): ?>
<a href="<?=$card_url?>" class="cards-list-item-thumbnail"> <a href="<?=$card_url?>" class="cards-item-thumbnail">
<?=mediaThumbnail($card_thumbnail_url, $card_title)?> <?=mediaThumbnail($card_thumbnail_url, $card_title)?>
</a> </a>
<?php else: ?> <?php else: ?>
<div class="cards-list-item-thumbnail"> <div class="cards-item-thumbnail">
<?=mediaThumbnail($card_thumbnail_url, $card_title)?> <?=mediaThumbnail($card_thumbnail_url, $card_title)?>
</div> </div>
<?php endif; ?> <?php endif; ?>
<?php endif; ?> <?php endif; ?>
<?php if (!$is_image_only): ?> <?php if (!$is_image_only): ?>
<div class="cards-list-item-info"> <div class="cards-item-info">
<?php if ($card_headline): ?> <?php if ($card_headline): ?>
<a class="cards-list-item-headline" href="<?=$card_url?>"><?=$card_headline?></a> <a class="cards-item-headline" href="<?=$card_url?>"><?=$card_headline?></a>
<?php endif; ?> <?php endif; ?>
<?php if ($card_title && $card_url): ?> <?php if ($card_title && $card_url): ?>
<a class="cards-list-item-title" href="<?=$card_url?>"><?=$card_title?></a> <a class="cards-item-title" href="<?=$card_url?>"><?=$card_title?></a>
<?php elseif ($card_title): ?> <?php elseif ($card_title): ?>
<span class="cards-list-item-title"><?=$card_title?></span> <span class="cards-item-title"><?=$card_title?></span>
<?php endif; ?> <?php endif; ?>
<?php if ($card_text): ?> <?php if ($card_text): ?>
<span class="cards-list-item-excerpt" href="<?=$card_url?>"><?=$card_text?></span> <span class="cards-item-excerpt" href="<?=$card_url?>"><?=$card_text?></span>
<?php endif; ?> <?php endif; ?>
</div> </div>
<?php endif; ?> <?php endif; ?>

View File

@ -42,7 +42,7 @@ $background_color = get_field('background_color');
$text_color = get_field('text_color'); $text_color = get_field('text_color');
?> ?>
<?php if (!isset($show_block) or $show_block): ?> <?php if (!isset($show_block) or $show_block): ?>
<div id="<?php echo esc_attr($id); ?>" class="cards-list card-layout-<?=$card_layout?> card-aspect-ratio-<?=$card_aspect_ratio?> cards-<?=($cards_per_row ? $cards_per_row : '3')?> <?php echo esc_attr($className); ?>"> <div id="<?php echo esc_attr($id); ?>" class="cards card-layout-<?=$card_layout?> card-aspect-ratio-<?=$card_aspect_ratio?> cards-<?=($cards_per_row ? $cards_per_row : '3')?> <?php echo esc_attr($className); ?>">
<?php while( have_rows('pages') ): the_row(); ?> <?php while( have_rows('pages') ): the_row(); ?>
<?php <?php
@ -54,29 +54,29 @@ $text_color = get_field('text_color');
<?php foreach($pages as $post): ?> <?php foreach($pages as $post): ?>
<?php setup_postdata($post); ?> <?php setup_postdata($post); ?>
<div class="cards-list-item-outer"> <div class="cards-item">
<div class="cards-list-item-inner"> <div class="cards-item-content">
<?php if (has_post_thumbnail()): ?> <?php if (has_post_thumbnail()): ?>
<a href="<?php the_permalink(); ?>" class="cards-list-item-thumbnail"> <a href="<?php the_permalink(); ?>" class="cards-item-thumbnail">
<?php the_post_thumbnail('featured-list', ['class' => 'img-fluid', 'title' => get_the_title()]); ?> <?php the_post_thumbnail('featured-list', ['class' => 'img-fluid', 'title' => get_the_title()]); ?>
</a> </a>
<?php endif; ?> <?php endif; ?>
<div class="cards-list-item-info"> <div class="cards-item-info">
<a class="cards-list-item-title" href="<?php the_permalink(); ?>"> <a class="cards-item-title" href="<?php the_permalink(); ?>">
<?php the_title() ?> <?php the_title() ?>
</a> </a>
<a class="cards-list-item-excerpt" href="<?php the_permalink(); ?>"><?php the_excerpt();?></a> <a class="cards-item-excerpt" href="<?php the_permalink(); ?>"><?php the_excerpt();?></a>
<div class="cards-list-item-more"> <div class="cards-item-more">
<a class="more-item url" href="<?php the_permalink(); ?>">READ MORE <i class="i-chevron-right"></i></a> <a class="more-item url" href="<?php the_permalink(); ?>">READ MORE <i class="i-chevron-right"></i></a>
</div> </div>
</div> </div>
<?php if ($background_color || $text_color) { ?> <?php if ($background_color || $text_color) { ?>
<style type="text/css"> <style type="text/css">
#<?php echo $id; ?> .cards-list-item-inner { #<?php echo $id; ?> .cards-item-content {
background: <?php echo $background_color; ?>; background: <?php echo $background_color; ?>;
color: <?php echo $text_color; ?>; color: <?php echo $text_color; ?>;
} }
@ -92,4 +92,3 @@ $text_color = get_field('text_color');
<?php endwhile; ?> <?php endwhile; ?>
</div> </div>
<?php endif; ?>

View File

@ -73,7 +73,7 @@ $style = get_field('style');
<?=$block_id?> { <?=$block_id?> {
background-image: <?=$gradient?>; background-image: <?=$gradient?>;
-webkit-background-clip: text; -webkit-bg-clip: text;
-webkit-text-fill-color: transparent; -webkit-text-fill-color: transparent;
} }
<?php endif;?> <?php endif;?>
@ -89,4 +89,3 @@ $style = get_field('style');
<?=($style ? $style : '')?> <?=($style ? $style : '')?>
</style> </style>
</div> </div>
<?php endif;?>

View File

@ -45,10 +45,10 @@ $style = get_field('style');
<?php if (!isset($show_block) or $show_block): ?> <?php if (!isset($show_block) or $show_block): ?>
<div id="<?php echo esc_attr($id); ?>" class="wp-block-<?php echo esc_attr($className); ?>"> <div id="<?php echo esc_attr($id); ?>" class="wp-block-<?php echo esc_attr($className); ?>">
<div class="cards-list card-layout-<?=$card_layout?> card-aspect-ratio-<?=$cards_aspect_ratio?>"> <div class="cards card-layout-<?=$card_layout?> card-aspect-ratio-<?=$cards_aspect_ratio?>">
<style> <style>
#<?=$id?> .cards-list { #<?=$id?> .cards {
--cards-list-items-per-row: <?=($cards_per_row ? $cards_per_row : '4')?>; --cards-items-per-row: <?=($cards_per_row ? $cards_per_row : '4')?>;
} }
</style> </style>
<?php foreach ($cards_list as $card_item): <?php foreach ($cards_list as $card_item):
@ -70,25 +70,25 @@ $style = get_field('style');
?> ?>
<?php if ($card_enabled): ?> <?php if ($card_enabled): ?>
<div class="cards-list-item-outer card-aspect-ratio-<?=$card_aspect_ratio?> is-social-<?=$card_social?>" <?=($card_width ? 'style="grid-column: span ' . $card_width . '"' : '')?>> <div class="cards-item card-aspect-ratio-<?=$card_aspect_ratio?> is-social-<?=$card_social?>" <?=($card_width ? 'style="grid-column: span ' . $card_width . '"' : '')?>>
<div class="cards-list-item-inner" style="<?=($card_color_bg ? 'background-color: ' . $card_color_bg . ';' : '')?><?=($card_color_text ? 'color: ' . $card_color_text . ';' : '')?>"> <div class="cards-item-content" style="<?=($card_color_bg ? 'background-color: ' . $card_color_bg . ';' : '')?><?=($card_color_text ? 'color: ' . $card_color_text . ';' : '')?>">
<?php if ($card_thumbnail): ?> <?php if ($card_thumbnail): ?>
<?php if ($card_url): ?> <?php if ($card_url): ?>
<a href="<?=$card_url?>" class="cards-list-item-thumbnail" target="_blank"> <a href="<?=$card_url?>" class="cards-item-thumbnail" target="_blank">
<?=mediaThumbnail($card_thumbnail_url, $card_title)?> <?=mediaThumbnail($card_thumbnail_url, $card_title)?>
<div class="cards-list-item-info"> <div class="cards-item-info">
<?php if ($card_headline): ?> <?php if ($card_headline): ?>
<span class="cards-list-item-headline"><?=$card_headline?></span> <span class="cards-item-headline"><?=$card_headline?></span>
<?php endif; ?> <?php endif; ?>
<?php if ($card_text): ?> <?php if ($card_text): ?>
<span class="cards-list-item-excerpt" href="<?=$card_url?>"><?=$card_text?></span> <span class="cards-item-excerpt" href="<?=$card_url?>"><?=$card_text?></span>
<?php endif; ?> <?php endif; ?>
<span class="cards-list-item-title"> <span class="cards-item-title">
<span class="cards-list-item-social"> <span class="cards-item-social">
<i class="i-<?=$card_social['value']?>"></i> <i class="i-<?=$card_social['value']?>"></i>
</span> </span>
@<?=$card_title?> @<?=$card_title?>

View File

@ -45,7 +45,7 @@
$hide_navigation = get_field('navigation_hide'); $hide_navigation = get_field('navigation_hide');
/* /*
* - If the page/post has_post_thumbnail, set $header_image_src as background-image url * - If the page/post has_post_thumbnail, set $header_image_src as background-img url
martonlente marked this conversation as resolved Outdated

I don't think this is an intended rename since it is a CSS property.

I don't think this is an intended rename since it is a CSS property.
* - If the header is not 'large', set $header_image_offset as background-position-y * - If the header is not 'large', set $header_image_offset as background-position-y
*/ */
?> ?>
@ -82,7 +82,7 @@
</div> </div>
<?php if ($header_image_src): ?> <?php if ($header_image_src): ?>
<div class="hero-background" style="background-image: url(<?=$header_image_src?>); background-position-y: <?=$header_image_offset?>"></div> <div class="hero-bg" style="background-image: url(<?=$header_image_src?>); background-position-y: <?=$header_image_offset?>"></div>
<?php endif;?> <?php endif;?>
<?php if ($header_background_video): ?> <?php if ($header_background_video): ?>

View File

@ -31,7 +31,7 @@
</div> </div>
<?php endif; ?> <?php endif; ?>
<div class="cards-list card-layout-card-transparent"> <div class="cards card-layout-card-transparent">
<?php if (have_posts()){ ?> <?php if (have_posts()){ ?>
<?php while ( have_posts() ) : the_post(); ?> <?php while ( have_posts() ) : the_post(); ?>
@ -49,16 +49,16 @@
} }
?> ?>
<div class="cards-list-item-outer"> <div class="cards-item">
<div class="cards-list-item-inner"> <div class="cards-item-content">
<?php if (has_post_thumbnail()): ?> <?php if (has_post_thumbnail()): ?>
<a href="<?php the_permalink(); ?>" class="cards-list-item-thumbnail"> <a href="<?php the_permalink(); ?>" class="cards-item-thumbnail">
<?php the_post_thumbnail('featured-list', ['class' => 'img-fluid', 'title' => get_the_title()]); ?> <?php the_post_thumbnail('featured-list', ['class' => 'img-fluid', 'title' => get_the_title()]); ?>
</a> </a>
<?php endif; ?> <?php endif; ?>
<a class="cards-list-item-title" href="<?php the_permalink(); ?>"><?php the_title() ?></a> <a class="cards-item-title" href="<?php the_permalink(); ?>"><?php the_title() ?></a>
<a class="cards-list-item-excerpt" href="<?php the_permalink(); ?>"><?php the_excerpt();?></a> <a class="cards-item-excerpt" href="<?php the_permalink(); ?>"><?php the_excerpt();?></a>
<div class="cards-list-item-extra"> <div class="cards-item-extra">
<ul> <ul>
<li> <li>
<a href="<?php the_permalink(); ?>"> <a href="<?php the_permalink(); ?>">

View File

@ -41,7 +41,7 @@ Template Name: Community
<a href="#<?= $language_iso ?>"><?= $language_label ?></a> <a href="#<?= $language_iso ?>"><?= $language_label ?></a>
</h3> </h3>
<div class="cards-list"> <div class="cards">
<?php <?php
if ($community) : if ($community) :
@ -54,17 +54,17 @@ Template Name: Community
$thumbnail = get_sub_field('thumbnail'); // Community thumbnail $thumbnail = get_sub_field('thumbnail'); // Community thumbnail
?> ?>
<div class="cards-list-item-outer"> <div class="cards-item">
<a class="cards-list-item-inner" href="<?= $url ?>" target="_blank" rel="nofollow"> <a class="cards-item-content" href="<?= $url ?>" target="_blank" rel="nofollow">
<?php if ($thumbnail) : ?> <?php if ($thumbnail) : ?>
<div class="cards-list-item-thumbnail"> <div class="cards-item-thumbnail">
<img src="<?= $thumbnail['sizes']['square'] ?>" alt="<?= $name ?>" /> <img src="<?= $thumbnail['sizes']['square'] ?>" alt="<?= $name ?>" />
</div> </div>
<?php endif; ?> <?php endif; ?>
<div class="cards-list-item-details"> <div class="cards-item-details">
<div class="cards-list-item-title"><?= $name ?></div> <div class="cards-item-title"><?= $name ?></div>
<div class="cards-list-item-excerpt"><?= $description ?></div> <div class="cards-item-excerpt"><?= $description ?></div>
<div class="cards-list-item-url"> <div class="cards-item-url">
<?= $url_pretty ?> <?= $url_pretty ?>
</div> </div>
</div> </div>

View File

@ -210,8 +210,8 @@ $analytics_event_name = 'Downloads+Blender';
</div> </div>
<?php if ($header_image_src): ?> <?php if ($header_image_src): ?>
<div class="hero-background-faded"> <div class="hero-bg-faded">
<div class="hero-background-faded-image" style="top: <?=$header_image_offset?>"> <div class="hero-bg-faded-img" style="top: <?=$header_image_offset?>">
<img src="<?=$header_image_src?>" alt=""/> <img src="<?=$header_image_src?>" alt=""/>
</div> </div>
</div> </div>
@ -231,7 +231,7 @@ $analytics_event_name = 'Downloads+Blender';
<div class="dl-features"> <div class="dl-features">
<a href="<?=$release_notes_url?>"> <a href="<?=$release_notes_url?>">
<div class="dl-background-image" style="background-image: url(<?=$splash['url']?>);"></div> <div class="dl-bg-img" style="background-image: url(<?=$splash['url']?>);"></div>
</a> </a>
<div class="dl-overlay-text"></div> <div class="dl-overlay-text"></div>
<div class="dl-overlay-text"></div> <div class="dl-overlay-text"></div>
@ -239,7 +239,7 @@ $analytics_event_name = 'Downloads+Blender';
<div class="dl-overlay bottom"></div> <div class="dl-overlay bottom"></div>
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-md-6 ml-auto"> <div class="col-md-6 ms-auto">
<div class="dl-features-text"> <div class="dl-features-text">
<a href="<?=$release_notes_url?>"> <a href="<?=$release_notes_url?>">
<h1>What's New</h1> <h1>What's New</h1>

View File

@ -33,7 +33,7 @@ Template Name: FAQ (deprecated)
<h3 id="<?=$faq_category_slug?>" class="pt-4 has-anchor border-top"> <h3 id="<?=$faq_category_slug?>" class="pt-4 has-anchor border-top">
<?=$faq_category?> <?=$faq_category?>
<a href="#<?=$faq_category_slug?>" class="text-muted"> <a href="#<?=$faq_category_slug?>" class="text-muted">
<i class="i-link anchor-icon mr-3 text-primary"></i> <i class="i-link anchor-icon me-3 text-primary"></i>
</a> </a>
</h3> </h3>
<div id="faq" class="py-3 mt-3 accordion"> <div id="faq" class="py-3 mt-3 accordion">

View File

@ -53,7 +53,7 @@ $dev_status = [
<?php /* Label with development status of the feature. */ ?> <?php /* Label with development status of the feature. */ ?>
<?php if ($subcat_dev_status != 'implemented'): ?> <?php if ($subcat_dev_status != 'implemented'): ?>
<span class="cards-list-item-label <?=$subcat_dev_status?>" title="<?=$dev_status[$subcat_dev_status]['desc']?>"> <span class="cards-item-label <?=$subcat_dev_status?>" title="<?=$dev_status[$subcat_dev_status]['desc']?>">
<?=$dev_status[$subcat_dev_status]['title']?> <?=$dev_status[$subcat_dev_status]['title']?>
</span> </span>
<?php endif; ?> <?php endif; ?>
@ -73,7 +73,7 @@ $dev_status = [
<?php /* Label with development status of the feature. */ ?> <?php /* Label with development status of the feature. */ ?>
<?php if ($detail_dev_status != 'implemented'): ?> <?php if ($detail_dev_status != 'implemented'): ?>
<span class="cards-list-item-label <?=$detail_dev_status?>" title="<?=$dev_status[$detail_dev_status]['desc']?>"> <span class="cards-item-label <?=$detail_dev_status?>" title="<?=$dev_status[$detail_dev_status]['desc']?>">
<?=$dev_status[$detail_dev_status]['title']?> <?=$dev_status[$detail_dev_status]['title']?>
</span> </span>
<?php endif; ?> <?php endif; ?>
@ -95,7 +95,7 @@ $dev_status = [
<?php /* LIST OF FEATURES*/ ?> <?php /* LIST OF FEATURES*/ ?>
<div class="<?=($sub_categories ? 'col-sm-8' : 'col-md-10 offset-md-1')?>"> <div class="<?=($sub_categories ? 'col-sm-8' : 'col-md-10 offset-md-1')?>">
<?php if ($sub_categories): ?> <?php if ($sub_categories): ?>
<div class="cards-list features-category"> <div class="cards features-category">
<?php while( have_rows('sub_categories') ): the_row(); <?php while( have_rows('sub_categories') ): the_row();
$subcat_title = get_sub_field('sub_category_title'); $subcat_title = get_sub_field('sub_category_title');
$subcat_slug = slugify($subcat_title); $subcat_slug = slugify($subcat_title);
@ -108,29 +108,29 @@ $dev_status = [
$subcat_details = get_sub_field('feature_details'); // List of sub-category features $subcat_details = get_sub_field('feature_details'); // List of sub-category features
?> ?>
<div id="<?=$subcat_slug?>" class="cards-list-item-outer subcat"> <div id="<?=$subcat_slug?>" class="cards-item subcat">
<div class="cards-list-item-inner"> <div class="cards-item-content">
<?php if ($subcat_image): ?> <?php if ($subcat_image): ?>
<div class="cards-list-item-thumbnail js-isolify" data-url="<?=$subcat_image['url']?>"> <div class="cards-item-thumbnail js-isolify" data-url="<?=$subcat_image['url']?>">
<img src="<?=$subcat_image['url']?>" alt="<?=$subcat_title;?>"/> <img src="<?=$subcat_image['url']?>" alt="<?=$subcat_title;?>"/>
</div> </div>
<?php endif; ?> <?php endif; ?>
<span class="cards-list-item-title"> <span class="cards-item-title">
<a href="#<?=$subcat_slug?>"><?=$subcat_title;?></a> <a href="#<?=$subcat_slug?>"><?=$subcat_title;?></a>
<?php /* Label with development status of the feature. */ ?> <?php /* Label with development status of the feature. */ ?>
<?php if ($subcat_dev_status != 'implemented'): ?> <?php if ($subcat_dev_status != 'implemented'): ?>
<span class="cards-list-item-label" title="<?=$dev_status[$subcat_dev_status]['desc']?>"> <span class="cards-item-label" title="<?=$dev_status[$subcat_dev_status]['desc']?>">
<?=$dev_status[$subcat_dev_status]['title']?> <?=$dev_status[$subcat_dev_status]['title']?>
</span> </span>
<?php endif; ?> <?php endif; ?>
</span> </span>
<div class="cards-list-item-description"> <div class="cards-item-description">
<?=$subcat_description;?> <?=$subcat_description;?>
</div> </div>
<?php if ($subcat_url or $subcat_video): ?> <?php if ($subcat_url or $subcat_video): ?>
<div class="cards-list-item-more"> <div class="cards-item-more">
<?php if ($subcat_video): ?> <?php if ($subcat_video): ?>
<div class="more-item video js-isolify" data-type="oembed" data-url="<div class='embed-container'><?=htmlspecialchars($subcat_video)?></div>"><i class="i-play"></i> WATCH VIDEO</div> <div class="more-item video js-isolify" data-type="oembed" data-url="<div class='embed-container'><?=htmlspecialchars($subcat_video)?></div>"><i class="i-play"></i> WATCH VIDEO</div>
<?php endif; ?> <?php endif; ?>
@ -153,33 +153,33 @@ $dev_status = [
$detail_dev_status = get_sub_field('detail_dev_status'); $detail_dev_status = get_sub_field('detail_dev_status');
?> ?>
<div class="cards-list-item-outer"> <div class="cards-item">
<div class="cards-list-item-inner"> <div class="cards-item-content">
<a id="<?=$subcat_slug?>-<?=$detail_slug?>" name="<?=$subcat_slug?>-<?=$detail_slug?>"></a> <a id="<?=$subcat_slug?>-<?=$detail_slug?>" name="<?=$subcat_slug?>-<?=$detail_slug?>"></a>
<?php if ($detail_image): ?> <?php if ($detail_image): ?>
<div class="cards-list-item-thumbnail js-isolify" data-url="<?=$detail_image['url']?>"> <div class="cards-item-thumbnail js-isolify" data-url="<?=$detail_image['url']?>">
<img src="<?=$detail_image['url']?>" alt="<?=$detail_title;?>"/> <img src="<?=$detail_image['url']?>" alt="<?=$detail_title;?>"/>
</div> </div>
<?php endif; ?> <?php endif; ?>
<div class="cards-list-item-title"> <div class="cards-item-title">
<span class="cards-list-item-pretitle"> <span class="cards-item-pretitle">
<a href="#<?=$subcat_slug?>"><?=$subcat_title;?></a> <i class="i-chevron-right"></i> <a href="#<?=$subcat_slug?>"><?=$subcat_title;?></a> <i class="i-chevron-right"></i>
</span> </span>
<a href="#<?=$subcat_slug?>-<?=$detail_slug?>"><?=$detail_title;?></a> <a href="#<?=$subcat_slug?>-<?=$detail_slug?>"><?=$detail_title;?></a>
<?php /* Label with development status of the feature. */ ?> <?php /* Label with development status of the feature. */ ?>
<?php if ($detail_dev_status != 'implemented'): ?> <?php if ($detail_dev_status != 'implemented'): ?>
<span class="cards-list-item-label" title="<?=$dev_status[$detail_dev_status]['desc']?>"> <span class="cards-item-label" title="<?=$dev_status[$detail_dev_status]['desc']?>">
<?=$dev_status[$detail_dev_status]['title']?> <?=$dev_status[$detail_dev_status]['title']?>
</span> </span>
<?php endif; ?> <?php endif; ?>
</div> </div>
<div class="cards-list-item-description"> <div class="cards-item-description">
<?=$detail_description;?> <?=$detail_description;?>
</div> </div>
<?php if ($detail_url or $detail_video): ?> <?php if ($detail_url or $detail_video): ?>
<div class="cards-list-item-more"> <div class="cards-item-more">
<?php if ($detail_video): ?> <?php if ($detail_video): ?>
<div class="more-item video js-isolify" data-type="oembed" data-url="<?=htmlspecialchars($detail_video)?>"><i class="i-play"></i> WATCH VIDEO</div> <div class="more-item video js-isolify" data-type="oembed" data-url="<?=htmlspecialchars($detail_video)?>"><i class="i-play"></i> WATCH VIDEO</div>
<?php endif; ?> <?php endif; ?>

View File

@ -37,7 +37,7 @@ $dev_status = [
<?php /* List of features categories. Cards style. */ ?> <?php /* List of features categories. Cards style. */ ?>
<div class="features-cards"> <div class="features-cards">
<div class="cards-list"> <div class="cards">
<?php while( have_rows('categories') ): the_row(); ?> <?php while( have_rows('categories') ): the_row(); ?>
<?php $category_pages = get_sub_field('category_page'); <?php $category_pages = get_sub_field('category_page');
@ -48,26 +48,26 @@ $dev_status = [
<?php $category_dev_status = get_field('category_dev_status'); ?> <?php $category_dev_status = get_field('category_dev_status'); ?>
<div class="cards-list-item-outer"> <div class="cards-item">
<div class="cards-list-item-inner"> <div class="cards-item-content">
<?php if (has_post_thumbnail()): ?> <?php if (has_post_thumbnail()): ?>
<a href="<?php the_permalink(); ?>" class="cards-list-item-thumbnail"> <a href="<?php the_permalink(); ?>" class="cards-item-thumbnail">
<?php the_post_thumbnail('featured-list', ['class' => 'img-fluid', 'title' => get_the_title()]); ?> <?php the_post_thumbnail('featured-list', ['class' => 'img-fluid', 'title' => get_the_title()]); ?>
</a> </a>
<?php endif; ?> <?php endif; ?>
<a class="cards-list-item-title" href="<?php the_permalink(); ?>"> <a class="cards-item-title" href="<?php the_permalink(); ?>">
<?php the_title() ?> <?php the_title() ?>
<?php /* Label with development status of the feature. */ ?> <?php /* Label with development status of the feature. */ ?>
<?php if ($category_dev_status && ($category_dev_status != 'implemented')): ?> <?php if ($category_dev_status && ($category_dev_status != 'implemented')): ?>
<span class="cards-list-item-label" title="<?=$dev_status[$category_dev_status]['desc']?>"> <span class="cards-item-label" title="<?=$dev_status[$category_dev_status]['desc']?>">
<?=$dev_status[$category_dev_status]['title']?> <?=$dev_status[$category_dev_status]['title']?>
</span> </span>
<?php endif; ?> <?php endif; ?>
</a> </a>
<a class="cards-list-item-excerpt" href="<?php the_permalink(); ?>"><?php the_excerpt();?></a> <a class="cards-item-excerpt" href="<?php the_permalink(); ?>"><?php the_excerpt();?></a>
<div class="cards-list-item-more"> <div class="cards-item-more">
<a class="more-item url" href="<?php the_permalink(); ?>">READ MORE <i class="i-chevron-right"></i></a> <a class="more-item url" href="<?php the_permalink(); ?>">READ MORE <i class="i-chevron-right"></i></a>
</div> </div>
</div> </div>

View File

@ -30,8 +30,8 @@ Template Name: Layout: Listing Cards (deprecated)
if ($section_enabled): ?> if ($section_enabled): ?>
<section id="section-<?=$i?>"> <section id="section-<?=$i?>">
<style> <style>
#section-<?=$i?> > .cards-list { #section-<?=$i?> > .cards {
--cards-list-items-per-row: <?=($cards_per_row ? $cards_per_row : '4')?>; --cards-items-per-row: <?=($cards_per_row ? $cards_per_row : '4')?>;
} }
</style> </style>
@ -41,7 +41,7 @@ Template Name: Layout: Listing Cards (deprecated)
</a> </a>
<?php endif; ?> <?php endif; ?>
<div class="cards-list card-layout-<?=$card_layout?> card-aspect-ratio-<?=$cards_aspect_ratio?>"> <div class="cards card-layout-<?=$card_layout?> card-aspect-ratio-<?=$cards_aspect_ratio?>">
<?php <?php
// Let's list the listing now // Let's list the listing now
foreach ($items_list as $list_item): foreach ($items_list as $list_item):
@ -62,28 +62,28 @@ Template Name: Layout: Listing Cards (deprecated)
} }
if ($list_item_enabled): ?> if ($list_item_enabled): ?>
<div class="cards-list-item-outer"> <div class="cards-item">
<div class="cards-list-item-inner"> <div class="cards-item-content">
<?php if ($list_item_thumbnail && $list_item_url): ?> <?php if ($list_item_thumbnail && $list_item_url): ?>
<a href="<?=$list_item_url?>" class="cards-list-item-thumbnail"> <a href="<?=$list_item_url?>" class="cards-item-thumbnail">
<img src="<?=$list_item_thumbnail['sizes'][$list_item_image_size]?>" alt="<?=$list_item_title?>"> <img src="<?=$list_item_thumbnail['sizes'][$list_item_image_size]?>" alt="<?=$list_item_title?>">
</a> </a>
<?php elseif ($list_item_thumbnail): ?> <?php elseif ($list_item_thumbnail): ?>
<div class="cards-list-item-thumbnail"> <div class="cards-item-thumbnail">
<img src="<?=$list_item_thumbnail['sizes'][$list_item_image_size]?>" alt="<?=$list_item_title?>"> <img src="<?=$list_item_thumbnail['sizes'][$list_item_image_size]?>" alt="<?=$list_item_title?>">
</div> </div>
<?php endif; ?> <?php endif; ?>
<div class="cards-list-item-info"> <div class="cards-item-info">
<?php if ($list_item_title && $list_item_url): ?> <?php if ($list_item_title && $list_item_url): ?>
<a class="cards-list-item-title" href="<?=$list_item_url?>"><?=$list_item_title?></a> <a class="cards-item-title" href="<?=$list_item_url?>"><?=$list_item_title?></a>
<?php elseif ($list_item_title): ?> <?php elseif ($list_item_title): ?>
<span class="cards-list-item-title"><?=$list_item_title?></span> <span class="cards-item-title"><?=$list_item_title?></span>
<?php endif; ?> <?php endif; ?>
<?php if ($list_item_text): ?> <?php if ($list_item_text): ?>
<span class="cards-list-item-excerpt" href="<?=$list_item_url?>"><?=$list_item_text?></span> <span class="cards-item-excerpt" href="<?=$list_item_url?>"><?=$list_item_text?></span>
<?php endif; ?> <?php endif; ?>
</div> </div>
</div> </div>

View File

@ -126,7 +126,7 @@ $is_latest = (($version_number >= $current_version_number) ? true : false);
<?=($section_color_text ? 'color: ' . $section_color_text . ';' : '')?>"> <?=($section_color_text ? 'color: ' . $section_color_text . ';' : '')?>">
<?php if ($section_bg_size != 'full'): ?> <?php if ($section_bg_size != 'full'): ?>
<div class="section-background bg-align-<?=$section_bg_size?>"><img src="<?=$section_background['url']?>" alt=""/></div> <div class="section-bg bg-align-<?=$section_bg_size?>"><img src="<?=$section_background['url']?>" alt=""/></div>
<?php endif; ?> <?php endif; ?>
<div class="container"> <div class="container">
@ -350,7 +350,7 @@ $is_latest = (($version_number >= $current_version_number) ? true : false);
</div> </div>
<?php endif; ?> <?php endif; ?>
<div class="cards-list cards-<?=($list_items_per_row ? $list_items_per_row : '4')?> <?=($list_items_compact ? 'compact' : '')?> mb-5"> <div class="cards cards-<?=($list_items_per_row ? $list_items_per_row : '4')?> <?=($list_items_compact ? 'compact' : '')?> mb-5">
<?php foreach ($list_items_list as $list_item): <?php foreach ($list_items_list as $list_item):
$list_item_url = $list_item['list_item_url']; $list_item_url = $list_item['list_item_url'];
@ -365,31 +365,31 @@ $is_latest = (($version_number >= $current_version_number) ? true : false);
$list_item_color_bg = $list_item['list_item_color_bg']; $list_item_color_bg = $list_item['list_item_color_bg'];
?> ?>
<div class="cards-list-item-outer<?=($is_image_only ? ' is-image-only' : '')?>"> <div class="cards-item<?=($is_image_only ? ' is-img-only' : '')?>">
<div class="cards-list-item-inner" style="<?=($list_item_color_bg ? 'background-color: ' . $list_item_color_bg . ';' : '')?><?=($list_item_color_text ? 'color: ' . $list_item_color_text . ';' : '')?>"> <div class="cards-item-content" style="<?=($list_item_color_bg ? 'background-color: ' . $list_item_color_bg . ';' : '')?><?=($list_item_color_text ? 'color: ' . $list_item_color_text . ';' : '')?>">
<?php if ($list_item['list_item_thumbnail']): ?> <?php if ($list_item['list_item_thumbnail']): ?>
<?php if ($list_item_url): ?> <?php if ($list_item_url): ?>
<a href="<?=$list_item_url?>" class="cards-list-item-thumbnail"> <a href="<?=$list_item_url?>" class="cards-item-thumbnail">
<img src="<?=$list_item['list_item_thumbnail']['url']?>" alt="<?=$list_item_title?>"> <img src="<?=$list_item['list_item_thumbnail']['url']?>" alt="<?=$list_item_title?>">
</a> </a>
<?php else: ?> <?php else: ?>
<div class="cards-list-item-thumbnail"> <div class="cards-item-thumbnail">
<img src="<?=$list_item['list_item_thumbnail']['url']?>" alt="<?=$list_item_title?>"> <img src="<?=$list_item['list_item_thumbnail']['url']?>" alt="<?=$list_item_title?>">
</div> </div>
<?php endif; ?> <?php endif; ?>
<?php endif; ?> <?php endif; ?>
<?php if (!$is_image_only): ?> <?php if (!$is_image_only): ?>
<div class="cards-list-item-info"> <div class="cards-item-info">
<?php if ($list_item_title && $list_item_url): ?> <?php if ($list_item_title && $list_item_url): ?>
<a class="cards-list-item-title" href="<?=$list_item_url?>"><?=$list_item_title?></a> <a class="cards-item-title" href="<?=$list_item_url?>"><?=$list_item_title?></a>
<?php elseif ($list_item_title): ?> <?php elseif ($list_item_title): ?>
<span class="cards-list-item-title"><?=$list_item_title?></span> <span class="cards-item-title"><?=$list_item_title?></span>
<?php endif; ?> <?php endif; ?>
<?php if ($list_item_text): ?> <?php if ($list_item_text): ?>
<span class="cards-list-item-excerpt" href="<?=$list_item_url?>"><?=$list_item_text?></span> <span class="cards-item-excerpt" href="<?=$list_item_url?>"><?=$list_item_text?></span>
<?php endif; ?> <?php endif; ?>
</div> </div>
<?php endif; ?> <?php endif; ?>

View File

@ -162,8 +162,8 @@ $dl_label = ($is_blender ? 'Blender' : $dl_filename);
</div> </div>
<?php if ($header_image_src): ?> <?php if ($header_image_src): ?>
<div class="hero-background-faded"> <div class="hero-bg-faded">
<div class="hero-background-faded-image" style="top: <?=$header_image_offset?>"> <div class="hero-bg-faded-img" style="top: <?=$header_image_offset?>">
<img src="<?=$header_image_src?>" alt=""/> <img src="<?=$header_image_src?>" alt=""/>
</div> </div>
</div> </div>

View File

@ -47,13 +47,13 @@ $page_width = get_field('page_width');
<?php if (is_preview()):?> <?php if (is_preview()):?>
<div class="row mt-3"> <div class="row mt-3">
<div class="col-md-8 mx-auto"> <div class="col-md-8 mx-auto">
<div class="cards-list cards-2"> <div class="cards cards-2">
<div class="cards-list-item-outer"> <div class="cards-item">
<div class="cards-list-item-inner"> <div class="cards-item-content">
<div class="cards-list-item-thumbnail"> <div class="cards-item-thumbnail">
<span class="cards-list-item-title mt-3">Preview</span> <span class="cards-item-title mt-3">Preview</span>
</div> </div>
<span class="cards-list-item-excerpt pb-3"> <span class="cards-item-excerpt pb-3">
This is how your post will look when listed. This is how your post will look when listed.
<br/> <br/>
The featured image <strong>must be 16:9</strong>. The featured image <strong>must be 16:9</strong>.
@ -65,16 +65,16 @@ $page_width = get_field('page_width');
</div> </div>
</div> </div>
<div class="cards-list-item-outer"> <div class="cards-item">
<div class="cards-list-item-inner"> <div class="cards-item-content">
<?php if (has_post_thumbnail()): ?> <?php if (has_post_thumbnail()): ?>
<a href="<?php the_permalink(); ?>" class="cards-list-item-thumbnail"> <a href="<?php the_permalink(); ?>" class="cards-item-thumbnail">
<?php the_post_thumbnail('featured-list', ['class' => 'img-fluid', 'title' => get_the_title()]); ?> <?php the_post_thumbnail('featured-list', ['class' => 'img-fluid', 'title' => get_the_title()]); ?>
</a> </a>
<?php endif; ?> <?php endif; ?>
<a class="cards-list-item-title" href="<?php the_permalink(); ?>"><?php the_title() ?></a> <a class="cards-item-title" href="<?php the_permalink(); ?>"><?php the_title() ?></a>
<a class="cards-list-item-excerpt" href="<?php the_permalink(); ?>"><?php the_excerpt();?></a> <a class="cards-item-excerpt" href="<?php the_permalink(); ?>"><?php the_excerpt();?></a>
<div class="cards-list-item-extra"> <div class="cards-item-extra">
<ul> <ul>
<li><a href="<?php the_permalink(); ?>"><?php the_time('F jS, Y'); ?></a></li> <li><a href="<?php the_permalink(); ?>"><?php the_time('F jS, Y'); ?></a></li>