From 0069a58683b6404aff4ad9249cfb70397b073e55 Mon Sep 17 00:00:00 2001
From: Timotej Lazar <timotej.lazar@fri.uni-lj.si>
Date: Thu, 11 Oct 2018 23:23:20 +0200
Subject: web: improve style
---
kpov_judge/web/kpov_judge/static/style.css | 46 ++++++++++++++++-----
.../web/kpov_judge/templates/class_tasks.html | 16 ++++++++
kpov_judge/web/kpov_judge/templates/index.html | 17 ++++----
.../web/kpov_judge/templates/task_greeting.html | 47 +++++++++-------------
4 files changed, 77 insertions(+), 49 deletions(-)
create mode 100644 kpov_judge/web/kpov_judge/templates/class_tasks.html
(limited to 'kpov_judge')
diff --git a/kpov_judge/web/kpov_judge/static/style.css b/kpov_judge/web/kpov_judge/static/style.css
index 9be13f8..ade0909 100644
--- a/kpov_judge/web/kpov_judge/static/style.css
+++ b/kpov_judge/web/kpov_judge/static/style.css
@@ -1,15 +1,37 @@
-.hover {
- position:relative;
+a.back {
+ text-decoration: none;
+}
+
+body {
+ margin: 0 auto;
+ max-width: 60em;
+ padding: 1em 2em;
+}
+
+h1 {
+ margin-bottom: 0.5em;
+}
+
+p {
+ hyphens: auto;
+ margin-top: 0.5em;
+ margin-bottom: 0;
+ padding-top: 0;
+ text-align: justify;
+}
+
+pre {
+ margin-left: 1em;
}
.tooltip { /* hide and position tooltip */
- top:1em;
- left:1em;
- background-color:black;
- color:white;
- border-radius:5px;
- opacity:0;
- position:absolute;
+ top: 1em;
+ left: 1em;
+ background-color: black;
+ color: white;
+ border-radius: 5px;
+ opacity: 0;
+ position: absolute;
-webkit-transition: opacity 0.5s;
-moz-transition: opacity 0.5s;
-ms-transition: opacity 0.5s;
@@ -17,6 +39,10 @@
transition: opacity 0.5s;
}
+.hover {
+ position: relative;
+}
+
.hover:hover .tooltip { /* display tooltip on hover */
- opacity:1;
+ opacity: 1;
}
diff --git a/kpov_judge/web/kpov_judge/templates/class_tasks.html b/kpov_judge/web/kpov_judge/templates/class_tasks.html
new file mode 100644
index 0000000..5a29ae7
--- /dev/null
+++ b/kpov_judge/web/kpov_judge/templates/class_tasks.html
@@ -0,0 +1,16 @@
+<html>
+<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
+
+<h1><a href="{{ url_for('index') }}" class="back">↩</a> {{clas.name}}</h1>
+
+<p>
+Zdravo, {{student_id}}.
+
+<p>
+Trenutno so na voljo naloge:
+
+<ul>
+{% for t in tasks %}
+<li><a href="{{url_for('task_lang_redirect', class_id=clas.class_id, task_id=t)}}">{{t}}</a>
+{% endfor %}
+</ul>
diff --git a/kpov_judge/web/kpov_judge/templates/index.html b/kpov_judge/web/kpov_judge/templates/index.html
index b5149ab..49895b0 100644
--- a/kpov_judge/web/kpov_judge/templates/index.html
+++ b/kpov_judge/web/kpov_judge/templates/index.html
@@ -1,20 +1,17 @@
<html>
-<body>
+<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
+
+<h1>KPOV Judge</h1>
+
<p>
-Zdravo, {{student_id}}
-</p>
-<p>
-{{env}}
-</p>
+Zdravo, {{student_id}}.
+
<p>
Trenutno so na voljo predmeti:
+
<ul>
{% for c in classes %}
<li><a href="{{url_for('class_tasks', class_id=c.class_id)}}">{{c.name}}</a></li>
{% endfor %}
</ul>
</li>
-</p>
-<p>Navodila lahko najdete <a href="http://lusy.fri.uni-lj.si/en/kpov-vaje">na strani LUSY</a>.
-</body>
-</html>
diff --git a/kpov_judge/web/kpov_judge/templates/task_greeting.html b/kpov_judge/web/kpov_judge/templates/task_greeting.html
index 217c0ca..20da231 100644
--- a/kpov_judge/web/kpov_judge/templates/task_greeting.html
+++ b/kpov_judge/web/kpov_judge/templates/task_greeting.html
@@ -1,14 +1,7 @@
<html lang="{{lang}}">
+<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
<style>
-body {
- margin: 0 auto;
- max-width: 60em;
- padding: 1em 2em;
-}
-body > h1 {
- margin-bottom: 0.5em;
-}
img.setup {
border: 1px solid black;
border-radius: 0.2em;
@@ -16,15 +9,6 @@ img.setup {
margin-left: 1.5em;
max-width: 20em;
}
-p {
- hyphens: auto;
- margin-top: 0;
- padding-top: 0;
- text-align: justify;
-}
-pre {
- margin-left: 1em;
-}
section.data {
columns: 2;
}
@@ -34,18 +18,20 @@ section.data > section {
section.disks > section > h1 {
margin-bottom: 0;
}
-section.disks > section > ul {
+section ul {
list-style-position: inside;
- margin: 0.5em;
+ margin: 0;
+ margin-left: 1em;
padding-left: 0;
}
+section > ul {
+ margin-top: 0.5em;
+}
</style>
-<h1>{{task_id}}</h1>
+<h1><a href="{{ url_for('class_tasks', class_id=class_id) }}" class="back">↩</a> {{task_id}}</h1>
<section>
-<h1>Navodila</h1>
-
<a href="setup.png"><img src="setup.png" class="setup"></a>
{{instructions}}
@@ -56,25 +42,30 @@ section.disks > section > ul {
<section class="data">
<section class="disks">
<h1>Računalniki</h1>
+<p>
+Slike diskov za to nalogo:
{% for c in computers %}
- <section>
- <h1>{{c['name']}}</h1>
+<ul>
+ <li>{{c['name']}}
{% if 'disk_urls' in c %}
<ul>
{% for u in c['disk_urls'] %}
- <li><a href={{disk_base_url+u['file']}}>{{u['name']}}</a></li>
+ <li><a href={{disk_base_url+u['file']}}>{{u['name']}}</a>
{% endfor %}
</ul>
{% else %}
Slike navideznih diskov so v izdelavi in bodo kmalu na voljo.
{% endif %}
- </section>
+ </ul>
{% endfor %}
<section>
{% if backing_images %}
<h1>Osnovne slike</h1>
+<p>
+Te slike so enake za vse naloge in jih prenesete samo enkrat.
+
<ul>
{% for b in backing_images %}
<li><a href={{disk_base_url+b}}>{{b}}</a></li>
@@ -88,6 +79,7 @@ section.disks > section > ul {
<h1>Rezultati</h1>
<p>
Ogledate si lahko:
+
<ul>
<li><a href='results.html'>rezultate</a> (<a href='../results.json'>json</a>)</li>
<li><a href='params.html'>parametre</a> (<a href='../params.json'>json</a>, <a href='../params_meta.json'>opisi parametrov</a>)</li>
@@ -103,6 +95,3 @@ Openstack projekt za to vajo je že ustvarjen ali v izdelavi (funkcionalnost še
<a href='?narediStack=true'>Ustvari</a> Openstack projekt za to vajo (funkcionalnost še ne deluje).
{% endif %}
#}
-
-</body>
-</html>
--
cgit v1.2.1