flifloo/nuitdelinfo_2021
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Merge pull request #9 from flifloo/kybo

Browse source 
last modifs kybo
This commit is contained in:
Ethanell 2021-12-03 06:41:07 +01:00 committed by GitHub
commit 477e8552d8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
10 changed files with 233 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

82
static/css/style.css
View file

@ -175,6 +175,12 @@ nav .right {
-ms-flex-align: center;
align-items: center;
}
nav .right .opennavmobile {
display: none;
cursor: pointer;
font-size: 60px;
color: #efefef;
}
nav .right img {
width: 50px;
cursor: pointer;
@ -197,6 +203,65 @@ nav .right .search:hover {
color: #00E8C2;
}
.navbar-mobile {
display: none;
-webkit-transform: translateX(100%);
transform: translateX(100%);
position: fixed;
width: 100%;
-webkit-transition: all ease-in-out 0.3s;
transition: all ease-in-out 0.3s;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
height: 100vh;
background: #303030;
top: 0;
left: 0;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
z-index: 9998;
}
.navbar-mobile.open {
-webkit-transform: translateX(0) !important;
transform: translateX(0) !important;
}
.navbar-mobile .closenavmobile {
position: fixed;
top: 20px;
right: 20px;
color: #efefef;
font-size: 70px;
cursor: pointer;
}
.navbar-mobile a {
font-size: 35px;
padding: 30px 0;
}
.navbar-mobile i {
font-size: 50px;
}
@media all and (max-width: 800px) {
.navbar-mobile {
display: -webkit-box !important;
display: -ms-flexbox !important;
display: flex !important;
}
nav .left .submenu, nav .right a {
display: none;
}
nav .opennavmobile {
display: block !important;
}
}
.flex-card {
display: -webkit-box;
display: -ms-flexbox;
@ -268,6 +333,7 @@ nav .right .search:hover {
position: fixed;
display: none;
padding: 30px;
overflow: auto;
padding-top: 100px;
height: 100vh;
z-index: 9999;
@ -351,6 +417,8 @@ nav .right .search:hover {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: space-evenly;
-ms-flex-pack: space-evenly;
justify-content: space-evenly;
@ -402,6 +470,20 @@ nav .right .search:hover {
margin-left: 15px;
}
@media all and (max-width: 1060px) {
.search-col, .flex-card .card {
-webkit-box-flex: 0 !important;
-ms-flex: 0 1 45% !important;
flex: 0 1 45% !important;
}
}
@media all and (max-width: 750px) {
.search-col, .flex-card .card {
-webkit-box-flex: 0 !important;
-ms-flex: 0 1 90% !important;
flex: 0 1 90% !important;
}
}
.personnal-info {
display: -webkit-box;
display: -ms-flexbox;

2
static/css/style.css.map
View file

File diff suppressed because one or more lines are too long

53
static/scss/layouts/nav.scss
View file

@ -34,6 +34,12 @@ nav{
display: flex;
justify-content: right;
align-items: center;
.opennavmobile{
display: none;
cursor: pointer;
font-size: 60px;
color: $light;
}
img{
width: 50px;
cursor: pointer;
@ -55,3 +61,50 @@ nav{
}
}
}
.navbar-mobile{
&.open{
transform: translateX(0) !important;
}
display: none;
transform: translateX(100%);
.closenavmobile{
position: fixed;
top: 20px;
right: 20px;
color: $light;
font-size: 70px;
cursor: pointer;
}
position: fixed;
width: 100%;
transition: all ease-in-out 0.3s;
align-items: center;
height: 100vh;
background: $background2;
top: 0;
left: 0;
justify-content: center;
flex-direction: column;
z-index: 9998;
a{
font-size: 35px;
padding: 30px 0;
}
i{
font-size: 50px;
}
}
@media all and (max-width: 800px){
.navbar-mobile{
display: flex !important;
}
nav .left .submenu, nav .right a{
display: none;
}
nav .opennavmobile{
display: block !important;
}
}

14
static/scss/layouts/quicksearch.scss
View file

@ -2,6 +2,7 @@
position: fixed;
display: none;
padding: 30px;
overflow: auto;
padding-top: 100px;
height: 100vh;
z-index: 9999;
@ -57,6 +58,7 @@
}
.flex-search{
display: flex;
flex-wrap: wrap;
justify-content: space-evenly;
align-items: center;
.search-col{
@ -92,3 +94,15 @@
}
}
}
@media all and (max-width: 1060px){
.search-col, .flex-card .card{
flex: 0 1 45% !important;
}
}
@media all and (max-width: 750px){
.search-col, .flex-card .card{
flex: 0 1 90% !important;
}
}

26
templates/article/edit.html
View file

@ -1,10 +1,34 @@
{% load static %}
<head>
<link rel="stylesheet" type="text/css" href="{% static 'css/style.css' %}">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<script src="{% static 'js/script.js' %}"></script>
{{ form.media }}
</head>
<body>
<form action="/a/edit/{{ edit_id }}/" method="post">
{% include 'quicksearch.html' %}
<nav>
<div class="left">
<a href="/" class="logo">LSDD</a>
<div class="submenu">
<a href="/a/">Sauvetages</a>
<a href="/p/">Personnes</a>
<a href="/b/">Bateaux</a>
</div>
</div>
<div class="right">
<a href="#quicksearch"><i class="material-icons search">search</i></a>
<img src="{% static 'images/pesquet.jpg' %}">
</div>
</nav>
<div class="container">
<h1>Ajouter un article</h1>
<form class="article-form" action="/a/edit/{{ edit_id }}/" method="post">
{% csrf_token %}
{{ form }}
<input type="submit" value="Submit">
</form>
</div>
</body>

2
templates/article/submit.html
View file

@ -15,7 +15,7 @@
<div class="submenu">
<a href="/a/">Sauvetages</a>
<a href="/p/">Personnes</a>
<a href="">Equipages</a>
<a href="/b/">Bateaux</a>
</div>
</div>
<div class="right">

27
templates/base.html
View file

@ -25,11 +25,36 @@
{% else %}
<a href="{% url 'login' %}">Login</a>
{% endif %}
<i class="material-icons opennavmobile">menu</i>
</div>
</nav>
<div class="navbar-mobile">
<i class="material-icons closenavmobile">close</i>
<a href="/a/">Sauvetages</a>
<a href="/p/">Personnes</a>
<a href="/b/">Bateaux</a>
<a href="#quicksearch"><i class="material-icons search">search</i></a>
{% if user.is_authenticated %}
<a href="{% url 'logout' %}"><img src="https://www.gravatar.com/avatar/{{ user.email | lower | md5 }}"></a>
{% else %}
<a href="{% url 'login' %}">Login</a>
{% endif %}
</div>
<div class="container">
{% block content %}
{% endblock %}
</div>
<script>
let menu = document.querySelector('.opennavmobile');
let close = document.querySelector('.closenavmobile');
let navmobile = document.querySelector('.navbar-mobile');
menu.addEventListener('click', function (){
navmobile.classList.toggle('open');
});
close.addEventListener('click', function (){
navmobile.classList.toggle('open');
});
</script>
</body>

1
templates/boat/boats.html
View file

@ -1,6 +1,7 @@
{% extends 'base.html' %}
{% load static %}
{% block content %}
<a href="/b/submit" class="btn-add">+</a>
<section>
<h1>Bateaux</h1>
<div class="flex-card">

28
templates/boat/submit.html
View file

@ -1,10 +1,34 @@
{% load static %}
<head>
<link rel="stylesheet" type="text/css" href="{% static 'css/style.css' %}">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<script src="{% static 'js/script.js' %}"></script>
{{ form.media }}
</head>
<body>
<form action="/b/submit/" method="post">
{% include 'quicksearch.html' %}
<nav>
<div class="left">
<a href="/" class="logo">LSDD</a>
<div class="submenu">
<a href="/a/">Sauvetages</a>
<a href="/p/">Personnes</a>
<a href="/b/">Bateaux</a>
</div>
</div>
<div class="right">
<a href="#quicksearch"><i class="material-icons search">search</i></a>
<img src="{% static 'images/pesquet.jpg' %}">
</div>
</nav>
<div class="container">
<h1>Ajouter un bateau</h1>
<form class="article-form" action="/b/submit/" method="post">
{% csrf_token %}
{{ form }}
<input type="submit" value="Submit">
<input type="submit" value="Ajouter">
</form>
</div>
</body>

4
templates/error.html
View file

@ -1,6 +1,10 @@
{% extends 'base.html' %}
{% load static %}
{% block content %}
<h1>Oups, une erreur est survenue :/</h1>
{% if quote %}
<h2>Pour nous faire pardonner voici une citation de Thomas Pesquet:</h2>
<p>{{ quote }}</p>
{% endif %}
{% endblock %}