Adds Social Media Links

- Adds social media links on index.html (fb,youtube,g+)
- Adds side bar images on testimonials page
- changes css for the above files

12 files changed, 175 insertions, 52 deletions

diff --git a/static/workshop_app/css/faq.css b/static/workshop_app/css/faq.css
index 98b4f5c..d391d3a 100644
--- a/static/workshop_app/css/faq.css
+++ b/static/workshop_app/css/faq.css
@@ -2,4 +2,5 @@
 	list-style-type: square;
 	font-family: 'Antic Slab';
 	font-size: 22px;
-}
+	border-bottom: 1.5px solid #BDBDBD;
+}
\ No newline at end of file
diff --git a/static/workshop_app/css/index.css b/static/workshop_app/css/index.css
index 1087d24..a086726 100644
--- a/static/workshop_app/css/index.css
+++ b/static/workshop_app/css/index.css
@@ -3,92 +3,113 @@ body {
   background-color: grey;
 }
 
+.container {
+  background-color: #C8C5B6;
+  width: 90%;
+}
+
 .fossee-label {
-  padding-top: 20%;
-  margin-left: 9%;
   color: #6D5847;
+  text-align: center;
   font-size: 400%;
-}
-
-.logo {
-    float: left;
-    margin-top: 9%;
-    margin-left: 15%;
+  margin-top: 12%;
 }
 
 .label-bar {
   color: #6D5847;
-  float: right;
   margin-top: 9%;
   font-size: 120%;
-  margin-right: 3%;
+  background-color: white;
+  text-align:right;
+
 }
 
+.label-bar a {
+  color: #6D5847;
+}
 
 .login {
-    margin-left: auto;
-    margin-right: 1%;
-    width: 40%;
-    height: 90%;
-    background: white;
+
+}
+
+#first-right {
+  background-color: white;
+  width:90%;
+  margin: auto;
+  padding: 5%;
+  text-align: center;
 }
 
 #rectbox {
-    border-radius: 9%;
+    border-radius: 15px 15px 15px 15px;
     background: #6D5847;
-    padding: 3%; 
-    margin-left: 10%;
+    margin-left: 15%;
     margin-top: 3%;
     width: 75%;
-    height: 60%;    
-}
+    height: 60%;
+    padding-top: 8%;
+    padding-bottom: 8%; 
 
+}
 
 
 /* Icons with their respective Images */
 .icons {
     background: white;
     margin-top: 3%;
+    padding-top: 2%;
+    font-size: 15pt;
+    color: #6D5847;
 }
 
-figure.item {
-    /* To correctly align image, regardless of content height: */
-    vertical-align: top;
-    display: inline-block;
-    /* To horizontally center images and caption */
-    text-align: center;
-    /* The width of the container also implies margin around the images. */
+.icons a {
+  color: #6D5847;
 }
 
-
-
+label {
+  color:white !important;
+}
 
 
 /* Contact Us, Related Links and Organization Logo css*/
 
 
-.org-logo {
-	margin-top: 1%;
-
-  float: left;
-  color: #5A3700;
-  
+#bottom a{
+  color: #6D5847;
 }
 
-.related-links {
-  font-size: 120%;
-	color: #5A3700;
-  text-align: center;
-  margin-top: 1%;
+/* Style all font awesome icons */
+.fa {
+    padding: 6px;
+    font-size: 30px;
+    width: 30px;
+    text-align: center;
+    text-decoration: none;
 }
 
-.contact-us {
-	font-size: 140%;
-  color: #5A3700;
-  margin-top: 1%;
+/* Add a hover effect if you want */
+.fa:hover {
+    opacity: 0.7;
+}
 
-  float: right;
+/* Facebook */
+.fa-facebook {
+    background: #3B5998;
+    color: white;
+}
+/* Google */
+.fa-google {
+  background: #dd4b39;
+  color: white;
+}
+/* Youtube */
+.fa-youtube {
+  background: #bb0000;
+  color: white;
+}
 
+#social a{
+    color: white;
 }
 
 /* Footer */
diff --git a/static/workshop_app/css/sticky-footer.css b/static/workshop_app/css/sticky-footer.css
index cb21144..924258c 100644
--- a/static/workshop_app/css/sticky-footer.css
+++ b/static/workshop_app/css/sticky-footer.css
@@ -31,6 +31,11 @@
   background-color: black;
 }
 
+.navbar-custom .navbar-brand:hover{
+  color: black;
+  background-color: #efefef;
+}
+
 /* Footer CSS */
 .footer {
 	position: relative;
diff --git a/static/workshop_app/css/testimonials.css b/static/workshop_app/css/testimonials.css
new file mode 100644
index 0000000..cba4902
--- /dev/null
+++ b/static/workshop_app/css/testimonials.css
@@ -0,0 +1,50 @@
+/***
+User Profile Sidebar by @keenthemes
+A component of Metronic Theme - #1 Selling Bootstrap 3 Admin Theme in Themeforest: http://j.mp/metronictheme
+Licensed under MIT
+***/
+
+/* Content */
+.content {
+    padding-top: 30px;
+}
+
+/* Testimonials */
+.testimonials blockquote {
+    background: #f8f8f8 none repeat scroll 0 0;
+    border-bottom:1px dotted black;
+    color: #666;
+    display: block;
+    font-size: 15px;
+    line-height: 20px;
+    padding: 15px;
+    position: relative;
+}
+
+
+.testimonials .carousel-info img {
+    border: 1px solid #f5f5f5;
+    border-radius: 150px !important;
+    padding: 3px;
+    width: 75px;
+}
+.testimonials .carousel-info {
+    overflow: hidden;
+}
+.testimonials .carousel-info img {
+    margin-right: 15px;
+}
+.testimonials .carousel-info span {
+    display: block;
+}
+.testimonials span.testimonials-name {
+    color: #e6400c;
+    font-size: 21px;
+    font-weight: 300;
+    margin: 23px 0 7px;
+}
+.testimonials span.testimonials-post {
+    color: #656565;
+    font-size: 15px;
+    border-bottom: 1px solid grey;
+}
\ No newline at end of file
diff --git a/static/workshop_app/img/sides_img_1.png b/static/workshop_app/img/sides_img_1.png
new file mode 100644
index 0000000..3a66e95
--- /dev/null
+++ b/static/workshop_app/img/sides_img_1.png
diff --git a/static/workshop_app/img/sides_img_2.png b/static/workshop_app/img/sides_img_2.png
new file mode 100644
index 0000000..71ce494
--- /dev/null
+++ b/static/workshop_app/img/sides_img_2.png
diff --git a/workshop_app/static/workshop_app/css/faq.css b/workshop_app/static/workshop_app/css/faq.css
index ac010b9..d391d3a 100644
--- a/workshop_app/static/workshop_app/css/faq.css
+++ b/workshop_app/static/workshop_app/css/faq.css
@@ -3,6 +3,4 @@
 	font-family: 'Antic Slab';
 	font-size: 22px;
 	border-bottom: 1.5px solid #BDBDBD;
-}
-
-
+}
\ No newline at end of file
diff --git a/workshop_app/static/workshop_app/css/index.css b/workshop_app/static/workshop_app/css/index.css
index 9590473..a086726 100644
--- a/workshop_app/static/workshop_app/css/index.css
+++ b/workshop_app/static/workshop_app/css/index.css
@@ -78,6 +78,40 @@ label {
   color: #6D5847;
 }
 
+/* Style all font awesome icons */
+.fa {
+    padding: 6px;
+    font-size: 30px;
+    width: 30px;
+    text-align: center;
+    text-decoration: none;
+}
+
+/* Add a hover effect if you want */
+.fa:hover {
+    opacity: 0.7;
+}
+
+/* Facebook */
+.fa-facebook {
+    background: #3B5998;
+    color: white;
+}
+/* Google */
+.fa-google {
+  background: #dd4b39;
+  color: white;
+}
+/* Youtube */
+.fa-youtube {
+  background: #bb0000;
+  color: white;
+}
+
+#social a{
+    color: white;
+}
+
 /* Footer */
 .footer {
   position: relative;
diff --git a/workshop_app/static/workshop_app/img/sides_img_1.png b/workshop_app/static/workshop_app/img/sides_img_1.png
new file mode 100644
index 0000000..3a66e95
--- /dev/null
+++ b/workshop_app/static/workshop_app/img/sides_img_1.png
diff --git a/workshop_app/static/workshop_app/img/sides_img_2.png b/workshop_app/static/workshop_app/img/sides_img_2.png
new file mode 100644
index 0000000..71ce494
--- /dev/null
+++ b/workshop_app/static/workshop_app/img/sides_img_2.png
diff --git a/workshop_app/templates/workshop_app/index.html b/workshop_app/templates/workshop_app/index.html
index 718f9ba..ec2f4eb 100644
--- a/workshop_app/templates/workshop_app/index.html
+++ b/workshop_app/templates/workshop_app/index.html
@@ -17,6 +17,10 @@
     <!-- Custom CSS -->
     <link rel="stylesheet" href="{{ URL_ROOT }}/static/workshop_app/css/index.css" type="text/css" />
 
+    <!-- Add icon library -->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+
+
     <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
     <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
     <!--[if lt IE 9]>
@@ -119,8 +123,12 @@
             <div class="col-md-4">
                 <h3>Contact Us</h3>
                 FOSSEE, IIT-Bombay<br>
-                Mumbai, India <br> <br>
-        
+                Mumbai, India <br> 
+                <div id="social">
+                <a href="https://www.facebook.com/FOSSEENMEICT/" target="_blank" class="fa fa-facebook"></a> &nbsp;
+                <a href="https://plus.google.com/u/0/104012350840765676803" target="_blank" class="fa fa-google"></a> &nbsp;
+                <a href="https://www.youtube.com/channel/UCMtt6exSCmZI7JU73S6Wz_A" target="_blank" class="fa fa-youtube"></a>  <br>
+                </div>
                 Phone: (+91) 22 2576 4133<br>
                 Email: workshops[at]fossee[dot]in
                 </div>
diff --git a/workshop_app/templates/workshop_app/testimonals.html b/workshop_app/templates/workshop_app/testimonals.html
index e4b7d24..1086775 100644
--- a/workshop_app/templates/workshop_app/testimonals.html
+++ b/workshop_app/templates/workshop_app/testimonals.html
@@ -26,7 +26,10 @@
 
 	<div class="container content">
 		<div class="row">
-		    <div class="col-md-6 col-md-offset-3">
+		<div class="col-md-1">
+			<img src="{{ URL_ROOT}}/static/workshop_app/img/sides_img_2.png">
+		</div>
+		    <div class="col-md-6 col-md-offset-2">
 		        <div class="testimonials">
 		        	{% for m in messages %}
 		        	<div class="active item">
@@ -41,6 +44,9 @@
 		           	{% endfor %}
 		        </div>
 		    </div>
+		    <div class="col-md-1">
+			<img src="{{ URL_ROOT}}/static/workshop_app/img/sides_img_1.png">
+		</div>
 		</div>
 	</div>