[tor-commits] [lego/develop] Update lego for eoy campaing

hiro at torproject.org hiro at torproject.org
Tue Apr 7 16:13:24 UTC 2020


commit a452ea9e315f72521e3b7999ad55ef681d707e80
Author: hiro <hiro at torproject.org>
Date:   Fri Oct 25 20:59:51 2019 +0200

    Update lego for eoy campaing
---
 assets/static/css/eoy.css                 |  92 ++++++++++++++++++++++++++++++
 assets/static/css/fonts/Kanit/kanit.woff2 | Bin 0 -> 18144 bytes
 templates/bottom_banner.html              |  38 +++++++-----
 3 files changed, 116 insertions(+), 14 deletions(-)

diff --git a/assets/static/css/eoy.css b/assets/static/css/eoy.css
new file mode 100644
index 0000000..6f52288
--- /dev/null
+++ b/assets/static/css/eoy.css
@@ -0,0 +1,92 @@
+ at font-face {
+  font-family: Kanit;
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url('fonts/Kanit/kanit.woff2') format('woff2');
+}
+
+.banner {
+  background-color: #000000;
+  z-index: 100000000000000 !important;
+}
+
+.banner__containter {
+  position: fixed;
+  right: 0;
+  left: 0;
+  bottom: 0;
+  padding: 1.25rem 1.25rem 2rem;
+  width: 100%;
+}
+
+.footer__close {
+  height: 3rem;
+  position: absolute;
+  right: 0;
+  top: 0;
+  width: 3rem;
+  margin-top: 0rem;
+  margin-right: -2rem;
+  z-index: 1;
+  font-weight: bolder;
+  visibility: inherit;
+}
+
+.take-back-monochrome-purple {
+  width: 533px;
+  height: 475px;
+}
+
+.tracking-surveillan {
+  color: #2EF900 !important;
+  font-family: Source Code Pro;
+  font-size: 18px;
+  font-weight: 400;
+  line-height: 22px;
+  text-align: left;
+}
+
+.take-back-the-intern {
+  color: #2FFF00;
+  font-family: Kanit;
+  font-size: 80px;
+  font-style: italic;
+  font-weight: 400;
+  line-height: 96px;
+  text-align: left;
+}
+
+.give-today-and-mozi {
+  color: #FFFFFF;
+  font-family: Source Code Pro;
+  font-size: 14px;
+  font-weight: 400;
+  line-height: 17px;
+  text-align: left;
+}
+
+.rectangle {
+  border: 3px solid #8A2BE2 !important;
+  color: #FFFFFF !important;
+}
+
+.eoy-sr-only {
+  height: 1px;
+  left: -10000px;
+  overflow: hidden;
+  position: absolute;
+  top: auto;
+  width: 1px;
+}
+
+#trigger {
+  position: absolute;
+  top: -9999px;
+  left: -9999px;
+}
+
+#trigger:checked ~  #banner-header, .banner__containter > #trigger:checked, #trigger:checked + label {
+  display: none;
+  visibility: hidden;
+}
diff --git a/assets/static/css/fonts/Kanit/kanit.woff2 b/assets/static/css/fonts/Kanit/kanit.woff2
new file mode 100644
index 0000000..be356f0
Binary files /dev/null and b/assets/static/css/fonts/Kanit/kanit.woff2 differ
diff --git a/templates/bottom_banner.html b/templates/bottom_banner.html
index 94efb57..20a5dc2 100644
--- a/templates/bottom_banner.html
+++ b/templates/bottom_banner.html
@@ -1,19 +1,29 @@
-<div class="dcs-banner__containter">
-  <input id="trigger" type="checkbox" title="Close banner" /><label for="trigger" class="dcs-footer__close">X</label>
-  <span class="dcs-sr-only">Close banner</span>
-  <div class="dcs-footer" id="dcs-banner-footer" role="contentinfo">
-    <div class="dcs-footer__container">
-      <a class="dcs-footer__logo" href="https://digital.globalclimatestrike.net/join/?source=digitalstrikebanner">
-        <img src="{{ '/static/images/dcs-logo.png'|asseturl }}" alt="Digital Climate Strike logo" class="dcs-logo">
-      </a>
-      <div class="dcs-footer__main">
-        <p class="dcs-footer__body">
-          Our website will join the Global #ClimateStrike on <time id="dcs-strike-date" datetime="2019-09-20">September 20</time>. Will you?
-        </p>
-        <div class="dcs-footer__action">
-          <a type="button" class="dcs-button" href="https://digital.globalclimatestrike.net/join/?source=digitalstrikebanner"> Yes, I’m in. ➔ </a>
+<div class="banner__containter banner align-middle d-flex justify-content-center p-5">
+  <input id="trigger" type="checkbox" title="Close banner" />
+    <label for="trigger" class="footer__close text-white">X</label>
+  <span class="eoy-sr-only text-white">Close banner</span>
+  <div class="eoy-banner row col-12" id="banner-header" role="contentinfo">
+    <div class="col-2"></div>
+    <div class="col-8">
+      <div class="col-12 row">
+        <div class="col-9">
+          <div class="row">
+            <p class="tracking-surveillan">Tracking, surveillance, and censorship are widespread online.</p>
+          </div>
+          <div class="row">
+            <p class="take-back-the-intern">TAKE BACK THE INTERNET WITH TOR</p>
+          </div>
+          <div class="row">
+            <a class="btn-lg rectangle">DONATE NOW</a>
+            <p class="give-today-and-mozi ml-5">Give today, and Mozilla will match your donation.</p>
+          </div>
+        </div>
+        <div class="col-3">
+          <img src="{{ '/static/images/home/png/take-back at 3x.png'|asseturl }}" alt="{{ _("Take Back The Internet") }}" />
         </div>
       </div>
     </div>
+    <div class="col-2">
+    </div>
   </div>
 </div>





More information about the tor-commits mailing list