From caecae2fad77d30627d6fce96289373b046a994c Mon Sep 17 00:00:00 2001
From: Chris Lawton <chris.lawton@torchbox.com>
Date: Mon, 6 Aug 2018 15:11:11 +0100
Subject: [PATCH] refactor wrapper modifiers to admin bar component
---
.../templates/dashboard/applicant_dashboard.html | 4 ++--
.../dashboard/templates/dashboard/dashboard.html | 4 ++--
.../templates/dashboard/reviewer_dashboard.html | 4 ++--
.../determinations/determination_detail.html | 4 ++--
.../determinations/determination_form.html | 4 ++--
.../funds/applicationrevision_list.html | 4 ++--
.../funds/applicationsubmission_detail.html | 4 ++--
.../funds/applicationsubmission_form.html | 4 ++--
.../funds/templates/funds/revisions_compare.html | 4 ++--
.../funds/templates/funds/submission_sealed.html | 4 ++--
.../apply/funds/templates/funds/submissions.html | 4 ++--
.../review/templates/review/review_detail.html | 4 ++--
.../review/templates/review/review_form.html | 4 ++--
.../review/templates/review/review_list.html | 4 ++--
.../apply/users/templates/users/account.html | 4 ++--
.../src/sass/apply/components/_admin-bar.scss | 16 ++++++++++++++++
.../src/sass/apply/components/_wrapper.scss | 15 ---------------
opentech/static_src/src/sass/apply/main.scss | 1 +
18 files changed, 47 insertions(+), 45 deletions(-)
create mode 100644 opentech/static_src/src/sass/apply/components/_admin-bar.scss
diff --git a/opentech/apply/dashboard/templates/dashboard/applicant_dashboard.html b/opentech/apply/dashboard/templates/dashboard/applicant_dashboard.html
index ea6cfe87a..331a22dc9 100644
--- a/opentech/apply/dashboard/templates/dashboard/applicant_dashboard.html
+++ b/opentech/apply/dashboard/templates/dashboard/applicant_dashboard.html
@@ -5,8 +5,8 @@
{% block title %}Submission Dashboard{% endblock %}
{% block content %}
-<div class="wrapper wrapper--breakout wrapper--admin">
- <div class="wrapper wrapper--large wrapper--applicant-dashboard">
+<div class="admin-bar">
+ <div class="admin-bar__inner wrapper--applicant-dashboard">
<div>
<h3 class="heading heading--no-margin">Dashboard</h3>
<h5>An overview of active and past submissions</h5>
diff --git a/opentech/apply/dashboard/templates/dashboard/dashboard.html b/opentech/apply/dashboard/templates/dashboard/dashboard.html
index 7e223d712..d467da86e 100644
--- a/opentech/apply/dashboard/templates/dashboard/dashboard.html
+++ b/opentech/apply/dashboard/templates/dashboard/dashboard.html
@@ -4,8 +4,8 @@
{% block title %}OTF Dashboard{% endblock %}
{% block content %}
-<div class="wrapper wrapper--breakout wrapper--admin">
- <div class="wrapper wrapper--large">
+<div class="admin-bar">
+ <div class="admin-bar__inner">
{% block page_header %}
<h1 class="gamma heading heading--no-margin heading--bold">Dashboard</h1>
{% endblock %}
diff --git a/opentech/apply/dashboard/templates/dashboard/reviewer_dashboard.html b/opentech/apply/dashboard/templates/dashboard/reviewer_dashboard.html
index a33a02728..f05ce66ab 100644
--- a/opentech/apply/dashboard/templates/dashboard/reviewer_dashboard.html
+++ b/opentech/apply/dashboard/templates/dashboard/reviewer_dashboard.html
@@ -4,8 +4,8 @@
{% block title %}OTF reviewer Dashboard{% endblock %}
{% block content %}
-<div class="wrapper wrapper--breakout wrapper--admin">
- <div class="wrapper wrapper--large">
+<div class="admin-bar">
+ <div class="admin-bar__inner">
{% block page_header %}
<h1 class="gamma heading heading--no-margin heading--bold">Dashboard</h1>
{% endblock %}
diff --git a/opentech/apply/determinations/templates/determinations/determination_detail.html b/opentech/apply/determinations/templates/determinations/determination_detail.html
index 9aefaa2a5..4948b34b7 100644
--- a/opentech/apply/determinations/templates/determinations/determination_detail.html
+++ b/opentech/apply/determinations/templates/determinations/determination_detail.html
@@ -2,8 +2,8 @@
{% load bleach_tags %}
{% block content %}
-<div class="wrapper wrapper--breakout wrapper--admin">
- <div class="wrapper wrapper--large">
+<div class="admin-bar">
+ <div class="admin-bar__inner">
<h2 class="heading heading--no-margin">Determination</h2>
<h5>For <a href="{% url "funds:submissions:detail" determination.submission.id %}">{{ determination.submission.title }}</a></h5>
</div>
diff --git a/opentech/apply/determinations/templates/determinations/determination_form.html b/opentech/apply/determinations/templates/determinations/determination_form.html
index 9009fc4d6..6f119037c 100644
--- a/opentech/apply/determinations/templates/determinations/determination_form.html
+++ b/opentech/apply/determinations/templates/determinations/determination_form.html
@@ -2,8 +2,8 @@
{% load bleach_tags %}
{% block title %}Create a determination{% endblock %}
{% block content %}
-<div class="wrapper wrapper--breakout wrapper--admin">
- <div class="wrapper wrapper--medium">
+<div class="admin-bar">
+ <div class="admin-bar__inner">
<h2 class="heading heading--no-margin">{{ title|default:"Create Determination" }}</h2>
<h5>For <a href="{% url "funds:submissions:detail" submission.id %}">{{ submission.title }}</a></h5>
</div>
diff --git a/opentech/apply/funds/templates/funds/applicationrevision_list.html b/opentech/apply/funds/templates/funds/applicationrevision_list.html
index 0311a70f1..8dc013d4d 100644
--- a/opentech/apply/funds/templates/funds/applicationrevision_list.html
+++ b/opentech/apply/funds/templates/funds/applicationrevision_list.html
@@ -2,8 +2,8 @@
{% block title %}Revisions for {{ submission.title }}{% endblock %}
{% block content %}
-<div class="wrapper wrapper--breakout wrapper--admin">
- <div class="wrapper wrapper--medium">
+<div class="admin-bar">
+ <div class="admin-bar__inner">
<h1 class="beta heading heading--no-margin heading--bold">Revisions</h1>
<h5>For <a href="{% url "funds:submissions:detail" submission.id %}">{{ submission.title }}</a></h5>
</div>
diff --git a/opentech/apply/funds/templates/funds/applicationsubmission_detail.html b/opentech/apply/funds/templates/funds/applicationsubmission_detail.html
index f60b85d1e..c38d7366c 100644
--- a/opentech/apply/funds/templates/funds/applicationsubmission_detail.html
+++ b/opentech/apply/funds/templates/funds/applicationsubmission_detail.html
@@ -8,8 +8,8 @@
{% include "includes/message_item.html" with message="This submission is sealed " tag="warning" close=False %}
</ul>
{% endif %}
-<div class="wrapper wrapper--breakout wrapper--admin">
- <div class="wrapper wrapper--medium">
+<div class="admin-bar">
+ <div class="admin-bar__inner">
<h1 class="beta heading heading--no-margin heading--bold">{{ object.title }}</h1>
<h5 class="heading heading--meta">
<span>{{ object.stage }}</span>
diff --git a/opentech/apply/funds/templates/funds/applicationsubmission_form.html b/opentech/apply/funds/templates/funds/applicationsubmission_form.html
index 71496889f..db69471fe 100644
--- a/opentech/apply/funds/templates/funds/applicationsubmission_form.html
+++ b/opentech/apply/funds/templates/funds/applicationsubmission_form.html
@@ -1,8 +1,8 @@
{% extends "base-apply.html" %}
{% block title %}Editing: {{object.title }}{% endblock %}
{% block content %}
-<div class="wrapper wrapper--breakout wrapper--admin">
- <div class="wrapper wrapper--large">
+<div class="admin-bar">
+ <div class="admin-bar__inner">
<h2 class="heading heading--no-margin">Editing: {{ object.title }}</h2>
</div>
</div>
diff --git a/opentech/apply/funds/templates/funds/revisions_compare.html b/opentech/apply/funds/templates/funds/revisions_compare.html
index 4bf8952b2..ae72674f6 100644
--- a/opentech/apply/funds/templates/funds/revisions_compare.html
+++ b/opentech/apply/funds/templates/funds/revisions_compare.html
@@ -1,7 +1,7 @@
{% extends "base-apply.html" %}
{% block content %}
-<div class="wrapper wrapper--breakout wrapper--admin">
- <div class="wrapper wrapper--medium">
+<div class="admin-bar">
+ <div class="admin-bar__inner">
<h2 class="heading heading--no-margin">Comparing Revisions</h2>
<h5>For <a href="{% url "funds:submissions:detail" object.id %}">{{ object.title }}</a></h5>
<h5><a href="{% url "funds:submissions:revisions:list" object.id %}">Back to revisions</a></h5>
diff --git a/opentech/apply/funds/templates/funds/submission_sealed.html b/opentech/apply/funds/templates/funds/submission_sealed.html
index 0f41f4695..ffd8069ea 100644
--- a/opentech/apply/funds/templates/funds/submission_sealed.html
+++ b/opentech/apply/funds/templates/funds/submission_sealed.html
@@ -3,8 +3,8 @@
{% block title %}Sealed: {{ object.title }}{% endblock %}
{% block content %}
-<div class="wrapper wrapper--breakout wrapper--admin">
- <div class="wrapper wrapper--medium">
+<div class="admin-bar">
+ <div class="admin-bar__inner">
<h1 class="beta heading heading--no-margin heading--bold">{{ object.title }}</h1>
<h5 class="heading heading--meta">
<span>{{ object.stage }}</span>
diff --git a/opentech/apply/funds/templates/funds/submissions.html b/opentech/apply/funds/templates/funds/submissions.html
index 419bc203b..9684cb70f 100644
--- a/opentech/apply/funds/templates/funds/submissions.html
+++ b/opentech/apply/funds/templates/funds/submissions.html
@@ -3,8 +3,8 @@
{% block title %}Submissions{% endblock %}
{% block content %}
-<div class="wrapper wrapper--breakout wrapper--admin">
- <div class="wrapper wrapper--large wrapper--search">
+<div class="admin-bar">
+ <div class="admin-bar__inner wrapper--search">
{% block page_header %}
<div>
<h1 class="gamma heading heading--no-margin heading--bold">Received Submissions</h1>
diff --git a/opentech/apply/review/templates/review/review_detail.html b/opentech/apply/review/templates/review/review_detail.html
index e72105b6b..f4ec8314f 100644
--- a/opentech/apply/review/templates/review/review_detail.html
+++ b/opentech/apply/review/templates/review/review_detail.html
@@ -2,8 +2,8 @@
{% load bleach_tags %}
{% block content %}
-<div class="wrapper wrapper--breakout wrapper--admin">
- <div class="wrapper wrapper--large">
+<div class="admin-bar">
+ <div class="admin-bar__inner">
<h1 class="beta heading heading--no-margin heading--bold">Review</h1>
<h5>For <a href="{% url "funds:submissions:detail" review.submission.id %}">{{ review.submission.title }}</a></h5>
</div>
diff --git a/opentech/apply/review/templates/review/review_form.html b/opentech/apply/review/templates/review/review_form.html
index 1c7e8747f..184bcd973 100644
--- a/opentech/apply/review/templates/review/review_form.html
+++ b/opentech/apply/review/templates/review/review_form.html
@@ -1,8 +1,8 @@
{% extends "base-apply.html" %}
{% block title %}Create a review{% endblock %}
{% block content %}
-<div class="wrapper wrapper--breakout wrapper--admin">
- <div class="wrapper wrapper--medium">
+<div class="admin-bar">
+ <div class="admin-bar__inner">
<h1 class="beta heading heading--no-margin heading--bold">{{ title|default:"Create Review" }}</h1>
<h5>For <a href="{% url "funds:submissions:detail" submission.id %}">{{ submission.title }}</a></h5>
</div>
diff --git a/opentech/apply/review/templates/review/review_list.html b/opentech/apply/review/templates/review/review_list.html
index 710b97246..889f3292f 100644
--- a/opentech/apply/review/templates/review/review_list.html
+++ b/opentech/apply/review/templates/review/review_list.html
@@ -4,8 +4,8 @@
{% block title %}Reviews{% endblock %}
{% block content %}
-<div class="wrapper wrapper--breakout wrapper--admin">
- <div class="wrapper wrapper--medium wrapper--reviews">
+<div class="admin-bar">
+ <div class="admin-bar__inner">
<div>
<h1 class="beta heading heading--no-margin heading--bold">Reviews</h1>
<h5>For <a href="{% url "funds:submissions:detail" submission.id %}">{{ submission.title }}</a></h5>
diff --git a/opentech/apply/users/templates/users/account.html b/opentech/apply/users/templates/users/account.html
index 317747654..fec9e9160 100644
--- a/opentech/apply/users/templates/users/account.html
+++ b/opentech/apply/users/templates/users/account.html
@@ -5,8 +5,8 @@
{% block content %}
-<div class="wrapper wrapper--breakout wrapper--admin">
- <div class="wrapper wrapper--large wrapper--search">
+<div class="admin-bar">
+ <div class="admin-bar__inner wrapper--search">
<h3>Welcome {{ user }}</h3>
</div>
</div>
diff --git a/opentech/static_src/src/sass/apply/components/_admin-bar.scss b/opentech/static_src/src/sass/apply/components/_admin-bar.scss
new file mode 100644
index 000000000..68e48b10d
--- /dev/null
+++ b/opentech/static_src/src/sass/apply/components/_admin-bar.scss
@@ -0,0 +1,16 @@
+.admin-bar {
+ position: relative;
+ right: 50%;
+ left: 50%;
+ width: 100vw;
+ padding: 20px;
+ margin-right: -50vw;
+ margin-left: -50vw;
+ color: $color--white;
+ background-color: $color--dark-grey;
+
+ &__inner {
+ max-width: $site-width;
+ margin: 0 auto;
+ }
+}
diff --git a/opentech/static_src/src/sass/apply/components/_wrapper.scss b/opentech/static_src/src/sass/apply/components/_wrapper.scss
index 90bfb7424..c80d2378e 100644
--- a/opentech/static_src/src/sass/apply/components/_wrapper.scss
+++ b/opentech/static_src/src/sass/apply/components/_wrapper.scss
@@ -20,21 +20,6 @@
padding: 0 20px;
}
- &--admin {
- padding: 20px;
- color: $color--white;
- background-color: $color--dark-grey;
- }
-
- &--breakout {
- position: relative;
- right: 50%;
- left: 50%;
- width: 100vw;
- margin-right: -50vw;
- margin-left: -50vw;
- }
-
&--blockquote {
padding: 1rem 0;
margin-top: 2rem;
diff --git a/opentech/static_src/src/sass/apply/main.scss b/opentech/static_src/src/sass/apply/main.scss
index ee6fea8b3..5aea73202 100755
--- a/opentech/static_src/src/sass/apply/main.scss
+++ b/opentech/static_src/src/sass/apply/main.scss
@@ -13,6 +13,7 @@
// Components
@import 'components/all-submissions';
+@import 'components/admin-bar';
@import 'components/activity-feed';
@import 'components/comment';
@import 'components/button';
--
GitLab