Skip to content

M
makura-2025
Commit 912412bf by rajshah
Options

Merge branch 'dev' of gitlab.makuracreations.xyz:rajshah/makura-2025 into dev

parents 953ab59a 9a912761
Showing with 1504 additions and 475 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
...@@ -25,6 +25,7 @@ ...@@ -25,6 +25,7 @@
/** GLOBAL SCROLL INTO VIEW CONTROLLER START HERE*/ /** GLOBAL SCROLL INTO VIEW CONTROLLER START HERE*/
$(function () { $(function () {
$(".makura-new a[data-target]").on("click", function (e) { $(".makura-new a[data-target]").on("click", function (e) {
console.log("clicked data target");
e.preventDefault(); e.preventDefault();
$(this).parent().addClass("active").siblings().removeClass("active"); $(this).parent().addClass("active").siblings().removeClass("active");
const currentActive = $(this).data("target"); const currentActive = $(this).data("target");
...@@ -37,6 +38,35 @@ ...@@ -37,6 +38,35 @@
}); });
} }
}); });
const observer = new IntersectionObserver(
function (entries) {
entries.forEach((entry) => {
if (entry.isIntersecting) {
const currentActive = entry.target.getAttribute("id");
console.log(currentActive);
$(".makura-new a[data-target]").each(function () {
if ($(this).data("target") === currentActive) {
$(this)
.parent()
.addClass("active")
.siblings()
.removeClass("active");
}
});
}
});
},
{
threshold: 0.2,
},
);
$(".portfolio-block").each(function () {
observer.observe(this);
});
}); });
/** GLOBAL SCROLL INTO VIEW CONTROLLER ENDS HERE*/ /** GLOBAL SCROLL INTO VIEW CONTROLLER ENDS HERE*/
...@@ -80,51 +110,85 @@ ...@@ -80,51 +110,85 @@
/** MOBILE OFFCANVAS TOC START HERE */ /** MOBILE OFFCANVAS TOC START HERE */
$(function () { $(function () {
$(".blog-side-bar h6").on("click", function () { $(".toc h6").on("click", function () {
$(this).addClass("remove"); $(this).addClass("remove");
$(".category-list").addClass("active"); $(".category-list").addClass("active");
}); });
$(".category-list a").on("click", function () { $(".category-list a").on("click", function () {
$(".blog-side-bar h6").removeClass("remove"); $(".toc h6").removeClass("remove");
$(".category-list").removeClass("active"); $(".category-list").removeClass("active");
}); });
$(document).on("click", function (e) { $(document).on("click", function (e) {
if (!$(e.target).closest(".blog-side-bar").length) { if (!$(e.target).closest(".toc").length) {
$(".blog-side-bar h6").removeClass("remove"); $(".toc h6").removeClass("remove");
$(".category-list").removeClass("active"); $(".category-list").removeClass("active");
} }
}); });
$(window).on("scroll", function () { $(window).on("scroll", function () {
$(".blog-side-bar h6").removeClass("remove"); $(".toc h6").removeClass("remove");
$(".category-list").removeClass("active"); $(".category-list").removeClass("active");
}); });
const tocObserver = new IntersectionObserver( // const tocObserver = new IntersectionObserver(
function (entries) { // function (entries) {
entries.forEach((entry) => { // entries.forEach((entry) => {
if (entry.isIntersecting) { // if (entry.isIntersecting) {
$(".blog-side-bar h6").show(); // $(".toc h6").show();
} else { // console.log("is intersecting")
$(".blog-side-bar h6").hide(); // } else {
} // $(".toc h6").hide();
}); // console.log("is not intersecting")
}, // }
{ // });
threshold: 0.1, // },
}, // {
); // threshold: 0.1,
// },
// );
// const sections = [
// document.querySelector(".BLOGDETAIL-LIST-ITEM-SECTION"),
// document.querySelector(".BLOGLISTING-LIST-ITEM-SECTION"),
// document.querySelector(".case-study-general"),
// ];
// sections.length &&
// sections.forEach((section) => {
// if (section) tocObserver.observe(section);
// });
const sections = [ const sections = [
document.querySelector(".BLOGDETAIL-LIST-ITEM-SECTION"), document.querySelector(".BLOGDETAIL-LIST-ITEM-SECTION"),
document.querySelector(".BLOGLISTING-LIST-ITEM-SECTION"), document.querySelector(".BLOGLISTING-LIST-ITEM-SECTION"),
document.querySelector(".case-study-general"),
]; ];
sections.length &&
sections.forEach((section) => { // Filter out any null sections
if (section) tocObserver.observe(section); const validSections = sections.filter(Boolean);
});
if (validSections.length) {
const handleScroll = () => {
const scrollTop = $(window).scrollTop();
const viewportHeight = $(window).height();
if (scrollTop > viewportHeight) {
$(".toc h6").show();
console.log("Scrolled past 100vh");
} else {
$(".toc h6").hide();
console.log("Above 100vh");
}
};
// Bind scroll event
$(window).on("scroll", handleScroll);
// Run on page load too
$(document).ready(handleScroll);
}
}); });
/** MOBILE OFFCANVAS TOC ENDS HERE */ /** MOBILE OFFCANVAS TOC ENDS HERE */
...@@ -178,4 +242,102 @@ ...@@ -178,4 +242,102 @@
}); });
}); });
/** GALLERY LIGHT BOX AND DYNAMIC SLIDER ENDS HERE */ /** GALLERY LIGHT BOX AND DYNAMIC SLIDER ENDS HERE */
/** CASE STUDY DETAIL */
$(function () {
// Handle click on TOC items
$(".case-study-general .category-list a[data-target]").on("click", function (e) {
e.preventDefault();
// Update active class on TOC items
$(this).parent("li").addClass("active").siblings("li").removeClass("active");
// Scroll to the target section
var currentActive = $(this).data("target");
document.getElementById(currentActive)?.scrollIntoView({
behavior: "smooth",
});
});
function handleTocActiveOnScroll(offset = 100) {
let currentId = null;
// Check all h2 elements with IDs in the content area
$(".case-study-general-content h2[id]").each(function () {
const elementTop = $(this).offset().top;
const scrollPosition = $(window).scrollTop() + offset;
if (elementTop <= scrollPosition) {
currentId = $(this).attr("id");
}
});
// Update active TOC item if a section is in view
if (currentId) {
$(".case-study-general .category-list li").removeClass("active");
$(`.case-study-general .category-list a[data-target="${currentId}"]`)
.parent("li")
.addClass("active");
}
}
// Handle scroll events
$(window).on("load scroll", function () {
handleTocActiveOnScroll();
});
});
$(function () {
// Wrap tables inside .table-responsive
$(".case-study-general-content table").each(function () {
const $table = $(this);
if (!$table.parent().hasClass("table-responsive")) {
$table.wrap('<div class="table-responsive"></div>');
}
});
})
/** CUSTOM FILTER */
// $(function () {
// $(".case-study-filter a").on("click", function (e) {
// e.preventDefault();
// $(".case-study-filter a").removeClass("active");
// $(this).addClass("active");
// const currentActive = $(this).data("filter"); // e.g. "design", "dev", etc.
// // Show all items first
// $(".case-study-listing .row > div").removeClass("d-none");
// if (currentActive !== "") {
// $(".case-study-listing .row > div").each(function () {
// if (!$(this).hasClass(currentActive)) {
// $(this).addClass("d-none");
// }
// });
// }
// });
// });
/** CASE STUDY LOAD MORE */
$(function () {
$(".load-hidden-item").on("click", function (e) {
e.preventDefault();
var items = $(".case-study-listing .extra-item");
var isVisible = items.is(":visible");
if (isVisible) {
items.slideUp();
$(this).find("span").text("Load More");
$(this).parent().removeClass("show-less");
} else {
items.slideDown();
$(this).find("span").text("Show Less");
$(this).parent().addClass("show-less");
}
})
})
})(jQuery); })(jQuery);
assets/js/spider-framework.js
...@@ -58,8 +58,8 @@ ...@@ -58,8 +58,8 @@
var m = normal.length2(); var m = normal.length2();
normal.mutableScale( normal.mutableScale(
((this.distance * this.distance - m) / m) * ((this.distance * this.distance - m) / m) *
this.stiffness * this.stiffness *
stepCoef stepCoef
); );
this.a.pos.mutableAdd(normal); this.a.pos.mutableAdd(normal);
this.b.pos.mutableSub(normal); this.b.pos.mutableSub(normal);
...@@ -81,7 +81,7 @@ ...@@ -81,7 +81,7 @@
PinConstraint.prototype.draw = function (ctx) { PinConstraint.prototype.draw = function (ctx) {
ctx.beginPath(); ctx.beginPath();
ctx.arc(this.pos.x, this.pos.y, 6, 0, 2 * Math.PI); ctx.arc(this.pos.x, this.pos.y, 6, 0, 2 * Math.PI);
ctx.fillStyle = "rgba(0,153,255,0.1)"; ctx.fillStyle = "#ddd";
ctx.fill(); ctx.fill();
}; };
function AngleConstraint(a, b, c, stiffness) { function AngleConstraint(a, b, c, stiffness) {
...@@ -109,7 +109,7 @@ ...@@ -109,7 +109,7 @@
ctx.lineTo(this.c.pos.x, this.c.pos.y); ctx.lineTo(this.c.pos.x, this.c.pos.y);
var tmp = ctx.lineWidth; var tmp = ctx.lineWidth;
ctx.lineWidth = 5; ctx.lineWidth = 5;
ctx.strokeStyle = "rgba(255,255,0,0.2)"; ctx.strokeStyle = "red";
ctx.stroke(); ctx.stroke();
ctx.lineWidth = tmp; ctx.lineWidth = tmp;
}; };
...@@ -286,7 +286,7 @@ ...@@ -286,7 +286,7 @@
assert( assert(
"normal", "normal",
Math.abs(normal.length() - 1) <= 1e-5 && Math.abs(normal.length() - 1) <= 1e-5 &&
normal.epsilonEquals(new Vec2(0.4472, 0.89443), 1e-4) normal.epsilonEquals(new Vec2(0.4472, 0.89443), 1e-4)
); );
assert("dot", new Vec2(2, 3).dot(new Vec2(4, 1)) == 11); assert("dot", new Vec2(2, 3).dot(new Vec2(4, 1)) == 11);
assert( assert(
...@@ -296,8 +296,8 @@ ...@@ -296,8 +296,8 @@
assert( assert(
"angle2", "angle2",
new Vec2(1, 1).angle2(new Vec2(1, 0), new Vec2(2, 1)) * new Vec2(1, 1).angle2(new Vec2(1, 0), new Vec2(2, 1)) *
(180 / Math.PI) == (180 / Math.PI) ==
90 90
); );
assert( assert(
"rotate", "rotate",
...@@ -466,7 +466,7 @@ ...@@ -466,7 +466,7 @@
this.mouseDown = false; this.mouseDown = false;
this.draggedEntity = null; this.draggedEntity = null;
this.selectionRadius = 20; this.selectionRadius = 20;
this.highlightColor = "#4f545c"; this.highlightColor = "#fff";
this.bounds = function (particle) { this.bounds = function (particle) {
if (particle.pos.y > this.height - 1) if (particle.pos.y > this.height - 1)
particle.pos.y = this.height - 1; particle.pos.y = this.height - 1;
......
assets/js/style.js
...@@ -274,25 +274,38 @@ ...@@ -274,25 +274,38 @@
}); });
//customer-feedback-course-detail //customer-feedback-course-detail
$(".client-carouselwrapper").owlCarousel({ $(".client-carouselwrapper").each(function (index) {
loop: false, const isSecond = index === 1;
autoplay: true,
margin: 20, $(this).owlCarousel({
nav: false, loop: true,
dots: false, margin: 20,
responsive: { nav: false,
0: { dots: false,
items: 3, autoplay: true,
}, rtl: isSecond,
600: { slideTransition: "linear",
items: 4, autoplayTimeout: 3000,
autoplaySpeed: 3000,
// autoplayHoverPause: true,
responsive: {
0: {
items: 3,
},
600: {
items: 4,
},
1000: {
items: 5,
},
1200: {
items: 8,
},
}, },
1000: { });
items: 5,
},
},
}); });
//more-course-section //more-course-section
$(".more-course-section").owlCarousel({ $(".more-course-section").owlCarousel({
loop: false, loop: false,
...@@ -433,19 +446,6 @@ ...@@ -433,19 +446,6 @@
// }); // });
// }); // });
var lastScrollTop = 0;
$(window).scroll(function (event) {
$(".menu-item-has-children").removeClass("show");
var thisValue = $(this).scrollTop();
if (thisValue == 0) {
$(".navbar").removeClass("sticky-top");
} else if (thisValue > lastScrollTop) {
$(".navbar").removeClass("sticky-top");
} else {
$(".navbar").addClass("sticky-top");
}
lastScrollTop = thisValue;
});
$(".button-close").click(function () { $(".button-close").click(function () {
$(".modal-dialog").addClass("addCss"); $(".modal-dialog").addClass("addCss");
...@@ -479,17 +479,53 @@ ...@@ -479,17 +479,53 @@
}, },
}); });
$(function () {
let lastScrollTop = 0;
let scrollTimeout;
$(window).on("scroll", function () {
clearTimeout(scrollTimeout);
const scrollTop = $(this).scrollTop();
scrollTimeout = setTimeout(() => {
$(".menu-item-has-children").removeClass("show");
if (scrollTop > 120 && scrollTop < lastScrollTop) {
$(".navbar").addClass("sticky-top");
$(".sticky-tab").addClass("sticky-with-header");
} else {
$(".navbar").removeClass("sticky-top");
$(".sticky-tab").removeClass("sticky-with-header");
}
lastScrollTop = scrollTop;
}, 100);
});
})
// returntotop // returntotop
$(window).scroll(function () { $(function () {
if ($(this).scrollTop() >= 200) { let lastScrollTop = 0;
$("#return-to-top").show(200);
} else { $(window).scroll(function () {
$("#return-to-top").hide(200); let currentScrollTop = $(this).scrollTop();
}
}); // Only show if scrolling up and scrolled at least 200px
$("#return-to-top").click(function () { if (currentScrollTop < lastScrollTop && currentScrollTop >= 200) {
$("body,html").animate({ scrollTop: 0 }, 1000); $("#return-to-top").fadeIn(200);
}); } else {
$("#return-to-top").fadeOut(200);
}
lastScrollTop = currentScrollTop;
});
$("#return-to-top").click(function () {
$("html, body").animate({ scrollTop: 0 }, 1000);
});
})
//thankyou message for comment in blog-detail //thankyou message for comment in blog-detail
$("#submitBtn").click(function () { $("#submitBtn").click(function () {
......
blocks/custom-banner-with-right-image.php
<?php if (get_field('enable_section')): ?> <?php if (get_field('enable_section')): ?>
<section class="background-dark pb-60 ABOUT TOP-BANNER-SECTION"> <section class="background-dark pb-60 ABOUT TOP-BANNER-SECTION">
<div class="container"> <div class="container">
<div class="inner-banner-wrapper"> <div class="inner-banner-wrapper">
<div class="row align-items-center justify-content-between"> <div class="row align-items-start justify-content-between">
<div class="col-lg-6 col-12"> <div class="col-lg-6 col-12">
<div class="position-relative left-text-wrapper"> <div class="position-relative left-text-wrapper">
<?php the_field('description'); ?> <?php the_field('description'); ?>
</div>
</div> </div>
<div class="col-lg-5 col-md-5 mx-auto col-12 text-center right-image"> </div>
<div class="image-wrapper"> <div class="col-lg-5 col-md-5 mx-auto col-12 text-center right-image">
<div class="image"> <div class="image-wrapper">
<?php <div class="image">
<?php
$image = get_field('image'); $image = get_field('image');
$size = 'full'; $size = 'full';
if ($image) { if ($image) {
echo wp_get_attachment_image($image, $size); echo wp_get_attachment_image($image, $size);
} ?> } ?>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</section> </div>
</section>
<?php endif; ?> <?php endif; ?>
\ No newline at end of file
blocks/partners-carousel.php
<?php if (get_field('enable_partners_carousel_section')) : ?> <?php if (get_field('enable_partners_carousel_section')) : ?>
<section class="py-80 container-fluid HOME TOP-CAROUSEL-SECTION reversed"> <section class="py-80 container-fluid HOME TOP-CAROUSEL-SECTION reversed">
<div class="container"> <div class="container">
<div class="row mb-60 pb-60 border-bottom"> <div class="row mb-60 pb-60 border-bottom">
<div class="mb-3 text-center title-wrapper"> <div class="mb-3 text-center title-wrapper">
<h5><?php echo get_field('pc_title'); ?></h5> <h5><?php echo get_field('pc_title'); ?></h5>
</div> </div>
<div class="col-lg-10 mx-auto"> <div class="">
<div class="client-carouselwrapper owl-carousel owl-theme"> <div class="client-carouselwrapper owl-carousel owl-theme mb-4">
<?php <?php
if (have_rows('pc_partners_list')) : if (have_rows('pc_partners_list')) :
while (have_rows('pc_partners_list')) : the_row(); ?> while (have_rows('pc_partners_list')) : the_row(); ?>
<!--<a target="_blank" href="<?php echo get_sub_field('link'); ?>" class="item">--> <!--<a target="_blank" href="<?php echo get_sub_field('link'); ?>" class="item">-->
<!--<a href="" onclick="return false;" class="item">--> <!--<a href="" onclick="return false;" class="item">-->
<?php <?php
$image = get_sub_field('logo'); $image = get_sub_field('logo');
$size = 'full'; // (thumbnail, medium, large, full or custom size) $size = 'full'; // (thumbnail, medium, large, full or custom size)
if ($image) { if ($image) {
echo wp_get_attachment_image($image, $size); echo wp_get_attachment_image($image, $size);
} ?> } ?>
<!--</a>--> <!--</a>-->
<?php endwhile; <?php endwhile;
endif; ?> endif; ?>
</div>
</div> </div>
<div class="client-carouselwrapper owl-carousel owl-theme">
<?php
$partners = get_field('pc_partners_list'); // Get entire repeater as array
if ($partners) {
$partners = array_reverse($partners); // Reverse the order
foreach ($partners as $partner) {
$image = $partner['logo'];
$size = 'full'; // thumbnail, medium, large, full or custom size
if ($image) {
echo wp_get_attachment_image($image, $size);
}
}
}
?>
</div>
</div> </div>
</div> </div>
</section> </div>
</section>
<?php endif; ?> <?php endif; ?>
\ No newline at end of file
blocks/portfolio-banner.php
<section class="bg-primary pb-60 PD-TOP-SECTION makura-new"> <section class="bg-primary pb-60 PD-TOP-SECTION makura-new">
<div class="container"> <div class="container">
<div class="row justify-content-between"> <div class="row justify-content-between">
<div class="col-lg-7 title-wrapper"> <div class="col-lg-7 title-wrapper">
<div class="portfolio-detail-content-box pb-40"> <div class="portfolio-detail-content-box pb-40">
<?php the_field('description'); ?> <?php the_field('description'); ?>
</div>
<?php if ($link = get_field('link')):
$link_target = $link['target'] ? $link['target'] : '_self'; ?>
<a href="<?php echo $link['url']; ?>" target="_blank" class="open-in-new-tab d-none d-lg-inline-block">
<?php echo $link['title']; ?>
<svg width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M14.3379 4.552L2.8619 16.028L0.976562 14.1427L12.4512 2.66667H2.3379V0H17.0046V14.6667H14.3379V4.552Z"
fill="#005AFF" />
</svg>
</a>
<?php endif; ?>
</div>
<div class="col-lg-4 col-xl-3">
<div class="client-logo-wrapper d-none d-lg-block">
<?php if ($image = get_field('client_logo')):
echo wp_get_attachment_image($image, 'full');
endif; ?>
</div>
<?php
$sof_title = get_field('sof_title') ?: 'Scope of Work';
if ($scope = get_field('scope_of_work')): ?>
<div class="scope-work-wrapper">
<?php if (!empty($sof_title)): ?><span
class="sm-text"><?php echo $sof_title; ?></span><?php endif; ?>
<ul class="list-unstyled">
<?php echo $scope; ?>
</ul>
</div>
<?php endif; ?>
</div>
</div> </div>
<?php if ($link = get_field('link')): <?php if ($link = get_field('link')):
$link_target = $link['target'] ? $link['target'] : '_self'; ?> $link_target = $link['target'] ? $link['target'] : '_self'; ?>
<a href="<?php echo $link['url']; ?>" target="_blank" class="open-in-new-tab d-none d-lg-inline-block"> <a href="<?php echo $link['url']; ?>" target="_blank" class="open-in-new-tab d-lg-none">
<?php echo $link['title']; ?> <?php echo $link['title']; ?>
<svg width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <svg width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg">
<path <path
d="M14.3379 4.552L2.8619 16.028L0.976562 14.1427L12.4512 2.66667H2.3379V0H17.0046V14.6667H14.3379V4.552Z" d="M14.3379 4.552L2.8619 16.028L0.976562 14.1427L12.4512 2.66667H2.3379V0H17.0046V14.6667H14.3379V4.552Z"
fill="#005AFF" /> fill="#005AFF" />
</svg> </svg>
</a> </a>
<?php endif; ?> <?php endif; ?>
</div>
<div class="col-lg-4">
<div class="client-logo-wrapper d-none d-lg-block">
<?php if ($image = get_field('client_logo')):
echo wp_get_attachment_image($image, 'full');
endif; ?>
</div>
<?php
$sof_title = get_field('sof_title')?:'Scope of Work';
if ($scope = get_field('scope_of_work')): ?>
<div class="scope-work-wrapper">
<?php if (!empty($sof_title)): ?><span class="sm-text"><?php echo $sof_title; ?></span><?php endif; ?>
<ul class="list-unstyled">
<?php echo $scope; ?>
</ul>
</div>
<?php endif; ?>
</div>
</div> </div>
<?php if ($link = get_field('link')):
$link_target = $link['target'] ? $link['target'] : '_self'; ?>
<a href="<?php echo $link['url']; ?>" target="_blank" class="open-in-new-tab d-lg-none">
<?php echo $link['title']; ?>
<svg width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M14.3379 4.552L2.8619 16.028L0.976562 14.1427L12.4512 2.66667H2.3379V0H17.0046V14.6667H14.3379V4.552Z"
fill="#005AFF" />
</svg>
</a>
<?php endif; ?>
</div>
</section> </section>
\ No newline at end of file
blocks/portfolio-listing-section.php
<?php if (get_field('enable_section')) : <?php
$terms = get_terms('portfolio-category'); $portfolio_listing = get_field('portfolio_listing') ?: [];
if ($terms) : if (is_array($portfolio_listing) && !empty($portfolio_listing) && isset($portfolio_listing)):
$enable_portfolio_listing = $portfolio_listing['enable_portfolio_listing'] ?? '';
if ($enable_portfolio_listing && !empty($enable_portfolio_listing) && isset($enable_portfolio_listing)):
$terms = get_terms('portfolio-category');
?> ?>
<section class="background-dark mb-60 ABOUT TOP-BANNER-SECTION"> <section class="case-study-filter background-dark mb-60 ABOUT TOP-BANNER-SECTION">
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<ul class="nav nav-pills mb-3" id="pills-tab" role="tablist"> <ul class="nav nav-pills mb-3" id="pills-tab" role="tablist">
...@@ -102,4 +105,5 @@ ...@@ -102,4 +105,5 @@
</div> </div>
</section> </section>
<?php endif; <?php endif;
endif; ?> endif;
\ No newline at end of file ?>
\ No newline at end of file
blocks/portfolio-text-image-section.php
...@@ -128,6 +128,8 @@ if (isset($content) && is_array($content) && !empty($content)): ...@@ -128,6 +128,8 @@ if (isset($content) && is_array($content) && !empty($content)):
$galleries_desc = $galleries['galleries_desc'] ?: ''; $galleries_desc = $galleries['galleries_desc'] ?: '';
$galleries_img = $galleries['galleries_img'] ?: []; $galleries_img = $galleries['galleries_img'] ?: [];
if (isset($galleries_img) && is_array($galleries_img) && !empty($galleries_img)): if (isset($galleries_img) && is_array($galleries_img) && !empty($galleries_img)):
$sanitized_title = !empty($galleries_title) ? sanitize_title_with_dashes(strtok($galleries_title, ' ')) : 'gallery';
$gallery_id = $sanitized_title . '-' . mt_rand(100000, 999999);
?> ?>
<div class="block-gallery makura-new mb-120"> <div class="block-gallery makura-new mb-120">
<div class="container"> <div class="container">
...@@ -156,7 +158,7 @@ if (isset($content) && is_array($content) && !empty($content)): ...@@ -156,7 +158,7 @@ if (isset($content) && is_array($content) && !empty($content)):
</div> </div>
</div> </div>
<div class="gallery-slider-wrapper slide-up"> <div class="gallery-slider-wrapper slide-up">
<div class="gallery-slider owl-carousel " id="ui-ux-gallery"> <div class="gallery-slider owl-carousel " id="ui-ux-<?php echo esc_attr($gallery_id); ?>">
<?php foreach ($galleries_img as $gi => $img): <?php foreach ($galleries_img as $gi => $img):
?> ?>
<div class="gallery-item"> <div class="gallery-item">
......
blocks/resources/resource-listing.php
...@@ -7,43 +7,46 @@ if (isset($resources_listing) && is_array($resources_listing) && !empty($resourc ...@@ -7,43 +7,46 @@ if (isset($resources_listing) && is_array($resources_listing) && !empty($resourc
$resources_items = $resources_listing['resources_items'] ?: []; $resources_items = $resources_listing['resources_items'] ?: [];
if (isset($resources_items) && is_array($resources_items) && !empty($resources_items)): if (isset($resources_items) && is_array($resources_items) && !empty($resources_items)):
?> ?>
<section class="resource-listing py-80 makura-new"> <section class="resource-listing py-80 makura-new">
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-lg-4 col-xl-3"> <div class="col-lg-4 col-xl-3">
<div class="toc slide-up"> <div class="toc slide-up">
<div class="category-list"> <div class="toc-title">
<ul> <h6>Table of Content</h6>
<?php foreach ($resources_items as $ri => $res_item): </div>
<div class="category-list">
<ul>
<?php foreach ($resources_items as $ri => $res_item):
$title = $res_item['title'] ?: ''; $title = $res_item['title'] ?: '';
?> ?>
<li class="<?php echo ($ri === 0) ? 'active' : ''; ?>"><a href="#" class="sm-text" <li class="<?php echo ($ri === 0) ? 'active' : ''; ?>"><a href="#" class="sm-text"
data-target="<?php echo strtolower(str_replace(' ', '-', $title)); ?>"><?php echo esc_html($title); ?></a> data-target="<?php echo strtolower(str_replace(' ', '-', $title)); ?>"><?php echo esc_html($title); ?></a>
</li> </li>
<?php endforeach; ?> <?php endforeach; ?>
</ul> </ul>
</div> </div>
</div> </div>
</div> </div>
<div class="col-lg-8 col-xl-9"> <div class="col-lg-8 col-xl-9">
<div class="resource-wrapper"> <div class="resource-wrapper">
<?php foreach ($resources_items as $ri => $res_item): <?php foreach ($resources_items as $ri => $res_item):
$title = $res_item['title'] ?: ''; $title = $res_item['title'] ?: '';
$desc = $res_item['desc'] ?: ''; $desc = $res_item['desc'] ?: '';
$select_resources = $res_item['select_resources'] ?: []; $select_resources = $res_item['select_resources'] ?: [];
?> ?>
<div class="resource-block slide-up" id="<?php echo strtolower(str_replace(' ', '-', $title)); ?>"> <div class="resource-block slide-up" id="<?php echo strtolower(str_replace(' ', '-', $title)); ?>">
<div class="section-title"> <div class="section-title">
<?php if (!empty($title)): ?> <?php if (!empty($title)): ?>
<h2><?php echo $title; ?></h2><?php endif; ?> <h2><?php echo $title; ?></h2><?php endif; ?>
<?php if (!empty($desc)): <?php if (!empty($desc)):
echo $desc ?: ''; echo $desc ?: '';
endif; ?> endif; ?>
</div> </div>
<?php if (!empty($select_resources) && isset($select_resources) && is_array($select_resources)): ?> <?php if (!empty($select_resources) && isset($select_resources) && is_array($select_resources)): ?>
<div class="resources"> <div class="resources">
<div class="row"> <div class="row">
<?php foreach ($select_resources as $sel_res): <?php foreach ($select_resources as $sel_res):
if ($sel_res instanceof WP_Post) { if ($sel_res instanceof WP_Post) {
$post_id = $sel_res->ID; $post_id = $sel_res->ID;
$post_url = get_permalink($post_id); $post_url = get_permalink($post_id);
...@@ -55,24 +58,24 @@ if (isset($resources_listing) && is_array($resources_listing) && !empty($resourc ...@@ -55,24 +58,24 @@ if (isset($resources_listing) && is_array($resources_listing) && !empty($resourc
$post_content = $sel_res->post_content; $post_content = $sel_res->post_content;
$post_excerpt = $sel_res->post_excerpt; $post_excerpt = $sel_res->post_excerpt;
?> ?>
<div class="col-sm-6"> <div class="col-sm-6">
<div class="resource-item d-sm-flex flex-sm-column flex-xl-row justify-content-xl-start slide-up"> <div class="resource-item d-sm-flex flex-sm-column flex-xl-row justify-content-xl-start slide-up">
<div class="resource-image"> <div class="resource-image">
<a href="<?php echo esc_url($post_url); ?>" class="d-block"> <a href="<?php echo esc_url($post_url); ?>" class="d-block">
<img src="<?php echo esc_url($post_thumbnail_url); ?>" <img src="<?php echo esc_url($post_thumbnail_url); ?>"
alt="<?php echo esc_attr($post_title); ?>" class="img-fluid"> alt="<?php echo esc_attr($post_title); ?>" class="img-fluid">
</a> </a>
</div> </div>
<div class="resource-content"> <div class="resource-content">
<div class="rc-detail"> <div class="rc-detail">
<h6><a href="<?php echo esc_url($post_url); ?>"> <h6><a href="<?php echo esc_url($post_url); ?>">
<?php echo esc_html($post_title); ?></a></h6> <?php echo esc_html($post_title); ?></a></h6>
<P class="sm-text"> <P class="sm-text">
<?php echo wp_trim_words($post_excerpt, 8, '...') ?: wp_trim_words($post_content, 8, '...'); ?> <?php echo wp_trim_words($post_excerpt, 8, '...') ?: wp_trim_words($post_content, 8, '...'); ?>
</P> </P>
</div> </div>
<div class="format-and-btn-wrapper d-flex justify-content-between"> <div class="format-and-btn-wrapper d-flex justify-content-between">
<?php <?php
$downloadable_resource = get_field('downloadable_resource', $post_id) ?: []; $downloadable_resource = get_field('downloadable_resource', $post_id) ?: [];
if (isset($downloadable_resource) && is_array($downloadable_resource) && !empty($downloadable_resource)): if (isset($downloadable_resource) && is_array($downloadable_resource) && !empty($downloadable_resource)):
$enable_downloadable_resources = $downloadable_resource['enable_downloadable_resources']; $enable_downloadable_resources = $downloadable_resource['enable_downloadable_resources'];
...@@ -105,24 +108,24 @@ if (isset($resources_listing) && is_array($resources_listing) && !empty($resourc ...@@ -105,24 +108,24 @@ if (isset($resources_listing) && is_array($resources_listing) && !empty($resourc
endif; endif;
endif; endif;
?> ?>
<p class="sm-text">Format: <img src="<?php echo esc_url($icon_url); ?>" <p class="sm-text">Format: <img src="<?php echo esc_url($icon_url); ?>"
alt="<?php echo esc_attr($subtype); ?>"></p> alt="<?php echo esc_attr($subtype); ?>"></p>
<a href="<?php echo esc_url($post_url); ?>" class="mc-btn-underlined sm-text">View in <a href="<?php echo esc_url($post_url); ?>" class="mc-btn-underlined sm-text">View in
Detail</a> Detail</a>
</div>
</div>
</div>
</div>
<?php }endforeach; ?>
</div>
</div> </div>
<?php endif; ?> </div>
</div> </div>
<?php endforeach; ?> </div>
<?php }endforeach; ?>
</div> </div>
</div> </div>
<?php endif; ?>
</div> </div>
<?php endforeach; ?>
</div> </div>
</section> </div>
<?php endif; endif; endif; ?> </div>
</div>
</section>
<?php endif; endif; endif; ?>
<!-- !Resources - Resources Listing --> <!-- !Resources - Resources Listing -->
\ No newline at end of file
blocks/testimonial-block.php
<?php if(get_field('enable_section')):?> <?php if (get_field('enable_section')):
<section class="container-fluid background-dark py-80 HOME OUR-CUSTOMERS-SAY-SECTION <?php if (is_singular('portfolio')): ?>single-what-customers-say<?php endif; ?>"> if (is_singular('portfolio') || is_singular('case-study')) {
<div class="container"> $single_customer_review = 'single-what-customers-say';
<div class="row top-title pb-60 justify-content-between"> }
<div class="col-lg-5 col-md-6 col-12"> ?>
<h2> <section class="container-fluid background-dark py-80 HOME OUR-CUSTOMERS-SAY-SECTION <?php echo esc_attr($single_customer_review); ?>">
<?php the_field('title');?> <div class="container">
</h2> <div class="row top-title pb-60 justify-content-between">
</div> <div class="col-lg-5 col-md-6 col-12">
<div class="col-lg-5 col-md-5 col-12"> <h2>
<?php the_field('description');?> <?php the_field('title'); ?>
</h2>
</div>
<div class="col-lg-5 col-md-5 col-12">
<?php the_field('description'); ?>
</div>
</div> </div>
</div> <?php $testimonials = get_field('testimonials');
<?php $testimonials = get_field('testimonials'); if($testimonials): $carousle_type = get_field('carousel_type'); ?> if ($testimonials): $carousle_type = get_field('carousel_type'); ?>
<div class="row"> <div class="row">
<div class="<?php if($carousle_type==3): echo 'customer-feedback'; elseif($carousle_type==2): echo ''; else: echo 'customer-feedback-portfolio'; endif;?> owl-carousel owl-theme"> <div class="<?php if ($carousle_type == 3): echo 'customer-feedback';
<?php foreach($testimonials as $testimonial):?> elseif ($carousle_type == 2): echo '';
<div class="item feedback-wrapper p-40"> else: echo 'customer-feedback-portfolio';
endif; ?> owl-carousel owl-theme">
<svg width="29" height="25" viewBox="0 0 29 25" fill="none" xmlns="http://www.w3.org/2000/svg"> <?php foreach ($testimonials as $testimonial): ?>
<path <div class="item feedback-wrapper p-40">
d="M28.6018 0.0012207V5.52334H26.9027C25.5339 5.52334 24.4484 5.73573 23.646 6.16051C22.8437 6.58529 22.2537 7.31685 21.8761 8.3552C21.4985 9.34635 21.3097 10.6915 21.3097 12.3906V17.6295L19.2566 13.6649C19.587 13.4289 20.059 13.2402 20.6726 13.0986C21.2861 12.9098 21.9233 12.8154 22.5841 12.8154C24.1416 12.8154 25.4395 13.311 26.4779 14.3021C27.5162 15.2461 28.0354 16.5676 28.0354 18.2667C28.0354 19.8714 27.5398 21.2402 26.5487 22.3729C25.5575 23.4584 24.1416 24.0012 22.3009 24.0012C21.1209 24.0012 20.0118 23.7416 18.9735 23.2225C17.9823 22.6561 17.1799 21.7121 16.5664 20.3906C15.9528 19.0219 15.646 17.1576 15.646 14.7977V13.5941C15.646 10.2431 16.0944 7.57644 16.9912 5.59414C17.9351 3.61184 19.2802 2.19591 21.0265 1.34635C22.7729 0.449598 24.8968 0.0012207 27.3982 0.0012207H28.6018ZM12.9558 0.0012207V5.52334H11.2566C9.88791 5.52334 8.80236 5.73573 8 6.16051C7.19764 6.58529 6.60767 7.31685 6.23009 8.3552C5.85251 9.34635 5.66372 10.6915 5.66372 12.3906V17.6295L3.61062 13.6649C3.941 13.4289 4.41298 13.2402 5.02655 13.0986C5.64012 12.9098 6.27729 12.8154 6.93805 12.8154C8.49558 12.8154 9.79351 13.311 10.8319 14.3021C11.8702 15.2461 12.3894 16.5676 12.3894 18.2667C12.3894 19.8714 11.8938 21.2402 10.9027 22.3729C9.91151 23.4584 8.49558 24.0012 6.65487 24.0012C5.47493 24.0012 4.36578 23.7416 3.32743 23.2225C2.33628 22.6561 1.53392 21.7121 0.920354 20.3906C0.306785 19.0219 0 17.1576 0 14.7977V13.5941C0 10.2431 0.448378 7.57644 1.34513 5.59414C2.28909 3.61184 3.63422 2.19591 5.38053 1.34635C7.12684 0.449598 9.25074 0.0012207 11.7522 0.0012207H12.9558Z"
fill="#005AFF" /> <svg width="29" height="25" viewBox="0 0 29 25" fill="none" xmlns="http://www.w3.org/2000/svg">
</svg> <path
<?php echo get_the_content(null,false,$testimonial);?> d="M28.6018 0.0012207V5.52334H26.9027C25.5339 5.52334 24.4484 5.73573 23.646 6.16051C22.8437 6.58529 22.2537 7.31685 21.8761 8.3552C21.4985 9.34635 21.3097 10.6915 21.3097 12.3906V17.6295L19.2566 13.6649C19.587 13.4289 20.059 13.2402 20.6726 13.0986C21.2861 12.9098 21.9233 12.8154 22.5841 12.8154C24.1416 12.8154 25.4395 13.311 26.4779 14.3021C27.5162 15.2461 28.0354 16.5676 28.0354 18.2667C28.0354 19.8714 27.5398 21.2402 26.5487 22.3729C25.5575 23.4584 24.1416 24.0012 22.3009 24.0012C21.1209 24.0012 20.0118 23.7416 18.9735 23.2225C17.9823 22.6561 17.1799 21.7121 16.5664 20.3906C15.9528 19.0219 15.646 17.1576 15.646 14.7977V13.5941C15.646 10.2431 16.0944 7.57644 16.9912 5.59414C17.9351 3.61184 19.2802 2.19591 21.0265 1.34635C22.7729 0.449598 24.8968 0.0012207 27.3982 0.0012207H28.6018ZM12.9558 0.0012207V5.52334H11.2566C9.88791 5.52334 8.80236 5.73573 8 6.16051C7.19764 6.58529 6.60767 7.31685 6.23009 8.3552C5.85251 9.34635 5.66372 10.6915 5.66372 12.3906V17.6295L3.61062 13.6649C3.941 13.4289 4.41298 13.2402 5.02655 13.0986C5.64012 12.9098 6.27729 12.8154 6.93805 12.8154C8.49558 12.8154 9.79351 13.311 10.8319 14.3021C11.8702 15.2461 12.3894 16.5676 12.3894 18.2667C12.3894 19.8714 11.8938 21.2402 10.9027 22.3729C9.91151 23.4584 8.49558 24.0012 6.65487 24.0012C5.47493 24.0012 4.36578 23.7416 3.32743 23.2225C2.33628 22.6561 1.53392 21.7121 0.920354 20.3906C0.306785 19.0219 0 17.1576 0 14.7977V13.5941C0 10.2431 0.448378 7.57644 1.34513 5.59414C2.28909 3.61184 3.63422 2.19591 5.38053 1.34635C7.12684 0.449598 9.25074 0.0012207 11.7522 0.0012207H12.9558Z"
<hr> fill="#005AFF" />
<div class="author-info d-flex align-items-center"> </svg>
<?php echo get_the_post_thumbnail($testimonial);?> <?php echo get_the_content(null, false, $testimonial); ?>
<div class="detail"> <hr>
<div><?php the_field('name',$testimonial);?></div> <div class="author-info d-flex align-items-center">
<span><?php the_field('profession',$testimonial);?></span> <?php echo get_the_post_thumbnail($testimonial); ?>
<div class="detail">
<div><?php the_field('name', $testimonial); ?></div>
<span><?php the_field('profession', $testimonial); ?></span>
</div>
</div>
</div> </div>
</div> <?php endforeach; ?>
</div>
</div> </div>
<?php endforeach;?> <?php endif; ?>
</div>
</div> </div>
<?php endif;?> </section>
</div> <?php endif; ?>
</section> \ No newline at end of file
<?php endif;?>
\ No newline at end of file
blocks/welcome-banner-spider.php
<?php if (get_field('enable_spider_welcome_banner_section')) : ?> <?php if (get_field('enable_spider_welcome_banner_section')) : ?>
<section class="py-80 HOME TOP-BANNER-SECTION home2"> <section class="py-80 HOME TOP-BANNER-SECTION home2">
<div class="container"> <div class="container">
<div class="row align-items-center"> <div class="row align-items-center">
<div class="col-lg-5 col-md-5 col-12 mx-auto left-text"> <div class="col-lg-6 col-md-6 col-12 mx-auto order-md-2">
<div class="position-relative left-text-wrapper"> <canvas id="scratch" style="width: 375px; height: 400px;"></canvas>
<h1><?php echo get_field('wb_title') ?></h1> </div>
<p><?php echo get_field('wb_subtitle') ?></p> <div class="col-lg-5 col-md-5 col-12 mx-auto left-text order-md-1">
</div> <div class="position-relative left-text-wrapper">
<div class="button-wrapper"> <h1><?php echo get_field('wb_title') ?></h1>
<a href="<?php echo get_field('wb_button_link') ?>" class="btn btn-start-project btn-primary"><?php echo get_field('wb_button_text') ?></a> <p><?php echo get_field('wb_subtitle') ?></p>
</div>
</div>
<div class="col-lg-6 col-md-6 col-12 mx-auto">
<div class="jumbotron showcase parallax-window" data-parallax="scroll"
data-image-src="images/showcase-bg.jpg" data-position="-80% -90%" style="margin-top:70px;">
<div class="col-md-5" style="margin-top:-50px;">
<canvas id="scratch" style="width: 500px; height: 400px;"></canvas>
</div>
</div> </div>
<div class="button-wrapper">
<a href="<?php echo get_field('wb_button_link') ?>" class="btn btn-start-project btn-primary">
<?php echo get_field('wb_button_text') ?><svg width="24" height="24" viewBox="0 0 24 24"
fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M4 13L16.17 13L10.58 18.59L12 20L20 12L12 4L10.59 5.41L16.17 11L4 11L4 13Z"
fill="white"></path>
</svg>
</a>
</div> </div>
</div> </div>
</div> </div>
</section> </div>
</section>
<?php endif; ?> <?php endif; ?>
\ No newline at end of file
blocks/welcome-banner.php
<?php if (get_field('enable_welcome_banner_section')) : ?> <?php if (get_field('enable_welcome_banner_section')) : ?>
<section class="bg-secondary background-dark py-80 HOME TOP-BANNER-SECTION"> <section class="bg-secondary background-dark py-80 HOME TOP-BANNER-SECTION">
<div class="container"> <div class="container">
<div class="row align-items-center"> <div class="row align-items-center">
<div class="col-lg-5 col-md-5 col-12 mx-auto left-text"> <div class="col-lg-6 col-md-6 col-12 mx-auto order-md-2">
<div class="position-relative left-text-wrapper"> <?php $enable_interactive_spider = get_field('enable_interactive_spider') ?: '';
<h1><?php echo get_field('wb_title') ?></h1> if (isset($enable_interactive_spider) && $enable_interactive_spider):
<p><?php echo get_field('wb_subtitle') ?></p> if(wp_is_mobile()){
</div> $spiderInlineCss = 'style="width: 350px; height: 400px;"';
<div class="button-wrapper"> }else{
<a href="<?php echo get_field('wb_button_link') ?>" class="btn btn-start-project btn-primary"><?php echo get_field('wb_button_text') ?></a> $spiderInlineCss = 'style="width: 500px; height: 400px;"';
</div> }
?>
<canvas id="scratch" <?php echo $spiderInlineCss; ?>></canvas>
<?php else:
$image = get_field('banner_image');
$size = 'full';
if ($image) {
echo wp_get_attachment_image($image, $size);
}
endif;
?>
</div>
<div class="col-lg-5 col-md-5 col-12 mx-auto left-text order-md-1">
<div class="position-relative left-text-wrapper">
<h1><?php echo get_field('wb_title') ?></h1>
<p><?php echo get_field('wb_subtitle') ?></p>
</div> </div>
<div class="col-lg-6 col-md-6 col-12 mx-auto"> <div class="button-wrapper">
<?php <a href="<?php echo get_field('wb_button_link') ?>"
$image = get_field('banner_image'); class="btn btn-start-project btn-primary"><?php echo get_field('wb_button_text') ?><svg
$size = 'full'; // (thumbnail, medium, large, full or custom size) width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
if ($image) { <path fill-rule="evenodd" clip-rule="evenodd"
echo wp_get_attachment_image($image, $size); d="M4 13L16.17 13L10.58 18.59L12 20L20 12L12 4L10.59 5.41L16.17 11L4 11L4 13Z"
} ?> fill="white"></path>
</svg></a>
</div>
<?php
$review_widget = get_field('review_widget') ?: [];
if (isset($review_widget) && is_array($review_widget) && !empty($review_widget)) :
$enable_review_widget = $review_widget['enable_review_widget'] ?: '';
if (!empty($enable_review_widget) && isset($enable_review_widget) && $enable_review_widget) :
$review_items = $review_widget['widget_items'] ?: '';
if (isset($review_items) && is_array($review_items) && !empty($review_items)) :
?>
<div class="review-block d-flex gap-2 flex-wrap">
<?php foreach ($review_items as $i => $item):
$widget = $item['widget'] ?? '';
if (empty($widget)) continue;
if ($i === 1) {
$widget = do_shortcode($widget);
};
?>
<div class="review d-flex align-items-center bg-white rounded-2">
<?php echo $widget; ?>
</div>
<?php endforeach; ?>
</div> </div>
<?php endif;
endif;
endif; ?>
</div> </div>
</div> </div>
</section> </div>
<?php endif; ?> </section>
\ No newline at end of file <?php endif; ?>
<script type="text/javascript" src="https://widget.clutch.co/static/js/widget.js"></script>
\ No newline at end of file
dev/sass/base/_base.scss
...@@ -40,6 +40,7 @@ body { ...@@ -40,6 +40,7 @@ body {
font-family: $body-font; font-family: $body-font;
position: relative; position: relative;
overflow-x: hidden; overflow-x: hidden;
&.no-scroll { &.no-scroll {
overflow: hidden !important; overflow: hidden !important;
} }
...@@ -93,6 +94,7 @@ p { ...@@ -93,6 +94,7 @@ p {
font-size: 1.125rem; font-size: 1.125rem;
color: #58595a; color: #58595a;
letter-spacing: -0.5px; letter-spacing: -0.5px;
@media (max-width: 991px) { @media (max-width: 991px) {
letter-spacing: 0; letter-spacing: 0;
} }
...@@ -647,11 +649,14 @@ ul { ...@@ -647,11 +649,14 @@ ul {
} }
// 9: Return to Top Start // 9: Return to Top Start
#return-to-top { .fixed-button-wrapper {
position: fixed; position: fixed;
z-index: 99; z-index: 99;
bottom: 20px; bottom: 80px;
right: 2%; right: 8px;
}
#return-to-top {
background: $primary; background: $primary;
width: 50px; width: 50px;
height: 50px; height: 50px;
...@@ -699,7 +704,7 @@ ul { ...@@ -699,7 +704,7 @@ ul {
} }
.text-content { .text-content {
& > span { &>span {
font-size: 1.25rem; font-size: 1.25rem;
color: #000000; color: #000000;
letter-spacing: 0.28em; letter-spacing: 0.28em;
...@@ -1054,60 +1059,14 @@ ul { ...@@ -1054,60 +1059,14 @@ ul {
// transition: all 0.5s ease; // transition: all 0.5s ease;
// transform: translateY(100%); // transform: translateY(100%);
h6,
.category-list {
position: fixed;
top: 50vh;
left: 0;
z-index: 2;
}
h6 {
box-shadow: 0 -2px 2px rgba(0, 0, 0, 0.1);
border-radius: 4px 4px 0 0;
padding: 8px 16px;
transform: rotate(90deg);
transform-origin: left bottom;
background-color: $primary;
color: $white !important;
font-size: 1rem !important;
word-spacing: 4px;
&.remove {
opacity: 0;
visibility: hidden;
transform: translateX(-100%);
}
}
.category-list {
border-radius: 8px;
padding: 16px;
box-shadow: 0 4px 4px rgba(0, 0, 0, 0.1);
opacity: 0;
visibility: hidden;
transform: translateX(-100%);
max-height: 240px;
overflow: auto !important;
background-color: $white;
max-width: 75%;
ul {
overflow: visible !important;
}
&.active {
opacity: 1;
visibility: visible;
transform: translateX(0);
}
}
.blog-filter-bar-close { .blog-filter-bar-close {
display: block; display: block;
} }
} }
} }
//blog-card-wrapper //blog-card-wrapper
.blog-card-wrapper { .blog-card-wrapper {
margin-bottom: 1.875rem; margin-bottom: 1.875rem;
...@@ -1168,6 +1127,7 @@ ul { ...@@ -1168,6 +1127,7 @@ ul {
} }
.text-wrapper { .text-wrapper {
h1, h1,
h2, h2,
h3, h3,
...@@ -1411,6 +1371,7 @@ ul { ...@@ -1411,6 +1371,7 @@ ul {
display: flex !important; display: flex !important;
.job-list { .job-list {
h1, h1,
h2, h2,
h3, h3,
...@@ -1455,12 +1416,15 @@ ul { ...@@ -1455,12 +1416,15 @@ ul {
.breadcrumb-background-dark { .breadcrumb-background-dark {
padding-bottom: 0; padding-bottom: 0;
padding-top: 4.5rem !important; padding-top: 4.5rem !important;
&.background-dark { &.background-dark {
background: #005aff !important; background: #005aff !important;
} }
&.breadcrumb-background-dark { &.breadcrumb-background-dark {
padding-bottom: 2.5rem !important; padding-bottom: 2.5rem !important;
} }
ol, ol,
ul { ul {
margin: 0; margin: 0;
...@@ -1472,7 +1436,7 @@ ul { ...@@ -1472,7 +1436,7 @@ ul {
} }
} }
.breadcrumb-item + .breadcrumb-item { .breadcrumb-item+.breadcrumb-item {
&::before { &::before {
content: ""; content: "";
background-image: url("data:image/svg+xml,%3Csvg width='11' height='10' viewBox='0 0 11 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.51423 5.6495L10.1608 5.00193L10.1589 4.99999L9.50653 4.34468L7.70727 2.53727L5.44039 0.258179L3.16196 2.54886L1.36078 4.35628L0.721895 4.99999L0.719971 5.00193L1.36655 5.6495L3.16581 7.45886L5.44039 9.74181L7.71304 7.45886L9.51423 5.6495Z' fill='white'/%3E%3C/svg%3E%0A"); background-image: url("data:image/svg+xml,%3Csvg width='11' height='10' viewBox='0 0 11 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.51423 5.6495L10.1608 5.00193L10.1589 4.99999L9.50653 4.34468L7.70727 2.53727L5.44039 0.258179L3.16196 2.54886L1.36078 4.35628L0.721895 4.99999L0.719971 5.00193L1.36655 5.6495L3.16581 7.45886L5.44039 9.74181L7.71304 7.45886L9.51423 5.6495Z' fill='white'/%3E%3C/svg%3E%0A");
...@@ -1488,6 +1452,7 @@ ul { ...@@ -1488,6 +1452,7 @@ ul {
.vacancy-detail-breadcrumb { .vacancy-detail-breadcrumb {
padding-top: 4.5rem !important; padding-top: 4.5rem !important;
background: #121526 !important; background: #121526 !important;
ol, ol,
ul { ul {
margin: 0; margin: 0;
...@@ -1499,7 +1464,7 @@ ul { ...@@ -1499,7 +1464,7 @@ ul {
} }
} }
.breadcrumb-item + .breadcrumb-item { .breadcrumb-item+.breadcrumb-item {
&::before { &::before {
content: ""; content: "";
background-image: url("data:image/svg+xml,%3Csvg width='11' height='10' viewBox='0 0 11 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.51423 5.6495L10.1608 5.00193L10.1589 4.99999L9.50653 4.34468L7.70727 2.53727L5.44039 0.258179L3.16196 2.54886L1.36078 4.35628L0.721895 4.99999L0.719971 5.00193L1.36655 5.6495L3.16581 7.45886L5.44039 9.74181L7.71304 7.45886L9.51423 5.6495Z' fill='white'/%3E%3C/svg%3E%0A"); background-image: url("data:image/svg+xml,%3Csvg width='11' height='10' viewBox='0 0 11 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.51423 5.6495L10.1608 5.00193L10.1589 4.99999L9.50653 4.34468L7.70727 2.53727L5.44039 0.258179L3.16196 2.54886L1.36078 4.35628L0.721895 4.99999L0.719971 5.00193L1.36655 5.6495L3.16581 7.45886L5.44039 9.74181L7.71304 7.45886L9.51423 5.6495Z' fill='white'/%3E%3C/svg%3E%0A");
...@@ -1517,11 +1482,13 @@ ul { ...@@ -1517,11 +1482,13 @@ ul {
.col-lg-9 { .col-lg-9 {
padding-left: 0.8125rem; padding-left: 0.8125rem;
} }
.terms-sidebar-wrapper { .terms-sidebar-wrapper {
position: sticky; position: sticky;
top: 20%; top: 20%;
margin-right: 2.5rem; margin-right: 2.5rem;
padding-bottom: 1.875rem; padding-bottom: 1.875rem;
ul { ul {
margin: 0; margin: 0;
list-style-type: none; list-style-type: none;
...@@ -1615,6 +1582,7 @@ ul { ...@@ -1615,6 +1582,7 @@ ul {
//YOU-MAY-LIKE //YOU-MAY-LIKE
.YOU-MAY-LIKE { .YOU-MAY-LIKE {
.main-wrapper .top-title-wrapper p, .main-wrapper .top-title-wrapper p,
span { span {
color: #000 !important; color: #000 !important;
...@@ -1623,4 +1591,4 @@ ul { ...@@ -1623,4 +1591,4 @@ ul {
.color-grey { .color-grey {
color: #6c757d; color: #6c757d;
} }
\ No newline at end of file
dev/sass/base/_footer.scss
...@@ -2,26 +2,34 @@ ...@@ -2,26 +2,34 @@
.upper-footer { .upper-footer {
position: relative; position: relative;
min-height: 29.75rem; min-height: 29.75rem;
@media (max-width: 1200px) { @media (max-width: 1200px) {
min-height: 35rem; min-height: 35rem;
} }
@media (max-width: 991px) { @media (max-width: 991px) {
min-height: 33rem; min-height: 33rem;
} }
@media (max-width: 768px) { @media (max-width: 768px) {
min-height: 20rem; min-height: 20rem;
} }
@media (max-width: 576px) { @media (max-width: 576px) {
min-height: 20rem; min-height: 20rem;
} }
.inner-text-wrapper { .inner-text-wrapper {
.inner-wrapper { .inner-wrapper {
position: relative; position: relative;
h2 { h2 {
margin-bottom: 4.0625rem; margin-bottom: 4.0625rem;
@media (max-width: 767.98px) { @media (max-width: 767.98px) {
font-size: 1.5rem !important; font-size: 1.5rem !important;
} }
&:before { &:before {
content: ""; content: "";
background-image: url("https://makuracreations.com/wp-content/themes/makura/assets/img/footer-left-arrow.png"); background-image: url("https://makuracreations.com/wp-content/themes/makura/assets/img/footer-left-arrow.png");
...@@ -31,26 +39,31 @@ ...@@ -31,26 +39,31 @@
background-repeat: no-repeat; background-repeat: no-repeat;
position: absolute; position: absolute;
left: -27%; left: -27%;
@media (max-width: 1023.98px) { @media (max-width: 1023.98px) {
height: 150px; height: 150px;
width: 150px; width: 150px;
} }
@media (max-width: 767.98px) { @media (max-width: 767.98px) {
height: 130px; height: 130px;
width: 130px; width: 130px;
left: -46%; left: -46%;
} }
@media (max-width: 424.98px) { @media (max-width: 424.98px) {
display: none; display: none;
} }
} }
} }
} }
a { a {
position: relative; position: relative;
width: 15.75rem; width: 15.75rem;
display: block; display: block;
margin: 0 auto; margin: 0 auto;
&::before { &::before {
content: ""; content: "";
background-image: url("https://makuracreations.com/wp-content/themes/makura/assets/img/start-project.png"); background-image: url("https://makuracreations.com/wp-content/themes/makura/assets/img/start-project.png");
...@@ -66,17 +79,21 @@ ...@@ -66,17 +79,21 @@
} }
} }
} }
.left-img { .left-img {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
left: 0; left: 0;
img { img {
height: 100%; height: 100%;
width: 100%; width: 100%;
object-fit: contain; object-fit: contain;
@media (max-width: 1023.98px) { @media (max-width: 1023.98px) {
height: 100%; height: 100%;
} }
@media (max-width: 768px) { @media (max-width: 768px) {
height: 7rem; height: 7rem;
width: 7rem; width: 7rem;
...@@ -84,17 +101,21 @@ ...@@ -84,17 +101,21 @@
} }
} }
} }
.right-img { .right-img {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
right: 0; right: 0;
img { img {
height: 100%; height: 100%;
width: 100%; width: 100%;
object-fit: contain; object-fit: contain;
@media (max-width: 1023.98px) { @media (max-width: 1023.98px) {
height: 100%; height: 100%;
} }
@media (max-width: 768px) { @media (max-width: 768px) {
height: 7rem; height: 7rem;
width: 7rem; width: 7rem;
...@@ -103,23 +124,32 @@ ...@@ -103,23 +124,32 @@
} }
} }
} }
.section-footer { .section-footer {
padding: 64px 0 68px;
position: relative;
z-index: 1;
.row { .row {
@media (max-width: 991px) { @media (max-width: 991px) {
justify-content: center; justify-content: center;
margin: auto; margin: auto;
text-align: center; text-align: center;
.col-lg-5 { .col-lg-5 {
margin-bottom: 1.25rem; margin-bottom: 1.25rem;
} }
ul { ul {
justify-content: center !important; justify-content: center !important;
margin-top: 1rem; margin-top: 1rem;
} }
} }
} }
.lower-footer { .lower-footer {
padding: 0 0 2rem 0; padding: 0 0 2rem 0;
.nav-item { .nav-item {
.font-16 { .font-16 {
@media (max-width: 991px) { @media (max-width: 991px) {
...@@ -127,42 +157,52 @@ ...@@ -127,42 +157,52 @@
} }
} }
} }
.top-ul { .top-ul {
justify-content: center; justify-content: center;
margin: 0; margin: 0;
@media (max-width: 767.98px) { @media (max-width: 767.98px) {
flex-direction: column; flex-direction: column;
li { li {
padding-right: 0 !important; padding-right: 0 !important;
margin: 0 auto; margin: 0 auto;
margin-bottom: 1.25rem; margin-bottom: 1.25rem;
} }
} }
li { li {
padding-right: 1rem; padding-right: 1rem;
a { a {
color: rgba(255, 255, 255, 0.56); color: rgba(255, 255, 255, 0.56);
transition: color 0.3s ease-in-out, box-shadow 0.3s ease-in-out; transition: color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
padding: 0 20px; padding: 0 20px;
&:hover { &:hover {
color: white; color: white;
text-decoration: underline; text-decoration: underline;
} }
} }
&:last-of-type { &:last-of-type {
padding-right: 0; padding-right: 0;
} }
} }
} }
} }
.social-links { .social-links {
margin-bottom: 2rem; margin-bottom: 2rem;
border-bottom: 2px solid #000; border-bottom: 2px solid #000;
padding-bottom: 2rem; padding-bottom: 2rem;
ul { ul {
display: flex; display: flex;
align-items: center; align-items: center;
margin-bottom: 0; margin-bottom: 0;
@media (max-width: 425px) { @media (max-width: 425px) {
li { li {
a { a {
...@@ -170,21 +210,25 @@ ...@@ -170,21 +210,25 @@
} }
} }
} }
li { li {
@media screen and (max-width: 1024.98px) { @media screen and (max-width: 1024.98px) {
margin: 0; margin: 0;
text-align: center; text-align: center;
} }
a { a {
color: rgba(255, 255, 255, 0.56); color: rgba(255, 255, 255, 0.56);
padding: 0 2rem; padding: 0 2rem;
transition: color 0.3s ease-in-out, box-shadow 0.3s ease-in-out; transition: color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
svg { svg {
&:hover { &:hover {
path { path {
fill: #868fce; fill: #868fce;
} }
} }
path { path {
transition: 0.5s ease-in-out; transition: 0.5s ease-in-out;
} }
...@@ -193,14 +237,17 @@ ...@@ -193,14 +237,17 @@
} }
} }
} }
span { span {
color: rgba(255, 255, 255, 0.56) !important; color: rgba(255, 255, 255, 0.56) !important;
} }
.footer-bottom-right-content { .footer-bottom-right-content {
li { li {
&:first-child { &:first-child {
margin-right: 2rem; margin-right: 2rem;
} }
a { a {
color: rgba(255, 255, 255, 0.56); color: rgba(255, 255, 255, 0.56);
font-family: $body-font; font-family: $body-font;
...@@ -208,11 +255,249 @@ ...@@ -208,11 +255,249 @@
font-weight: 400; font-weight: 400;
line-height: 180%; line-height: 180%;
letter-spacing: -0.4px; letter-spacing: -0.4px;
&:hover { &:hover {
text-decoration: underline; text-decoration: underline;
} }
} }
} }
} }
.footer-links {
.footer-link-wrapper {
padding: 24px;
border-radius: 12px;
background-color: #6CAFF60A;
&:not(:last-child) {
margin-bottom: 20px;
}
}
strong {
display: block;
padding-bottom: 12px;
margin-bottom: 12px;
border-bottom: 1px solid rgba(119, 145, 250, 0.1);
}
ul {
margin-bottom: 0;
li {
text-align: start;
list-style-type: none;
a {
opacity: 0.56;
font-size: 14px;
line-height: 180%;
letter-spacing: 0;
&:hover {
opacity: 1;
svg {
path {
fill-opacity: 1;
fill: var(--white);
}
}
}
}
&:not(:last-child) {
margin-bottom: 8px;
}
}
&.socials {
li {
a {
display: flex;
align-items: center;
gap: 8px;
}
}
}
}
}
.footer-branch {
.branch-title {
margin-bottom: 12px;
gap: 8px;
span {
color: var(--white) !important;
font-family: "Sora", sans-serif;
font-weight: 600;
font-size: 14px;
line-height: 180%;
letter-spacing: -0.4px;
display: block;
}
}
ul {
li {
a {
display: flex;
align-items: flex-start;
justify-content: flex-start;
word-break: break-all;
svg {
margin-right: 8px;
}
}
}
}
}
.row {
>div {
&:not(:first-child) {
.footer-branch {
margin-top: 24px;
}
}
}
}
.footer-about {
text-align: center;
max-width: 568px;
margin: 48px auto 0;
.logo {
margin-bottom: 8px;
}
span {
display: block;
font-weight: 400;
font-size: 12px;
line-height: 180%;
letter-spacing: 0px;
margin: 8px 0;
}
p {
font-weight: 400;
font-size: 10px !important;
line-height: 150%;
letter-spacing: -0.4px;
margin-bottom: 0;
opacity: 0.56;
}
}
} }
//section-footer
.scroll-animate {
position: absolute;
left: 50%;
bottom: 0;
transform: translateX(-50%);
span {
font-size: 20px;
line-height: 180%;
font-weight: 800;
letter-spacing: 0px;
mix-blend-mode: overlay;
opacity: 0.2;
color: #868fce;
}
}
@media (min-width:576px) {
.section-footer {
.footer-links {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 8px;
.footer-link-wrapper {
height: 100%;
}
}
}
.scroll-animate {
span {
font-size: 24px;
}
}
}
@media (min-width:768px) {
.section-footer {
.footer-links {
grid-template-columns: repeat(3, 1fr);
.footer-link-wrapper.location-wrapper {
// height: 100%;
grid-column: 1/-1;
}
}
&::before,
&::after {
content: "";
position: absolute;
bottom: 0;
width: 215px;
height: 216px;
}
&::before {
left: 0;
background: url(../img/footer-shape-left.svg) no-repeat center/cover;
}
&::after {
right: 0;
background: url(../img/footer-shape-right.svg) no-repeat center/cover;
}
}
}
@media (min-width:1200px) {
.section-footer {
.footer-links {
display: flex;
.footer-link-wrapper {
margin-bottom: 0 !important;
height: unset;
&:not(.location-wrapper) {
width: 232px;
}
.footer-branch {
margin-top: 0 !important;
}
}
}
}
}
@media (min-width:1440px) {
.section-footer {
.footer-links {
.footer-link-wrapper {
flex: 1 0 auto;
}
}
}
}
//section-footer
\ No newline at end of file
dev/sass/base/_global.scss
...@@ -2,8 +2,38 @@ a, ...@@ -2,8 +2,38 @@ a,
button { button {
transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;
} }
.new {
position: relative;
&::after {
content: "New";
position: absolute;
right: -10px;
top: -15px;
background-color: rgb(17, 170, 55);
border-radius: 4px;
font-size: 10px;
line-height: 12px;
padding: 2px 6px;
color: $white;
animation: glow 1.5s ease-in-out infinite alternate;
}
@keyframes glow {
0% {
box-shadow: 0 0 4px rgba(17, 170, 55, 0.5);
}
100% {
box-shadow: 0 0 12px rgba(17, 170, 55, 1);
}
}
}
.section-title { .section-title {
margin-bottom: 3.75rem; margin-bottom: 3.75rem;
p { p {
margin-bottom: 0; margin-bottom: 0;
} }
...@@ -11,6 +41,7 @@ button { ...@@ -11,6 +41,7 @@ button {
.input-field { .input-field {
margin-bottom: 32px; margin-bottom: 32px;
label { label {
color: $black; color: $black;
font-size: 16px; font-size: 16px;
...@@ -19,6 +50,7 @@ button { ...@@ -19,6 +50,7 @@ button {
display: block; display: block;
margin-bottom: 8px; margin-bottom: 8px;
} }
input, input,
select, select,
textarea { textarea {
...@@ -45,6 +77,7 @@ button { ...@@ -45,6 +77,7 @@ button {
opacity: 0.4; opacity: 0.4;
} }
} }
textarea { textarea {
resize: none; resize: none;
} }
...@@ -110,7 +143,7 @@ button { ...@@ -110,7 +143,7 @@ button {
} }
} }
> svg { >svg {
position: absolute; position: absolute;
top: 50%; top: 50%;
transform: translateY(-50%); transform: translateY(-50%);
...@@ -223,6 +256,11 @@ button { ...@@ -223,6 +256,11 @@ button {
} }
} }
figcaption {
font-style: italic;
color: $grey ;
}
@media (max-width: 767px) { @media (max-width: 767px) {
.section-title { .section-title {
margin-bottom: 2rem; margin-bottom: 2rem;
...@@ -231,6 +269,7 @@ button { ...@@ -231,6 +269,7 @@ button {
font-size: 2rem !important; font-size: 2rem !important;
} }
} }
.input-field { .input-field {
margin-bottom: 24px; margin-bottom: 24px;
} }
...@@ -249,22 +288,81 @@ button { ...@@ -249,22 +288,81 @@ button {
.toc { .toc {
position: fixed !important; position: fixed !important;
display: block !important; display: block !important;
bottom: 0; // bottom: 0;
left: 0; left: 0;
right: 0; top: 50%;
transform: translate(-100%, -50%);
z-index: 2;
// .category-list {
// display: grid;
// grid-template-rows: 0fr;
// overflow: hidden;
// ul {
// overflow: hidden;
// }
// }
&.active {
.category-list {
transform: translate(0%, -50%);
// grid-template-rows: 1fr;
}
}
}
}
@media (max-width: 1023px) {
.toc {
h6,
.category-list { .category-list {
display: grid; position: fixed;
grid-template-rows: 0fr; top: 50%;
overflow: hidden; left: 0;
z-index: 2;
}
ul { h6 {
overflow: hidden; box-shadow: 0 -2px 2px rgba(0, 0, 0, 0.1);
border-radius: 4px 4px 0 0;
padding: 8px 16px;
transform: translateY(-50%) rotate(90deg);
transform-origin: left bottom;
background-color: $primary;
color: $white !important;
font-size: 1rem !important;
word-spacing: 4px;
text-wrap: nowrap;
&.remove {
opacity: 0;
visibility: hidden;
transform: translateX(-100%) translateY(-50%);
} }
} }
&.active {
.category-list { .category-list {
grid-template-rows: 1fr; border-radius: 8px;
padding: 16px;
box-shadow: 0 4px 4px rgba(0, 0, 0, 0.1);
opacity: 0;
visibility: hidden;
transform: translateX(-100%) translateY(-50%);
max-height: 240px;
overflow: auto !important;
background-color: $white;
width: 24rem;
ul {
overflow: visible !important;
}
&.active {
opacity: 1;
visibility: visible;
transform: translateX(0) translateY(-50%);
} }
} }
} }
...@@ -290,4 +388,4 @@ button { ...@@ -290,4 +388,4 @@ button {
padding: 0 16px 24px; padding: 0 16px 24px;
} }
} }
} }
\ No newline at end of file
dev/sass/base/_header.scss
///top-nav //top-nav
.header-placeholder {
height: 65px;
}
@media (min-width:992px) {
.header-placeholder {
height: 86px;
}
}
.top-nav { .top-nav {
width: 100%; width: 100%;
background-color: $white; background-color: $white;
...@@ -7,11 +17,17 @@ ...@@ -7,11 +17,17 @@
left: 0; left: 0;
z-index: 111; z-index: 111;
transition: 0.4s ease-in-out; transition: 0.4s ease-in-out;
position: absolute;
top: 0;
@media (max-width: 1030px) { @media (max-width: 1030px) {
.navbar-nav { .navbar-nav {
flex-direction: column !important; flex-direction: column !important;
} }
} }
.side-menu-close { .side-menu-close {
@media (max-width: 1030px) { @media (max-width: 1030px) {
display: block !important; display: block !important;
...@@ -117,6 +133,7 @@ ...@@ -117,6 +133,7 @@
@media (max-width: 1030px) { @media (max-width: 1030px) {
margin-right: 0; margin-right: 0;
&:not(:last-child) { &:not(:last-child) {
margin-bottom: 1.875rem; margin-bottom: 1.875rem;
} }
...@@ -174,6 +191,8 @@ ...@@ -174,6 +191,8 @@
} }
} }
&:last-of-type { &:last-of-type {
margin-right: 0; margin-right: 0;
} }
...@@ -181,7 +200,7 @@ ...@@ -181,7 +200,7 @@
&.menu-item-has-children { &.menu-item-has-children {
position: relative; position: relative;
> a { >a {
padding-right: 24px; padding-right: 24px;
position: relative; position: relative;
...@@ -199,11 +218,12 @@ ...@@ -199,11 +218,12 @@
&:hover, &:hover,
&.show { &.show {
> ul { >ul {
opacity: 1; opacity: 1;
visibility: visible; visibility: visible;
transform: translateY(0); transform: translateY(0);
} }
a { a {
&::before { &::before {
transform: translateY(-50%) rotate(-90deg); transform: translateY(-50%) rotate(-90deg);
...@@ -231,6 +251,7 @@ ...@@ -231,6 +251,7 @@
left: 100%; left: 100%;
top: 0; top: 0;
} }
a { a {
display: block; display: block;
padding: 12px 36px 12px 24px; padding: 12px 36px 12px 24px;
...@@ -238,13 +259,15 @@ ...@@ -238,13 +259,15 @@
&::after { &::after {
content: unset; content: unset;
} }
&::before { &::before {
right: 24px; right: 24px;
} }
} }
&:hover, &:hover,
&.active { &.active {
> a { >a {
background-color: rgba(44, 92, 218, 20%); background-color: rgba(44, 92, 218, 20%);
} }
} }
...@@ -324,9 +347,12 @@ ...@@ -324,9 +347,12 @@
// brightness(140%); // brightness(140%);
-webkit-box-shadow: 0 6px 9px 0 rgba(0, 0, 0, 0.06); -webkit-box-shadow: 0 6px 9px 0 rgba(0, 0, 0, 0.06);
animation: slideDown 0.8s ease forwards; animation: slideDown 0.8s ease forwards;
position: fixed;
// overflow: hidden; // overflow: hidden;
@media (max-width: 1030px) { @media (max-width: 1030px) {
animation: unset; animation: unset;
.navbar-nav { .navbar-nav {
flex-direction: column !important; flex-direction: column !important;
} }
...@@ -414,6 +440,7 @@ ...@@ -414,6 +440,7 @@
li { li {
width: 100%; width: 100%;
a { a {
// padding-left: 0 !important; // padding-left: 0 !important;
color: $black !important; color: $black !important;
...@@ -424,6 +451,7 @@ ...@@ -424,6 +451,7 @@
} }
} }
} }
.top-nav { .top-nav {
.nav-wrapper { .nav-wrapper {
.nav-right { .nav-right {
...@@ -443,6 +471,7 @@ ...@@ -443,6 +471,7 @@
padding-left: 12px; padding-left: 12px;
// border-radius: 12px; // border-radius: 12px;
} }
ul { ul {
padding-left: 12px; padding-left: 12px;
} }
...@@ -451,7 +480,7 @@ ...@@ -451,7 +480,7 @@
&:hover, &:hover,
&.show { &.show {
> ul { >ul {
display: block; display: block;
} }
} }
...@@ -482,4 +511,4 @@ ...@@ -482,4 +511,4 @@
display: block; display: block;
height: 150px; height: 150px;
margin-top: -180px; margin-top: -180px;
} }
\ No newline at end of file
dev/sass/pages/_about.scss
//TOP-BANNER-SECTION //TOP-BANNER-SECTION
.TOP-BANNER-SECTION {
&.background-dark {
background: #005aff !important;
}
.TOP-BANNER-SECTION,
.PORTFOLIO-TOP-TITLE-SECTION {
.btn-start-project { .btn-start-project {
background-color: #121526; background-color: #121526;
svg {
margin-left: 8px;
transition: all 0.3s ease-in-out;
}
&:hover { &:hover {
color: $primary !important; color: $primary !important;
border-color: $white; border-color: $white;
&::before { &::before {
background-color: $white; background-color: $white;
} }
svg {
path {
fill: $primary;
}
}
} }
} }
}
.TOP-BANNER-SECTION {
&.background-dark {
background: #005aff !important;
}
.left-text-wrapper { .left-text-wrapper {
&::before { &::before {
display: none; display: none;
} }
p { p {
margin: 1.5rem 0 0 0; margin: 1.5rem 0 0 0;
} }
} }
.nav-pills { .nav-pills {
padding: 1.5rem 0; padding: 1.5rem 0;
@media (max-width: 767.98px) { @media (max-width: 767.98px) {
padding: 1.5rem; padding: 1.5rem;
} }
border-top: 1px solid #58595a; border-top: 1px solid #58595a;
border-bottom: 1px solid #58595a; border-bottom: 1px solid #58595a;
margin-bottom: 0 !important; margin-bottom: 0 !important;
li { li {
margin-right: 2.75rem; margin-right: 2.75rem;
&:last-child { &:last-child {
margin-right: 0; margin-right: 0;
} }
} }
button { button {
padding: 0; padding: 0;
background-color: unset !important; background-color: unset !important;
...@@ -46,17 +72,20 @@ ...@@ -46,17 +72,20 @@
font-weight: 600; font-weight: 600;
line-height: 24px; line-height: 24px;
letter-spacing: -0.4px; letter-spacing: -0.4px;
&.active { &.active {
color: #000000 !important; color: #000000 !important;
} }
} }
} }
} }
//TOP-BANNER-SECTION //TOP-BANNER-SECTION
//ABOUTPAGE //ABOUTPAGE
.ABOUTPAGE-COUTER { .ABOUTPAGE-COUTER {
.card-wrapper { .card-wrapper {
.experience, .experience,
.client, .client,
.experts { .experts {
...@@ -68,21 +97,25 @@ ...@@ -68,21 +97,25 @@
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
span { span {
font-weight: 600; font-weight: 600;
font-size: 44px; font-size: 44px;
} }
p { p {
font-weight: 500; font-weight: 500;
} }
} }
} }
} }
//ABOUTPAGE //ABOUTPAGE
//ABOUT-TOP-AFTER-COUNTER-SECTION //ABOUT-TOP-AFTER-COUNTER-SECTION
.ABOUT-TOP-AFTER-COUNTER-SECTION { .ABOUT-TOP-AFTER-COUNTER-SECTION {
@media (max-width: 767.98px) { @media (max-width: 767.98px) {
h1, h1,
h2, h2,
h3, h3,
...@@ -91,9 +124,11 @@ ...@@ -91,9 +124,11 @@
h6 { h6 {
font-size: 2rem !important; font-size: 2rem !important;
} }
p { p {
font-size: 1.125rem !important; font-size: 1.125rem !important;
} }
.right-image-wrapper { .right-image-wrapper {
.image-wrapper { .image-wrapper {
img { img {
...@@ -105,17 +140,20 @@ ...@@ -105,17 +140,20 @@
} }
} }
} }
.left-text-wrapper { .left-text-wrapper {
span { span {
font-weight: 600; font-weight: 600;
font-size: 14px; font-size: 14px;
color: #005aff; color: #005aff;
} }
.text-wrapper { .text-wrapper {
h2 { h2 {
font-size: 2.75rem; font-size: 2.75rem;
margin-top: 1.25rem; margin-top: 1.25rem;
} }
p { p {
color: #58595a; color: #58595a;
font-family: $body-font; font-family: $body-font;
...@@ -125,6 +163,7 @@ ...@@ -125,6 +163,7 @@
} }
} }
} }
.right-image-wrapper { .right-image-wrapper {
.image-wrapper { .image-wrapper {
img { img {
...@@ -135,10 +174,12 @@ ...@@ -135,10 +174,12 @@
} }
} }
} }
//ABOUT-TOP-AFTER-COUNTER-SECTION //ABOUT-TOP-AFTER-COUNTER-SECTION
//MISSION-VISION-SECTION //MISSION-VISION-SECTION
.MISSION-VISION-SECTION { .MISSION-VISION-SECTION {
h1, h1,
h2, h2,
h3, h3,
...@@ -148,43 +189,53 @@ ...@@ -148,43 +189,53 @@
font-weight: 600; font-weight: 600;
font-size: 2.5rem; font-size: 2.5rem;
margin-bottom: 5.75rem; margin-bottom: 5.75rem;
@media (max-width: 767.98px) { @media (max-width: 767.98px) {
font-size: 2rem !important; font-size: 2rem !important;
margin-bottom: 2rem; margin-bottom: 2rem;
} }
} }
.row { .row {
padding-bottom: 7rem; padding-bottom: 7rem;
&:nth-child(odd) { &:nth-child(odd) {
flex-direction: row-reverse; flex-direction: row-reverse;
.left-text-wrapper { .left-text-wrapper {
.text-wrapper { .text-wrapper {
padding-right: 0; padding-right: 0;
} }
} }
} }
&:nth-last-of-type() { &:nth-last-of-type() {
padding-bottom: 0; padding-bottom: 0;
} }
.left-text-wrapper { .left-text-wrapper {
.text-wrapper { .text-wrapper {
padding-right: 1.25rem; padding-right: 1.25rem;
h2 { h2 {
font-size: 2.75rem; font-size: 2.75rem;
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
} }
p { p {
margin-bottom: 1.75rem; margin-bottom: 1.75rem;
color: #58595a; color: #58595a;
font-family: $body-font; font-family: $body-font;
font-size: 1.125rem; font-size: 1.125rem;
font-weight: 400; font-weight: 400;
@media (max-width: 767.98px) { @media (max-width: 767.98px) {
font-size: 1.125rem !important; font-size: 1.125rem !important;
} }
} }
} }
} }
.right-image-wrapper { .right-image-wrapper {
.image-wrapper { .image-wrapper {
img { img {
...@@ -197,6 +248,7 @@ ...@@ -197,6 +248,7 @@
} }
} }
} }
//MISSION-VISION-SECTION //MISSION-VISION-SECTION
//technologies-use-innovating //technologies-use-innovating
...@@ -208,4 +260,4 @@ ...@@ -208,4 +260,4 @@
font-weight: 600; font-weight: 600;
letter-spacing: -0.6px; letter-spacing: -0.6px;
} }
} }
\ No newline at end of file
dev/sass/pages/_responsive.scss
...@@ -375,6 +375,8 @@ ...@@ -375,6 +375,8 @@
} }
.TECHNOLOGY-USED-SECTION { .TECHNOLOGY-USED-SECTION {
padding-bottom: 4rem;
.col-6 { .col-6 {
width: 100%; width: 100%;
} }
......
dev/sass/pages/master-portfolio/_moment-gallery.scss
...@@ -21,8 +21,8 @@ ...@@ -21,8 +21,8 @@
height: 100%; height: 100%;
object-fit: cover; object-fit: cover;
} }
&.horizontal { &:nth-child(3) {
grid-row: span 2; grid-column: span 2;
} }
&:nth-child(n + 4) { &:nth-child(n + 4) {
display: none; display: none;
......
dev/sass/pages/master-portfolio/_sticky-tab.scss
...@@ -24,6 +24,10 @@ ...@@ -24,6 +24,10 @@
} }
} }
} }
&.sticky-with-header {
top: 66px;
}
} }
@media (min-width: 768px) { @media (min-width: 768px) {
...@@ -51,5 +55,9 @@ ...@@ -51,5 +55,9 @@
} }
} }
} }
&.sticky-with-header {
top: 88px;
}
} }
} }
dev/sass/pages/resources/_resource-detail.scss
.resource-detail { .resource-detail {
.rd-content { .rd-content {
h2, h2,
h3, h3,
h4, h4,
h5 { h5 {
margin-bottom: 16px; margin-bottom: 16px;
&:not(:first-child) { &:not(:first-child) {
margin-top: 32px; margin-top: 32px;
} }
} }
ul {
span.over-title {
display: block;
margin-top: 32px;
margin-bottom: 8px;
color: $primary;
+h2,
+h3,
+h4,
+h5 {
margin-top: 0;
}
}
ul,
ol {
padding-left: 8px; padding-left: 8px;
li { li {
position: relative; position: relative;
padding-left: 24px; padding-left: 24px;
...@@ -33,6 +52,14 @@ ...@@ -33,6 +52,14 @@
} }
} }
} }
a {
color: $primary;
&:hover {
text-decoration: underline;
}
}
} }
li, li,
...@@ -41,6 +68,7 @@ ...@@ -41,6 +68,7 @@
a { a {
font-size: 1.5rem; font-size: 1.5rem;
} }
strong { strong {
font-weight: 500; font-weight: 500;
} }
...@@ -49,6 +77,7 @@ ...@@ -49,6 +77,7 @@
padding-top: 32px; padding-top: 32px;
margin-top: 40px; margin-top: 40px;
border-top: 1px solid rgba(0, 0, 0, 0.1); border-top: 1px solid rgba(0, 0, 0, 0.1);
.rd-socials { .rd-socials {
margin-top: 20px; margin-top: 20px;
...@@ -56,16 +85,20 @@ ...@@ -56,16 +85,20 @@
display: block; display: block;
margin-bottom: 8px; margin-bottom: 8px;
} }
ul { ul {
gap: 8px; gap: 8px;
li { li {
a { a {
&:hover { &:hover {
svg { svg {
fill: $primary; fill: $primary;
rect { rect {
stroke: $primary; stroke: $primary;
} }
path { path {
fill: #fff; fill: #fff;
} }
...@@ -76,11 +109,16 @@ ...@@ -76,11 +109,16 @@
} }
} }
} }
.faq-wrapper {
margin-top: 2rem;
}
} }
@media (min-width: 768px) { @media (min-width: 768px) {
.resource-detail { .resource-detail {
.rd-content { .rd-content {
h2, h2,
h3, h3,
h4, h4,
...@@ -90,6 +128,11 @@ ...@@ -90,6 +128,11 @@
} }
} }
} }
span.over-title {
margin-top: 48px;
}
li, li,
p, p,
strong, strong,
...@@ -117,4 +160,4 @@ ...@@ -117,4 +160,4 @@
} }
} }
} }
} }
\ No newline at end of file
dev/sass/pages/site-comparision/_inner-banner.scss
...@@ -12,6 +12,7 @@ ...@@ -12,6 +12,7 @@
&:hover { &:hover {
background-color: $white !important; background-color: $white !important;
color: $primary !important; color: $primary !important;
svg { svg {
path { path {
stroke: $primary; stroke: $primary;
...@@ -23,6 +24,7 @@ ...@@ -23,6 +24,7 @@
.COMPARISON-FORM .section-title { .COMPARISON-FORM .section-title {
margin-bottom: 24px; margin-bottom: 24px;
} }
// &::before { // &::before {
// content: ""; // content: "";
// width: 18px; // width: 18px;
...@@ -35,6 +37,7 @@ ...@@ -35,6 +37,7 @@
margin-right: 12px; margin-right: 12px;
} }
} }
h1 { h1 {
color: $white; color: $white;
} }
...@@ -47,3 +50,32 @@ ...@@ -47,3 +50,32 @@
} }
} }
} }
.ti-widget-container {
margin-top: 0 !important;
}
.ti-footer {
box-shadow: none !important;
padding: 0 !important;
.ti-fade-container {
.ti-large-logo {
height: unset !important;
}
.ti-logo-fb {
max-width: 70px !important;
height: unset !important;
}
}
}
.TOP-BANNER-SECTION {
.ti-widget.ti-goog .ti-stars .ti-star {
max-width: 12px !important;
height: 12px !important;
}
}
\ No newline at end of file
dev/sass/style.scss
...@@ -8,6 +8,10 @@ $theme-colors: ( ...@@ -8,6 +8,10 @@ $theme-colors: (
"red": #f71d24 "red": #f71d24
); );
:root {
--white: #fff;
}
//colors //colors
// $primary: #121526; // $primary: #121526;
$primary: #005aff; $primary: #005aff;
...@@ -17,6 +21,7 @@ $primary-second: #005aff; ...@@ -17,6 +21,7 @@ $primary-second: #005aff;
$grey: #58595a; $grey: #58595a;
$red: #f71d24; $red: #f71d24;
//fonts //fonts
$body-font: "Sora", sans-serif; $body-font: "Sora", sans-serif;
...@@ -62,3 +67,11 @@ $body-font: "Sora", sans-serif; ...@@ -62,3 +67,11 @@ $body-font: "Sora", sans-serif;
@import "pages/master-portfolio/sticky-tab"; @import "pages/master-portfolio/sticky-tab";
@import "pages/master-portfolio/block-gallery"; @import "pages/master-portfolio/block-gallery";
@import "pages/master-portfolio/moment-gallery"; @import "pages/master-portfolio/moment-gallery";
@import "pages/case-study/case-study-banner";
@import "pages/case-study/case-study-general";
@import "pages/case-study/case-study-list";
@import "pages/case-study/case-study-filter";
@import "pages/milestone";
@import "./base/cta";
@import "./pages/awards/award-listing";
@import "./pages/awards/award-detail";
\ No newline at end of file
footer.php
This source diff could not be displayed because it is too large. You can view the blob instead.
functions.php
...@@ -252,7 +252,9 @@ function my_custom_pagination($numpages = '', $pagerange = '', $paged = '', $sea ...@@ -252,7 +252,9 @@ function my_custom_pagination($numpages = '', $pagerange = '', $paged = '', $sea
register_nav_menus( register_nav_menus(
array( array(
'menu-web' => esc_html__( 'Primary Menu', 'makura' ) 'menu-web' => esc_html__( 'Primary Menu', 'makura' ),
'quick-link' => esc_html__( 'Quick Links', 'makura' ),
'services' => esc_html__( 'Services', 'makura' )
) )
); );
......
header.php
...@@ -2,48 +2,48 @@ ...@@ -2,48 +2,48 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<?php wp_head(); ?> <?php wp_head(); ?>
<meta name="google-site-verification" content="DPEItwBusmmpY1RLo_YnoM9jRctsvqfM0AJNpkGiKwc" /> <meta name="google-site-verification" content="DPEItwBusmmpY1RLo_YnoM9jRctsvqfM0AJNpkGiKwc" />
<!-- Google Tag Manager --> <!-- Google Tag Manager -->
<script> <script>
(function(w, d, s, l, i) { (function(w, d, s, l, i) {
w[l] = w[l] || []; w[l] = w[l] || [];
w[l].push({ w[l].push({
'gtm.start': new Date().getTime(), 'gtm.start': new Date().getTime(),
event: 'gtm.js' event: 'gtm.js'
}); });
var f = d.getElementsByTagName(s)[0], var f = d.getElementsByTagName(s)[0],
j = d.createElement(s), j = d.createElement(s),
dl = l != 'dataLayer' ? '&l=' + l : ''; dl = l != 'dataLayer' ? '&l=' + l : '';
j.async = true; j.async = true;
j.src = j.src =
'https://www.googletagmanager.com/gtm.js?id=' + i + dl; 'https://www.googletagmanager.com/gtm.js?id=' + i + dl;
f.parentNode.insertBefore(j, f); f.parentNode.insertBefore(j, f);
})(window, document, 'script', 'dataLayer', 'GTM-T7SF2XRJ'); })(window, document, 'script', 'dataLayer', 'GTM-T7SF2XRJ');
</script> </script>
<!-- End Google Tag Manager --> <!-- End Google Tag Manager -->
</head> </head>
<body> <body>
<!-- Google Tag Manager (noscript) --> <!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-T7SF2XRJ" height="0" width="0" <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-T7SF2XRJ" height="0" width="0"
style="display:none;visibility:hidden"></iframe></noscript> style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) --> <!-- End Google Tag Manager (noscript) -->
<nav class="navbar navbar-expand-lg navbar-light top-nav p-0" id="myTopnav"> <nav class="navbar navbar-expand-lg navbar-light top-nav p-0" id="myTopnav">
<div class="container"> <div class="container">
<div class="row align-items-center position-relative nav-wrapper justify-content-between w-100"> <div class="row align-items-center position-relative nav-wrapper justify-content-between w-100">
<div class="col-5 col-lg-1 d-flex align-items-center nav-left"> <div class="col-5 col-lg-1 d-flex align-items-center nav-left">
<div class="logo d-flex align-items-center"> <div class="logo d-flex align-items-center">
<?php echo get_custom_logo(); ?> <?php echo get_custom_logo(); ?>
</div> </div>
</div> </div>
<div class="col-6 col-lg-10 d-flex align-items-center justify-content-end nav-right"> <div class="col-6 col-lg-10 d-flex align-items-center justify-content-end nav-right">
<?php <?php
wp_nav_menu( array( wp_nav_menu( array(
'theme_location' => 'menu-web', 'theme_location' => 'menu-web',
'depth' => 9, 'depth' => 9,
...@@ -55,27 +55,31 @@ ...@@ -55,27 +55,31 @@
</div>%3$s</ul>' </div>%3$s</ul>'
)); ));
?> ?>
<div class="book-button"> <div class="book-button">
<a href="#" data-bs-toggle="modal" data-bs-target="#exampleModal" <a href="#" data-bs-toggle="modal" data-bs-target="#exampleModal"
class="btn btn-primary btn-padding hover-up btn-start-project font-14 fw-500 btn-padding btn-submit">Start class="btn btn-primary btn-padding hover-up btn-start-project font-14 fw-500 btn-padding btn-submit">Start
your project your project
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
<path fill-rule="evenodd" clip-rule="evenodd" xmlns="http://www.w3.org/2000/svg">
d="M4 13L16.17 13L10.58 18.59L12 20L20 12L12 4L10.59 5.41L16.17 11L4 11L4 13Z" fill="white"></path> <path fill-rule="evenodd" clip-rule="evenodd"
</svg> d="M4 13L16.17 13L10.58 18.59L12 20L20 12L12 4L10.59 5.41L16.17 11L4 11L4 13Z"
<span class="bg-hover" style="left: 108px; top: 62.1562px;"></span> fill="white"></path>
</a> </svg>
</div> <span class="bg-hover" style="left: 108px; top: 62.1562px;"></span>
</div> </a>
<div class="col-1 menu-toggler"> </div>
<div class="toggler-icon"> </div>
<svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 24 24" height="32" width="32" <div class="col-1 menu-toggler">
xmlns="http://www.w3.org/2000/svg"> <div class="toggler-icon">
<path fill="none" d="M0 0h24v24H0z"></path> <svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 24 24" height="32"
<path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"></path> width="32" xmlns="http://www.w3.org/2000/svg">
</svg> <path fill="none" d="M0 0h24v24H0z"></path>
</div> <path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"></path>
</svg>
</div>
</div>
</div>
</div> </div>
</div> </nav>
</div>
</nav> <div class="header-placeholder"></div>
\ No newline at end of file \ No newline at end of file
includes/enqueuer.php
...@@ -12,7 +12,7 @@ function conserve_register_styles() ...@@ -12,7 +12,7 @@ function conserve_register_styles()
wp_enqueue_style('magnific-popup', 'https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/magnific-popup.min.css', null, $theme_version); wp_enqueue_style('magnific-popup', 'https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/magnific-popup.min.css', null, $theme_version);
wp_enqueue_style('slick', 'https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick-theme.min.css', null, $theme_version); wp_enqueue_style('slick', 'https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick-theme.min.css', null, $theme_version);
wp_enqueue_style('flatpicker', 'https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.6.13/flatpickr.min.css', null, $theme_version); wp_enqueue_style('flatpicker', 'https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.6.13/flatpickr.min.css', null, $theme_version);
wp_enqueue_style('custom-css', get_template_directory_uri() . '/assets/css/style.css', null, '6.4.5'); wp_enqueue_style('custom-css', get_template_directory_uri() . '/assets/css/style.css', null, '6.4.7');
......
single-resource.php
...@@ -5,7 +5,7 @@ $post_thumbnail_url = get_the_post_thumbnail_url(get_the_ID(), 'full'); ...@@ -5,7 +5,7 @@ $post_thumbnail_url = get_the_post_thumbnail_url(get_the_ID(), 'full');
if (!$post_thumbnail_url) { if (!$post_thumbnail_url) {
$post_thumbnail_url = get_field('resources_fallback_featured_image', 'option'); $post_thumbnail_url = get_field('resources_fallback_featured_image', 'option');
} }
$downloadable_resource = get_field('downloadable_resource', $post_id) ?: []; $downloadable_resource = get_field('downloadable_resource') ?: [];
if (isset($downloadable_resource) && is_array($downloadable_resource) && !empty($downloadable_resource)): if (isset($downloadable_resource) && is_array($downloadable_resource) && !empty($downloadable_resource)):
$enable_downloadable_resources = $downloadable_resource['enable_downloadable_resources']; $enable_downloadable_resources = $downloadable_resource['enable_downloadable_resources'];
if ($enable_downloadable_resources && isset($enable_downloadable_resources)): if ($enable_downloadable_resources && isset($enable_downloadable_resources)):
...@@ -44,7 +44,7 @@ endif; ...@@ -44,7 +44,7 @@ endif;
<ol class="breadcrumb"> <ol class="breadcrumb">
<li class="breadcrumb-item"><a href="<?php echo site_url('/'); ?>">Home</a></li> <li class="breadcrumb-item"><a href="<?php echo site_url('/'); ?>">Home</a></li>
<li class="breadcrumb-item"><a <li class="breadcrumb-item"><a
href="<?php echo get_permalink(get_page_by_path('downloadable-resources')); ?>">Downloadable href="<?php echo get_permalink(get_page_by_path('resources')); ?>">
Resources</a></li> Resources</a></li>
<li class="breadcrumb-item active" aria-current="page"><?php the_title(); ?></li> <li class="breadcrumb-item active" aria-current="page"><?php the_title(); ?></li>
</ol> </ol>
...@@ -59,12 +59,17 @@ endif; ...@@ -59,12 +59,17 @@ endif;
<div class="col-lg-6 col-12"> <div class="col-lg-6 col-12">
<div class="position-relative left-text-wrapper"> <div class="position-relative left-text-wrapper">
<h1><?php echo get_the_title(); ?></h1> <h1><?php echo get_the_title(); ?></h1>
<p><?php echo wp_trim_words(get_the_excerpt(), 8, ' [...]') ?: wp_trim_words(get_the_content(), 8, ' [...]'); ?> <p><?php echo get_the_excerpt() ?: wp_trim_words(get_the_content(), 8, ' [...]'); ?>
</p> </p>
<a href="<?php echo esc_url($url); ?>" target="_blank" <a href="<?php echo esc_url($url); ?>" target="_blank"
class="btn btn-primary btn-padding hover-up btn-start-project font-14 fw-500 btn-padding btn-submit" class="btn btn-primary btn-padding hover-up btn-start-project font-14 fw-500 btn-padding btn-submit"
download>Download download>Download
Now [<?php echo $icon; ?>]</a> Now [<?php echo $icon; ?>]<svg width="24" height="24" viewBox="0 0 24 24" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M4 13L16.17 13L10.58 18.59L12 20L20 12L12 4L10.59 5.41L16.17 11L4 11L4 13Z"
fill="white"></path>
</svg></a>
</div> </div>
</div> </div>
<div class="col-lg-5 col-md-5 mx-auto col-12 text-center right-image"> <div class="col-lg-5 col-md-5 mx-auto col-12 text-center right-image">
...@@ -87,26 +92,26 @@ endif; ...@@ -87,26 +92,26 @@ endif;
<?php echo the_content(); ?> <?php echo the_content(); ?>
<!-- faqs --> <!-- faqs -->
<?php if (get_field('enable_section')): ?> <?php if (get_field('enable_section')): ?>
<span><?php the_field('subtitle'); ?></span> <span class="over-title"><?php the_field('subtitle'); ?></span>
<h3><?php the_field('title'); ?></h3> <h3><?php the_field('title'); ?></h3>
<?php the_field('description'); ?> <?php the_field('description'); ?>
<?php $faqs = get_field('faqs'); <?php $faqs = get_field('faqs');
if ($faqs): ?> if ($faqs): ?>
<div class="faq-wrapper"> <div class="faq-wrapper">
<?php foreach ($faqs as $key => $faq): ?> <?php foreach ($faqs as $key => $faq): ?>
<div class="faq-item"> <div class="faq-item">
<div class="faq-title"> <div class="faq-title">
<strong><?php echo get_the_title($faq); ?></strong> <strong><?php echo get_the_title($faq); ?></strong>
</div>
<div class="faq-content-box">
<div class="faq-content">
<?php echo get_the_content(null, false, $faq); ?>
</div>
</div>
</div>
<?php endforeach; ?>
</div> </div>
<?php endif; ?> <div class="faq-content-box">
<div class="faq-content">
<?php echo get_the_content(null, false, $faq); ?>
</div>
</div>
</div>
<?php endforeach; ?>
</div>
<?php endif; ?>
<?php endif; ?> <?php endif; ?>
<!-- faqs --> <!-- faqs -->
......
single-service.php
...@@ -11,7 +11,8 @@ get_header(); ...@@ -11,7 +11,8 @@ get_header();
<nav aria-label="breadcrumb"> <nav aria-label="breadcrumb">
<ol class="breadcrumb"> <ol class="breadcrumb">
<li class="breadcrumb-item"><a href="<?php echo site_url('/');?>">Home</a></li> <li class="breadcrumb-item"><a href="<?php echo site_url('/');?>">Home</a></li>
<li class="breadcrumb-item"><a href="<?php echo get_permalink(get_page_by_path('services'));?>">Services</a></li> <li class="breadcrumb-item"><a
href="<?php echo get_permalink(get_page_by_path('services'));?>">Services</a></li>
<li class="breadcrumb-item active" aria-current="page"><?php the_title();?></li> <li class="breadcrumb-item active" aria-current="page"><?php the_title();?></li>
</ol> </ol>
</nav> </nav>
...@@ -24,16 +25,23 @@ get_header(); ...@@ -24,16 +25,23 @@ get_header();
<div class="row align-items-center justify-content-between"> <div class="row align-items-center justify-content-between">
<div class="col-lg-5 col-md-5 col-12"> <div class="col-lg-5 col-md-5 col-12">
<h1 class="pb-20"><?php the_title();?></h1> <h1 class="pb-20"><?php the_title();?></h1>
<p><?php the_field('banner_description');?></p> <p><?php the_field('banner_description');?></p>
<?php if(get_field('enable_inquiry')):?> <?php if(get_field('enable_inquiry')):?>
<div class="d-flex w-100 button-wrapper"> <div class="d-flex w-100 button-wrapper">
<button class="btn mb-20 btn-start-project btn-primary"><a href="<?php echo get_home_url().'/contact-us/';?>"><?php the_field('inquiry_text');?></a></button> <a class="btn mb-20 btn-start-project btn-primary"
href="<?php echo get_home_url().'/contact-us/';?>"><?php the_field('inquiry_text');?><svg
width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M4 13L16.17 13L10.58 18.59L12 20L20 12L12 4L10.59 5.41L16.17 11L4 11L4 13Z"
fill="white"></path>
</svg>
</a>
</div> </div>
<?php endif;?> <?php endif;?>
</div> </div>
<div class="col-lg-5 col-md-5 mx-auto col-12 text-center right-image"> <div class="col-lg-5 col-md-5 mx-auto col-12 text-center right-image">
<?php if($image = get_field('banner_image')):?> <?php if($image = get_field('banner_image')):?>
<?php echo wp_get_attachment_image($image,'full'); endif;?> <?php echo wp_get_attachment_image($image,'full'); endif;?>
</div> </div>
</div> </div>
</div> </div>
......
style.css
/* /*
Theme Name: Makura Theme Theme Name: Makura Theme
Text Domain: makura-theme Text Domain: makura-theme
Version: 1.2 Version: 1.2025.07
Description: Custom theme for Makura Description: Custom theme for Makura
Tags: blog, one-column, custom-background, custom-colors, custom-logo, custom-menu, editor-style, featured-images, footer-widgets, full-width-template, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, block-styles, wide-blocks, accessibility-ready Tags: blog, one-column, custom-background, custom-colors, custom-logo, custom-menu, editor-style, featured-images, footer-widgets, full-width-template, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, block-styles, wide-blocks, accessibility-ready
......
template-parts/home/milestone.php 0 → 100644
<section class="milestone makura-new">
<div class="container">
<div class="section-title">
<h2>
<img src="<?php echo get_parent_theme_file_uri()?>/assets/img/milestone-title.svg?>" alt="">
Recognition & Milestones
</h2>
<p>Our work has been recognized for pushing creative boundaries and delivering real impact. These milestones
reflect our passion for design and the trust our clients place in us.</p>
</div>
<div class="row">
<div class="col-lg-6">
<div class="milestone-card">
<div class="milestone-card-content">
<img src="<?php echo get_parent_theme_file_uri()?>/assets/img/milestone.svg" alt=""
class="img-fluid milestone-logo">
<span class="over-title">24 october 2023</span>
<h3>Recognition from World Health Organization</h3>
<p>Proud moments that highlight our dedication to impactful and innovative design.Breathing new
life, Makura Creations changed the overall look of CAN. Boosting their social media presence
and
updating their </p>
<a href="#">Learn More →</a>
</div>
<img src="<?php echo get_parent_theme_file_uri()?>/assets/img/blog-banner.png" alt=""
class="img-fluid ">
</div>
</div>
<div class="col-lg-6">
<div class="milestone-card">
<div class="milestone-card-content">
<img src="<?php echo get_parent_theme_file_uri()?>/assets/img/milestone.svg" alt=""
class="img-fluid milestone-logo">
<span class="over-title">24 october 2023</span>
<h3>Recognition from World Health Organization</h3>
<p>Proud moments that highlight our dedication to impactful and innovative design.Breathing new
life, Makura Creations changed the overall look of CAN. Boosting their social media presence
and
updating their </p>
<a href="#">Learn More →</a>
</div>
<img src="<?php echo get_parent_theme_file_uri()?>/assets/img/blog-banner.png" alt=""
class="img-fluid">
</div>
</div>
</div>
</div>
</section>
\ No newline at end of file
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