WIP: Contributor landing page

app/app/urls.py

@@ -170,6 +170,7 @@
     re_path(r'^results/?', retail.views.results, name='results'),
     url(r'^get/?', retail.views.get_gitcoin, name='get_gitcoin'),
     url(r'^$', retail.views.index, name='index'),
+    url(r'^contributor', retail.views.contributor_landing, name='contributor_landing'),
     url(r'^help/dev/?', retail.views.help_dev, name='help_dev'),
     url(r'^help/repo/?', retail.views.help_repo, name='help_repo'),
     url(r'^help/faq?', retail.views.help_faq, name='help_faq'),

app/assets/v2/css/buttons.css

@@ -111,7 +111,10 @@ button:focus {
   padding: .75rem 1.5rem;
 }
 
-.btn-outline-gc-blue, .btn-outline-gc-purple, .btn-outline-gc-green {
+.btn-outline-gc-blue,
+.btn-outline-gc-purple,
+.btn-outline-gc-green,
+.btn-outline-white {
   padding: .75rem 1.5rem;
 }
 
@@ -137,6 +140,16 @@ button:focus {
   color: white;
 }
 
+.btn-outline-white {
+  border-color: #ffffff;
+  color: #ffffff;
+}
+
+.btn-outline-white:hover {
+  background: #ffffff;
+  color: #3f00ff;
+}
+
 .btn-gc-green {
   background-color: var(--gc-green);
 }

app/assets/v2/css/gitcoin.css

@@ -174,6 +174,11 @@ h4,
   background-repeat: no-repeat;
 }
 
+.header-contributor {
+  background-image: url('/static/v2/images/landing/contributor/hero_header_bg.jpg');
+  background-color: #3f00ff;
+}
+
 #gitcoin-background {
   background-image: url("/static/v2/images/header-bg.png");
   background-size: 2000px;
@@ -196,6 +201,18 @@ h4,
   font-size: 0.9rem !important;
 }
 
+.text-white {
+  color: #ffffff;
+}
+
+.underline {
+  text-decoration: underline;
+}
+
+.light {
+  font-weight: 200;
+}
+
 .font-title-lg {
   font-size: 22px;
 }
@@ -281,6 +298,11 @@ div.button-pink {
   letter-spacing: 0.1em;
 }
 
+.header-line-contributors {
+  letter-spacing: 0.5px;
+  font-weight: 700;
+}
+
 .subheader-line {
   color: #70efbe;
   font-family: Muli, sans-serif;
@@ -289,6 +311,12 @@ div.button-pink {
   font-style: italic;
 }
 
+.subheader-line-contributors {
+  color: #ffffff;
+  margin-top: 0.6em;
+  font-weight: 100;
+}
+
 .font-weight-300 {
   font-weight: 300;
 }

app/assets/v2/css/howitworks.css

@@ -69,7 +69,7 @@
   line-height: 26px;
   border-radius: 100%;
   background: #F9006C;
-  color: #333333;
+  color: #FFFFFF;
 }
 
 .how-it-works__step-title {

app/assets/v2/css/landing_page.css

@@ -164,7 +164,7 @@ body {
   justify-items: center;
 }
 
-.benefit-list {
+.benefits-list {
   grid-gap: 1rem;
   max-width: 70rem;
   display: grid;
@@ -214,20 +214,39 @@ body {
   background: white;
 }
 
-.pilot-container img {
+.pilot-container img,
+.project  {
   margin: 1.5rem 3rem;
   height: 5rem;
   width: 5rem;
 }
 
+.project img {
+  width: auto;
+  margin: 0
+}
+
 .pilot-container .image--rounded {
   border-radius: 100%;
 }
 
-.contributors-cta-container {
+.contributors-cta {
   background: #3E00FF;
 }
 
+.contributors-cta__robot {
+  max-height: 350px;
+}
+
+.join-gitcoin-heading {
+  font-size: 2.5rem;
+}
+
+.contributors-cta-text {
+  font-size: 1.2rem;
+  font-weight: 100;
+}
+
 .pricing_container {
   background-color: #F9F9F9;
   padding-bottom: 50rem;
@@ -343,6 +362,10 @@ body {
   border-bottom: 1px solid #E1E8EE;
 }
 
+.projects-container {
+  border-top: 1px solid #E1E8EE;
+}
+
 .testimonial-container {
   background-color: #F0F0F0;
 }
@@ -410,6 +433,74 @@ body {
   transform-origin: center 60%;
 }
 
+#binary-numbers .odd {
+  opacity: 0 ;
+  animation: opacity-1 1s infinite alternate;
+}
+
+#binary-numbers .even {
+  opacity: 1 ;
+  animation: opacity-1 1s 1s infinite alternate;
+}
+
+#community * {
+  animation: 3s cubic-bezier(0, 0, 1, 1) infinite;
+}
+
+#members-wrapper {
+  stroke: none;
+  stroke-width: 1;
+  fill: none;
+}
+
+#members-container {
+  transform: translate(-532.000000px, -912.000000px);
+  fill: #FFFFFF;
+  stroke: #000000;
+  stroke-width: 2.2;
+}
+
+#members {
+  transform: translate(-112.000000px, 757.000000px);
+}
+
+#members-inner1 {
+  transform: translate(527.000000px, 87.000000px);
+}
+
+#members-inner2 {
+  transform: translate(119.000000px, 70.000000px);
+}
+
+#member2-inner {
+  transform: translate(27.000000px, 0.000000px);
+}
+
+#member3-inner {
+  transform: translate(13.000000px, 4.000000px);
+}
+
+#member1 {
+  animation-name: member1-animation;
+  transform-origin: 50% 50%;
+  transform-box: fill-box;
+  transform: scale(0.8, 0.8);
+}
+
+#member2 {
+  transform-origin: 50% 50%;
+  transform-box: fill-box;
+  transform: scale(0.8, 0.8);
+  animation-name: member2-animation;
+}
+
+#member3 {
+  transform-origin: 50% 50%;
+  transform-box: fill-box;
+  transform: scale(0.8, 0.8);
+  animation-name: member3-animation;
+}
+
 .navbar__cta {
   color: white;
   opacity: 0;
@@ -469,14 +560,89 @@ body {
   }
 }
 
+@keyframes opacity-1 {
+  0% {
+    opacity: 0;
+  }
+  49.99% {
+    opacity: 0;
+  }
+  50% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
+@keyframes member1-animation {
+  0% {
+    transform: scale(0.8, 0.8);
+  }
+  18.89% {
+    transform: scale(1, 1);
+  }
+  60% {
+    transform: scale(1, 0.87);
+  }
+  81.11% {
+    transform: scale(0.8, 0.8);
+  }
+  100% {
+    transform: scale(0.8, 0.8);
+  }
+}
+
+@keyframes member2-animation{
+  0% {
+    transform: scale(0.8, 0.8);
+  }
+  6.67% {
+    transform: scale(0.8, 0.8);
+  }
+  24.44% {
+    transform: scale(1, 1);
+  }
+  65.56% {
+    transform: scale(1, 1);
+  }
+  90% {
+    transform: scale(0.8, 0.8);
+  }
+  100% {
+    transform: scale(0.8, 0.8);
+  }
+}
+
+@keyframes member3-animation {
+  0% {
+    transform: scale(0.8, 0.8);
+  }
+  12.22% {
+    transform: scale(0.8, 0.8);
+  }
+  30% {
+    transform: scale(1, 1);
+  }
+  75.56% {
+    transform: scale(1, 1);
+  }
+  98.89% {
+    transform: scale(0.8, 0.8);
+  }
+  100% {
+    transform: scale(0.8, 0.8);
+  }
+}
+
 @media (max-width: 1300px) {
   .whatisit_container iframe {
     min-height: 250px;
   }
 }
 
 @media (max-width: 869px) {
-  .benefit-list {
+  .benefits-list {
     grid-template-columns: 1fr;
   }
 }
@@ -587,10 +753,6 @@ body {
   text-align: left;
 }
 
-/* .get-started-btn {
-  min-width: 206px;
-} */
-
 .contributor-hero-bg {
   position: relative;
   background: url('../images/landing/contributor/hero_laptop.png') no-repeat;
@@ -615,6 +777,13 @@ body {
   color: #3f00ff;
 }
 
+@media (max-width: 991px) {
+  .contributor-hero-bg,
+  .ethereum-icon {
+    display: none;
+  }
+}
+
 @media (max-width: 767px) {
   .contributors-hero-container {
     margin-left: 1em !important;
@@ -623,6 +792,11 @@ body {
   .join-slack-btn {
     margin-left: 0 !important;
   }
+
+  .join-gitcoin-heading {
+    margin-top: 2em;
+    font-size: 2rem;
+  }
 }
 
 @media (max-width: 440px) {

app/dashboard/notifications.py

@@ -552,11 +552,20 @@ def amount_usdt_open_work():
         float: The sum of all USDT values rounded to the nearest 2 decimals.
 
     """
-    from dashboard.models import Bounty
-    bounties = Bounty.objects.filter(network='mainnet', current_bounty=True, idx_status__in=['open', 'submitted'])
+    bounties = open_bounties()
     return round(sum([b.value_in_usdt_now for b in bounties if b.value_in_usdt_now]), 2)
 
 
+def open_bounties():
+    """Get all current open and submitted work.
+
+    Returns:
+        QuerySet: The mainnet Bounty objects which are of open and submitted work statuses.
+
+    """
+    from dashboard.models import Bounty
+    return Bounty.objects.filter(network='mainnet', current_bounty=True, idx_status__in=['open', 'submitted'])
+
 def maybe_market_tip_to_github(tip):
     """Post a Github comment for the specified Tip.