Dancer2-Plugin-LiteBlog

 view release on metacpan or  search on metacpan

lib/Dancer2/Plugin/LiteBlog/Scaffolder/Data.pm  view on Meta::CPAN

button:hover, .btn:hover {
    background-color: var(--primary-hover);
}

/* Accessibility rules */
a:focus, button:focus, .btn:focus {
    outline: 3px solid rgba(0, 123, 255, 0.5);
    outline-offset: 2px;
}

/* Header Menu */
/* CSS for the mobile header */
#mobile-menu-container {
    position: relative; /* to hold the popup menu */
}

.hero-bar-hidden {
    display: none;
}

#mobile-header {

lib/Dancer2/Plugin/LiteBlog/Scaffolder/Data.pm  view on Meta::CPAN

    height: 24px; /* adjust height of the whole menu */
}

.hamburger-menu .bar {
    background-color: #ccc; /* color of the bar */
    height: 4px; /* thickness of each bar */
    width: 32px; /* width of each bar */
    border-radius: 2px; /* rounded edges */
}

/* The Hamburger Menu */
#mobile-navigation-menu {
    z-index: 9999; /* on top of other content */
    display: flex;
    flex-direction: column;
    background-color: #f5f5f5; 
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); 

lib/Dancer2/Plugin/LiteBlog/Scaffolder/Data.pm  view on Meta::CPAN

});
</script>
[% END %]

[% IF navigation %]
<!-- Handle the click on the hamburger icon -->
<script type="text/javascript">
document.addEventListener('DOMContentLoaded', (event) => {
    // Get the elements
    const menuToggle = document.querySelector('#menu-toggle');
    const mobileMenu = document.querySelector('#mobile-navigation-menu');

    // Add event listener
    menuToggle.addEventListener('click', function() {
        // Toggle the .open class on the mobile menu
        mobileMenu.classList.toggle('open');
    });
});
</script>
[% END %]

[% IF feature.highlight %]
<script type="text/javascript">
document.addEventListener('DOMContentLoaded', (event) => {
    document.querySelectorAll('pre code').forEach((block) => {
        hljs.highlightBlock(block);

t/public/css/liteblog.css  view on Meta::CPAN

button:hover, .btn:hover {
    background-color: var(--primary-hover);
}

/* Accessibility rules */
a:focus, button:focus, .btn:focus {
    outline: 3px solid rgba(0, 123, 255, 0.5);
    outline-offset: 2px;
}

/* Header Menu */
/* CSS for the mobile header */
#mobile-menu-container {
    position: relative; /* to hold the popup menu */
}

.hero-bar-hidden {
    display: none;
}

#mobile-header {

t/public/css/liteblog.css  view on Meta::CPAN

    height: 24px; /* adjust height of the whole menu */
}

.hamburger-menu .bar {
    background-color: #ccc; /* color of the bar */
    height: 4px; /* thickness of each bar */
    width: 32px; /* width of each bar */
    border-radius: 2px; /* rounded edges */
}

/* The Hamburger Menu */
#mobile-navigation-menu {
    z-index: 9999; /* on top of other content */
    display: flex;
    flex-direction: column;
    background-color: #f5f5f5; 
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); 

t/views/layouts/liteblog.tt  view on Meta::CPAN

});
</script>
[% END %]

[% IF navigation %]
<!-- Handle the click on the hamburger icon -->
<script type="text/javascript">
document.addEventListener('DOMContentLoaded', (event) => {
    // Get the elements
    const menuToggle = document.querySelector('#menu-toggle');
    const mobileMenu = document.querySelector('#mobile-navigation-menu');

    // Add event listener
    menuToggle.addEventListener('click', function() {
        // Toggle the .open class on the mobile menu
        mobileMenu.classList.toggle('open');
    });
});
</script>
[% END %]

[% IF feature.highlight %]
<script type="text/javascript">
document.addEventListener('DOMContentLoaded', (event) => {
    document.querySelectorAll('pre code').forEach((block) => {
        hljs.highlightBlock(block);