Updated navbar size
This commit is contained in:
parent
77de7d54ca
commit
209ba0f5f0
2 changed files with 82 additions and 76 deletions
|
@ -1,5 +1,5 @@
|
|||
.navbar {
|
||||
min-height: 3.25rem;
|
||||
min-height: 3.5rem;
|
||||
background-color: var(--navbar-color);
|
||||
box-shadow: rgba(216, 222, 233, 0.15) 0px 5px 10px 0px;
|
||||
color: rgba(0,0,0,.7);
|
||||
|
@ -11,11 +11,15 @@
|
|||
@include transition() {}
|
||||
|
||||
@include respond-to("medium-up") {
|
||||
min-height: 3.25rem;
|
||||
align-items: stretch;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
&.container {
|
||||
max-width: 1330px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
align-items: stretch;
|
||||
display: flex;
|
||||
|
|
150
views/index.ejs
150
views/index.ejs
|
@ -35,89 +35,91 @@
|
|||
<% } %>
|
||||
</head>
|
||||
<body>
|
||||
<nav class="navbar" aria-label="Navigation principale">
|
||||
<div class="navbar-brand">
|
||||
<a class="navbar-item" href="/">
|
||||
<img src="/img/logo.png" alt="Logo MusicTopus">
|
||||
<span>MusicTopus</span>
|
||||
</a>
|
||||
|
||||
<a role="button" class="navbar-burger" aria-label="Afficher le menu" aria-expanded="false" data-target="navbar">
|
||||
<span aria-hidden="true"></span>
|
||||
<span aria-hidden="true"></span>
|
||||
<span aria-hidden="true"></span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div id="navbar" class="navbar-menu">
|
||||
<% if ( user ) { %>
|
||||
<div class="navbar-start">
|
||||
<div class="navbar-item">
|
||||
<div class="buttons">
|
||||
<a class="button is-primary" href="/ajouter-un-album">
|
||||
<i class="icon-plus"></i>
|
||||
<span>
|
||||
Ajouter un album
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% } %>
|
||||
|
||||
<div class="navbar-end">
|
||||
<a class="navbar-item" href="/nous-contacter">
|
||||
Nous contacter
|
||||
<nav class="navbar">
|
||||
<nav class="navbar container" aria-label="Navigation principale">
|
||||
<div class="navbar-brand">
|
||||
<a class="navbar-item" href="/">
|
||||
<img src="/img/logo.png" alt="Logo MusicTopus">
|
||||
<span>MusicTopus</span>
|
||||
</a>
|
||||
<% if ( user ) { %>
|
||||
<div class="navbar-item has-dropdown">
|
||||
<a class="navbar-link">
|
||||
<i class="icon-user"></i>
|
||||
<span>
|
||||
<%= user.username %>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
<div class="navbar-dropdown">
|
||||
<a class="navbar-item" href="/mon-compte">
|
||||
Mon compte
|
||||
</a>
|
||||
<hr />
|
||||
<a class="navbar-item" href="/ma-collection">
|
||||
Ma collection
|
||||
</a>
|
||||
<a class="navbar-item" href="/ma-collection/exporter">
|
||||
Exporter ma collection
|
||||
</a>
|
||||
<a class="navbar-item" href="/ma-collection/importer">
|
||||
Importer une collection
|
||||
</a>
|
||||
<a role="button" class="navbar-burger" aria-label="Afficher le menu" aria-expanded="false" data-target="navbar">
|
||||
<span aria-hidden="true"></span>
|
||||
<span aria-hidden="true"></span>
|
||||
<span aria-hidden="true"></span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div id="navbar" class="navbar-menu">
|
||||
<% if ( user ) { %>
|
||||
<div class="navbar-start">
|
||||
<div class="navbar-item">
|
||||
<div class="buttons">
|
||||
<a class="button is-primary" href="/ajouter-un-album">
|
||||
<i class="icon-plus"></i>
|
||||
<span>
|
||||
Ajouter un album
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% } %>
|
||||
<div class="navbar-item apparence">
|
||||
<div class="theme-switch-wrapper">
|
||||
<label class="theme-switch" for="checkbox" aria-label="Passer du thème clair au thème sombre et inversement">
|
||||
<input type="checkbox" id="checkbox" />
|
||||
<div class="slider round"></div>
|
||||
</label>
|
||||
|
||||
<div class="navbar-end">
|
||||
<a class="navbar-item" href="/nous-contacter">
|
||||
Nous contacter
|
||||
</a>
|
||||
<% if ( user ) { %>
|
||||
<div class="navbar-item has-dropdown">
|
||||
<a class="navbar-link">
|
||||
<i class="icon-user"></i>
|
||||
<span>
|
||||
<%= user.username %>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
<div class="navbar-dropdown">
|
||||
<a class="navbar-item" href="/mon-compte">
|
||||
Mon compte
|
||||
</a>
|
||||
<hr />
|
||||
<a class="navbar-item" href="/ma-collection">
|
||||
Ma collection
|
||||
</a>
|
||||
<a class="navbar-item" href="/ma-collection/exporter">
|
||||
Exporter ma collection
|
||||
</a>
|
||||
<a class="navbar-item" href="/ma-collection/importer">
|
||||
Importer une collection
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="navbar-item">
|
||||
<div class="buttons">
|
||||
<% if ( !user ) { %>
|
||||
<a class="button is-primary" href="/connexion">
|
||||
<strong>Connexion</strong>
|
||||
</a>
|
||||
<% } else { %>
|
||||
<a class="button is-danger" href="/se-deconnecter">
|
||||
Déconnexion
|
||||
</a>
|
||||
<% } %>
|
||||
<% } %>
|
||||
<div class="navbar-item apparence">
|
||||
<div class="theme-switch-wrapper">
|
||||
<label class="theme-switch" for="checkbox" aria-label="Passer du thème clair au thème sombre et inversement">
|
||||
<input type="checkbox" id="checkbox" />
|
||||
<div class="slider round"></div>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="navbar-item">
|
||||
<div class="buttons">
|
||||
<% if ( !user ) { %>
|
||||
<a class="button is-primary" href="/connexion">
|
||||
<strong>Connexion</strong>
|
||||
</a>
|
||||
<% } else { %>
|
||||
<a class="button is-danger" href="/se-deconnecter">
|
||||
Déconnexion
|
||||
</a>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</nav>
|
||||
|
||||
<div id="toastr">
|
||||
|
|
Loading…
Reference in a new issue