Skip to content
Code-Schnipsel Gruppen Projekte
Commit 35372e3b erstellt von Michael Danielczok's avatar Michael Danielczok
Dateien durchsuchen

feat: Improved template "Box with shadow" in advanced box content.

Übergeordneter e3353038
Keine zugehörigen Branchen gefunden
Keine zugehörigen Tags gefunden
Keine zugehörigen Merge Requests gefunden
.quiqqer-boxContentAdvanced-wrapper.template-boxWithShadow {
overflow: visible;
}
.quiqqer-boxContentAdvanced-entries__boxWithShadow {
padding: 2rem 0;
}
.quiqqer-boxContentAdvanced-entries__boxWithShadow .quiqqer-boxContentAdvanced-entry {
box-shadow: 0 20px 40px -12px rgba(0,0,0,0.13);
background-color: #fff;
}
.quiqqer-boxContentAdvanced-entries__boxWithShadow .quiqqer-boxContentAdvanced-entry-img {
background: #f8f8f8;
margin-bottom: 1rem;
text-align: center;
}
.quiqqer-boxContentAdvanced-entries__boxWithShadow header {
padding-left: 1rem;
padding-right: 1rem;
}
.quiqqer-boxContentAdvanced-entries__boxWithShadow .quiqqer-boxContentAdvanced-entry-content {
padding: 1rem 1rem 0;
}
.quiqqer-boxContentAdvanced-entries__boxWithShadow .quiqqer-boxContentAdvanced-entry-img .fa {
margin-bottom: 3rem;
margin-top: 3rem;
}
.quiqqer-boxContentAdvanced-entries__boxWithShadow .centerText header,
.quiqqer-boxContentAdvanced-entries__boxWithShadow .centerText .quiqqer-boxContentAdvanced-entry-content {
text-align: center;
}
\ No newline at end of file
<div class="quiqqer-boxContentAdvanced-entries quiqqer-boxContentAdvanced__standard"> <div class="quiqqer-boxContentAdvanced-entries quiqqer-boxContentAdvanced-entries__boxWithShadow">
{assign var=centerTex value=''}
{if $centerText}
{assign var=centerText value='centerText'}
{/if}
{foreach from=$entries item=entry} {foreach from=$entries item=entry}
<div class="quiqqer-boxContentAdvanced-entry-container quiqqer-boxContentAdvanced{$entriesPerLine}" <div class="quiqqer-boxContentAdvanced-entry-container quiqqer-boxContentAdvanced{$entriesPerLine} {$centerText}"
{if $entry.entryOrder}style="order: {$entry.entryOrder}"{/if}> {if $entry.entryOrder}style="order: {$entry.entryOrder}"{/if}>
<div class="quiqqer-boxContentAdvanced-entry"> <div class="quiqqer-boxContentAdvanced-entry">
{if $entry.entryImage} {if $entry.entryImage}
......
...@@ -51,3 +51,19 @@ ...@@ -51,3 +51,19 @@
.quiqqer-boxContentAdvanced-10 { .quiqqer-boxContentAdvanced-10 {
width: 10%; width: 10%;
} }
@media screen and (max-width: 767px) {
.quiqqer-boxContentAdvanced-entries .quiqqer-boxContentAdvanced-entry-container {
flex: 1 0 280px;
}
}
.quiqqer-boxContentAdvanced-entry-img picture,
.quiqqer-boxContentAdvanced-entry-img img {
width: auto;
}
.quiqqer-boxContentAdvanced-entry-img .fa {
font-size: 60px;
margin-bottom: 2rem;
}
\ No newline at end of file
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
</div> </div>
{/if} {/if}
<div class="quiqqer-boxContentAdvanced-wrapper grid-children"> <div class="quiqqer-boxContentAdvanced-wrapper grid-children template-{$this->getAttribute('template')}">
<div class="grid-children-container"> <div class="grid-children-container">
{$entriesTemplate} {$entriesTemplate}
</div> </div>
......
.quiqqer-boxContentAdvanced-entry-img { .quiqqer-boxContentAdvanced-entries__standard .quiqqer-boxContentAdvanced-entry-img {
margin-bottom: 2rem; margin-bottom: 2rem;
text-align: center; text-align: center;
} }
.quiqqer-boxContentAdvanced-entry-img picture { .quiqqer-boxContentAdvanced-entries__standard .quiqqer-boxContentAdvanced-entry-img picture {
display: block;
height: 250px; height: 250px;
width: auto !important;
} }
.quiqqer-boxContentAdvanced-entry-img .fa { .quiqqer-boxContentAdvanced-entries__standard .quiqqer-boxContentAdvanced-entry-title {
font-size: 40px;
margin-bottom: 2rem;
}
.quiqqer-boxContentAdvanced-entry-container.centerText .quiqqer-boxContentAdvanced-entry header {
text-align: center;
}
.quiqqer-boxContentAdvanced-entry-title {
font-size: 1.25rem; font-size: 1.25rem;
} }
.quiqqer-boxContentAdvanced-entry-subTitle { .quiqqer-boxContentAdvanced-entries__standard .quiqqer-boxContentAdvanced-entry-subTitle {
font-size: 0.9rem; font-size: 0.9rem;
} }
.quiqqer-boxContentAdvanced-entry-container.centerText .quiqqer-boxContentAdvanced-entry-content { .quiqqer-boxContentAdvanced-entries__standard .quiqqer-boxContentAdvanced-entry-content *:last-child {
text-align: center; margin-bottom: 0;
} }
.quiqqer-boxContentAdvanced-entry-content *:last-child { .quiqqer-boxContentAdvanced-entries__standard .centerText header,
margin-bottom: 0; .quiqqer-boxContentAdvanced-entries__standard .centerText .quiqqer-boxContentAdvanced-entry-content {
text-align: center;
} }
@media screen and (max-width: 767px) { @media screen and (max-width: 767px) {
.quiqqer-boxContentAdvanced-entry-container { .quiqqer-boxContentAdvanced-entries__standard .quiqqer-boxContentAdvanced-entry-img picture {
flex: 1 0 280px;
}
.quiqqer-boxContentAdvanced-entry-img picture {
height: auto; height: auto;
} }
} }
\ No newline at end of file
<div class="quiqqer-boxContentAdvanced-entries quiqqer-boxContentAdvanced__standard"> <div class="quiqqer-boxContentAdvanced-entries quiqqer-boxContentAdvanced-entries__standard">
{assign var=centerTex value=''} {assign var=centerTex value=''}
{if $centerText} {if $centerText}
{assign var=centerText value='centerText'} {assign var=centerText value='centerText'}
......
0% Lade oder .
You are about to add 0 people to the discussion. Proceed with caution.
Bearbeitung dieser Nachricht zuerst beenden!
Bitte registrieren oder zum Kommentieren