Skip to content
This repository was archived by the owner on Sep 19, 2018. It is now read-only.

Commit d8d28eb

Browse files
author
Mateja Verlic
committed
Merge pull request #365 from ViaCoco/master
working on scoreboard
2 parents 2809cde + 87fd145 commit d8d28eb

File tree

5 files changed

+100
-33
lines changed

5 files changed

+100
-33
lines changed

‎static/scss/_base.scss‎

Lines changed: 0 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -538,26 +538,3 @@ LIST EVENTS STYLES
538538
font-family: inherit;
539539
}
540540
}
541-
542-
/*********************
543-
SCOREBOARD STYLES
544-
*********************/
545-
546-
.country {
547-
border-bottom:1px solid #ccc;
548-
border:1px solid #ccc;
549-
.country-name {
550-
font-weight: 800;
551-
font-size: 1.2em;
552-
}
553-
.event-number {
554-
font-weight: 800;
555-
font-size: 1.5em;
556-
}
557-
background-color: #F5F5F5;
558-
}
559-
560-
.highlighted {
561-
background-color: #F0F8FF;
562-
}
563-

‎static/scss/_scoreboard.scss‎

Lines changed: 83 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,83 @@
1+
/*********************
2+
SCOREBOARD STYLES
3+
*********************/
4+
5+
.sb-wrapper {
6+
display: block;
7+
position: relative;
8+
z-index: 999;
9+
padding-left: 0;
10+
overflow: visible;
11+
12+
.one-row{
13+
display: table-row;
14+
counter-reset:li;
15+
margin-left:0;
16+
padding-left:0;
17+
18+
.sb-box{
19+
display: table-cell;
20+
border: solid white 4px;
21+
background: $silver;
22+
position: relative;
23+
list-style:none;
24+
height: 160px;
25+
26+
&:before {
27+
content:counter(li);
28+
counter-increment:li;
29+
position:absolute;
30+
top:0;
31+
left:0;
32+
-moz-box-sizing:border-box;
33+
-webkit-box-sizing:border-box;
34+
box-sizing:border-box;
35+
width:40px;
36+
padding:10px;
37+
border-top: 2px solid $slate;
38+
color:$white;
39+
font-weight: bold;
40+
background:$slate;
41+
text-align: center;
42+
}
43+
44+
&:nth-child(-n +10)::before {
45+
border-top: 2px solid $secondary-color;
46+
background:$secondary-color;
47+
}
48+
49+
img {
50+
position: absolute;
51+
right: -2px;
52+
top: -12px;
53+
width: 65px;
54+
}
55+
56+
.box-inner{
57+
top: 25%;
58+
padding: 0 15px;
59+
position: relative;
60+
}
61+
62+
.country-name {
63+
display: block;
64+
position: relative;
65+
font-size: 20px;
66+
padding-top: 10px;
67+
}
68+
69+
a {
70+
display: inline-block;
71+
72+
.event-number {
73+
position: relative;
74+
font-size: 18px;
75+
left: 0;
76+
display: block;
77+
text-decoration: none;
78+
padding-bottom: 10px;
79+
}
80+
}
81+
}
82+
}
83+
}

‎static/scss/style.scss‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,7 @@ of the styles inside media queries.
3838
// styles in base.scss
3939
@import "base";
4040
@import "misc";
41+
@import "scoreboard";
4142

4243
//style for pagination button
4344
@import "pagination";

‎static/scss/variables.scss‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ $white: #ffffff;
1111
$whitesmoke: #f5f5f5;
1212
$brand-primary: #428BCA;
1313
$golden: #FCD04B;
14+
$bronze: #cd7f32;
1415

1516
$dark-blue: #478ac8;//#198182;
1617
$light-blue: #386ea0;//lighten(#386ea0, 20%);//#26BCBB;

‎web/templates/pages/scoreboard.html‎

Lines changed: 15 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -3,17 +3,22 @@
33
{% block title %}- Events Scoreboard{% endblock title %}
44

55
{% block content %}
6-
<div class="container">
6+
<div class="container">
77
<h1>#codeEU Events Scoreboard</h1>
88
<p>Which countries in Europe are buzzing with coding activity? The scoreboard is sorted by the number of listed coding events per population, so don't be surprised to see some of the smaller countries higher up on the list!</p>
9-
{% for country in counts %}
10-
<div class="col-md-6 country{% if forloop.counter < 11 %} highlighted{% endif %}">
11-
<img src="/static/flags/{{ country.country_code|lower }}.png" alt="{{ country.country_name }}" />
12-
<span class="icon-flag">
13-
<span class="country-name">{{ country.country_name }}</span> is participating with
14-
<span class="event-number"><a href="{% url 'web.search_events' %}?country_code={{ country.country_code }}&amp;past=yes">{{ country.events }}</span> event{% if country.events != 1 %}s{% endif %}</a>
15-
</span>
16-
</div>
17-
{% endfor %}
9+
<div class="sb-wrapper">
10+
<ol class="one-row">
11+
{% for country in counts %}
12+
<li class="col-md-3 col-sm-4 col-xs-6 sb-box">
13+
<img src="/static/flags/{{ country.country_code|lower }}.png" alt="{{ country.country_name }}" />
14+
<div class="box-inner">
15+
<span class="country-name">{{ country.country_name }}</span><p> is participating with </p>
16+
<a href="{% url 'web.search_events' %}?country_code={{ country.country_code }}&amp;past=yes">
17+
<span class="event-number">{{ country.events }} event{% if country.events != 1 %}s{% endif %}</span></a>
18+
</div>
19+
</li>
20+
{% endfor %}
21+
</ol>
1822
</div>
23+
</div>
1924
{% endblock content %}

0 commit comments

Comments
 (0)