HackENS/hackens-orga
6
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

add css for divider lines

Browse source
This commit is contained in:
sinavir 2023-02-13 02:22:05 +01:00
parent ab494c4820
commit f1a9e64c75
6 changed files with 205 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

61
hackens_orga/shared/static/css/bundle.css
View file

@ -7727,4 +7727,65 @@ a.has-text-danger-dark:hover, a.has-text-danger-dark:focus {
background-color: #fafafa;
padding: 3rem 1.5rem 6rem; }
.divider {
position: relative;
display: flex;
align-items: center;
text-transform: uppercase;
color: #7a7a7a;
font-size: 0.75rem;
font-weight: 600;
letter-spacing: 0.5px;
margin: 25px 0; }
.divider::after, .divider::before {
content: "";
display: block;
flex: 1;
height: 1px;
background-color: #dbdbdb; }
.divider.is-vertical {
flex-direction: column;
margin: 0 25px; }
.divider.is-vertical::after, .divider.is-vertical::before {
height: auto;
width: 1px; }
.divider.is-vertical::after {
margin-left: 0;
margin-top: 10px; }
.divider.is-vertical::before {
margin-right: 0;
margin-bottom: 10px; }
.divider.is-white::after, .divider.is-white::before {
background-color: white; }
.divider.is-black::after, .divider.is-black::before {
background-color: #0a0a0a; }
.divider.is-light::after, .divider.is-light::before {
background-color: whitesmoke; }
.divider.is-dark::after, .divider.is-dark::before {
background-color: #363636; }
.divider.is-primary::after, .divider.is-primary::before {
background-color: #00d1b2; }
.divider.is-primary.is-light::after, .divider.is-primary.is-light::before {
background-color: #ebfffc; }
.divider.is-link::after, .divider.is-link::before {
background-color: #485fc7; }
.divider.is-link.is-light::after, .divider.is-link.is-light::before {
background-color: #eff1fa; }
.divider.is-info::after, .divider.is-info::before {
background-color: #3e8ed0; }
.divider.is-info.is-light::after, .divider.is-info.is-light::before {
background-color: #eff5fb; }
.divider.is-success::after, .divider.is-success::before {
background-color: #48c78e; }
.divider.is-success.is-light::after, .divider.is-success.is-light::before {
background-color: #effaf5; }
.divider.is-warning::after, .divider.is-warning::before {
background-color: #ffe08a; }
.divider.is-warning.is-light::after, .divider.is-warning.is-light::before {
background-color: #fffaeb; }
.divider.is-danger::after, .divider.is-danger::before {
background-color: #f14668; }
.divider.is-danger.is-light::after, .divider.is-danger.is-light::before {
background-color: #feecf0; }
/*# sourceMappingURL=bundle.css.map */

4
hackens_orga/shared/static/css/bundle.css.map
View file

File diff suppressed because one or more lines are too long

37
hackens_orga/shared/static/js/bulma-utils.js Normal file
View file

@ -0,0 +1,37 @@
document.addEventListener('DOMContentLoaded', () => {
// Get all "navbar-burger" elements
const $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0);
// Add a click event on each of them
$navbarBurgers.forEach( el => {
el.addEventListener('click', () => {
// Get the target from the "data-target" attribute
if ('target' in el.dataset) {
const target = el.dataset.target;
const $target = document.getElementById(target);
el.classList.toggle('is-active');
$target.classList.toggle('is-active');
}
});
});
});
document.addEventListener('DOMContentLoaded', () => {
const $deleteElems = Array.prototype.slice.call(document.querySelectorAll('.delete'), 0);
// Add a click event on each of them
$deleteElems.forEach( el => {
el.addEventListener('click', () => {
// Get the target from the "data-target" attribute
if ('target' in el.dataset) {
const target = el.dataset.target;
const $target = document.getElementById(target);
$target.remove();
}
});
});
});

81
hackens_orga/shared/static/scss/divider.sass Normal file
View file

@ -0,0 +1,81 @@
@charset "utf-8"
// MIT License
//
// Copyright (c) 2020 CreativeBulma
//
// (https://github.com/CreativeBulma/bulma-divider/)
//
// Permission is hereby granted, free of charge, to any person obtaining a copy
// of this software and associated documentation files (the "Software"), to deal
// in the Software without restriction, including without limitation the rights
// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
// copies of the Software, and to permit persons to whom the Software is
// furnished to do so, subject to the following conditions:
//
// The above copyright notice and this permission notice shall be included in all
// copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
// SOFTWARE.
$divider-background-color: $border !default
$divider-font-size: $size-7 !default
$divider-margin-inner-size: 10px !default
$divider-margin-size: 25px !default
.divider
position: relative
display: flex
align-items: center
text-transform: uppercase
color: $grey
font-size: $divider-font-size
font-weight: $weight-semibold
letter-spacing: .5px
margin: $divider-margin-size 0
&::after,
&::before
content: ''
display: block
flex: 1
height: 1px
background-color: $divider-background-color
&.is-vertical
flex-direction: column
margin: 0 $divider-margin-size
&::after,
&::before
height: auto
width: 1px
&::after
margin-left: 0
margin-top: $divider-margin-inner-size
&::before
margin-right: 0
margin-bottom: $divider-margin-inner-size
@each $name, $pair in $colors
$color: nth($pair, 1)
&.is-#{$name}
&::after,
&::before
background-color: $color
// If light and dark colors are provided
@if length($pair) >= 4
$color-light: nth($pair, 3)
&.is-light
&::after,
&::before
background-color: $color-light

1
hackens_orga/shared/static/scss/main.scss
View file

@ -6,3 +6,4 @@
@import "bulma/bulma.sass";
@import "divider.sass";

50
hackens_orga/shared/templates/forms/common-form.html
View file

@ -1,31 +1,27 @@
{% load i18n %}
<form action="" method="post">
{% csrf_token %}
<div class="columns is-centered">
<div class="column {% if c_size %}{{ c_size }}{% else %}is-two-thirds{% endif %}">
<form action="" method="post">
{% csrf_token %}
{% include "forms/form.html" %}
{% include "forms/form.html" %}
<div class="field is-grouped">
<div class="control is-expanded">
<button class="button is-fullwidth is-outlined is-primary is-light" type="submit">
<span class="icon">
<i class="fas fa-{% if f_icon %}{{ f_icon }}{% else %}check{% endif %}"></i>
</span>
<span>{% if f_submit %}{{ f_submit }}{% else %}{% trans "Enregister" %}{% endif %}</span>
</button>
</div>
<div class="control">
<a class="button is-primary" href="{{ r_url }}{% if r_anchor %}#{{ r_anchor }}{% endif %}">
<span class="icon">
<i class="fas fa-undo-alt"></i>
</span>
<span>{% if f_return %}{{ f_return }}{% else %}{% trans "Retour" %}{% endif %}</span>
</a>
</div>
</div>
</form>
<div class="field is-grouped">
<div class="control is-expanded">
<button class="button is-fullwidth is-outlined is-primary is-light" type="submit">
<span class="icon">
<i class="fas fa-{% if f_icon %}{{ f_icon }}{% else %}check{% endif %}"></i>
</span>
<span>{% if f_submit %}{{ f_submit }}{% else %}{% trans "Enregister" %}{% endif %}</span>
</button>
</div>
<!--
<div class="control">
<a class="button is-primary" href="{{ r_url }}{% if r_anchor %}#{{ r_anchor }}{% endif %}">
<span class="icon">
<i class="fas fa-undo-alt"></i>
</span>
<span>{% if f_return %}{{ f_return }}{% else %}{% trans "Retour" %}{% endif %}</span>
</a>
</div>
-->
</div>
</div>
</form>