diff --git a/CHANGELOG.md b/CHANGELOG.md index fd4e0177..cdacea61 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -150,3 +150,17 @@ On some database engines (postgreSQL) you also need to update the id sequences: ```bash python3 manage.py sqlsequencereset cotisations | python3 manage.py dbshell ``` + +## MR 296: Frontend changes + +Install fonts-font-awesome + +```bash +apt-get -y install fonts-font-awesome +``` + +Collec new statics + +```bash +python3 manage.py collectstatic +``` diff --git a/apt_requirements.txt b/apt_requirements.txt index 46d4c752..8b8c67c4 100644 --- a/apt_requirements.txt +++ b/apt_requirements.txt @@ -14,4 +14,5 @@ libjs-jquery libjs-jquery-ui libjs-jquery-timepicker libjs-bootstrap +fonts-font-awesome graphviz diff --git a/logs/templates/logs/sidebar.html b/logs/templates/logs/sidebar.html index 87011cfc..d2ee3002 100644 --- a/logs/templates/logs/sidebar.html +++ b/logs/templates/logs/sidebar.html @@ -29,15 +29,15 @@ with this program; if not, write to the Free Software Foundation, Inc., {% block sidebar %} {% can_view_app logs %} - + {% trans "Summary" %} - + {% trans "Events" %} - + {% trans "General" %} diff --git a/re2o/locale/fr/LC_MESSAGES/django.mo b/re2o/locale/fr/LC_MESSAGES/django.mo index e51e7ad2..e3d6b8ed 100644 Binary files a/re2o/locale/fr/LC_MESSAGES/django.mo and b/re2o/locale/fr/LC_MESSAGES/django.mo differ diff --git a/re2o/locale/fr/LC_MESSAGES/django.po b/re2o/locale/fr/LC_MESSAGES/django.po index 58886a6b..9c9941b2 100644 --- a/re2o/locale/fr/LC_MESSAGES/django.po +++ b/re2o/locale/fr/LC_MESSAGES/django.po @@ -87,7 +87,7 @@ msgstr "À propos de %(AssoName)s" #: templates/re2o/about.html:36 msgid "" "Re2o is an administration tool initiated by Rezo Supelec Metz and a few members of other Rezo Metz and a few members of other FedeRez associations around the summer 2016.
It is " "intended to be a tool independant from any network infrastructure so it can " "be setup in \"a few steps\". This tool is entirely free and available under " @@ -98,11 +98,11 @@ msgid "" "to contact us and come help us build the future of Re2o." msgstr "" "Re2o est un outil d'administration initié par Rézo Supélec Metz et quelques membres d'autres assocations de Rézo Metz et quelques membres d'autres associations de FedeRez autour de l'été 2016.
Il se veut " "être un outil indépendant de toute infrastructure réseau pour pouvoir être " "installé en \"quelques étapes\". Cet outil est entièrement gratuit et est " -"disponible sous license GNU Public License v2 (GPLv2) sur legitlab de FedeRez.
\n" "Les mainteneurs de Re2o sont de fiers bénévoles venant principalement " "d'écoles d'ingénieurs françaises (mais pas seulement) qui ont donné beaucoup " diff --git a/re2o/settings.py b/re2o/settings.py index 9dd52d1f..0a019d2d 100644 --- a/re2o/settings.py +++ b/re2o/settings.py @@ -174,6 +174,7 @@ BOOTSTRAP_BASE_URL = '/javascript/bootstrap/' # Use only absolute paths with '/' delimiters even on Windows STATICFILES_DIRS = ( os.path.join(BASE_DIR, 'static').replace('\\', '/'), + "/usr/share/fonts-font-awesome/", ) # Directory where the static files served by the server are stored STATIC_ROOT = os.path.join(BASE_DIR, 'static_files') diff --git a/re2o/templates/re2o/about.html b/re2o/templates/re2o/about.html index f7afc69c..99e2f9b3 100644 --- a/re2o/templates/re2o/about.html +++ b/re2o/templates/re2o/about.html @@ -35,7 +35,7 @@ with this program; if not, write to the Free Software Foundation, Inc.,

{% trans "About Re2o" %}

{% blocktrans trimmed %} Re2o is an administration tool initiated by - Rezo Supelec Metz and a few + Rezo Metz and a few members of other FedeRez associations around the summer 2016.
It is intended to be a tool independant from any network infrastructure diff --git a/re2o/templatetags/design.py b/re2o/templatetags/design.py index c64e9b40..9df37c30 100644 --- a/re2o/templatetags/design.py +++ b/re2o/templatetags/design.py @@ -31,9 +31,9 @@ def tick(valeur, autoescape=False): if isinstance(valeur,bool): if valeur == True: - result = '' + result = '' else: - result = '' + result = '' return mark_safe(result) else: # if the value is not a boolean, display it as if tick was not called diff --git a/static/css/base.css b/static/css/base.css index 5748f538..3d040c9c 100644 --- a/static/css/base.css +++ b/static/css/base.css @@ -1,38 +1,22 @@ -/* Sticky footer hacks */ -html, body { - height: 100%; -} - -#wrap { - min-height: 100%; -} - -#main { - overflow: auto; - padding-bottom:60px; /* this needs to be bigger than footer height*/ -} - +/* Footer */ footer { - position: relative; - margin-top: -50px; /* negative value of footer height */ - height: 50px; - clear:both; - padding-top:20px; - background-color: #222222; - /*background: -webkit-linear-gradient(left, red, red 16.6%, orange 16.6%, orange, orange 33.3%, yellow 33.3%, yellow, yellow 50%, green 50%, green, green 66.6%, blue 66.6%, blue, blue 83.3%, violet 83.3%,violet); */ - color: white; - padding: 15px; + padding-top: 3rem; + padding-bottom: 3rem; } -footer a { - color: white; - text-decoration: underline; +footer p { + margin-bottom: .25rem; } -/* Remove the navbar's default margin-bottom and rounded borders */ -.navbar { - margin-bottom: 0; - border-radius: 0; +/* Move the space between navbar and content in the content */ +.navbar { margin-bottom: 0; } +.pt4 { padding-top: 1.5rem!important; } + +/* Reserv space for icons and align */ +a > i.fa { + display: inline-block; + width: 26px; + text-align: center; } /* Reduce the padding for the logo in the navbar-brand so the 32px-high logo @@ -47,6 +31,20 @@ footer a { display: initial; } +/* Make navbar look less Bootstraped */ +.navbar-inverse { + background-color: #612210; + border-color: #f9a01b; +} + +.navbar-inverse .navbar-brand { + color: #ffffff; +} + +.navbar-inverse .navbar-nav > li > a { + color: #d6d6d6; +} + /* Add right colors for buttons in dropdown in navbar-inverse (else it is light * gray on white bg and white when hovered */ .navbar-inverse .dropdown-menu .btn-link { @@ -73,10 +71,11 @@ footer a { overflow: auto; } -/* Set gray background color and 100% height */ +/* Set gray background color */ .sidenav { - padding-top: 20px; background-color: #f1f1f1; + border: 1px solid #e0e0e0; + border-radius: 0 0 5px 5px; } .table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th { vertical-align: middle; diff --git a/static/js/sapphire.js b/static/js/sapphire.js index db65fdd1..4f2e6c29 100644 --- a/static/js/sapphire.js +++ b/static/js/sapphire.js @@ -21,189 +21,332 @@ // General options //===================================== // Times the canvas is refreshed a second -var FPS = 30; +let FPS = 30; // Determine the length of the trail (0=instant disappear, maximum=window.innerHeight=no disappear) -var TRAIL_TIME = 5; +let TRAIL_TIME = 5; // The color of the characters -var RAIN_COLOR = "#00F"; +let RAIN_COLOR = "#00F"; // The characters displayed -var CHARACTERS = "田由甲申甴电甶男甸甹町画甼甽甾甿畀畁畂畃畄畅畆畇畈畉畊畋界畍畎畏畐畑".split(""); +let CHARACTERS = "田由甲申甴电甶男甸甹町画甼甽甾甿畀畁畂畃畄畅畆畇畈畉畊畋界畍畎畏畐畑".split(""); // The font size used to display the characters -var FONT_SIZE = 10; +let FONT_SIZE = 10; // The maximum number of characters displayed by column -var MAX_CHAR = 7; +let MAX_CHAR = 7; -var Sapphire = function () { - var sapphire = { +let Sapphire; + +Sapphire = function () { + let sapphire = { triggerHandle: undefined, - activated: false, - runOnce: false, + activated: false, + runOnce: false, - getClass: function(elt, main, name) { elt.obj = main.getElementsByClassName(name); }, - getTag: function(elt, main, name) { elt.obj = main.getElementsByTagName(name); }, + getClass: function (elt, main, name) { + elt.obj = main.getElementsByClassName(name); + }, + getTag: function (elt, main, name) { + elt.obj = main.getElementsByTagName(name); + }, - getProp: function(elt) { - for (var i=0 ; i sapphire.canvas.height && Math.random() > 0.975) + for (let i = 0; i < sapphire.drops.length; i++) { + for (let j = 0; j < sapphire.drops[i].length; j++) { + let text = CHARACTERS[Math.floor(Math.random() * CHARACTERS.length)]; + ctx.fillText(text, i * FONT_SIZE, sapphire.drops[i][j] * FONT_SIZE); + if (sapphire.drops[i][j] * FONT_SIZE > sapphire.canvas.height && Math.random() > 0.975) sapphire.drops[i][j] = 0; sapphire.drops[i][j]++; } @@ -278,19 +425,29 @@ var Sapphire = function () { sapphire.resize(); window.addEventListener('resize', sapphire.resize); - sapphire.triggerHandle = setInterval(drawEverything, 1000/FPS); + sapphire.triggerHandle = setInterval(drawEverything, 1000 / FPS); }, - stop: function() { + stop: function () { window.removeEventListener('resize', sapphire.resize); clearInterval(sapphire.triggerHandle); sapphire.canvas.parentNode.removeChild(sapphire.canvas); }, - alterElts: function() { for (var e in sapphire.elts) { sapphire.elts[e].alter(main); } }, - revertElts: function() { for (var e in sapphire.elts) { sapphire.elts[e].revert(main); } }, + alterElts: function () { + for (let e in sapphire.elts) { + let main = document.getElementById("main"); + sapphire.elts[e].alter(main); + } + }, + revertElts: function () { + for (let e in sapphire.elts) { + let main = document.getElementById("main"); + sapphire.elts[e].revert(main); + } + }, - activate: function() { + activate: function () { if (!sapphire.runOnce) { sapphire.runOnce = true; sapphire.init(); @@ -306,11 +463,7 @@ var Sapphire = function () { sapphire.revertElts(); } } - } + }; return sapphire; -} - -var s = Sapphire(); -Konami(s.activate); - +}; \ No newline at end of file diff --git a/templates/base.html b/templates/base.html index aeb840da..f6cf3c39 100644 --- a/templates/base.html +++ b/templates/base.html @@ -39,224 +39,245 @@ with this program; if not, write to the Free Software Foundation, Inc., - - - {# Load CSS and JavaScript #} - {% bootstrap_css %} - - + + + {# Load CSS #} + {% bootstrap_css %} + + + + - {% bootstrap_javascript %} - - - - - - - {{ name_website }} : {% block title %}{% trans "Home" %}{% endblock %} - -

- + +
+
+
+
+
+ {% block sidebar %} + {% endblock %} +
- - -
-
-
-
-
- {% block sidebar %} - {% endblock %} -
-
-
-
- {# Display django.contrib.messages as Bootstrap alerts #} - {% bootstrap_messages %} -
- {% block content %}{% endblock %} -
-
-
- {% if request_user.is_authenticated %} -
-

{{ request_user.name }} {{ request_user.surname }}

-
- - - - - - - - - - - - - - - - - -
{% trans "Username" %}{{ request_user.pseudo }}
{% trans "Room" %}{{ request_user.room }}
{% trans "Internet access" %} - {% if request_user.has_access %} - {% blocktrans with request.user.end_access|date:"d b Y" as date %}Until {{ date }}{% endblocktrans %} - {% else %} - {% trans "Disabled" %} - {% endif %} -
{% trans "Membership" %} - {% if request_user.is_adherent %} - {% blocktrans with request_user.end_adhesion|date:"d b Y" as date %}Until {{ date }}{% endblocktrans %} - {% else %} - {% trans "Not a member" %} - {% endif %} -
- - {% else %} -

{% trans "You are not logged in." %}

- {% endif %} -
+
+ {# Display django.contrib.messages as Bootstrap alerts #} + {% bootstrap_messages %} + {% block content %}{% endblock %} +
+
+
{% if request_user.is_authenticated %} -
-
-

{% blocktrans count interfaces|length as nb %}{{ nb }} active machine{% plural %}{{ nb }} active machines{% endblocktrans %}

-
- +
+

{{ request_user.name }} {{ request_user.surname }}

+ + + + + + + + + + + + + + + + + +
{% trans "Username" %}{{ request_user.pseudo }}
{% trans "Room" %}{{ request_user.room }}
{% trans "Internet access" %} + {% if request_user.has_access %} + {% blocktrans with request.user.end_access|date:"d b Y" as date %}Until {{ date }}{% endblocktrans %} + {% else %} + {% trans "Disabled" %} + {% endif %} +
{% trans "Membership" %} + {% if request_user.is_adherent %} + {% blocktrans with request_user.end_adhesion|date:"d b Y" as date %}Until {{ date }}{% endblocktrans %} + {% else %} + {% trans "Not a member" %} + {% endif %} +
+ + {% else %} +

{% trans "You are not logged in." %}

{% endif %}
+ {% if request_user.is_authenticated %} +
+
+

{% blocktrans count interfaces|length as nb %}{{ nb }} active machine{% plural %}{{ nb }} active machines{% endblocktrans %}

+
+ +
+ {% endif %}
-