Start converting header, nav etc to all bulma columns

This commit is contained in:
Benjamin Melançon 2019-08-16 02:53:01 -04:00
parent 3971990b6e
commit 0565057444
4 changed files with 47 additions and 38 deletions

View file

@ -2,7 +2,7 @@
// Extend or override Bulma's elements ../../node_modules/bulma/sass/elements // Extend or override Bulma's elements ../../node_modules/bulma/sass/elements
.geo-title { .site-title {
display: inline-block; display: inline-block;
width: 4.5em; width: 4.5em;
font-size: 37px; font-size: 37px;

View file

@ -1,9 +1,2 @@
@charset "UTF-8"; @charset "UTF-8";
// Extend or override Bulma's layouts ../../node_modules/bulma/sass/layout // Extend or override Bulma's layouts ../../node_modules/bulma/sass/layout
// Hiding or making the top empty have no padding screws
// up the layout and i have no idea why, but cut the
// padding in half and it comes out perfect. *shrug*
.empty-top {
padding: 0.375rem;
}

View file

@ -1,4 +1,3 @@
{% extends "block.html.twig" %}
{# {#
/** /**
* @file * @file
@ -15,16 +14,18 @@
* @ingroup themeable * @ingroup themeable
*/ */
#} #}
{% block content %} {% if site_logo %}
{% if site_logo %} <div class="column is-narrow logo">
<figure class="image is-pulled-left"> <figure class="image is-pulled-left">
<a href="{{ path('<front>') }}" title="{{ 'Home'|t }}" rel="home"> <a href="{{ path('<front>') }}" title="{{ 'Home'|t }}" rel="home">
<img src="{{ site_logo }}" alt="{{ site_name }} Home" /> <img src="{{ site_logo }}" alt="{{ site_name }} Home" />
</a> </a>
</figure> </figure>
{% endif %} </div>
<a class="geo-title title is-3" href="{{ path('<front>') }}" title="{{ 'Home'|t }}" rel="home"> {% endif %}
<div class="column is-narrow sitename">
<a class="site-title title is-3" href="{{ path('<front>') }}" title="{{ 'Home'|t }}" rel="home">
<span class="green">Grassroots <span class="green">Grassroots
Economic</span> Economic</span>
<span class="yellow">Organizing</span></a> <span class="yellow">Organizing</span></a>
{% endblock content %} </div>

View file

@ -16,27 +16,42 @@
%} %}
{% endif %} {% endif %}
{% block navbar %} {% block navbar %}
{# Add a new region #} {# We put everything in Bulma columns so must do navbar in header block #}
{% if page.header_user or page.header_search %}
<div class="container">
<div class="columns">
<div class="column empty-top"></div>
{% if page.header_user %}
<div class="column user-account-menu">
{{ page.header_user }}
</div>
{% endif %}
{% if page.header_search %}
<div class="column search-bar is-hidden-mobile">
{{ page.header_search }}
</div>
{% endif %}
</div>
</div>
{% endif %}
{{ parent() }}
{% endblock navbar %} {% endblock navbar %}
{% block header %} {% block header %}
<div class="columns header">
{% block navbar_branding %}
{{ page.navbar_branding }}
{% endblock navbar_branding %}
<nav class="column navigation">
<div class="columns">
{% if page.header_search %}
<div class="column search-bar is-hidden-mobile">
{{ page.header_search }}
</div>
{% endif %}
{% if page.header_user %}
<div class="column user-account-menu">
{{ page.header_user }}
</div>
{% endif %}
{% block navbar_social %}
{% if page.navbar_social %}
<div class="column">
{{ page.navbar_social }}
</div>
{% endif %}
{% endblock navbar_social %}
{% block primary_menu %}
{% if page.primary_menu %}
<div class="column">
{{ page.primary_menu }}
</div>
{% endif %}
{% endblock primary_menu %}
</div>
</nav>
</div>
<p class="slogan"><strong class="title">{{ site_slogan }}</strong></p> <p class="slogan"><strong class="title">{{ site_slogan }}</strong></p>
{% if not is_front %} {% if not is_front %}
<section> <section>