Nextia/roxo-hugo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: migrate Hugo Bootstrap theme to latest Hugo with Tailwind CSS and refactor codebase

Browse Source 
* replace Bootstrap-based styling with Tailwind CSS
* update theme compatibility for latest Hugo version
* refactor templates and partials
* fix outdated code and broken components
* improve project structure and maintainability
* optimize styling and frontend build setup
This commit is contained in:
Al Murad Uzzaman
2026-05-10 13:38:01 +06:00
parent eac3f49bc5
commit f8b297eaad
233 changed files with 5272 additions and 9256 deletions
Download Patch File Download Diff File Expand all files Collapse all files

218
layouts/home.html Executable file
View File

@@ -0,0 +1,218 @@
{{ define "main" }}
<!-- Banner -->
{{ with .Params.banner }}
{{ $bannerImage := resources.Get (strings.TrimPrefix "/" .image) }}
<section
class="min-h-screen flex items-center bg-center bg-no-repeat bg-cover"
{{ with $bannerImage }}
style="background-image: url('{{ .RelPermalink }}');"
{{ end }}>
<div class="container">
<div class="row justify-center">
<div class="lg:col-10 md:col-9 mb-8 text-center">
<p class="mb-2 text-text-dark font-extralight">
{{ .content | markdownify }}
</p>
<h1 class="text-h3 lg:text-h1">
{{ .title | markdownify }}
</h1>
<div class="mt-18! flex gap-5 flex-wrap justify-center">
{{ with .button_secondary }}
{{ if .enable }}
<a
class="btn btn-secondary"
href="{{ .link | absURL }}"
{{ if strings.HasPrefix .link `http` }}
target="_blank" rel="noopener"
{{ end }}>
<span class="btn-area">
<span data-text="{{ .label }}">
{{ .label }}
</span>
</span>
</a>
{{ end }}
{{ end }}
{{ with .button_primary }}
{{ if .enable }}
<a
class="btn btn-primary"
href="{{ .link | absURL }}"
{{ if strings.HasPrefix .link `http` }}
target="_blank" rel="noopener"
{{ end }}>
<span class="btn-area">
<span data-text="{{ .label }}">
{{ .label }}
</span>
</span>
</a>
{{ end }}
{{ end }}
</div>
</div>
</div>
</div>
<button
class="absolute bottom-15 left-1/2 -translate-x-1/2 js-scroll-to-next cursor-pointer bg-none border-none p-0"
type="button"
aria-label="Scroll to next section">
<svg
xmlns="http://www.w3.org/2000/svg"
width="26.07"
height="32.634"
viewBox="0 0 26.07 32.634">
<g id="download" transform="translate(-3.282)">
<path
id="Path_1"
data-name="Path 1"
d="M16.317,32.634a.5.5,0,0,1-.5-.5V.5a.5.5,0,0,1,1,0V32.134A.5.5,0,0,1,16.317,32.634Z"
fill="#00113e" />
<path
id="Path_2"
data-name="Path 2"
d="M16.315,32.634h0a.5.5,0,0,1-.354-.146L3.428,19.951a.5.5,0,0,1,.707-.707L16.314,31.427,28.5,19.244a.5.5,0,1,1,.707.707L16.668,32.487A.5.5,0,0,1,16.315,32.634Z"
fill="#00113e" />
</g>
</svg>
</button>
{{/* Smooth scroll to company stats section with header offset */}}
<script>
(function(){
function onClick(e){
e.preventDefault();
var statsSection = document.querySelector('.bg-secondary\\/70');
if(statsSection) {
var header = document.querySelector('nav, [role="banner"], header');
var headerHeight = header ? header.offsetHeight : 0;
var targetPosition = statsSection.getBoundingClientRect().top + window.scrollY - headerHeight;
window.scrollTo({ top: targetPosition, behavior: 'smooth' });
}
}
document.addEventListener('DOMContentLoaded', function(){
var btn = document.querySelector('.js-scroll-to-next');
if(btn) btn.addEventListener('click', onClick, {passive:false});
});
})();
</script>
</section>
{{ end }}
<!-- /Banner -->
<!-- Company Stats -->
{{ with .Params.company_stats }}
{{ if .enable }}
<section class="section-sm bg-secondary/70">
<div class="container">
<div class="row">
<h2 class="mb-10 text-text-light font-extralight tracking-widest">
{{ .title }}
</h2>
<div class="row g-4">
{{ range .stats }}
<div class="md:col-3 col-6">
<div class="">
<h6 class="text-text-light font-extralight text-lg">
{{ .name }}
</h6>
<p class="h1 text-text-light font-bold -mt-2!">
{{ .count }}
</p>
</div>
</div>
{{ end }}
</div>
</div>
</div>
</section>
{{ end }}
{{ end }}
<!-- /Company Stats -->
<!-- Recent Works -->
{{ with .Params.recent_works }}
{{ if .enable }}
<section class="section">
<div class="container">
<div class="row items-center justify-between">
<h2 class="mb-4 font-extralight tracking-widest">
{{ .title | markdownify }}
</h2>
<p class="h6">
{{ .description | markdownify }}
</p>
<div class="mt-14 grid gap-8 md:grid-cols-2">
{{ range where (where site.RegularPages "Type" "portfolio") "Params.featured" true }}
{{ partial "components/portfolio-card" . }}
{{ end }}
</div>
</div>
</div>
</section>
{{ end }}
{{ end }}
<!-- /Features -->
<!-- Testimonials -->
{{ with site.GetPage "sections/testimonial" }}
{{ if .Params.enable }}
<section class="section bg-tertiary">
<style>
@media (min-width: 1024px) {
.testimonials-grid:hover .testimonial-card {
opacity: 0.4;
}
.testimonials-grid:hover .testimonial-card:hover {
opacity: 1;
}
}
</style>
<div class="container">
<div class="row">
<div class="mb-12">
<h2 class="mb-4 font-extralight">
{{ .Title | markdownify }}
</h2>
<p class="h6">
{{ .Params.description | markdownify }}
</p>
</div>
<div class="col-12">
<div class="testimonials-grid grid gap-8 md:grid-cols-2 lg:grid-cols-3">
{{ range .Params.testimonials }}
<article class="testimonial-card bg-body px-7 py-10 transition-opacity duration-300">
<div class="mb-6 flex items-center">
{{ partial "image" (dict "Src" .avatar "Size" "80x80" "Class" "" "Alt" .name) }}
<div class="ml-4">
<h3 class="h6 font-primary font-semibold">
{{ .name }}
</h3>
<p>
{{ .designation | markdownify }}
</p>
</div>
</div>
<blockquote>
{{ .content | markdownify }}
</blockquote>
</article>
{{ end }}
</div>
</div>
</div>
</div>
</section>
{{ end }}
{{ end }}
<!-- /Testimonials -->
<!-- Call to action -->
{{ partial "call-to-action" . }}
<!-- /Call to action -->
{{ end }}