Merge pull request #141 from levivm/feature/new_digitalglarus

Support us page, deactivate/reactivate membership.

digitalglarus/models.py

@@ -91,7 +91,8 @@ class Membership(models.Model):
     @classmethod
     def activate_or_crete(cls, data, user):
         membership = cls.get_by_user(user)
-        obj, created = cls.objects.update_or_create(id=membership.id, defaults=data)
+        membership_id = membership.id if membership else None
+        obj, created = cls.objects.update_or_create(id=membership_id, defaults=data)
         return obj
 
     @classmethod

digitalglarus/static/digitalglarus/css/agency.css

@@ -67,6 +67,12 @@ h6 {
 	font-size: 18px;
 }
 
+@media only screen and (max-width: 400px){ 
+  h1, h2 {
+    font-size: 20px;
+  }
+}
+
 .portfolio-caption-white {
 	text-transform: uppercase;
 	font-family:"Montserrat","Helvetica Neue",Helvetica, Arial,sans-serif;
@@ -118,7 +124,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 +137,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 +247,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 +265,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 +1080,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 +1176,11 @@ footer {
 }
 
 .map-caption{
-    text-transform:uppercase;
+	text-transform: none;
-    font-size: 13px;
 	font-family:"Montserrat","Helvetica Neue",Helvetica, Arial,sans-serif;
 	font-weight: 400;
 	color: #ffffff;
+	font-size: 14px;
 	letter-spacing: 1px;
 	text-align:center;
 }
@@ -1201,4 +1205,33 @@ hr {
 .navbar-right {
     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,11 +1,11 @@
 @charset "UTF-8";
 /* CSS Document */
 
-header.history {
+header {
     text-align: center;
     color: #fff;
     background-attachment: scroll;
-    background-image: url(../img/header_bg_4.png);
+    background-image: url(../img/header_bg_2.png);
     background-position: center center;
     background-repeat: none;
     -webkit-background-size: cover;
@@ -14,64 +14,294 @@ header.history {
     -o-background-size: cover;
 }
 
-.supporter {
+header.history {
-    font-size:18px;
+    background-image: url(../img/header_bg_4.png);
-    font-family:raleway, monteserrat, open sans, helvitica neue, sans-serif;
+}
-    text-align:center;
+
-    line-height: 2.5;
+
+.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;
+	text-align:center;
+	line-height: 2.5;
+	color: #fff;
 }
 
 .supporter-intro {
     padding: 15px 5px 15px;
-    color: #fff;
+	color: #fff;
 }
 
 .supporter-black {
     padding: 15px 5px 15px;
-    color: #000;
+	color: #000000;
-    font-size:18px;
+	font-size:18px;
-    font-weight: 200;
+	font-weight: 200;
-    font-family:raleway, monteserrat, open sans, helvitica neue, sans-serif;
+	font-family:raleway, monteserrat, open sans, helvitica neue, sans-serif;
-    text-align:center;
+	text-align:center;
-    line-height: 1.8;
+	line-height: 1.8;
 }
 
-@media (max-width: 979px) and (min-width: 768px)
+@media (max-width: 979px)
 .supporter-black{
-    width: 100%;    
+    width: 100%;	
 }
 
 .supporter-headline {
-    color: #fff;
+	color: #fff;
-    font-size: 36px;
+	font-size: 36px;
-    text-transform: uppercase;
+	text-transform: uppercase;
     font-family: 'Raleway', Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
     font-weight: 400;
-    padding-top: 50px;
+	padding-top: 50px;
-    margin-top: 0;
+	margin-top: 0;
     margin-bottom: 15px;
 }
 .supporter-bg {
-    background-image:url(../img/bg-supporter.png);
+	background-image:url(../img/bg-supporter.png);
-    background-position: center center;
+	background-position: center center;
-    background-repeat: none;
+	background-repeat: none;
-    -webkit-background-size: cover;
+	-webkit-background-size: cover;
-    -moz-background-size: cover;
+	-moz-background-size: cover;
-    background-size: cover;
+	background-size: cover;
-    -o-background-size: cover;
+	-o-background-size: cover;
 }
-    
+	
 .glyphicon-star {
-    font-size: 44px;
+	font-size: 44px;
     display: block;
     text-align: center;
     margin: 30px auto 30px;
-    color: #88c7d7;
+	color: #88c7d7;
 }
 
 .glyphicon-heart {
-    font-size: 42px;
+	font-size: 42px;
     display: block;
     text-align: center;
     margin: 40px auto 20px;
@@ -79,7 +309,7 @@ header.history {
 }
 
 .glyphicon-home {
-    font-size: 42px;
+	font-size: 42px;
     display: block;
     text-align: center;
     margin: 40px auto 40px;
@@ -88,7 +318,7 @@ header.history {
 
 
 .glyphicon-road {
-    font-size: 42px;
+	font-size: 42px;
     display: block;
     text-align: center;
     margin: 40px auto 20px;
@@ -96,7 +326,7 @@ header.history {
 }
 
 /*.glyphicon-inverse {
-    display: block;
+	display: block;
     width: 40px;
     height: 40px;
     border-radius: 100%;
@@ -109,7 +339,7 @@ header.history {
     -moz-transition: all .3s;
     transition: all .3s;
 }*/
-    
+	
 #hr.grey {
     border-color: #ddd;
     border-width: 1px;
@@ -117,35 +347,24 @@ header.history {
 }
 
 .img-100days{
-    width:220px;
+	width:220px;
-    height: 330px;
+	height: 330px;
-    display: block;
+	display: block;
     position: absolute;
     left: 0;
     top: 0;
     text-decoration: none;
 }
 
-#price {
+section#waystohelp {
-    background-color: #ddd;
+	background-color: #fff;
-    -webkit-background-size: cover;
+	display: block;
-    -moz-background-size: cover;
+	margin-top: 50px;
-    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{
+.whatwedo{
-    padding-top: 30px;
+    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/history.html

@@ -102,7 +102,7 @@
         <br>
     {% endfor %}
        <br>
-       <a href="http://startbootstrap.com/template-overviews/creative/" class="btn btn-default btn-primary sr-button">Become a supporter</a>
+       <a href="{% url 'digitalglarus:supportus' %}" class="btn btn-default btn-primary sr-button">Become a supporter</a>
        <br>
        <br>
        <br>
@@ -118,7 +118,8 @@
        <div class="row" class="wow fadeInDown">
         <div class="col-lg-12 text-center wow fadeInDown">
           <div class=" map-wrap">
-          <iframe style="pointer-events:none;margin-top:20px;"  src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2721.4267495037207!2d9.070190915609343!3d46.99259307914885!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47852e9322cc1971%3A0xf1558647dfdfaa60!2sIn+der+Au+7%2C+8762+Glarus+S%C3%BCd!5e0!3m2!1sen!2sch!4v1470238006004" width="100%" height="450" frameborder="0" style="border:0"></iframe></div>
+          <iframe style="pointer-events:none;margin-top:20px;"  src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2721.4267495037207!2d9.070190915609343!3d46.99259307914885!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47852e9322cc1971%3A0xf1558647dfdfaa60!2sIn+der+Au+7%2C+8762+Glarus+S%C3%BCd!5e0!3m2!1sen!2sch!4v1470238006004" width="100%" height="450" frameborder="0" style="border:0"></iframe>
+          </div>
             <div class="col-md-4 map-title">
               Digital Glarus<br>
               <span class="map-caption">In der Au 7 Schwanden 8762 Switzerland

digitalglarus/templates/digitalglarus/membership_payment.html

@@ -18,6 +18,7 @@
     padding: .5em;
     padding-right: 1.5em
   }
+
 </style>
 
   <section id="price">
@@ -97,9 +98,10 @@
                                      <span class="custom-control-indicator"></span>
                                      <span class="custom-control-description">I accept the Digital Glarus <a href=#>Terms and Conditions</a>, <a href=#>Community Guidelines</a> and <a href=#>Privacy Policy</a></span>
                                      </label>
-
+                                    <div class="row">
-                                    <div class="col-xs-12">
+                                      <div class="col-xs-6 col-md-12">
-                                        <button class="btn btn-primary btn-md btn-blck submit-payment" type="submit">Purchase membership</button>
+                                          <button class="btn btn-primary btn-md btn-blck submit-payment" type="submit">Purchase membership</button>
+                                      </div>
                                     </div>
                                 </div>
                                 <div class="row" style="display:none;">

digitalglarus/templates/digitalglarus/supportus.html

@@ -0,0 +1,178 @@
+{% extends "new_base_glarus.html" %}
+{% load staticfiles cms_tags %}
+
+{% block extra_css %}
+  <style type="text/css">
+
+  .supportus-posts .post-preview { 
+    background-color: white;
+    padding-right: 3%;
+  }
+
+  .supportus-posts img {
+    margin:6% !important;
+  }
+
+  .supportus-posts p {
+    /*font-size: 0.5em !important;*/
+  }
+
+  .supportus-posts .post-meta {
+    font-size: 0.4em !important;
+  }
+
+  .supporter-white {
+    color: white;
+  }
+
+  #waystohelp .wow{
+    background-color: white;
+  }
+
+  .whatwedowith {
+    margin-top: 0px;
+  }
+
+  </style>
+{% endblock %}
+
+
+{% 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 image-blog " 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>
+             </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-white">Discover how your donation is being used in renovating our coworking space!</p>
+            <div class="row">
+             <div class="col-md-6 col-md-offset-3 supportus-posts">
+                <div 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 %}
+                </div>
+             </div>
+          
+            </div>
+      </div>
+    </div>
+
+ 
+ </section>
+    
+    <section id="contact">
+      <div class="row">
+       <div class="fill wow fadeInDown">
+        <div class="col-lg-12 text-center 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>
+      </div>
+    </section>
+{% endblock %}

digitalglarus/templates/new_base_glarus.html

@@ -7,7 +7,8 @@
 
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- <meta name="viewport" content="width=device-width, initial-scale=1"> -->
+    <meta name="viewport" content="width=device-width" />
     <meta name="description" content="">
     <meta name="author" content="">
 
@@ -79,7 +80,41 @@
         margin: 0px;
         color:white;
       }
+
+      @media only screen and (min-width: 769px){ 
+        .dropdown.home-dropdown-mobile {
+          display:  none;
+        }
+        .dropdown.home-dropdown {
+          display: block;
+        }
+      }
+
+      @media only screen and (max-width: 768px){ 
+        .dropdown.home-dropdown-mobile {
+          display: block;
+          background-color: 
+        }
+
+        .dropdown.home-dropdown-mobile .dropdown-menu{
+          display: block;
+          background-color: #0f1221;
+        }
+
+        .dropdown.home-dropdown-mobile .dropdown-menu li a {
+          color:white;
+        }
+        .dropdown.home-dropdown-mobile .dropdown-menu li a:hover {
+          color: #0f1221;
+        }
+
+        .dropdown.home-dropdown {
+          display: none;
+        }
+      }
+
     </style>
+    {% block extra_css %} {% endblock %}
   </head>
 
 
@@ -120,6 +155,29 @@
         </li>
 
         {% if request.user.is_authenticated %}
+        <li class="dropdown home-dropdown-mobile open">
+          <a class="dropdown-toggle" role="button" data-toggle="dropdown" href="#">
+            <i class="glyphicon glyphicon-user"></i>{{request.user.name}} <span class="caret"></span>
+          </a>
+          <ul id="g-account-menu" class="dropdown-menu" role="menu">
+            <li>
+              <a href="{% url 'digitalglarus:booking_orders_list' %}">
+                <i class="fa fa-home" aria-hidden="true"></i> {% trans "Bookings"%} 
+              </a>
+            </li>
+            <li>
+              <a href="{% url 'digitalglarus:membership_orders_list' %}"><i class="fa fa-heart-o" aria-hidden="true"></i> {% trans "Membership"%} 
+              </a>
+            </li>
+            <li>
+              <a href="{% url 'digitalglarus:logout' %}">
+                <i class="fa fa-lock" aria-hidden="true"></i>
+                {% trans "Logout"%}
+              </a>
+            </li>
+          </ul>
+        </li>   
+
         <li class="dropdown home-dropdown">
           <a class="dropdown-toggle" role="button" data-toggle="dropdown" href="#">
             <i class="glyphicon glyphicon-user"></i>{{request.user.name}} <span class="caret"></span>

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 = ["dg-renovation"]
+        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

requirements.txt

@@ -1,53 +1,86 @@
+Babel==2.3.4
 Django==1.9.4
-aldryn-newsblog
+Django-Select2==4.3.2
-wheel
+Pillow==3.2.0
-django-bootstrap3
+URLObject==2.4.0
-django-cms
+Unidecode==0.04.19
-django-compressor
+YURL==0.13
-django-filter
+aldryn-apphooks-config==0.2.7
-django-taggit
+aldryn-boilerplates==0.7.4
-django-taggit-autosuggest
+aldryn-categories==1.0.3
-django-taggit-templatetags
+aldryn-common==1.0.1
-django-templatetag-sugar
+aldryn-newsblog==1.2.1
-django-model-utils
+aldryn-people==1.2.0
-djangocms-blog
+aldryn-reversion==1.0.8
-django-dotenv
+aldryn-search==0.2.11
-psycopg2
+aldryn-translation-tools==0.2.1
-django-mptt
+backport-collections==0.1
-easy_thumbnails
+cmsplugin-filer==1.0.1
-django-polymorphic
+django-appconf==1.0.2
-model-mommy
+django-appdata==0.1.5
-pycryptodome
+django-bootstrap3==7.0.1
-django-stored-messages
+django-classy-tags==0.7.2
-django-guardian
+django-cms==3.2.5
+django-compressor==2.0
+django-debug-toolbar==1.4
+django-dotenv==1.4.1
+django-extensions==1.6.7
+django-filer==1.2.0
+django-filter==0.13.0
+django-formtools==1.0
+django-guardian==1.4.4
+django-haystack==2.4.1
+django-meta==1.2
+django-meta-mixin==0.3.0
+django-model-utils==2.5
+django-mptt==0.8.4
+django-parler==1.6.3
+django-phonenumber-field==1.1.0
+django-polymorphic==0.9.2
+django-reversion==1.10.2
+django-sekizai==0.9.0
+django-sortedm2m==1.2.2
+django-spurl==0.6.4
+django-standard-form==1.1.1
+django-stored-messages==1.4.0
+django-taggit==0.18.3
+django-taggit-autosuggest==0.2.8
+django-taggit-templatetags==0.2.5
+django-templatetag-sugar==1.0
+django-treebeard==4.0.1
+djangocms-admin-style==1.1.1
+djangocms-apphook-setup==0.1.2
+djangocms-blog==0.7.0
+djangocms-file==1.0
+djangocms-flash==0.3.0
+djangocms-googlemap==0.4.0
+djangocms-inherit==0.2.1
+djangocms-link==1.7.2
+djangocms-page-meta==0.5.11
+djangocms-picture==1.0.0
+djangocms-teaser==0.2.0
+djangocms-text-ckeditor==2.9.3
+djangocms-video==1.0.0
+easy-thumbnails==2.3
+html5lib==0.9999999
+lxml==3.6.0
+model-mommy==1.2.6
+phonenumbers==7.4.0
+phonenumberslite==7.4.0
+psycopg2==2.6.1
+pycryptodome==3.4
+pylibmc==1.5.1
+python-dateutil==2.5.3
+python-slugify==1.2.0
+pytz==2016.4
+rcssmin==1.0.6
+requests==2.10.0
+rjsmin==1.0.12
+six==1.10.0
+sqlparse==0.1.19
+stripe==1.33.0
+wheel==0.29.0
 
-#PLUGINS
-djangocms_flash
-djangocms_googlemap
-djangocms_inherit
-djangocms_link
-djangocms_teaser
-djangocms_page_meta
-djangocms_text_ckeditor
-djangocms_file
-djangocms_picture
-djangocms_video
 
-#PAYMENT
-stripe
 
-django-treebeard
-django-sekizai
-django-classy-tags
-djangocms-admin-style
-html5lib
-six
 
-# Optional, recommended packages
-Pillow>=2
-django-filer
-cmsplugin-filer
-django-reversion
-pylibmc
-django_extensions
-django-debug-toolbar

ungleich/templates/ungleich/djangocms_blog/includes/blog_item.html

@@ -31,7 +31,7 @@
       </p>
 
       <p class="post-subtitle">
-        {% if not TRUNCWORDS_COUNT %}
+        {% if not TRUNCWORDS_COUNT %}       
         {% render_model post "abstract" %}
         {% else %}
         {% render_model post "abstract" "" "" 'truncatewords_html:TRUNCWORDS_COUNT'  %}