Skip to content
4 changes: 0 additions & 4 deletions components/com_content/tmpl/category/blog.php
Original file line number Diff line number Diff line change
Expand Up @@ -76,12 +76,10 @@
<?php foreach ($this->lead_items as &$item) : ?>
<div class="com-content-category-blog__item blog-item"
itemprop="blogPost" itemscope itemtype="https://schema.org/BlogPosting">
<div class="blog-item-content"><!-- Double divs required for IE11 grid fallback -->
<?php
$this->item = & $item;
echo $this->loadTemplate('item');
?>
</div>
</div>
<?php $leadingcount++; ?>
<?php endforeach; ?>
Expand All @@ -98,12 +96,10 @@
<?php foreach ($this->intro_items as $key => &$item) : ?>
<div class="com-content-category-blog__item blog-item"
itemprop="blogPost" itemscope itemtype="https://schema.org/BlogPosting">
<div class="blog-item-content"><!-- Double divs required for IE11 grid fallback -->
<?php
$this->item = & $item;
echo $this->loadTemplate('item');
?>
</div>
</div>
<?php endforeach; ?>
</div>
Expand Down
4 changes: 0 additions & 4 deletions components/com_content/tmpl/featured/default.php
Original file line number Diff line number Diff line change
Expand Up @@ -32,12 +32,10 @@
<?php foreach ($this->lead_items as &$item) : ?>
<div class="blog-item"
itemprop="blogPost" itemscope itemtype="https://schema.org/BlogPosting">
<div class="blog-item-content"><!-- Double divs required for IE11 grid fallback -->
<?php
$this->item = & $item;
echo $this->loadTemplate('item');
?>
</div>
</div>
<?php $leadingcount++; ?>
<?php endforeach; ?>
Expand All @@ -49,12 +47,10 @@
<?php foreach ($this->intro_items as $key => &$item) : ?>
<div class="blog-item"
itemprop="blogPost" itemscope itemtype="https://schema.org/BlogPosting">
<div class="blog-item-content"><!-- Double divs required for IE11 grid fallback -->
<?php
$this->item = & $item;
echo $this->loadTemplate('item');
?>
</div>
</div>
<?php endforeach; ?>
</div>
Expand Down
87 changes: 42 additions & 45 deletions templates/cassiopeia/scss/blocks/_modifiers.scss
Original file line number Diff line number Diff line change
Expand Up @@ -88,6 +88,48 @@

.blog-item {
padding: 0 ($cassiopeia-grid-gutter / 2) $cassiopeia-grid-gutter ($cassiopeia-grid-gutter / 2);
display: flex;
flex-direction: column;
.boxed & {
background-color: #fff;
box-shadow: 0 0 2px rgba(52, 58, 67, 0.1), 0 2px 5px rgba(52, 58, 67, 0.08), 0 5px 15px rgba(52, 58, 67, 0.08), inset 0 3px 0 $cassiopeia-template-color;
.item-content {
padding: 25px;
}
}
.image-left &, .image-right & {
flex-direction: row;
}
.item-image {
margin-top: 3px;
margin-bottom: 15px;
overflow: hidden;
.boxed & {
margin-bottom: 0;
}
.image-right & {
order: 1;
}
.image-bottom & {
order: 1;
margin-top: -15px;
}
}
.item-content {
.image-left & {
padding-left: 25px;
}
.image-right & {
padding-right: 25px;
}
}
.image-left &, .image-right & {
flex-direction: column;

@include media-breakpoint-up(sm) {
flex-direction: row;
}
}
}

@supports (display: grid) {
Expand Down Expand Up @@ -146,51 +188,6 @@
}
}

.blog-item-content {
display: flex;
flex-direction: column;
.boxed & {
background-color: #fff;
box-shadow: 0 0 2px rgba(52, 58, 67, 0.1), 0 2px 5px rgba(52, 58, 67, 0.08), 0 5px 15px rgba(52, 58, 67, 0.08), inset 0 3px 0 $cassiopeia-template-color;
.item-content {
padding: 25px;
}
}
.image-left &, .image-right & {
flex-direction: row;
}
.item-image {
margin-top: 3px;
margin-bottom: 15px;
overflow: hidden;
.boxed & {
margin-bottom: 0;
}
.image-right & {
order: 1;
}
.image-bottom & {
order: 1;
margin-top: -15px;
}
}
.item-content {
.image-left & {
padding-left: 25px;
}
.image-right & {
padding-right: 25px;
}
}
.image-left &, .image-right & {
flex-direction: column;

@include media-breakpoint-up(sm) {
flex-direction: row;
}
}
}

.image-alternate {
.blog-item:nth-of-type(2n+1) {
.item-image {
Expand Down