Skip to content

M
makura-2025
Commit c9b85799 by jhukal9@gmail.com
Options

updated the card with similar size

parent c751524e
Showing with 197 additions and 22 deletions
assets/css/style.css
This source diff could not be displayed because it is too large. You can view the blob instead.
assets/js/script.js
......@@ -38,7 +38,7 @@
});
},
{
threshold: 0.1,
threshold: 0.5,
},
);
$(".resource-block").each(function () {
......
blocks/custom-banner-with-right-image.php
......@@ -18,7 +18,12 @@ $(section).addClass(".inner-banner-absolute-image)
</div>
</div>
<div class="col-lg-5 col-md-5 mx-auto col-12 text-center right-image">
<div class="image-wrapper">
<!--
if(absolute-image){
$(image-wrapper).addClass("slide-up);
}
-->
<div class="image-wrapper slide-up">
<div class="image">
<!--<?php if($image = get_field('image')): echo wp_get_attachment_image($image); endif;?>-->
......
dev/sass/base/_makura-new.scss
footer {
position: relative;
z-index: 1;
}
.makura-new {
h6 {
font-size: 18px !important;
line-height: 24px;
letter-spacing: -0.294px;
}
ul,
ol {
margin: 0;
......@@ -23,12 +29,45 @@
}
}
svg,
rect,
path {
transition: all 0.25s ease-in-out;
}
.mc-btn-underlined {
font-weight: 600;
text-decoration: underline;
text-underline-offset: 2px;
}
.btn-primary {
position: relative;
z-index: 1;
overflow: hidden;
&::before {
content: "";
position: absolute;
inset: 0;
transform: translateX(-150%);
opacity: 0;
visibility: hidden;
background-color: $background-dark;
transition: all 0.25s ease-in-out;
z-index: -1;
}
&:hover {
transform: translateY(0);
&::before {
transform: translateX(0);
opacity: 1;
visibility: visible;
}
}
}
.sm-text {
font-size: 1.125rem !important;
line-height: 22px;
......@@ -55,6 +94,13 @@
.faq-item {
padding: 16px 0;
&:first-child {
padding-top: 0;
}
&:last-child {
padding-bottom: 0;
}
&:not(:last-child) {
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
......
dev/sass/pages/resources/_resource-detail.scss
......@@ -33,12 +33,48 @@
}
}
}
}
li,
p,
strong {
strong,
a {
font-size: 1.5rem;
}
strong {
font-weight: 500;
}
.rd-footer-action-group {
padding-top: 32px;
margin-top: 40px;
border-top: 1px solid rgba(0, 0, 0, 0.1);
.rd-socials {
margin-top: 20px;
strong {
display: block;
margin-bottom: 8px;
}
ul {
gap: 8px;
li {
a {
&:hover {
svg {
fill: $primary;
rect {
stroke: $primary;
}
path {
fill: #fff;
}
}
}
}
}
}
}
}
}
......@@ -53,11 +89,32 @@
margin-top: 48px;
}
}
}
li,
p,
strong {
strong,
a {
font-size: 1.125rem;
}
.rd-footer-action-group {
.rd-socials {
margin-top: 0;
}
}
}
}
@media (min-width: 992px) {
.resource-detail {
.rd-footer-action-group {
.rd-socials {
gap: 16px;
strong {
margin-bottom: 0;
}
}
}
}
}
dev/sass/pages/resources/_resource-listing.scss
......@@ -31,9 +31,12 @@
}
}
.rc-detail {
> p {
margin-bottom: 1.25rem;
margin-bottom: 16px;
}
}
h4,
h5,
h6,
......@@ -109,6 +112,10 @@
}
}
}
.resource-item {
height: 100%;
}
}
}
}
......@@ -159,10 +166,17 @@
.resource-item {
.resource-image {
height: unset;
max-width: 30%;
width: 30%;
min-width: 30%;
max-height: 180px;
overflow: hidden;
}
.resource-content {
padding: 16px 12px 16px 20px;
display: flex;
flex-direction: column;
justify-content: space-between;
a.mc-btn-underlined {
opacity: 0;
visibility: hidden;
......@@ -188,19 +202,3 @@
}
}
}
@media (min-width: 1440px) {
.resource-listing {
.resource-wrapper {
.resource-block {
.resource-item {
.resource-content {
display: flex;
flex-direction: column;
justify-content: center;
}
}
}
}
}
}
template-parts/resource-page/resource-detail.php
......@@ -69,6 +69,75 @@
</div>
</div>
</div>
<div class="rd-footer-action-group">
<div class="row">
<div class="col-md-6 col-lg-4 order-md-2">
<a href="#"
class="btn btn-primary btn-padding hover-up btn-start-project font-14 fw-500 btn-padding btn-submit">Download
Now [PDF]</a>
</div>
<div class="col-md-6 col-lg-8 order-md-1">
<div class="rd-socials d-lg-flex align-items-lg-center ">
<strong>Share this Template</strong>
<ul class="d-flex align-items-center justify-content-start">
<li>
<a href="#">
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="0.5" y="0.5" width="31" height="31" rx="15.5" stroke="#878787" />
<path
d="M19.7188 17H17.375V24H14.25V17H11.6875V14.125H14.25V11.9062C14.25 9.40625 15.75 8 18.0312 8C19.125 8 20.2812 8.21875 20.2812 8.21875V10.6875H19C17.75 10.6875 17.375 11.4375 17.375 12.25V14.125H20.1562L19.7188 17Z"
fill="#878787" />
</svg>
</a>
</li>
<li>
<a href="#"><svg width="32" height="32" viewBox="0 0 32 32" fill="none"
xmlns="http://www.w3.org/2000/svg">
<rect x="0.5" y="0.5" width="31" height="31" rx="15.5" stroke="#878787" />
<path
d="M22.3438 12.75C22.3438 12.9062 22.3438 13.0312 22.3438 13.1875C22.3438 17.5312 19.0625 22.5 13.0312 22.5C11.1562 22.5 9.4375 21.9688 8 21.0312C8.25 21.0625 8.5 21.0938 8.78125 21.0938C10.3125 21.0938 11.7188 20.5625 12.8438 19.6875C11.4062 19.6562 10.1875 18.7188 9.78125 17.4062C10 17.4375 10.1875 17.4688 10.4062 17.4688C10.6875 17.4688 11 17.4062 11.25 17.3438C9.75 17.0312 8.625 15.7188 8.625 14.125V14.0938C9.0625 14.3438 9.59375 14.4688 10.125 14.5C9.21875 13.9062 8.65625 12.9062 8.65625 11.7812C8.65625 11.1562 8.8125 10.5938 9.09375 10.125C10.7188 12.0938 13.1562 13.4062 15.875 13.5625C15.8125 13.3125 15.7812 13.0625 15.7812 12.8125C15.7812 11 17.25 9.53125 19.0625 9.53125C20 9.53125 20.8438 9.90625 21.4688 10.5625C22.1875 10.4062 22.9062 10.125 23.5312 9.75C23.2812 10.5312 22.7812 11.1562 22.0938 11.5625C22.75 11.5 23.4062 11.3125 23.9688 11.0625C23.5312 11.7188 22.9688 12.2812 22.3438 12.75Z"
fill="#878787" />
</svg>
</a>
</li>
<li>
<a href="#"><svg width="32" height="32" viewBox="0 0 32 32" fill="none"
xmlns="http://www.w3.org/2000/svg">
<rect x="0.5" y="0.5" width="31" height="31" rx="15.5" stroke="#878787" />
<path
d="M12.125 22H9.21875V12.6562H12.125V22ZM10.6562 11.4062C9.75 11.4062 9 10.625 9 9.6875C9 8.78125 9.75 8.03125 10.6562 8.03125C11.5938 8.03125 12.3438 8.78125 12.3438 9.6875C12.3438 10.625 11.5938 11.4062 10.6562 11.4062ZM22.9688 22H20.0938V17.4688C20.0938 16.375 20.0625 15 18.5625 15C17.0625 15 16.8438 16.1562 16.8438 17.375V22H13.9375V12.6562H16.7188V13.9375H16.75C17.1562 13.2188 18.0938 12.4375 19.5 12.4375C22.4375 12.4375 23 14.375 23 16.875V22H22.9688Z"
fill="#878787" />
</svg>
</a>
</li>
<li>
<a href="#">
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="0.5" y="0.5" width="31" height="31" rx="15.5" stroke="#878787" />
<path
d="M24.1562 11.9062C24.5312 13.2188 24.5312 16.0312 24.5312 16.0312C24.5312 16.0312 24.5312 18.8125 24.1562 20.1562C23.9688 20.9062 23.375 21.4688 22.6562 21.6562C21.3125 22 16 22 16 22C16 22 10.6562 22 9.3125 21.6562C8.59375 21.4688 8 20.9062 7.8125 20.1562C7.4375 18.8125 7.4375 16.0312 7.4375 16.0312C7.4375 16.0312 7.4375 13.2188 7.8125 11.9062C8 11.1562 8.59375 10.5625 9.3125 10.375C10.6562 10 16 10 16 10C16 10 21.3125 10 22.6562 10.375C23.375 10.5625 23.9688 11.1562 24.1562 11.9062ZM14.25 18.5625L18.6875 16.0312L14.25 13.5V18.5625Z"
fill="#878787" />
</svg>
</a>
</li>
<li>
<a href="#">
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="0.5" y="0.5" width="31" height="31" rx="15.5" stroke="#878787" />
<path
d="M16 12.4062C17.9688 12.4062 19.5938 14.0312 19.5938 16C19.5938 18 17.9688 19.5938 16 19.5938C14 19.5938 12.4062 18 12.4062 16C12.4062 14.0312 14 12.4062 16 12.4062ZM16 18.3438C17.2812 18.3438 18.3125 17.3125 18.3125 16C18.3125 14.7188 17.2812 13.6875 16 13.6875C14.6875 13.6875 13.6562 14.7188 13.6562 16C13.6562 17.3125 14.7188 18.3438 16 18.3438ZM20.5625 12.2812C20.5625 12.75 20.1875 13.125 19.7188 13.125C19.25 13.125 18.875 12.75 18.875 12.2812C18.875 11.8125 19.25 11.4375 19.7188 11.4375C20.1875 11.4375 20.5625 11.8125 20.5625 12.2812ZM22.9375 13.125C23 14.2812 23 17.75 22.9375 18.9062C22.875 20.0312 22.625 21 21.8125 21.8438C21 22.6562 20 22.9062 18.875 22.9688C17.7188 23.0312 14.25 23.0312 13.0938 22.9688C11.9688 22.9062 11 22.6562 10.1562 21.8438C9.34375 21 9.09375 20.0312 9.03125 18.9062C8.96875 17.75 8.96875 14.2812 9.03125 13.125C9.09375 12 9.34375 11 10.1562 10.1875C11 9.375 11.9688 9.125 13.0938 9.0625C14.25 9 17.7188 9 18.875 9.0625C20 9.125 21 9.375 21.8125 10.1875C22.625 11 22.875 12 22.9375 13.125ZM21.4375 20.125C21.8125 19.2188 21.7188 17.0312 21.7188 16C21.7188 15 21.8125 12.8125 21.4375 11.875C21.1875 11.2812 20.7188 10.7812 20.125 10.5625C19.1875 10.1875 17 10.2812 16 10.2812C14.9688 10.2812 12.7812 10.1875 11.875 10.5625C11.25 10.8125 10.7812 11.2812 10.5312 11.875C10.1562 12.8125 10.25 15 10.25 16C10.25 17.0312 10.1562 19.2188 10.5312 20.125C10.7812 20.75 11.25 21.2188 11.875 21.4688C12.7812 21.8438 14.9688 21.75 16 21.75C17 21.75 19.1875 21.8438 20.125 21.4688C20.7188 21.2188 21.2188 20.75 21.4375 20.125Z"
fill="#878787" />
</svg>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment