added supportus view

digitalglarus/static/digitalglarus/css/agency.css

@@ -118,7 +118,7 @@ h6 {
     border-color: #88c7d7;
     text-transform: uppercase;
     font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
-    font-weight: 700;
+    font-weight: 400;
     color: #fff;
     background-color: #88c7d7;
 	letter-spacing: 1px;
@@ -131,7 +131,7 @@ h6 {
 .btn-primary.active,
 .open .dropdown-toggle.btn-primary {
     text-transform: uppercase;
-	font-weight: 700;
+	font-weight: 400;
 	border-color: #ba1924;
     color: #fff;
     background-color: #ba1924;
@@ -241,8 +241,6 @@ fieldset[disabled] .btn-xl.active {
 
 .navbar-default .navbar-collapse {
     border-color: rgba(255,255,255,.02);
-    padding-right: 100px;
-    text-align: right;
 }
 
 .navbar-default .navbar-toggle {
@@ -261,7 +259,7 @@ fieldset[disabled] .btn-xl.active {
 
 .navbar-default .nav li a {
     text-transform: uppercase;
-    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
+    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
     font-weight: 400;
     letter-spacing: 1px;
     color: #fff;
@@ -1076,7 +1074,7 @@ h6 intro-smallcap {
 
 .carousel-text {
 	text-transform : none;
-	font-family:"Raleway" , Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
+	font-famil:"Raleway" , Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
 	font-size : 20px;
 	font-weight : 100;
 	lign-heignt: 2px;
@@ -1172,11 +1170,11 @@ footer {
 }
 
 .map-caption{
-    text-transform:uppercase;
-    font-size: 13px;
+	text-transform: none;
 	font-family:"Montserrat","Helvetica Neue",Helvetica, Arial,sans-serif;
 	font-weight: 400;
 	color: #ffffff;
+	font-size: 14px;
 	letter-spacing: 1px;
 	text-align:center;
 }
@@ -1202,3 +1200,32 @@ hr {
     float: right!important;
     margin-right: -100px;
 }
+
+.help-box {
+    padding: 2em;
+    padding-top: 2em;
+    padding-bottom: 0.1em;
+    margin-bottom: 0px;
+}
+
+.help-box-group {
+	padding-top: 2em;
+	padding-bottom: 2.5em;
+}
+
+.submit-box {
+    padding-top: 1.5em;
+    padding-bottom: 2em;
+}
+
+.help-wrap {
+	padding-bottom: 2em;
+	padding-left: 4em;
+	padding-right: 4em;
+	padding-top: 2em;
+}
+
+.donate { 
+    font-weight: 600;
+	font-size: 24px;
+}

digitalglarus/static/digitalglarus/css/history.css

@@ -1,7 +1,7 @@
 @charset "UTF-8";
 /* CSS Document */
 
-header.history {
+header {
     text-align: center;
     color: #fff;
     background-attachment: scroll;
@@ -14,6 +14,231 @@ header.history {
     -o-background-size: cover;
 }
 
+.supportus {
+	background-image: url(../img/bal_header.png);
+    text-align: center;
+    color: #fff;
+    background-attachment: scroll;
+    background-position: center center;
+    background-repeat: none;
+    -webkit-background-size: cover;
+    -moz-background-size: cover;
+    background-size: cover;
+    -o-background-size: cover;
+	display: block;
+	overflow-x: hidden;
+}
+
+.supportus .intro-text {
+    padding-top: 100px;
+    padding-bottom: 50px;
+}
+
+.supportus .intro-text .intro-lead-in {
+    margin-bottom: 25px;
+    font-family: 'Raleway', "Droid Serif","Helvetica Neue",Helvetica,Arial,sans-serif;
+    font-size: 22px;
+    font-style: italic;
+    line-height: 22px;
+}
+
+.supportus .intro-text .intro-heading {
+    margin-bottom: 25px;
+    text-transform: uppercase;
+    font-family: 'Raleway', Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
+    font-size: 50px;
+    font-weight: 700;
+    line-height: 50px;
+}
+
+.supportus .intro-headline-big {
+    font-family: 'Raleway' , "Open Sans Bold", Helvetica, Arial, "Arial Bold", sans-serif;
+    font-size: 2.6em;
+    font-style: normal;
+    font-weight: 200;
+    text-transform: none;
+    text-transform: uppercase;
+    color: #fff;
+}
+@media(min-width : 320px) {
+    .supportus .intro-text {
+	padding-top: 200px;
+	padding-bottom: 200px;
+    }
+
+    .supportus .intro-text .intro-lead-in {
+	margin-bottom: 25px;
+	font-family: "Open Sans Extrabold", "Helvetica Neue", Helvetica, Arial, sans-serif;
+	font-size: 40px;
+	line-height: 40px;
+	font-style: normal;
+    }
+
+   .supportus .intro-text .intro-heading {
+	margin-bottom: 50px;
+	text-transform: uppercase;
+	font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
+	font-size: 75px;
+	font-weight: 700;
+	line-height: 75px;
+}
+.supportus .intro-headline-big {
+    font-family: 'Raleway', "Open Sans Bold", Helvetica, Arial, "Arial Bold", 
+	font-size: 2.6em;
+    font-style: normal;
+    font-weight: 800;
+    text-transform: uppercase;
+    color: #ffffff;
+	line-height: 1;
+	opacity: 0.85;
+	
+}
+
+.supportus-box {
+    border-style: solid;
+    border-width: 1px;
+	border-color: #ddd;
+	margin-left: 15px;
+    margin-right: 15px;
+	padding-left: 0;
+	padding-right: 0;
+}
+
+/*.supportus .portfolio-item {
+    right: 0;
+    margin: 0;
+	text-align: center;
+	display: block;
+    max-width: 650px;   
+	border: 1px;
+	border-color: #ddd;
+}
+
+.supportus .portfolio-item:hover {
+    opacity: 1;
+}
+
+.supportus .portfolio-item .portfolio-link {
+    display: block;
+    position: relative;
+    margin: 0 auto;
+    max-width: 400px;
+}
+
+.supportus .portfolio-item .portfolio-link .portfolio-hover {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    opacity: 1;
+    background: rgba(254,209,54,.9);
+    -webkit-transition: all ease .5s;
+    -moz-transition: all ease .5s;
+    transition: all ease .5s;
+}
+.supportus .portfolio-item .portfolio-link .portfolio-hover:hover {
+    opacity: 1;
+}
+
+.supportus .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content {
+    position: absolute;
+    top: 50%;
+    width: 100%;
+    height: 20px;
+    margin-top: -12px;
+    text-align: center;
+    font-size: 20px;
+    color: #fff;
+}
+
+.supportus .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content i {
+    margin-top: -12px;
+}
+.supportus .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h3,
+.supportus .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h4 {
+    margin: 0;
+}
+
+.supportus .portfolio-item .portfolio-caption {
+    padding: 25px;
+    max-width: 400px;
+    text-align: center;
+    background-color: #fff;
+}
+
+.supportus .portfolio-item .portfolio-caption h4 {
+	margin: 0;
+	font-size: bold;
+	text-transform: none;
+	color: #494949;
+}
+
+.supportus .portfolio-item .portfolio-caption p {
+	margin: 0;
+	font-family: "Raleway", "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
+	font-size: 14px;
+}
+
+.supportus * {
+    z-index: 2;
+}
+
+@media(min-width:767px) {
+    .supportus .portfolio-item {
+	margin: 0
+    }
+}
+*/
+
+.supporter-lead {
+    padding: 15px 5px 15px;
+	color: #000;
+	font-size:18px;
+	font-weight: 200;
+	font-family:raleway, monteserrat, open sans, helvitica neue, sans-serif;
+	text-align:center;
+	line-height: 1.6;
+}
+
+.white-background {
+  background-color: #fff;
+  -webkit-background-size: cover;
+  -moz-background-size: cover;
+  background-size: cover;
+  -o-background-size: cover;
+  color: #777;
+}
+
+.whatwedowith {
+	    margin-top: 50px;
+		margin-bottom: 0px;
+		padding-top: 3em;
+		padding-bottom: 3em;
+		background-image: url(../img/bricks_header_inverse.png);
+		background-size: cover;
+		background-repeat:no-repeat;
+        -webkit-background-size:cover;
+        -moz-background-size:cover;
+        -o-background-size:cover;
+		background-position:center;
+}
+
+.www {
+	margin-top: 3em;
+	margin-bottom: 15px;
+	font-size: 36px;
+	color: #494949;
+}
+
+.whatwe-wrap {
+     padding-bottom: 2em;
+	 padding-top: 0;
+	 margin-top: 2em;
+	 margin-bottom: 0;
+	 font-size: 36px;
+	 color: #494949;
+}
+
+
 .supporter {
 	font-size:18px;
 	font-family:raleway, monteserrat, open sans, helvitica neue, sans-serif;
@@ -29,7 +254,7 @@ header.history {
 
 .supporter-black {
     padding: 15px 5px 15px;
-    color: #000;
+	color: #f5f5f5;
 	font-size:18px;
 	font-weight: 200;
 	font-family:raleway, monteserrat, open sans, helvitica neue, sans-serif;
@@ -37,7 +262,7 @@ header.history {
 	line-height: 1.8;
 }
 
-@media (max-width: 979px) and (min-width: 768px)
+@media (max-width: 979px)
 .supporter-black{
     width: 100%;	
 }
@@ -126,26 +351,15 @@ header.history {
     text-decoration: none;
 }
 
-#price {
-    background-color: #ddd;
-    -webkit-background-size: cover;
-    -moz-background-size: cover;
-    background-size: cover;
-    -o-background-size: cover;
-}
-.price-box{
-    padding-left: 15px;
-    padding-right: 15px;
-    padding-top: 30px; 
-    padding-bottom: 30px;
-    margin-bottom: 30px;
-    color: inherit;
+section#waystohelp {
 	background-color: #fff;
-    margin-top: 30px;
-    margin-left: 10px;
-    margin-right: 10px;
+	display: block;
+	margin-top: 50px;
 }
 
-.graph{
-    padding-top: 30px;
+.whatwedo{
+    margin-top: 0;
+    margin-bottom: 15px;
+    font-size: 36px;
+    color: #f5f5f5;
 }

digitalglarus/static/digitalglarus/css/history1.css

@@ -0,0 +1,151 @@
+@charset "UTF-8";
+/* CSS Document */
+
+header.history {
+    text-align: center;
+    color: #fff;
+    background-attachment: scroll;
+    background-image: url(../img/header_bg_4.png);
+    background-position: center center;
+    background-repeat: none;
+    -webkit-background-size: cover;
+    -moz-background-size: cover;
+    background-size: cover;
+    -o-background-size: cover;
+}
+
+.supporter {
+    font-size:18px;
+    font-family:raleway, monteserrat, open sans, helvitica neue, sans-serif;
+    text-align:center;
+    line-height: 2.5;
+    color: #fff;
+}
+
+.supporter-intro {
+    padding: 15px 5px 15px;
+    color: #fff;
+}
+
+.supporter-black {
+    padding: 15px 5px 15px;
+    color: #000;
+    font-size:18px;
+    font-weight: 200;
+    font-family:raleway, monteserrat, open sans, helvitica neue, sans-serif;
+    text-align:center;
+    line-height: 1.8;
+}
+
+@media (max-width: 979px) and (min-width: 768px)
+.supporter-black{
+    width: 100%;    
+}
+
+.supporter-headline {
+    color: #fff;
+    font-size: 36px;
+    text-transform: uppercase;
+    font-family: 'Raleway', Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
+    font-weight: 400;
+    padding-top: 50px;
+    margin-top: 0;
+    margin-bottom: 15px;
+}
+.supporter-bg {
+    background-image:url(../img/bg-supporter.png);
+    background-position: center center;
+    background-repeat: none;
+    -webkit-background-size: cover;
+    -moz-background-size: cover;
+    background-size: cover;
+    -o-background-size: cover;
+}
+    
+.glyphicon-star {
+    font-size: 44px;
+    display: block;
+    text-align: center;
+    margin: 30px auto 30px;
+    color: #88c7d7;
+}
+
+.glyphicon-heart {
+    font-size: 42px;
+    display: block;
+    text-align: center;
+    margin: 40px auto 20px;
+    color: #88c7d7;
+}
+
+.glyphicon-home {
+    font-size: 42px;
+    display: block;
+    text-align: center;
+    margin: 40px auto 40px;
+    color: #88c7d7;
+}
+
+
+.glyphicon-road {
+    font-size: 42px;
+    display: block;
+    text-align: center;
+    margin: 40px auto 20px;
+    color: #88c7d7;
+}
+
+/*.glyphicon-inverse {
+    display: block;
+    width: 40px;
+    height: 40px;
+    border-radius: 100%;
+    font-size: 20px;
+    line-height: 40px;
+    outline: 0;
+    color: #fff;
+    background-color: #88c7d7;
+    -webkit-transition: all .3s;
+    -moz-transition: all .3s;
+    transition: all .3s;
+}*/
+    
+#hr.grey {
+    border-color: #ddd;
+    border-width: 1px;
+    max-width: 100px;
+}
+
+.img-100days{
+    width:220px;
+    height: 330px;
+    display: block;
+    position: absolute;
+    left: 0;
+    top: 0;
+    text-decoration: none;
+}
+
+#price {
+    background-color: #ddd;
+    -webkit-background-size: cover;
+    -moz-background-size: cover;
+    background-size: cover;
+    -o-background-size: cover;
+}
+.price-box{
+    padding-left: 15px;
+    padding-right: 15px;
+    padding-top: 30px; 
+    padding-bottom: 30px;
+    margin-bottom: 30px;
+    color: inherit;
+    background-color: #fff;
+    margin-top: 30px;
+    margin-left: 10px;
+    margin-right: 10px;
+}
+
+.graph{
+    padding-top: 30px;
+}

digitalglarus/templates/digitalglarus/supportus.html

@@ -0,0 +1,147 @@
+{% extends "new_base_glarus.html" %}
+{% load staticfiles cms_tags %}
+
+{% block content %}
+
+    <!-- Header -->
+    <section>
+    <div class="supportus">
+      <div class="container">
+      <div class="intro-text">
+        <p>
+         </p>
+           <div class="intro-headline-big">
+             <span class="intro-headline-big">
+                Become Our Supporter
+             </span>
+           </div>
+      </div>
+      </div>  
+     </div>
+    </section>
+<!-- form section ends-->
+    <!-- Services Section -->
+    <section id="waystohelp">
+     <div class="col-md-12 col-lg-12 text-center wow fadeInDown">
+   
+      <div class="help-wrap">
+        <h2 class="section-heading">3 Ways to Help</h2>
+        
+         <p class="text-center supporter-lead">The First Coworking Space of Glarus was not possible without our 
+                                                              supporters. <br>
+                                                              Be our supporter today and help us realize our dream coworking space!</p>
+                                                              
+        </div>
+     
+      
+        <div class="help-box-group row">
+      
+                  <div class="col-md-4 col-sm-6 portfolio-item text-center wow fadeInDown">
+                     <div class="supportus-box">
+                    <a href="#">
+                        <img class="img-responsive img-centered" src="{% static 'digitalglarus/img/supportus/2.png' %}" alt="">
+                    </a>
+                      
+                          <h3 class="donate">Get our news</h3>
+                           
+                         <div class="help-box">
+                         <hr class="primary"> 
+                             <p>Subscribe to our mailing list and stay informed on our news at Digital Glarus!
+                             We'll keep you up to date to our events and send you special invitations!</p>
+                                
+                                 <!--   <div class="submit-box">    
+                                      <button type="submit" class="btn btn-primary btn-blue">Subscribe</button>
+                                    </div>-->
+                         </div>
+                      </div>
+        </div>    
+      <div class="col-md-4 col-sm-6 text-center wow fadeInDown"> 
+            <div class="supportus-box">
+           <a href="#">
+                    <img class="img-responsive img-centered" src="{% static 'digitalglarus/img/supportus/3.png' %}" alt="">
+           </a>
+                
+                  <h3 class="donate">Connect and Share</h3>
+                    
+                     <div class="help-box">
+                     <hr class="primary"> 
+                         <p>Share your experience at Digital Glarus with your friends and collegues, let the other discover our coworking space!</p>
+                             
+                                <!-- <div class="submit-box"> 
+                                 <ul class="list-inline social-buttons">
+             <li><a href="https://twitter.com/ungleich"><i class="fa fa-twitter"></i></a>
+              </li>  
+                <li><a href="https://www.facebook.com/digitalglarus/"><i class="fa fa-facebook"></i></a>
+              </li> </ul>
+                                 </div> -->
+                     </div>  
+             
+            </div>    
+      </div> 
+      <div class="col-md-4 col-sm-6 text-center wow fadeInDown"> 
+             <div class="supportus-box">
+            <a href="#">
+                    <img class="img-responsive img-centered" src="{% static 'digitalglarus/img/supportus/1.png' %}" alt="">
+                </a>
+             
+                <h3 class="donate">
+                   Donate now
+                </h3>
+                
+                  <div class="help-box">
+                  <hr class="primary"> 
+                     <p>Your donation helps us renovate our 100+years old coworking space! This very old house needs a lot of love.</p>
+                        
+                   <!--    <div class="submit-box">  
+                           <button type="submit" class="btn btn-primary btn-blue">Donate</button>
+           
+                  </div> -->
+             </div>
+      </div>       
+   </div>
+ </div>
+ </section>
+ 
+ <section id="whatwedowith">
+
+      <div class="col-md-12 col-lg-12 text-center wow fadeInDown whatwedowith">
+        <div class="whatwe-wrap">
+          <h2 class="whatwedo">What we do with your support</h2>
+           <p class="carousel-text text-center supporter-black">Discover how your donation is being used in renovating our coworking space!</p>
+            <div class="row">
+            <div class="col-md-2"></div>
+             <div class="col-md-8">
+                <section class="blog-list">
+                  {% for post in post_list %}
+                  {% include "ungleich/djangocms_blog/includes/blog_item.html" with post=post image="true" TRUNCWORDS_COUNT=TRUNCWORDS_COUNT %}
+                  {% endfor %}
+                </section>
+
+                <a href="https://blog.ungleich.ch/en-us/blog/2016/05/21/renovation-digital-chalet/">
+                    <img class="img-responsive img-centered" src="{% static 'digitalglarus/img/supportus/7.png' %}" alt="">
+                </a>
+             </div>
+            <div class="col-md-2"></div>
+          
+        </div>
+      </div>
+ 
+ </section>
+    
+    <section id="contact">
+      <div class="fill">
+       <div class="row col-lg-12" class="wow fadeInDown">
+         <div class="col-md-4 map-title">
+           Digital Glarus <br>
+            <span class="map-caption">In der Au 7 Schwanden 8762 Switzerland
+             <br>info@digitalglarus.ch
+              <br>
+              (044) 534-66-22
+             <p>&nbsp;</p>
+            </span>
+       </div>
+        <p>&nbsp;</p>
+     </div>
+      </div> 
+    </section>
+{% endblock %}

digitalglarus/urls.py

@@ -7,11 +7,12 @@ from .views import ContactView, IndexView, AboutView, HistoryView, LoginView, Si
     MembershipPricingView, BookingSelectDatesView, BookingPaymentView, OrdersBookingDetailView,\
     BookingOrdersListView, MembershipOrdersListView, OrdersMembershipDetailView, \
     MembershipDeactivateView, MembershipDeactivateSuccessView, UserBillingAddressView, \
-    MembershipReactivateView
+    MembershipReactivateView, SupportusView
 # from membership.views import LoginRegistrationView
 
 urlpatterns = [
     url(_(r'^$'), IndexView.as_view(), name='landing'),
+    url(_(r'support-us/?$'), SupportusView.as_view(), name='supportus'),
     url(_(r'contact/?$'), ContactView.as_view(), name='contact'),
     url(_(r'login/?$'), LoginView.as_view(), name='login'),
     url(_(r'signup/?$'), SignupView.as_view(), name='signup'),
@@ -47,7 +48,7 @@ urlpatterns = [
     url(_(r'supporters/?$'), views.supporters, name='supporters'),
     url(r'calendar_api/(?P<month>\d+)/(?P<year>\d+)?$', views.CalendarApi.as_view(),name='calendar_api_1'),
     url(r'calendar_api/', views.CalendarApi.as_view(),name='calendar_api'),
-    url(_(r'support-us/?$'), views.support, name='support'),
+    # url(_(r'support-us/?$'), views.support, name='support'),
     url(r'^blog/(?P<slug>\w[-\w]*)/$', views.blog_detail, name='blog-detail'),
     url(r'blog/$', views.blog, name='blog'),
 ]

digitalglarus/views.py

@@ -46,6 +46,19 @@ class IndexView(TemplateView):
     template_name = "digitalglarus/index.html"
 
 
+class SupportusView(TemplateView):
+    template_name = "digitalglarus/supportus.html"
+
+    def get_context_data(self, *args, **kwargs):
+        context = super(SupportusView, self).get_context_data(**kwargs)
+        tags = ["digitalglarus"]
+        posts = Post.objects.filter(tags__name__in=tags, publish=True).translated(get_language())
+        context.update({
+            'post_list': posts
+        })
+        return context
+
+
 class LoginView(LoginViewMixin):
     template_name = "digitalglarus/login.html"
     form_class = LoginForm