cl-theme: update css to version 2.0.2

This commit is contained in:
Jesús 2021-12-05 19:41:21 -05:00
parent 5f5b5d241f
commit 0974483b60
No known key found for this signature in database
GPG Key ID: F6EE7BC59A315766
2 changed files with 56 additions and 7 deletions

View File

@ -2,7 +2,7 @@
* bulma css framework (github.com/jgthms | bulma.io)
* Author: jeremy thomas
* Author: jesus e.
* Version: 2.0.1
* Version: 2.0.2
* Licensed under MIT (https://github.com/jgthms/bulma/blob/master/LICENSE)
*/
/* basic formatting changes (mostly to cater for darker colours) */
@ -48,6 +48,27 @@ body, input, textarea, .button {
display: none;
}
.nav__toggle {
position: absolute;
cursor: pointer;
margin: 0 1rem;
right: 0;
}
.nav__toggle svg {
width: 1rem;
fill: white;
}
.nav__toggle .close {
display: none;
}
.nav__toggle .close,
.nav__toggle .menu {
margin: 1rem auto;
}
label[for=navbar-toggle-cbox] {
cursor: pointer;
}
@ -56,6 +77,14 @@ label[for=navbar-toggle-cbox] {
display: block;
}
#navbar-toggle-cbox:checked ~ .navbar-brand label.nav__toggle svg.close {
display: block;
}
#navbar-toggle-cbox:checked ~ .navbar-brand label.nav__toggle svg.menu {
display: none;
}
/*- ----------- End Menu Mobile sin JS ------------- */
/* navigation */
.navbar {
@ -715,6 +744,18 @@ dt:hover > a.headerlink {
}
}
@media only screen and (min-width: 1087px) {
.nav__toggle {
display: none;
}
.nav__menu {
flex-direction: row;
}
.nav__menu li {
display: block;
}
}
@media screen and (max-width: 600px) {
.main-content {
padding: 0rem;

View File

@ -45,7 +45,7 @@
<!-- stylesheets -->
<link rel="stylesheet" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/css/bulma.css?v=0.7.4"/>
<link rel="stylesheet" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/css/hover.css"/>
<link rel="stylesheet" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/css/style.css?v=2.0.1"/>
<link rel="stylesheet" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/css/style.css?v=2.0.2"/>
<!-- favicon -->
<link rel="icon" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/favicon/cl-favicon-16x16.png" sizes="16x16"/>
<link rel="icon" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/favicon/cl-favicon-32x32.png" sizes="32x32"/>
@ -68,12 +68,20 @@
<a class="navbar-item" href="{{ SITEURL }}/" rel="home">
<h3 class="title is-3 has-text-white">{{ SITENAME_SINGLE }}</h3>
</a>
<!-- this "navbar-burger" hamburger menu is only visible on mobile -->
<label class="navbar-burger" for="navbar-toggle-cbox" data-target="navMenu">
<span></span>
<span></span>
<span></span>
<label class="nav__toggle" for="navbar-toggle-cbox">
<!-- Menu -->
<svg class="menu" viewBox="0 0 448 512" width="100" title="bars">
<path
d="M16 132h416c8.837 0 16-7.163 16-16V76c0-8.837-7.163-16-16-16H16C7.163 60 0 67.163 0 76v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16z"
/>
</svg>
<!-- Close -->
<svg class="close" viewBox="0 0 384 512" width="100" title="times">
<path
d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
/>
</svg>
</label>
<!-- end of burger -->
</div>