diff --git a/web/themes/custom/geofresco/README.md b/web/themes/custom/geofresco/README.md index f3c4c7b..e5bbb3a 100644 --- a/web/themes/custom/geofresco/README.md +++ b/web/themes/custom/geofresco/README.md @@ -44,6 +44,10 @@ Provided by default are seven npm scripts that point to Gulp tasks. We run gulp ``` npm run compile ``` + or: + ``` + ./css + ``` 3. Watch files and run tasks when they change. ``` diff --git a/web/themes/custom/geofresco/dist/css/global.css b/web/themes/custom/geofresco/dist/css/global.css index 312d2c7..2df1240 100644 --- a/web/themes/custom/geofresco/dist/css/global.css +++ b/web/themes/custom/geofresco/dist/css/global.css @@ -3084,8 +3084,7 @@ a.tag:hover { padding-top: 18px; } .slogan { - position: relative; - top: -36px; + margin-top: -36px; height: 36px; z-index: 30; display: -webkit-box; @@ -8165,8 +8164,5 @@ label.panel-block { background-color: #fafafa; padding: 3rem 1.5rem 6rem; } -/* -.hero-body { - padding: 2rem 1.5rem; -} -*/ +.secondary-menus { + z-index: 40; } diff --git a/web/themes/custom/geofresco/src/global/_layout.scss b/web/themes/custom/geofresco/src/global/_layout.scss index c0021e3..74b7fd5 100644 --- a/web/themes/custom/geofresco/src/global/_layout.scss +++ b/web/themes/custom/geofresco/src/global/_layout.scss @@ -1,8 +1,6 @@ @charset "UTF-8"; // Extend or override Bulma's layouts ../../node_modules/bulma/sass/layout -/* -.hero-body { - padding: 2rem 1.5rem; +.secondary-menus { + z-index: 40; } -*/ diff --git a/web/themes/custom/geofresco/src/templates/layout/page.html.twig b/web/themes/custom/geofresco/src/templates/layout/page.html.twig index 991c9e3..9e2bafc 100644 --- a/web/themes/custom/geofresco/src/templates/layout/page.html.twig +++ b/web/themes/custom/geofresco/src/templates/layout/page.html.twig @@ -18,14 +18,21 @@ {% block navbar %} {# Add a new region #} {% if page.header_user or page.header_search %} -<div class="container"> - <div class="columns"> - <div class="column"></div> +<div class="container secondary-menus"> + <div class="columns is-mobile"> + <div class="column is-hidden-mobile"></div> {% if page.header_user %} <div class="column user-account-menu"> {{ page.header_user }} </div> {% endif %} + <div class="column is-narrow is-hidden-tablet"> + <div id="js-navbar-burger" class="navbar-burger burger" data-target="navbar-menu"> + <span></span> + <span></span> + <span></span> + </div> + </div> {% if page.header_search %} <div class="column search-bar is-hidden-mobile"> {{ page.header_search }} @@ -34,7 +41,34 @@ </div> </div> {% endif %} -{{ parent() }} +{% if page.navbar_branding or page.navbar_social or page.primary_menu %} +{# Top navbar #} +<nav class="navbar has-shadow"> + <div class="container"> + <div class="navbar-brand"> + {% block navbar_branding %} + {% if page.navbar_branding %} + {{ page.navbar_branding }} + {% endif %} + {% endblock navbar_branding %} + </div> + <div id="js-navbar-menu" class="navbar-menu"> + {% block navbar_social %} + {% if page.navbar_social %} + <div class="navbar-start"> + {{ page.navbar_social }} + </div> + {% endif %} + {% endblock navbar_social %} + {% block primary_menu %} + {% if page.primary_menu %} + {{ page.primary_menu }} + {% endif %} + {% endblock primary_menu %} + </div> + </div> +</nav> +{% endif %} {% endblock navbar %} {% block header %} <p class="slogan"><strong class="title">{{ site_slogan }}</strong></p>