Merge pull request #285 from nextcloud/overwall-style-refresh

[WIP/NI] Overwall style refresh

Author: Jos Poortvliet

assets/css/_helpers.scss

@@ -0,0 +1,17 @@
+/// Block Element
+/// @access public
+/// @param {String} $element - Element's name
+@mixin element($element) {
+    &__#{$element} {
+        @content;
+    }
+}
+
+/// Block Modifier
+/// @access public
+/// @param {String} $modifier - Modifier's name
+@mixin modifier($modifier) {
+    &--#{$modifier} {
+        @content;
+    }
+}

assets/css/_variables.scss

@@ -1,10 +1,19 @@
+/*Colors*/
 $dark-blue: #2a2a36;
 $medium-blue: #0073B2;
 $nextcloud-blue: #0082c9;
+$light-grey: #f1f1f1;
 $medium-grey: #555555;
 $white: #ffffff;
 $orange: #FF8B00;
-$font-stack: 'Open Sans', Frutiger, Calibri, 'Myriad Pro', Myriad, sans-serif !important;
+
+/*Shadows*/
+$elevation-shadow-1: 0 2px 4px 0 rgba(0, 0, 0, 0.11);
+
+
+$font-stack: 'Open Sans', Frutiger, Calibri, 'Myriad Pro', Myriad, sans-serif;
+
+/*Breakpoints*/
 $break-small: 768px;
 $break-big: 991px;
 $very-wide: 1600px;

assets/css/box.css

@@ -36,9 +36,6 @@
 	}
 
 	p {
-	    font-size: 18px;
-    	font-weight: 300;
-    	max-width: 600px;
     	padding-top: 20px;
     	margin: 0 auto;
 	}
@@ -78,7 +75,6 @@
 }
 
 .section-getbox {
-	padding-top: 100px;
 	height: 440px;
 	width: 100%;
 	background-color: #252323;
@@ -89,8 +85,8 @@
 		.wrapper-text {
 			max-width: 550px;
 			color:white;
-			z-index: 50;
-			@include vertical-center;
+			padding-top: 40px;
+
 			h2 {
 				color: white;
 			}
@@ -114,11 +110,7 @@
 			height: 485px;
 		    background-repeat: no-repeat;
 		    float: right;
-	        margin-top: -220px;
-		}
-		
-		.dropdown-menu {
-			z-index: 1000;
+	        margin-top: -130px;
 		}
 	}
 }
@@ -134,7 +126,6 @@
 		p {
 		    font-size: 18px;
 	    	font-weight: 300;
-	    	max-width: 550px;
 	    	margin: 0 auto;
 	    	margin-top: 10px;
 	    	text-align: center;
@@ -171,7 +162,6 @@
 		p {
 		    font-size: 18px;
 	    	font-weight: 300;
-	    	max-width: 650px;
 	    	margin: 0 auto;
 	    	margin-top: 10px;
 		}
@@ -207,7 +197,6 @@
 		p {
 		    font-size: 18px;
 			font-weight: 300;
-			max-width: 650px;
 			margin: 0 auto;
 			margin-top: 10px;
 		}
@@ -390,12 +379,12 @@
 		.container {
 			padding-top: 30px;
 
-			.wrapper-buttons {
+			.col-xs-8 .wrapper-buttons {
 				text-align: center;
 				margin-top: 50px;
 
-				p {
-					margin-bottom: 45px;
+				.button {
+					margin: 0, 15px;
 				}
 			}
 		}