diff --git a/assets/css/app.css b/assets/css/app.css index a0cacd2..cd21f4c 100644 --- a/assets/css/app.css +++ b/assets/css/app.css @@ -1,3 +1,4 @@ +@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap'); @import "tailwindcss"; @import "header.css"; @@ -116,57 +117,6 @@ body { transform: translateY(0); } -/* Breadcrumb Styles */ -.breadcrumb-nav { - width: 100%; - margin: 1rem 0; -} - -.breadcrumb-container { - max-width: 1200px; - margin: 0 auto; - padding: 0 1rem; -} - -.breadcrumb-list { - display: flex; - align-items: center; - flex-wrap: wrap; - list-style: none; - margin: 0; - padding: 0.75rem 1rem; - background: white; - border-radius: 8px; - box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); -} - -.breadcrumb-item { - display: flex; - align-items: center; - font-size: 0.875rem; - color: var(--gray-600); -} - -.breadcrumb-item a { - color: var(--gray-600); - text-decoration: none; - transition: color 0.2s ease; -} - -.breadcrumb-item a:hover { - color: var(--primary-blue); -} - -.breadcrumb-item:not(:last-child)::after { - content: "/"; - margin: 0 0.5rem; - color: var(--gray-300); -} - -.breadcrumb-item.active { - color: var(--primary-blue); - font-weight: 500; -} /* Responsive Utilities */ @media (max-width: 768px) { @@ -175,3 +125,37 @@ body { padding-right: 1rem; } } + +/* Prose Styles from docs/homepage.html and docs/post.html */ +.prose { + max-width: none; +} + +.prose h2 { + font-weight: 600; + margin-top: 2.5rem; + margin-bottom: 1rem; + font-size: 1.875rem; + line-height: 2.25rem; +} + +.prose p { + margin-bottom: 1.5rem; + line-height: 1.75; +} + +.prose blockquote { + border-left-width: 4px; + border-color: #3b82f6; + padding-left: 1.5rem; + margin: 2rem 0; + font-style: italic; +} + +.article-image { + transition: transform 0.3s ease; +} + +.article-image:hover { + transform: scale(1.02); +} diff --git a/assets/js/app.js b/assets/js/app.js index deed7c6..67031d2 100644 --- a/assets/js/app.js +++ b/assets/js/app.js @@ -7,4 +7,63 @@ window.Alpine = Alpine // Initialize Alpine Alpine.start() +// Header JavaScript - Hamburger menu functionality +document.addEventListener('DOMContentLoaded', function() { + // Mobile menu toggle + const offcanvasToggle = document.querySelector('.cs-header__offcanvas-toggle'); + const offcanvasClose = document.querySelector('.cs-header__offcanvas-close'); + const offcanvas = document.querySelector('.cs-header__offcanvas'); + const overlay = document.querySelector('.cs-search-overlay'); + + if (offcanvasToggle) { + offcanvasToggle.addEventListener('click', function() { + offcanvas.classList.add('active'); + overlay.style.display = 'block'; + document.body.style.overflow = 'hidden'; + }); + } + + if (offcanvasClose) { + offcanvasClose.addEventListener('click', function() { + offcanvas.classList.remove('active'); + overlay.style.display = 'none'; + document.body.style.overflow = ''; + }); + } + + + // Search functionality + const searchToggle = document.querySelectorAll('.cs-header__search-toggle'); + const searchClose = document.querySelector('.cs-search__close'); + const search = document.querySelector('.cs-search'); + + searchToggle.forEach(toggle => { + toggle.addEventListener('click', function() { + search.style.display = 'block'; + overlay.style.display = 'block'; + document.body.style.overflow = 'hidden'; + }); + }); + + if (searchClose) { + searchClose.addEventListener('click', function() { + search.style.display = 'none'; + overlay.style.display = 'none'; + document.body.style.overflow = ''; + }); + } + + if (overlay) { + overlay.addEventListener('click', function() { + if (offcanvas) { + offcanvas.classList.remove('active'); + } + search.style.display = 'none'; + overlay.style.display = 'none'; + document.body.style.overflow = ''; + + }); + } +}); + console.log("Hello world"); diff --git a/assets/js/header.js b/assets/js/header.js deleted file mode 100644 index e33c786..0000000 --- a/assets/js/header.js +++ /dev/null @@ -1,54 +0,0 @@ -// Header JavaScript -document.addEventListener('DOMContentLoaded', function() { - // Mobile menu toggle - const offcanvasToggle = document.querySelector('.cs-header__offcanvas-toggle'); - const offcanvasClose = document.querySelector('.cs-header__offcanvas-close'); - const offcanvas = document.querySelector('.cs-header__offcanvas'); - const overlay = document.querySelector('.cs-search-overlay'); - - if (offcanvasToggle) { - offcanvasToggle.addEventListener('click', function() { - offcanvas.classList.add('active'); - overlay.style.display = 'block'; - document.body.style.overflow = 'hidden'; - }); - } - - if (offcanvasClose) { - offcanvasClose.addEventListener('click', function() { - offcanvas.classList.remove('active'); - overlay.style.display = 'none'; - document.body.style.overflow = ''; - }); - } - - // Search functionality - const searchToggle = document.querySelectorAll('.cs-header__search-toggle'); - const searchClose = document.querySelector('.cs-search__close'); - const search = document.querySelector('.cs-search'); - - searchToggle.forEach(toggle => { - toggle.addEventListener('click', function() { - search.style.display = 'block'; - overlay.style.display = 'block'; - document.body.style.overflow = 'hidden'; - }); - }); - - if (searchClose) { - searchClose.addEventListener('click', function() { - search.style.display = 'none'; - overlay.style.display = 'none'; - document.body.style.overflow = ''; - }); - } - - if (overlay) { - overlay.addEventListener('click', function() { - offcanvas.classList.remove('active'); - search.style.display = 'none'; - overlay.style.display = 'none'; - document.body.style.overflow = ''; - }); - } -}); diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html index 15efced..68c16ce 100644 --- a/layouts/_default/baseof.html +++ b/layouts/_default/baseof.html @@ -31,10 +31,6 @@ - -
diff --git a/layouts/_default/single.html b/layouts/_default/single.html index 6077d75..1d7bca9 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -1,131 +1,131 @@ {{ define "main" }} -{{ .Summary }}
+{{ .Summary | truncate 100 }}
+Comments are disabled.
- {{ end }} - -Stay updated with the latest insights on technology and the future of work.
+ +- {{ .Site.Params.description | default "Exploring technology's impact on work and life" }} -
- - -{{ .Summary | truncate 150 }}
-Exploring the latest technological advancements and their impact on the modern workplace, from AI to remote collaboration tools.
+Exploring the benefits and potential pitfalls of using AI to recruit and evaluate candidates in the modern workplace.
+Discover the latest apps and software that can help you work smarter, not harder.
+{{ .Summary | truncate 100 }}
-How forward-thinking companies are maintaining strong cultures with distributed teams.
+What businesses need to know about the decentralized web and its potential impact.
+No categories available yet.
-