Use Bulma features
This commit is contained in:
parent
3d8a225ed1
commit
530d7f7365
5 changed files with 304 additions and 284 deletions
File diff suppressed because it is too large
Load diff
File diff suppressed because one or more lines are too long
|
@ -1,26 +1,30 @@
|
||||||
// Compilation command :
|
// Compilation command : sass --watch sass/main.scss:../elections/css/main.css
|
||||||
|
|
||||||
$text: black;
|
$text: black;
|
||||||
|
|
||||||
@import "bulma/bulma.sass";
|
$box-radius: 3px;
|
||||||
|
$primary: hsl(219, 33%, 17%); // Dark blue
|
||||||
|
$body-background-color: hsl(0, 0%, 86%); // Light grey
|
||||||
|
|
||||||
|
@import "../bulma/bulma.sass";
|
||||||
|
|
||||||
$primary_color: #1d2739;
|
$primary_color: #1d2739;
|
||||||
$background_color: lightgrey;
|
$background_color: lightgrey;
|
||||||
|
|
||||||
html, body {
|
// html, body {
|
||||||
background: $background_color;
|
// background: $background_color;
|
||||||
font-size: 18px;
|
// font-size: 18px;
|
||||||
}
|
// }
|
||||||
|
|
||||||
#top-navbar {
|
// #top-navbar {
|
||||||
#logo {
|
// #logo {
|
||||||
font-family: sans-serif;
|
// font-family: sans-serif;
|
||||||
font-weight: bold;
|
// font-weight: bold;
|
||||||
font-size: 40px;
|
// font-size: 40px;
|
||||||
}
|
// }
|
||||||
|
|
||||||
background-color: $primary_color;
|
// background-color: $primary_color;
|
||||||
color: findColorInvert($primary_color);
|
// color: findColorInvert($primary_color);
|
||||||
padding: 1em 2em;
|
// padding: 1em 2em;
|
||||||
margin-bottom: 0;
|
// margin-bottom: 0;
|
||||||
}
|
// }
|
||||||
|
|
|
@ -3,7 +3,8 @@
|
||||||
|
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
|
||||||
|
<head>
|
||||||
<title>{{ site.name }}</title>
|
<title>{{ site.name }}</title>
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
@ -18,11 +19,14 @@
|
||||||
{# <script src="{% static 'elections/js/main.js' %}"></script> #}
|
{# <script src="{% static 'elections/js/main.js' %}"></script> #}
|
||||||
|
|
||||||
{% block extra_head %}{% endblock extra_head %}
|
{% block extra_head %}{% endblock extra_head %}
|
||||||
</head>
|
</head>
|
||||||
<body>
|
|
||||||
<nav class="level"id="top-navbar">
|
<body>
|
||||||
<div class="level-left" id="logo">Kadenios</div>
|
<nav class="level has-background-primary">
|
||||||
<div class="level-right" id="logout-button">
|
<div class="level-left pl-4">
|
||||||
|
<b class="title has-text-primary-light">Kadenios</b>
|
||||||
|
</div>
|
||||||
|
<div class="level-right pr-4">
|
||||||
<figure class="image is-64x64">
|
<figure class="image is-64x64">
|
||||||
<a href="">
|
<a href="">
|
||||||
<img src="{% static "elections/images/logout.svg" %}" alt="logout">
|
<img src="{% static "elections/images/logout.svg" %}" alt="logout">
|
||||||
|
@ -31,8 +35,8 @@
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
{% block layout %}
|
{% block layout %}
|
||||||
<div class="columns">
|
<div class="columns is-centered">
|
||||||
<div class="column is-two-thirds is-offset-2">
|
<div class="column is-two-thirds">
|
||||||
<section class="section">
|
<section class="section">
|
||||||
|
|
||||||
{% if messages %}
|
{% if messages %}
|
||||||
|
@ -54,5 +58,6 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{% endblock layout %}
|
{% endblock layout %}
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|
25
elections/templates/elections/election.html
Normal file
25
elections/templates/elections/election.html
Normal file
|
@ -0,0 +1,25 @@
|
||||||
|
{% extends "elections/base.html" %}
|
||||||
|
{% load i18n %}
|
||||||
|
|
||||||
|
|
||||||
|
{% block content %}
|
||||||
|
|
||||||
|
<h1 class="title">{{ election.name }}</h1>
|
||||||
|
|
||||||
|
<div class="message is-info">
|
||||||
|
<p class="message-body">{{ election.description }}</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="container">
|
||||||
|
{% for q in questions %}
|
||||||
|
<div class="box">
|
||||||
|
<h3 class="subtitle">{{ q.text }}</h3>
|
||||||
|
{% for o in q.options.all %}
|
||||||
|
{{ o.text }}<br>
|
||||||
|
{% endfor %}
|
||||||
|
<a class="button is-outlined is-info is-light">{% trans "Voter" %}</a>
|
||||||
|
</div>
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{% endblock %}
|
Loading…
Add table
Reference in a new issue