[damned-lies] Make theme templates responsive using Bootstrap
- From: Claude Paroz <claudep src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [damned-lies] Make theme templates responsive using Bootstrap
- Date: Wed, 18 May 2016 17:53:24 +0000 (UTC)
commit e81fbe4d79c4b4b931cbaddef52c8aa3dc2878d4
Author: Tom Tryfonidis <tomtryf gmail com>
Date: Sat May 14 14:48:17 2016 +0300
Make theme templates responsive using Bootstrap
Fixes bug #766216
common/static/css/responsive.css | 80 ++++++++++
common/static/css/template.css | 170 +++------------------
common/static/css/text.css | 24 ++--
common/static/img/clock.png | Bin 0 -> 792 bytes
common/static/img/logo.png | Bin 0 -> 8887 bytes
templates/about.html | 28 ++--
templates/base.html | 82 +++++++---
templates/branch_detail.html | 6 +-
templates/index.html | 23 ++--
templates/languages/language_list.html | 4 +-
templates/languages/language_release.html | 2 +-
templates/languages/language_release_stats.html | 4 +-
templates/languages/language_release_summary.html | 4 +-
templates/module_detail.html | 30 ++--
templates/module_images.html | 5 +-
templates/module_list.html | 4 +-
templates/people/person_base.html | 10 +-
templates/people/person_detail.html | 63 ++++----
templates/people/person_list.html | 2 +-
templates/people/person_overview.html | 2 +-
templates/people/person_team_membership.html | 34 +++--
templates/release_compare.html | 7 +-
templates/release_detail.html | 5 +-
templates/stats_show.html | 5 +-
templates/teams/team_base.html | 6 +-
templates/teams/team_detail.html | 2 +-
templates/teams/team_edit.html | 2 +-
templates/teams/team_list.html | 4 +-
templates/vertimus/vertimus_detail.html | 15 ++-
templates/vertimus/vertimus_diff.html | 2 +-
30 files changed, 318 insertions(+), 307 deletions(-)
---
diff --git a/common/static/css/responsive.css b/common/static/css/responsive.css
new file mode 100644
index 0000000..2db81aa
--- /dev/null
+++ b/common/static/css/responsive.css
@@ -0,0 +1,80 @@
+/* Custom media queries and Bootstrap overwrite rules for Damned Lies */
+
+.col-centered{
+ float: none;
+ margin: 0 auto;
+}
+.no-padding {
+ padding: 0 !important;
+ margin: 0 !important;
+}
+.mobile-menu {
+ display: none;
+ visibility: hidden;
+}
+.normal-menu {
+ display: block;
+}
+.navbar-toggle, .navbar-toggle:hover, .navbar-toggle:focus, .navbar-toggle:active, .navbar-toggle.active,
.navbar-toggle.disabled, .navbar-toggle[disabled]{
+ margin-top: 40px;
+ background-image: none;
+ background-color: #2e3436;
+}
+.table-responsive {
+ border: none;
+}
+.navbar-default .navbar-nav > li > a {
+ text-decoration: none;
+}
+
+/*----------------Smartphones-------------------*/
+ media (max-width: 767px) {
+ header {
+ padding-bottom: 40px;
+ }
+ .navbar-default,
+ .navbar-default .navbar-collapse {
+ background-color: transparent;
+ border-color: transparent;
+ }
+ .mobile-menu {
+ cursor: pointer;
+ display: inline-block;
+ float: right;
+ visibility: visible;
+ width:100%;
+ }
+ .normal-menu {
+ display: none;
+ }
+ .top_bar {
+ padding-top: 50px;
+ }
+ .top_bar ul li {
+ display: block !important;
+ }
+ h1, #content h1 {
+ font-size: 23px;
+ }
+ h2 {
+ font-size: 20px;
+ }
+}
+
+/*-----------------Tablets------------------------*/
+ media (min-width:767px) and (max-width: 990px){
+ header {
+ padding-bottom: 30px;
+ }
+ #globalnav {
+ margin: 0 auto;
+ }
+ .top_bar {
+ margin:0 auto;
+ float: none;
+ }
+ .normal-menu #gnome_header {
+ height: auto;
+ padding: 0 33%;
+ }
+}
diff --git a/common/static/css/template.css b/common/static/css/template.css
index f486796..d6293ba 100644
--- a/common/static/css/template.css
+++ b/common/static/css/template.css
@@ -23,24 +23,17 @@ a:hover {
.hidden {
display: none;
}
-.maxwidth {
- width: 960px;
- margin: 0 auto;
- text-align: left;
-}
.clear {
clear: both;
}
-
/* Global Domain Bar */
/* ========================================================================== */
-
-
#global_domain_bar {
background: #fff;
height: 10px;
+ position: relative;
}
#global_domain_bar .maxwidth {
position: relative;
@@ -200,8 +193,6 @@ a:hover {
/* GNOME Header */
/* ========================================================================== */
-
-
#gnome_header {
margin: 0;
padding: 6px auto;
@@ -248,7 +239,6 @@ a:hover {
outline: none;
}
-
/* Global Navigation */
/* ========================================================================== */
@@ -309,8 +299,6 @@ a:hover {
border-radius: 5px;
}
-
-
/* Page Title */
/* ========================================================================== */
@@ -331,8 +319,6 @@ a:hover {
text-decoration: underline;
}
-
-
/* GNOME Container */
/* ========================================================================== */
@@ -341,63 +327,6 @@ a:hover {
min-height: 400px;
}
-
-/* Grid Columns */
-/* ========================================================================== */
-
-.columns {
- overflow: hidden;
-}
-.columns .bloc {
- width: 135px;
- margin-left: 30px;
- float: left;
-}
-.columns .bloc.one {
- width: 130px;
-}
-.columns .bloc.sidebar,
-.columns .bloc.two {
- width: 300px;
-}
-.columns .bloc.half,
-.columns .bloc.three {
- width: 465px;
-}
-.columns .bloc.content,
-.columns .bloc.four {
- width: 630px;
-}
-.columns .bloc.five {
- width: 795px;
-}
-.columns .bloc.full,
-.columns .bloc.six {
- width: 960px;
-}
-.columns .bloc.first {
- margin-left: 0;
- clear: left;
-}
-.columns .bloc.offset_one {
- margin-left: 165px !important;
-}
-.columns .bloc.offset_sidebar,
-.columns .bloc.offset_two {
- margin-left: 330px !important;
-}
-.columns .bloc.offset_half,
-.columns .bloc.offset_three {
- margin-left: 495px !important;
-}
-.columns .bloc.offset_four {
- margin-left: 660px !important;
-}
-.columns .bloc.offset_five {
- margin-left: 825px !important;
-}
-
-
/* Separators */
/* ========================================================================== */
@@ -427,21 +356,6 @@ hr.bottom_shadow {
/* Specific stylesheet for Damned-lies */
/* ========================================================================== */
-/* Columns */
-
-.bloc50 {
- display: block;
- float: left;
- width: 50%;
- padding: 0 15px;
- -moz-box-sizing: border-box;
- -webkit-box-sizing: border-box;
- box-sizing: border-box;
-}
-.bloc50.reset {
- clear: left;
-}
-
/* Statistics table */
table.stats {
@@ -522,12 +436,13 @@ pre.stats .num3 {
}
/* Used in vertimus_detail */
+
div#vertimus_stats {
- line-height: 1.3em;
+ line-height: 1.3em;
}
div#vertimus_stats pre.stats {
- white-space: normal;
- font-family: sans-serif;
+ white-space: normal;
+ font-family: sans-serif;
font-size: 13px;
}
@@ -588,36 +503,11 @@ div.graphinline {
/* Multi column lists */
-.multi_column_list {
- -moz-column-count: 3;
- -webkit-column-count: 3;
- column-count: 3;
-}
-.multi_column_list li {
- border: 1px solid #ccc;
- background: #fff;
- padding: 4px 8px;
- list-style: none;
- margin: 8px 0;
-
- -moz-border-radius: 3px;
- -webkit-border-radius: 3px;
- border-radius: 3px;
-}
-
-.col2_column {
- float: left;
- width: 50%
-}
-.col3_column {
- float: left;
- width: 33.3%
-}
-.col3_container ul {
+.column_container ul {
margin-top: 0;
list-style: none;
}
-.col3_column li, .col2_column li {
+.column_box li {
border: 1px solid #ccc;
background: #fff;
padding: 4px 8px;
@@ -631,10 +521,10 @@ div.graphinline {
-webkit-border-radius: 3px;
border-radius: 3px;
}
-.col3_column li a, .col2_column li a {
+.column_box li a {
text-decoration: none;
}
-.col3_column li a:hover, .col2_column li a:hover {
+.column_box li a:hover {
text-decoration: underline;
}
@@ -642,23 +532,24 @@ div.graphinline {
/* Used in people/person_list */
.person_list {
- padding-left: 65px;
- margin-bottom: 12px;
- clear: left;
+ padding-left: 65px;
+ margin-bottom: 12px;
+ clear: left;
}
.person_list .name {
- font-size: 110%;
+ font-size: 110%;
}
.person_list img {
- height: 48px;
- float: left;
- margin-left: -65px;
+ height: 48px;
+ float: left;
+ margin-left: -65px;
}
.person_detail {
- display: table-row;
+ display: block;
+ padding-bottom: 20px;
}
.person_detail .image,
.person_detail .txt {
@@ -807,7 +698,6 @@ div.face_image img {
max-height: 50px;
max-width: 50px;
}
-
.right_actions {
float: right;
font-weight: bold;
@@ -874,6 +764,13 @@ div.docimages {
}
/* Miscellaneous */
+img.action_icons {
+ width: 20px;
+ height: 20px;
+ float: right;
+ margin: 0 2px;
+}
+
.helptext{
font-size: 12px;
color: #000;
@@ -939,16 +836,6 @@ ul.foot li {
list-style-image: url(../img/foot-16.png);
}
-.about_qlinks{
- text-align: left;
- margin-left: 20px;
- line-height: 0.9em;
-}
-
-.about_qlinks td a{
- margin-left: 15px;
-}
-
/* Footer */
/* ========================================================================== */
@@ -1043,10 +930,3 @@ ul.foot li {
#footer #footnotes a {
color: inherit;
}
-
-img.action_icons {
- width: 20px;
- height: 20px;
- float: right;
- margin: 0 2px;
-}
diff --git a/common/static/css/text.css b/common/static/css/text.css
index 6d81028..6ac5a4e 100644
--- a/common/static/css/text.css
+++ b/common/static/css/text.css
@@ -21,18 +21,11 @@ h2 {
font-size: 25px;
font-weight: bold;
}
-h3, dt {
+h3 {
font-size: 18px;
margin: 0.4em 0 0.5em;
color: #2E3436;
}
-dt {
- color: #E36615;
- font-weight: normal;
-}
-dt a:hover {
- color: #fa7721;
-}
h4 {
font-size: 16px;
color: #ce5c00;
@@ -52,7 +45,7 @@ ul {
li {
margin-left:30px;
}
-dl,dt,h1,h2,h3,h4,h5,h6,pre,table,address,fieldset {
+h1,h2,h3,h4,h5,h6,pre,table,address,fieldset {
margin: 0.8em 0 0.4em;
}
p, dd, .action_box, ul, ol {
@@ -116,8 +109,17 @@ a {
/* About page */
/* ========================================================================== */
-table.about_qlinks th {
- padding: 0.8em 0 0.4em;
+
+.about_qlinks dt {
+ font-size: 18px;
color: #CE5C00;
+ font-weight: normal;
+ text-align: left;
+}
+#about_page .about_qlinks dt {
font-size: 16px;
+ font-weight: bold;
+}
+.about_qlinks dt a:hover {
+ color: #fa7721;
}
diff --git a/common/static/img/clock.png b/common/static/img/clock.png
new file mode 100644
index 0000000..bf70fc3
Binary files /dev/null and b/common/static/img/clock.png differ
diff --git a/common/static/img/logo.png b/common/static/img/logo.png
new file mode 100644
index 0000000..847eec7
Binary files /dev/null and b/common/static/img/logo.png differ
diff --git a/templates/about.html b/templates/about.html
index 8bb3b0d..2e4e779 100644
--- a/templates/about.html
+++ b/templates/about.html
@@ -4,8 +4,7 @@
{% block title %} {% trans "About" %} {% endblock %}
{% block content %}
-<div class="maxwidth">
-
+<div id="about_page" class="mainpage">
<h1>{% trans "About Damned Lies" %}</h1>
<p>{% trans "Damned Lies is the Web application used to manage the localisation (l10n) of the GNOME
project." %}
@@ -25,20 +24,15 @@
{% endif %}
<h2>{% trans "Quick links" %}</h2>
-<table class="about_qlinks">
- <tr><th>{% trans "Project wiki" %}</th>
- <td><a href="https://wiki.gnome.org/DamnedLies";>https://wiki.gnome.org/DamnedLies</a></td>
- </tr>
- <tr><th>{% trans "Bug tracking page" %}</th>
- <td><a
href="https://bugzilla.gnome.org/browse.cgi?product=damned-lies";>https://bugzilla.gnome.org/browse.cgi?product=damned-lies</a></td>
- </tr>
- <tr><th>{% trans "Source code" %}</th>
- <td><a
href="https://git.gnome.org/browse/damned-lies/";>https://git.gnome.org/browse/damned-lies</a></td>
- </tr>
- <tr><th>{% trans "Workflow" %}</th>
- <td><a
href="https://l10n.gnome.org/help/vertimus_workflow/";>https://l10n.gnome.org/help/vertimus_workflow</a></td>
- </tr>
-</table>
-
+<dl class="dl-horizontal about_qlinks">
+ <dt>{% trans "Project wiki" %}</dt>
+ <dd><a href="https://wiki.gnome.org/DamnedLies";>https://wiki.gnome.org/DamnedLies</a></dd>
+ <dt>{% trans "Bug tracking page" %}</dt>
+ <dd><a
href="https://bugzilla.gnome.org/browse.cgi?product=damned-lies";>https://bugzilla.gnome.org/browse.cgi?product=damned-lies</a></dd>
+ <dt>{% trans "Source code" %}</dt>
+ <dd><a href="https://git.gnome.org/browse/damned-lies/";>https://git.gnome.org/browse/damned-lies</a></dd>
+ <dt>{% trans "Workflow" %}</dt>
+ <dd><a
href="https://l10n.gnome.org/help/vertimus_workflow/";>https://l10n.gnome.org/help/vertimus_workflow</a></dd>
+</dl>
</div>
{% endblock %}
diff --git a/templates/base.html b/templates/base.html
index 11a1e3f..a6c2dda 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -4,10 +4,12 @@
<html lang="{{ LANGUAGE_CODE }}">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1">
<title>{% block title %}page title{% endblock %}</title>
<link rel="icon" type="image/png" href="{{ STATIC_URL }}img/foot-16.png">
<link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/template.css">
+ <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/responsive.css">
{% if LANGUAGE_BIDI %}
<link rel="stylesheet" href="{{ STATIC_URL }}css/rtl.css">
{% endif %}
@@ -30,6 +32,7 @@
</head>
<body>
+<div class="container">
<!-- global gnome.org domain bar -->
<div id="global_domain_bar">
<div class="maxwidth">
@@ -43,29 +46,59 @@
</div>
{% include "login/login_usermenu.html" %}
</div>
+ {% include "login/login_usermenu.html" %}
</div>
- <div id="gnome_header">
-
- <div class="maxwidth">
-
- <h1><a href="{% url 'home' %}" title="{% trans "Back to Damned Lies home page" %}"><img src="{{
STATIC_URL }}img/foot.png" alt="GNOME" /> {% trans "Damned Lies" %}</a></h1>
-
- <ul id="globalnav">
- <li{% if pageSection == "home" %} class="active"{% endif %}><a href="{% url 'home' %}"
title="{% trans "Back to Damned Lies home page" %}"><span>{% trans "Home" %}</span></a></li>
- <li{% if pageSection == "teams" %} class="active"{% endif %}><a href="{% url 'teams'
%}"><span>{% trans "Teams" %}</span></a></li>
- <li{% if pageSection == "languages" %} class="active"{% endif %}><a href="{% url 'languages'
%}"><span>{% trans "Languages" %}</span></a></li>
- <li{% if pageSection == "releases" %} class="active"{% endif %}><a href="{% url 'releases'
%}"><span>{% trans "Release sets" %}</span></a></li>
- <li{% if pageSection == "module" %} class="active"{% endif %}><a href="{% url 'modules'
%}"><span>{% trans "Modules" %}</span></a></li>
- </ul>
-
- <div class="clear"></div>
- </div>
-
- </div>
-
- <div class="body">
- <div id="content" class="maxwidth">
+ <header class="col-md-12">
+ <div class="mobile-menu">
+ <div class="navbar navbar-default">
+ <div class="container-fluid">
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle collapsed"
data-toggle="collapse" data-target=".navbar-collapse" >
+ <span class="sr-only">Toggle navigation</span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a class="navbar-brand" title="{% trans "Back to Damned Lies
home page" %}" href="/"><img src="{{ STATIC_URL }}img/logo.png" alt="GNOME" /></a>
+ </div>
+
+ <div class="collapse navbar-collapse">
+ <div class="top_bar">
+ <ul class="nav navbar-nav text-center">
+ <li{% if pageSection == "home" %} class="active"{%
endif %}><a href="{% url 'home' %}" title="{% trans "Back to Damned Lies home page" %}"><span>{% trans "Home"
%}</span></a></li>
+ <li{% if pageSection == "teams" %} class="active"{%
endif %}><a href="{% url 'teams' %}"><span>{% trans "Teams" %}</span></a></li>
+ <li{% if pageSection == "languages" %}
class="active"{% endif %}><a href="{% url 'languages' %}"><span>{% trans "Languages" %}</span></a></li>
+ <li{% if pageSection == "releases" %}
class="active"{% endif %}><a href="{% url 'releases' %}"><span>{% trans "Release sets" %}</span></a></li>
+ <li{% if pageSection == "module" %} class="active"{%
endif %}><a href="{% url 'modules' %}"><span>{% trans "Modules" %}</span></a></li>
+ </ul>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div> <!-- mobile-menu end -->
+
+ <div class="normal-menu">
+ <div id="gnome_header" class="col-sm-4 col-md-3">
+ <h1><a title="{% trans "Back to Damned Lies home page" %}" href="/"><img
src="{{ STATIC_URL }}img/logo.png" alt="GNOME" /></a></h1>
+ </div>
+
+ <div class="top_bar col-sm-8 col-md-9">
+ <ul id="globalnav">
+ <li{% if pageSection == "home" %} class="active"{% endif
%}><a href="{% url 'home' %}" title="{% trans "Back to Damned Lies home page" %}"><span>{% trans "Home"
%}</span></a></li>
+ <li{% if pageSection == "teams" %} class="active"{% endif
%}><a href="{% url 'teams' %}"><span>{% trans "Teams" %}</span></a></li>
+ <li{% if pageSection == "languages" %} class="active"{% endif
%}><a href="{% url 'languages' %}"><span>{% trans "Languages" %}</span></a></li>
+ <li{% if pageSection == "releases" %} class="active"{% endif
%}><a href="{% url 'releases' %}"><span>{% trans "Release sets" %}</span></a></li>
+ <li{% if pageSection == "module" %} class="active"{% endif
%}><a href="{% url 'modules' %}"><span>{% trans "Modules" %}</span></a></li>
+ </ul>
+ </div>
+ </div> <!-- normal-menu end -->
+ <div class="clearfix"></div>
+ </header>
+
+ <div class="clearfix"></div>
+
+ <div id="content">
{% if messages %}
{% for message in messages %}
<p class="errornote">{{ message|safe }}</p>
@@ -75,6 +108,7 @@
{% block content-title %}{% endblock %}
{% block content %}{% endblock %}
</div>
+</div>
<div id="footer_art">
</div>
@@ -83,8 +117,7 @@
</div>
<div id="footer">
- <div class="maxwidth">
- <div class="links">
+ <div class="links container">
<div>
<ul id="menu-footer" class="menu">
<li><a href="https://www.gnome.org";>{% trans "The GNOME Project" %}</a>
@@ -123,7 +156,7 @@
</div>
</div> <!-- end of div.links -->
- <div id="footnotes">
+ <div id="footnotes" class="container">
{% trans "Copyright © 2006" %}-{% now "Y" %} <strong><a href="https://www.gnome.org/";>{% trans
"The GNOME Project" %}</a></strong>.
<br />
<a href="{% url 'about' %}">{% trans "About Damned Lies" %}</a>.
@@ -131,7 +164,6 @@
{% blocktrans with "<a href='http://www.canonical.com/'>Canonical</a>" as link %}Hosted by {{ link
}}.{% endblocktrans %}
{% blocktrans with "<a href='https://www.djangoproject.com/'>Django</a>" as link %}Powered by {{
link }}.{% endblocktrans %}
</div>
- </div>
</div>
</div> <!-- end of div.body -->
diff --git a/templates/branch_detail.html b/templates/branch_detail.html
index caf0941..a9a6a1a 100644
--- a/templates/branch_detail.html
+++ b/templates/branch_detail.html
@@ -4,8 +4,8 @@
<p>{% trans "This branch is currently string-frozen." %}</p>
{% endif %}
-<div class="columns">
- <div class="bloc half first">
+<div class="row">
+ <div class="col-md-6">
{% with branch.get_ui_stats as stats %}
{% if stats|length %}
{% if not stats|length_is:"1" %}
@@ -15,7 +15,7 @@
{% endif %}
{% endwith %}
</div>
- <div class="bloc half">
+ <div class="col-md-6">
{% with branch.get_doc_stats as stats %}
{% if stats|length %}
{% if not stats|length_is:"1" %}
diff --git a/templates/index.html b/templates/index.html
index bd4ce79..66cc979 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -5,16 +5,18 @@
{% block content %}
<div class="mainpage">
- <div class="columns">
- <div class="bloc content first offset_one">
+ <div class="row">
+ <div class="col-md-8 col-centered">
<p class="main_feature" style="text-align: center;">{% trans "Damned Lies is the Web application
used to manage the localisation (l10n) of the GNOME project." %}
-<em><a href="{% url 'about' %}">{% trans "More…" %}</a></em></p>
+ <em><a href="{% url 'about' %}">{% trans "More…" %}</a></em></p>
</div>
+ </div>
- <hr class="bottom_shadow">
+ <hr class="bottom_shadow">
- <div class="bloc half first">
+ <div class="row">
+ <div class="col-md-6">
<h2><a href="{% url 'teams' %}">{% trans "Teams" %}</a></h2>
<p>{% trans "List of all GNOME Translation Teams, with full information such as primary contact
(coordinator), web pages and mailing list information." %}
{% trans "If there is no team for your language, you can easily <a
href='https://wiki.gnome.org/TranslationProject/StartingATeam/'>start your own team</a>." %}
@@ -29,14 +31,16 @@
</p>
</div>
- <div class="bloc half">
+ <div class="col-md-6">
<h2><a href="{% url 'languages' %}">{% trans "Languages" %}</a></h2>
{% url 'teams' as teams_url %}
<p>{% blocktrans %}List of all languages there are <a href='{{ teams_url }}'>Translation
Teams</a> for.{% endblocktrans %}
{% trans "Some teams manage more than one language (usually just simple variants), and here you
can see all the languages GNOME is being translated to." %}</p>
</div>
+ </div>
- <div class="bloc half first">
+ <div class="row">
+ <div class="col-md-6">
<h2><a href="{% url 'releases' %}">{% trans "Release Sets" %}</a></h2>
<p>{% trans "List of all GNOME release sets and releases we gather stats for." %}</p>
@@ -46,15 +50,14 @@
<p>{% trans "Look here if you want to compare language support in any of these release sets."
%}</p>
</div>
- <div class="bloc half">
+ <div class="col-md-6">
<h2><a href="{% url 'modules' %}">{% trans "Modules" %}</a></h2>
<p>{% trans "List of all modules with statistics in here." %}</p>
<p>{% trans "Modules are separate libraries or applications, with one or more branches of
development included." %}
{% trans "They are usually taken from the Git repository, and we keep all relevant information
on them (Bugzilla details, web page, maintainer information,...)." %}</p>
</div>
-
- </div>
+ </div>
</div>
{% endblock %}
diff --git a/templates/languages/language_list.html b/templates/languages/language_list.html
index 6ab2f37..306a5c1 100644
--- a/templates/languages/language_list.html
+++ b/templates/languages/language_list.html
@@ -13,10 +13,10 @@
{% endblocktrans %}</p>
{% load list_to_columns %}
-<div class="col3_container">
+<div class="column_container">
{% list_to_columns languages as columns 3 %}
{% for col in columns %}
- <div class="col3_column">
+ <div class="column_box col-xs-12 col-sm-4 no-padding">
<ul>
{% for lang in col %}
<li>
diff --git a/templates/languages/language_release.html b/templates/languages/language_release.html
index a8a3972..05f33a0 100644
--- a/templates/languages/language_release.html
+++ b/templates/languages/language_release.html
@@ -17,7 +17,7 @@ $(document).ready(function()
</script>{% endblock %}
{% block content %}
-<div class="maxwidth">
+<div class="mainpage">
<h2>{% trans release.description %} - <a href="{{ language.get_team_url }}">{{ language_name }}</a></h2>
diff --git a/templates/languages/language_release_stats.html b/templates/languages/language_release_stats.html
index 678a884..30305dc 100644
--- a/templates/languages/language_release_stats.html
+++ b/templates/languages/language_release_stats.html
@@ -21,7 +21,8 @@
</tr>
</table>
-<table class="stats" name="stats-table" id="stats-table">
+<div class="table-responsive">
+<table class="stats table" name="stats-table" id="stats-table">
<thead>
<tr><th>{% trans "Module" %}</th><th>{% trans "Branch" %}</th>
{# colspan=2 for Statistics is causing offset in sort effect for following columns #}
@@ -95,6 +96,7 @@
{% endfor %}
</tbody>
</table>
+</div>
{% if modstats.all_errors %}
<h3>{% trans "Error summary" %}</h3>
diff --git a/templates/languages/language_release_summary.html
b/templates/languages/language_release_summary.html
index e4cd6ab..09a8aca 100644
--- a/templates/languages/language_release_summary.html
+++ b/templates/languages/language_release_summary.html
@@ -5,7 +5,8 @@ Following variables should be set:
stats : release stat list, obtained with get_release_stats
show_all_modules_line : boolean
{% endcomment %}
-<table class="stats">
+<div class="table-responsive">
+<table class="stats table">
<thead><tr>
<th>{% trans "Release" %}</th>
<th>{% trans "User Interface" %}</th>
@@ -55,3 +56,4 @@ Following variables should be set:
{% endif %}
</tfoot>
</table>
+</div>
diff --git a/templates/module_detail.html b/templates/module_detail.html
index b85b43b..0ee3885 100644
--- a/templates/module_detail.html
+++ b/templates/module_detail.html
@@ -55,29 +55,29 @@ $(document).ready(function() {
<p><a href="{{ module.homepage }}">{{ module.homepage }}</a></p>
{% endif %}
-<div class="columns">
- <div class="bloc half first">
- {% if module.maintainers.all %}
- <h2>{% trans "Maintainers" %}</h2>
- {% for person in module.maintainers.all %}
+<div class="col-md-7 col-sm-7">
+ {% if module.maintainers.all %}
+ <h2>{% trans "Maintainers" %}</h2>
+ {% for person in module.maintainers.all %}
{% include "people/person_overview.html" %}
- {% endfor %}
- {% endif %}
- </div>
+ {% endfor %}
+ {% endif %}
+</div>
- <div class="bloc half">
- {% if module.bugs_base %}
- <h2>{% trans "Bug reporting" %}</h2>
- <ul>
+<div class="col-md-5 col-sm-5">
+ {% if module.bugs_base %}
+ <h2>{% trans "Bug reporting" %}</h2>
+ <ul>
{% if module.get_bugs_i18n_url %}
<li><a href="{{ module.get_bugs_i18n_url }}">{% trans "Show existing i18n and l10n bugs" %}</a></li>
{% endif %}
<li><a href="{{ module.get_bugs_enter_url }}">{% trans "Report a bug" %}</a></li>
- </ul>
- {% endif %}
- </div>
+ </ul>
+ {% endif %}
</div>
+<div class="clearfix"></div>
+
{% if branches %}
<!-- Links to branches of module -->
<p>
diff --git a/templates/module_images.html b/templates/module_images.html
index 857c933..658e9ef 100644
--- a/templates/module_images.html
+++ b/templates/module_images.html
@@ -11,7 +11,8 @@
<h2>{% trans "Figures translation status" %} —
<small>{{ figstats|num_stats }}</small></h2>
-<table class="stats">
+<div class="table-responsive">
+<table class="stats table">
<thead><tr><th width="50%">{% trans "Original" %}</th><th width="50%">{% trans stat.language.name
%}</th></tr></thead>
{% for fig in stat.get_figures %}
<tr><td valign="top">
@@ -50,7 +51,7 @@
</tr>
{% endfor %}
</table>
-
+</div>
</div>
{% endblock %}
diff --git a/templates/module_list.html b/templates/module_list.html
index cd2829b..5f52557 100644
--- a/templates/module_list.html
+++ b/templates/module_list.html
@@ -11,10 +11,10 @@
<p>{% trans "Select a module below to see some of the damned lies about it:" %}</p>
{% load list_to_columns %}
-<div class="col3_container">
+<div class="column_container">
{% list_to_columns modules as columns 3 %}
{% for l in columns %}
- <div class="col3_column">
+ <div class="column_box col-xs-12 col-sm-4 no-padding">
<ul>
{% for m in l %}
<li><a href="{% url 'module' m.name %}">{{ m.get_description }}</a></li>
diff --git a/templates/people/person_base.html b/templates/people/person_base.html
index c82f82a..703d04b 100644
--- a/templates/people/person_base.html
+++ b/templates/people/person_base.html
@@ -4,9 +4,12 @@
{% block title %}{% trans "GNOME Contributor" %}{% endblock %}
{% block content %}
-<div class="mainpage">
+<div class="mainpage container">
+ {% include "people/person_overview.html" %}
+
{% if on_own_page %}
- <div class="right_actions">
+ <span class="visible-xs-inline"><h2>{% trans "User Settings" %}</h2></span>
+ <div class="right_actions col-sm-3 col-xs-12">
<ul>
<li><a href="{% url 'person_detail_change' %}">{% trans "Change your details" %}</a></li>
<li><a href="{% url 'person_password_change' %}">{% trans "Change your password" %}</a></li>
@@ -14,9 +17,6 @@
</ul>
</div>
{% endif %}
-
- {% include "people/person_overview.html" %}
-
{% block subcontent %}
{% endblock %}
</div>
diff --git a/templates/people/person_detail.html b/templates/people/person_detail.html
index eb16c06..f8f0237 100644
--- a/templates/people/person_detail.html
+++ b/templates/people/person_detail.html
@@ -22,7 +22,7 @@ $(document).ready(function()
{% block subcontent %}
{% if on_own_page %}
<br clear="right" />
- <div id="language_menu">
+ <div id="language_menu" class="col-sm-12">
<form action="/i18n/setlang/" method="post">
{% csrf_token %}
<h2>{% trans "Site Language" %}</h2>
@@ -37,41 +37,46 @@ $(document).ready(function()
{% endif %}
{% if person.maintains_modules.all %}
-<h2>{% trans "Module maintenance" %}</h2>
-<ul class="foot">
- {% for module in person.maintains_modules.all %}
- <li><a href="{{ module.get_absolute_url }}">{{ module.get_description }}</a></li>
- {% endfor %}
-</ul>
+<div class="col-sm-12">
+ <h2>{% trans "Module maintenance" %}</h2>
+ <ul class="foot">
+ {% for module in person.maintains_modules.all %}
+ <li><a href="{{ module.get_absolute_url }}">{{ module.get_description }}</a></li>
+ {% endfor %}
+ </ul>
+</div>
{% endif %}
{% include "people/person_team_membership.html" %}
{% if states %}
+<div class="col-sm-12">
+ <div id="hide-show">
+ <a href="#" id="hide-completed-modules">{% trans "Hide completed modules" %}</a>
+ <a href="#" id="show-completed-modules" style="display: none;">{% trans "Show completed modules"
%}</a>
+ </div>
-<div id="hide-show">
- <a href="#" id="hide-completed-modules">{% trans "Hide completed modules" %}</a>
- <a href="#" id="show-completed-modules" style="display: none;">{% trans "Show completed modules" %}</a>
-</div>
-
-<h2>{% trans "Current activity" %}</h2>
+ <h2>{% trans "Current activity" %}</h2>
-<table class="stats" id="working_on" name="working_on">
-<thead><tr>
- <th>{% trans "Date" %}</th><th>{% trans "Module" %}</th><th>{% trans "Statistics" %}</th><th>{% trans
"Graph" %}</th><th>{% trans "State" %}</th>
-</tr></thead>
-<tbody>
-{% for state, stats in states %}
-<tr id="{{ state.id }}{% if stats.tr_percentage == 100 %}-complete{% endif %}" {% if stats.tr_percentage ==
100 %}class="completed-module"{% endif %}>
- <td><span style="display: none;">{{ state.updated|date:"c" }}</span>{{
state.updated|naturalday:"DATE_FORMAT" }}</td>
- <td><a href="{{ state.get_absolute_url }}">{{ state.branch.module.get_description }} - {{
state.branch.name }} - {{ state.domain.get_description }} - {{ state.language.get_name }}</a></td>
- <td>{{ stats.tr_percentage|default:"0" }}%</td>
- <td><div class="graph">{{ stats|vis_stats }}</div></td>
- <td>{{ state.description }}</td>
-</tr>
-{% endfor %}
-</tbody>
-</table>
+ <div class="table-responsive">
+ <table class="stats table" id="working_on" name="working_on">
+ <thead><tr>
+ <th>{% trans "Date" %}</th><th>{% trans "Module" %}</th><th>{% trans "Statistics" %}</th><th>{%
trans "Graph" %}</th><th>{% trans "State" %}</th>
+ </tr></thead>
+ <tbody>
+ {% for state, stats in states %}
+ <tr id="{{ state.id }}{% if stats.tr_percentage == 100 %}-complete{% endif %}" {% if
stats.tr_percentage == 100 %}class="completed-module"{% endif %}>
+ <td><span style="display: none;">{{ state.updated|date:"c" }}</span>{{
state.updated|naturalday:"DATE_FORMAT" }}</td>
+ <td><a href="{{ state.get_absolute_url }}">{{ state.branch.module.get_description }} - {{
state.branch.name }} - {{ state.domain.get_description }} - {{ state.language.get_name }}</a></td>
+ <td>{{ stats.tr_percentage|default:"0" }}%</td>
+ <td><div class="graph">{{ stats|vis_stats }}</div></td>
+ <td>{{ state.description }}</td>
+ </tr>
+ {% endfor %}
+ </tbody>
+ </table>
+ </div>
+</div>
{% endif %}
{% endblock %}
diff --git a/templates/people/person_list.html b/templates/people/person_list.html
index 4aefb36..bbef733 100644
--- a/templates/people/person_list.html
+++ b/templates/people/person_list.html
@@ -4,7 +4,7 @@
{% block title %}{% trans "GNOME Contributors" %}{% endblock %}
{% block content %}
-<div class="maxwidth">
+<div class="mainpage">
<h2>{% trans "GNOME Contributors" %}</h2>
<p>{% trans "GNOME is being developed by following people:" %}</p>
diff --git a/templates/people/person_overview.html b/templates/people/person_overview.html
index 8e688a4..1fea5b4 100644
--- a/templates/people/person_overview.html
+++ b/templates/people/person_overview.html
@@ -3,7 +3,7 @@
{% load i18n people %}
-<div class="person_detail">
+<div class="person_detail col-sm-9">
<div class="image">{{ person|people_image }}</div>
<div class="txt">
diff --git a/templates/people/person_team_membership.html b/templates/people/person_team_membership.html
index c22c5ea..11a0fe1 100644
--- a/templates/people/person_team_membership.html
+++ b/templates/people/person_team_membership.html
@@ -2,20 +2,22 @@
{% load stats_extras %}
{% if person.role_set.all %}
-<h2>{% trans "Team membership" %}</h2>
-<ul class="foot">
- {% for role in person.role_set.all %}
- {% with role.get_role_display as role_name %}
- <li>{% blocktrans with role.team|linked_with:role.team.get_description|safe as team_name %}Member of {{
team_name }} team ({{ role_name }}){% endblocktrans %}
- {% if on_own_page %}
- <form class="inline" method="GET" action="{% url 'person_team_leave' role.team.name %}">
- {% csrf_token %}
- <input type="submit" value="{% trans "Leave" %}"
- onClick="javascript:return confirm('{% trans "Are you sure you want to leave the team?" %}')">
- </form>
- {% endif %}
- </li>
- {% endwith %}
- {% endfor %}
-</ul>
+<div class="col-sm-12">
+ <h2>{% trans "Team membership" %}</h2>
+ <ul class="foot">
+ {% for role in person.role_set.all %}
+ {% with role.get_role_display as role_name %}
+ <li>{% blocktrans with role.team|linked_with:role.team.get_description|safe as team_name %}Member of
{{ team_name }} team ({{ role_name }}){% endblocktrans %}
+ {% if on_own_page %}
+ <form class="inline" method="GET" action="{% url 'person_team_leave' role.team.name %}">
+ {% csrf_token %}
+ <input type="submit" value="{% trans "Leave" %}"
+ onClick="javascript:return confirm('{% trans "Are you sure you want to leave the team?"
%}')">
+ </form>
+ {% endif %}
+ </li>
+ {% endwith %}
+ {% endfor %}
+ </ul>
+</div>
{% endif %}
diff --git a/templates/release_compare.html b/templates/release_compare.html
index a932f8e..74208af 100644
--- a/templates/release_compare.html
+++ b/templates/release_compare.html
@@ -15,11 +15,12 @@ $(document).ready(function()
{% endblock %}
{% block content %}
-<div class="maxwidth">
+<div class="mainpage">
<h1>{% trans "Releases Comparison" %}</h1>
-<table class="stats" id="stats">
+<div class="table-responsive">
+<table class="stats table" id="stats">
<thead>
<tr>
<th class="header">{% trans "Languages" %}</th>
@@ -43,6 +44,6 @@ $(document).ready(function()
</tr>
{% endfor %}
</table>
-
+</div>
</div>
{% endblock %}
diff --git a/templates/release_detail.html b/templates/release_detail.html
index 25a899e..a416bfa 100644
--- a/templates/release_detail.html
+++ b/templates/release_detail.html
@@ -13,7 +13,8 @@
<p><i>{% trans "The modules of this release are not part of the GNOME Git repository. Please check each
module's web page to see where to send translations." %}</i></p>
{% endif %}
-<table class="stats">
+<div class="table-responsive">
+<table class="stats table">
<thead>
<tr>
<th style="background-color:transparent;"></th>
@@ -86,6 +87,6 @@
</tfoot>
</table>
-
+</div>
</div>
{% endblock %}
diff --git a/templates/stats_show.html b/templates/stats_show.html
index b0b3fa5..569d9f8 100644
--- a/templates/stats_show.html
+++ b/templates/stats_show.html
@@ -48,7 +48,8 @@
</div>
{% endif %}
- <table class="stats">
+ <div class="table-responsive">
+ <table class="stats table">
<thead><tr>
<th>{% trans "Language" %}</th><th>{% trans "Translated" %}</th>
{% if pot_stat.full_po.fig_count %}
@@ -87,7 +88,7 @@
{% endif %}
{% endfor %}
</table>
-
+ </div>
</div>
{% endwith %}
diff --git a/templates/teams/team_base.html b/templates/teams/team_base.html
index 77b9b2f..05966e3 100644
--- a/templates/teams/team_base.html
+++ b/templates/teams/team_base.html
@@ -2,9 +2,9 @@
{% load i18n %}
{% with team.get_description as lang %}
-<div class="columns">
+<div class="row">
- <div class="bloc first half">
+ <div class="about_qlinks col-md-5 col-sm-6">
<h2>{% trans "Details" %}
{% if can_edit_details %}
<a href="{% url 'team_edit' team.name %}">
@@ -42,7 +42,7 @@
</div>
- <div class="bloc half">
+ <div class="col-md-7 col-sm-6">
<h2>{% trans "Coordinator" %}</h2>
{% for person in team.get_coordinators %}
{% include "people/person_overview.html" %}
diff --git a/templates/teams/team_detail.html b/templates/teams/team_detail.html
index 00ba4bd..9ddd295 100644
--- a/templates/teams/team_detail.html
+++ b/templates/teams/team_detail.html
@@ -35,7 +35,7 @@ $(document).ready(function() {
{% block title %}{{ team.get_description }}{% endblock %}
{% block content %}
-<div class="maxwidth">
+<div class="col-xs-12">
{% if not team.fake %}
diff --git a/templates/teams/team_edit.html b/templates/teams/team_edit.html
index c57900b..12bc110 100644
--- a/templates/teams/team_edit.html
+++ b/templates/teams/team_edit.html
@@ -12,7 +12,7 @@ $(document).ready(function() {
{% endblock %}
{% block content %}
-<div class="maxwidth">
+<div class="col-xs-12">
<h1>{% blocktrans with team.get_description as lang %}{{ lang }} Translation Team{% endblocktrans %}</h1>
<form action="{{ request.path }}" method="POST" class="djform">
diff --git a/templates/teams/team_list.html b/templates/teams/team_list.html
index ade7cd6..342ac30 100644
--- a/templates/teams/team_list.html
+++ b/templates/teams/team_list.html
@@ -12,10 +12,10 @@
<p>{% trans "Select a team below to see more information about it:" %}</p>
{% load list_to_columns %}
-<div class="col3_container">
+<div class="column_container">
{% list_to_columns teams as columns 2 %}
{% for col in columns %}
- <div class="col2_column">
+ <div class="column_box col-xs-12 col-sm-6 no-padding">
<ul>
{% for team in col %}
<li style="font-size: 120%;">
diff --git a/templates/vertimus/vertimus_detail.html b/templates/vertimus/vertimus_detail.html
index 178e4a2..3147110 100644
--- a/templates/vertimus/vertimus_detail.html
+++ b/templates/vertimus/vertimus_detail.html
@@ -28,7 +28,7 @@ $(document).ready(function() {
{% endblock %}
{% block content %}
-<div class="maxwidth">
+<div class="mainpage">
{% if action_form.non_field_errors %}
{{ action_form.non_field_errors }}
{% endif %}
@@ -176,12 +176,17 @@ $(document).ready(function() {
<div class="face_image">{{ action.person|people_image }}</div>
<a href="{{ action.person.get_absolute_url }}">{{ action.person.name }}</a>
, <br /><a name="{{ action.id }}" href="#{{ action.id }}" title="{% trans 'Link to this comment'
%}"><img alt="link comment icon" class="action_icons" src="{{ STATIC_URL }}img/share.png"></a>
+ <a role="button" data-toggle="collapse" href="#{{ action.created|date:_("Y_g_i_s") }}"
class="visible-xs-inline" aria-expanded="false" aria-controls="collapseExample2">
+ <img alt="icon for action time" class="action_icons" src="{{ STATIC_URL }}img/clock.png">
+ </a>
{% if action.sent_to_ml%}
- <img alt="mail icon sent" class="action_icons" src="{{ STATIC_URL }}img/mail.png"
- title="{% trans 'This message was sent to the mailing list' %}">
+ <img alt="mail icon sent" class="action_icons" src="{{ STATIC_URL }}img/mail.png" title="{%
trans 'This message was sent to the mailing list' %}">
{% endif %}
- <strong>{{ action.description }}</strong>
- , {{ action.created|date:_("Y-m-d g:i a O") }}
+ <div class="collapse" id="{{ action.created|date:_("Y_g_i_s") }}">
+ {{ action.created|date:_("Y-m-d g:i a O") }}
+ </div>
+ <strong>{{ action.description }}</strong>
+ <span class="hidden-xs">, {{ action.created|date:_("Y-m-d g:i a O") }}</span>
<div class="clear"></div>
</div>
<div class="vertimus_action_content">
diff --git a/templates/vertimus/vertimus_diff.html b/templates/vertimus/vertimus_diff.html
index 1727b3a..6cdd81c 100644
--- a/templates/vertimus/vertimus_diff.html
+++ b/templates/vertimus/vertimus_diff.html
@@ -10,7 +10,7 @@
{% endblock %}
{% block content %}
-<div class="maxwidth">
+<div class="row">
<h1>{{ state.branch.module.get_description }} - <span style="color:#000;">{{ state.branch.name }}</span> -
{{ state.domain.get_description }} - {{ state.language.get_name }}</h1>
<p><a href="{% url 'vertimus_by_names' state.branch.module.name state.branch.name state.domain.name
state.language.locale %}">{% trans "<- Back to actions" %}</a></p>
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]
