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;
|
||||
|
||||
@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;
|
||||
$background_color: lightgrey;
|
||||
|
||||
html, body {
|
||||
background: $background_color;
|
||||
font-size: 18px;
|
||||
}
|
||||
// html, body {
|
||||
// background: $background_color;
|
||||
// font-size: 18px;
|
||||
// }
|
||||
|
||||
#top-navbar {
|
||||
#logo {
|
||||
font-family: sans-serif;
|
||||
font-weight: bold;
|
||||
font-size: 40px;
|
||||
}
|
||||
// #top-navbar {
|
||||
// #logo {
|
||||
// font-family: sans-serif;
|
||||
// font-weight: bold;
|
||||
// font-size: 40px;
|
||||
// }
|
||||
|
||||
background-color: $primary_color;
|
||||
color: findColorInvert($primary_color);
|
||||
padding: 1em 2em;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
// background-color: $primary_color;
|
||||
// color: findColorInvert($primary_color);
|
||||
// padding: 1em 2em;
|
||||
// margin-bottom: 0;
|
||||
// }
|
||||
|
|
|
@ -3,6 +3,7 @@
|
|||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>{{ site.name }}</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
|
@ -19,10 +20,13 @@
|
|||
|
||||
{% block extra_head %}{% endblock extra_head %}
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<nav class="level"id="top-navbar">
|
||||
<div class="level-left" id="logo">Kadenios</div>
|
||||
<div class="level-right" id="logout-button">
|
||||
<nav class="level has-background-primary">
|
||||
<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">
|
||||
<a href="">
|
||||
<img src="{% static "elections/images/logout.svg" %}" alt="logout">
|
||||
|
@ -31,8 +35,8 @@
|
|||
</div>
|
||||
</nav>
|
||||
{% block layout %}
|
||||
<div class="columns">
|
||||
<div class="column is-two-thirds is-offset-2">
|
||||
<div class="columns is-centered">
|
||||
<div class="column is-two-thirds">
|
||||
<section class="section">
|
||||
|
||||
{% if messages %}
|
||||
|
@ -55,4 +59,5 @@
|
|||
</div>
|
||||
{% endblock layout %}
|
||||
</body>
|
||||
|
||||
</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…
Reference in a new issue