Bulmafy navbar

This commit is contained in:
Ludovic Stephan 2020-07-19 19:28:44 +02:00
parent deae1c4639
commit e323f2f755
6 changed files with 71 additions and 36 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View file

@ -0,0 +1,42 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns="http://www.w3.org/2000/svg"
preserveAspectRatio="xMidYMid meet"
viewBox="0 0 2560 2560"
height="256"
width="256"
version="1.0">
<g
transform="translate(-220,50)"
stroke="none"
fill="#ffffff"
id="layer101">
<path
id="path2"
d="M 0,1230 V 0 H 1500 3000 V 1230 2460 H 1500 0 Z" />
</g>
<g
transform="translate(-220,50)"
stroke="none"
fill="#3e2263"
id="layer102">
<path
id="path5"
d="M 220,1230 V -50 H 1500 2780 V 1230 2510 H 1500 220 Z m 1496,765 c 103,-17 204,-46 284,-83 l 55,-25 -40,-8 c -80,-16 -169,-10 -245,16 -123,42 -232,59 -385,59 -126,0 -278,-18 -341,-40 -13,-5 -16,-4 -9,4 14,15 166,60 254,76 102,19 315,19 427,1 z m -703,-217 c 15,-6 27,-13 27,-17 0,-4 -37,-25 -82,-47 -86,-43 -182,-120 -193,-155 -8,-26 32,-113 78,-167 44,-52 46,-62 10,-62 -39,1 -106,33 -165,80 -40,31 -54,38 -64,29 -21,-18 -17,-50 16,-116 57,-113 151,-199 259,-235 49,-16 51,-18 16,-13 -123,19 -260,151 -322,310 -15,39 -14,-81 1,-147 25,-107 55,-176 112,-251 49,-65 52,-73 38,-88 -21,-23 -104,-62 -216,-100 -51,-18 -97,-35 -102,-40 -4,-4 32,-10 80,-14 106,-9 256,13 317,48 l 39,22 56,-33 c 32,-18 114,-61 184,-95 80,-39 126,-67 123,-74 -6,-19 12,-16 19,3 9,24 28,5 22,-22 -7,-26 8,-34 18,-9 11,29 28,16 21,-18 -6,-30 -5,-31 10,-13 8,11 15,24 15,29 0,4 5,5 10,2 6,-3 8,-18 4,-33 -5,-26 -5,-26 10,-8 15,19 18,19 118,-12 113,-35 284,-72 329,-72 24,0 29,4 29,25 0,34 -36,125 -63,158 l -22,28 -59,-30 c -74,-39 -165,-43 -233,-10 -24,11 -43,25 -43,30 0,4 28,6 63,2 49,-4 71,-2 98,12 46,23 79,55 79,75 0,16 -48,66 -135,139 l -40,33 43,-23 c 55,-30 166,-121 188,-154 9,-13 13,-29 9,-36 -15,-23 -100,-69 -129,-69 -17,0 -38,-5 -46,-10 -12,-8 -10,-10 10,-10 49,1 104,19 149,51 l 45,31 24,-28 c 33,-40 72,-128 79,-180 10,-79 -25,-96 -233,-114 -84,-7 -148,-7 -218,0 -106,12 -269,51 -317,76 -28,14 -31,13 -62,-10 -56,-43 -167,-89 -225,-94 l -55,-5 6,29 c 2,16 14,55 26,86 21,57 27,112 15,142 -3,9 -34,38 -68,64 l -62,49 -104,7 c -166,12 -192,34 -83,70 34,12 65,24 68,28 4,4 -7,27 -24,52 -118,171 -124,402 -16,571 18,29 50,88 70,131 42,93 99,154 168,184 82,35 212,44 280,18 z m 540,-39 c 60,-16 70,-41 75,-196 l 5,-134 -39,3 -39,3 -5,114 c -4,93 -8,116 -22,125 -31,19 -41,-7 -47,-126 l -6,-113 -32,-3 c -41,-4 -44,6 -34,151 9,143 25,172 101,186 3,0 22,-4 43,-10 z m 322,-34 c 0,-30 0,-30 -64,-33 l -64,-3 7,-130 7,-129 h -35 -36 v 165 166 l 93,-3 92,-3 z m 115,-55 5,-84 18,27 c 21,33 39,34 60,5 15,-22 16,-18 16,60 l 1,82 h 35 35 l -2,-162 -3,-163 h -40 c -38,0 -41,2 -53,43 -16,49 -24,48 -42,-7 -12,-38 -16,-41 -50,-41 -34,0 -38,3 -44,31 -8,43 -8,284 1,293 4,4 19,6 33,4 24,-3 25,-6 30,-88 z m 370,-42 c 193,-243 228,-505 100,-759 -61,-120 -195,-260 -328,-343 -66,-41 -60,-26 13,33 36,29 92,85 125,126 182,230 209,500 75,753 -42,79 -45,89 -45,163 0,44 4,79 9,79 5,0 28,-24 51,-52 z M 1249,1314 c 76,-30 94,-102 41,-156 -27,-27 -29,-32 -17,-47 34,-40 25,-100 -19,-120 -30,-13 -143,-15 -164,-1 -11,7 -15,42 -18,164 l -4,156 23,9 c 37,15 115,13 158,-5 z m 571,-9 c 84,-43 61,-135 -43,-173 -46,-18 -52,-23 -52,-48 0,-39 30,-42 79,-9 l 37,25 -3,-41 c -4,-49 -32,-76 -90,-85 -32,-6 -41,-2 -68,24 -24,25 -30,39 -30,74 0,57 21,85 87,114 40,18 54,29 51,42 -5,29 -71,28 -111,-2 -19,-14 -36,-26 -39,-26 -11,0 -16,55 -7,72 24,45 131,63 189,33 z m -303,-12 c 56,-26 75,-65 71,-150 -3,-67 -6,-75 -38,-108 -43,-44 -94,-61 -146,-48 l -39,9 -3,144 c -1,79 0,150 2,157 8,19 110,17 153,-4 z" />
<path
id="path7"
d="m 1503,633 c 4,-3 10,-3 14,0 3,4 0,7 -7,7 -7,0 -10,-3 -7,-7 z" />
<path
id="path9"
d="m 1532,448 c 3,-7 15,-14 29,-16 23,-2 23,-2 5,13 -24,18 -39,20 -34,3 z" />
<path
id="path11"
d="m 1140,1231 c 0,-45 10,-61 36,-61 26,0 64,32 64,53 0,23 -23,37 -62,37 -35,0 -38,-2 -38,-29 z" />
<path
id="path13"
d="m 1140,1070 c 0,-35 17,-45 56,-36 20,5 25,12 22,34 -3,23 -8,27 -40,30 -36,3 -38,2 -38,-28 z" />
<path
id="path15"
d="m 1430,1151 c 0,-72 3,-91 14,-91 28,0 47,13 61,41 31,60 10,121 -47,135 l -28,6 z" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 4 KiB

View file

@ -7,8 +7,6 @@ $primary_color: #3e2263;
$background_color: #ddcecc;
html, body {
padding: 0;
margin: 0;
background: $background_color;
font-size: 18px;
}
@ -20,31 +18,17 @@ a {
/* header */
nav {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
align-items: center;
background: $primary_color;
height: 3em;
padding: 0.4em 1em;
}
#search-bar {
background-color: $primary_color;
padding: 0 1em;
nav a, nav a img {
height: 100%;
}
& :first-child {
justify-content: left;
}
// input[type="text"], input[type="email"] {
// font-size: 18px;
// border: 0;
// padding: 5px 5px;
// }
#search_autocomplete {
flex: 1;
width: 480px;
margin: 0;
padding: 10px 10px;
& :last-child {
justify-content: right;
}
}
.highlight {

View file

@ -1,4 +1,4 @@
{% extends "bds/base.html" %}
{% extends "bds/base_layout.html" %}
{% block content %}
<div style="width: 60%; margin: auto; padding-top: 2em;">

View file

@ -1,13 +1,18 @@
{% load i18n %}
{% load static %}
<nav id="search-bar">
<nav id="search-bar" class="level">
<div class="level-item">
<figure class="image is-64x64 is-pulled-left">
<a href="{% url "bds:home" %}">
<img src="{% static "bds/images/logo.svg" %}" alt="bds-logo">
<img src="{% static "bds/images/logo_square.svg" %}" alt="bds-logo">
</a>
</figure>
</div>
<div>
<div class="level-item">
<input
class="input"
type="text"
name="q"
id="search_autocomplete"
@ -16,9 +21,13 @@
<div class="yourlabs-autocomplete"></div>
</div>
<div class="level-item">
<figure class="image is-64x64">
<a href="#TODO">
<img src="{% static "bds/images/logout.svg" %}" alt="logout">
</a>
</figure>
</div>
</nav>
<script type="text/javascript">