Merged branch 261_new-color-scheme into Templating

app/assets/stylesheets/start-page-pictures.css

@@ -0,0 +1,39 @@
+
+.start-page-pictures {
+    position: relative;
+}
+
+.start-page-picture {
+    padding: 6px;
+    position: absolute;
+    background: #fff;
+    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
+}
+.start-page-picture img {
+    width: 350px;
+}
+.start-page-pictures .picture-1 {
+    transform: rotate(10deg);
+    -webkit-transform: rotate(10deg);
+    -moz-transform: rotate(10deg);
+    -ms-transform: rotate(10deg);
+    top: 40px;
+    left: 30px;
+}
+.start-page-pictures .picture-2 {
+    transform: rotate(5deg);
+    -webkit-transform: rotate(5deg);
+    -moz-transform: rotate(5deg);
+    -ms-transform: rotate(5deg);
+    top: 160px;
+    left: 200px;
+    z-index: 2;
+}
+.start-page-pictures .picture-3 {
+    transform: rotate(-5deg);
+    -webkit-transform: rotate(-5deg);
+    -moz-transform: rotate(-5deg);
+    -ms-transform: rotate(-5deg);
+    top: 240px;
+    left: 30px;
+}

app/views/application/index.html.erb

@@ -1,37 +1,49 @@
 <section class="front-section">
 	<div class="container" id="wsp-welcome">
 		<div class="row">
-			<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
-				<h4 class="text-uppercase"><%= t 'start_page.welcome_to' %></h4>
-				<h1><%= t('start_page.workshop_portal_hpi_html') %></h1>
+			<div class="col-sm-6">
+				<div class="row">
+					<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
+						<h4 class="text-uppercase"><%= t 'start_page.welcome_to' %></h4>
+						<h1><%= t('start_page.workshop_portal_hpi_html') %></h1>
+					</div>
+				</div>
+				<div class="row spacer-20"></div>
+				<div class="row">
+					<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 text-left">
+						<p><%= t 'start_page.intro_text' %></p>
+					</div>
+				</div>
+				<div class="row spacer-15"></div>
+				<div class="row">
+					<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
+						<ul>
+							<li>
+								<a class="btn btn-default" href="<%= events_path %>">
+										<%= glyph 'calendar' %>  <%= t "start_page.all_events" %>
+								</a>
+							</li>
+							<li>
+								<a class="btn btn-default" href="<%= new_user_registration_path %>">
+									<%= glyph 'user' %> <%= t 'start_page.register_now' %>
+								</a>
+							</li>
+						</ul>
+					</div>
+				</div>
 			</div>
-		</div>
-		<div class="row spacer-20"></div>
-		<div class="row">
-			<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 text-left">
-				<p><%= t 'start_page.intro_text' %></p>
+			<div class="col-md-6 col-lg-6 start-page-pictures">
+				<div class="start-page-picture picture-1">
+					<%= image_tag 'sample_images/children-593313_1280-w500.png' %>
+				</div>
+				<div class="start-page-picture picture-2">
+					<%= image_tag 'sample_images/women-1209678_1280-w500.png' %>
+				</div>
+				<div class="start-page-picture picture-3">
+					<%= image_tag 'sample_images/computer-1873831_1920-w500.png' %>
+				</div>
 			</div>
 		</div>
-		<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
-
-		</div>
-		<div class="row spacer-15"></div>
-		<div class="row">
-			<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
-				<ul>
-					<li>						
-						<a class="btn btn-default" href="<%= events_path %>">
-								<%= glyph 'calendar' %>  <%= t "start_page.all_events" %>
-						</a>
-					</li>
-					<li>						
-						<a class="btn btn-default" href="<%= new_user_registration_path %>">
-							<%= glyph 'user' %> <%= t 'start_page.register_now' %>
-						</a>
-					</li>
-				</ul>
-			</div	>	
-		</div>
 	</div>
 </section>
 
@@ -40,7 +52,7 @@
 <section class="front-section">
 	<div class="container">
 		<div class="row">
-			<div class="col-xs-12 col-sm-12 col-md-10 col-lg-10 col-md-offset-1 col-lg-offset-1">			
+			<div class="col-xs-12 col-sm-12 col-md-10 col-lg-10 col-md-offset-1 col-lg-offset-1">
 				<h2><span class="m-r-1"><%= t 'navbar.events' %></span>
 					<a class="btn btn-primary" href="<%= events_path %>">
 						<%= glyph 'calendar' %> <%= t "start_page.all_events" %>
@@ -112,7 +124,7 @@
 						<div class="spacer-30"></div>
 						<p class="lead"><%= t "start_page.outro_text_requests" %></p>
 					</div>
-				</div>			
+				</div>
 			</div>
 		</div>
 	</div>