David A. Windham
david
/
laravel
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

Work on welcome page

Jeffrey Way 10 years ago
parent
3c0a1cfb4b
commit
ba1bff0f4f
7 changed files with 181 additions and 10 deletions
Unified View Show Diff Stats
  1. 48 0
      public/css/app.css
  2. 4 2
      resources/assets/sass/app.scss
  3. 43 0
      resources/assets/sass/pages/_welcome.scss
  4. 18 0
      resources/assets/sass/partials/_banner.scss
  5. 3 0
      resources/assets/sass/partials/_variables.scss
  6. 4 7
      resources/views/layouts/app.blade.php
  7. 61 1
      resources/views/welcome.blade.php

+ 48 - 0
public/css/app.css
View File 

@@ -4614,5 +4614,53 @@ button.close {
 
   margin: -11px 10px -10px 0;
 
   margin: -11px 10px -10px 0;
 
   padding: 0; }
 
   padding: 0; }
 
 
 
+.jumbotron {
 
+  background: #F55430;
 
+  color: #fde0da;
 
+  margin-top: -20px; }
 
+
 
+.jumbotron__header, .jumbotron h1 {
 
+  font-weight: bold;
 
+  color: white;
 
+  margin-top: 0; }
 
+
 
+.jumbotron__body {
 
+  max-width: 80%;
 
+  margin-bottom: 0;
 
+  line-height: 1.6em; }
 
+
 
+.steps {
 
+  max-width: 80%;
 
+  padding-left: 0;
 
+  list-style: none;
 
+  counter-reset: welcome-steps; }
 
+
 
+.steps > .steps__item {
 
+  margin-bottom: 2.5em;
 
+  padding: 19px;
 
+  border: 1px solid #eeeeee;
 
+  border-radius: 4px;
 
+  overflow: hidden; }
 
+  .steps > .steps__item:before {
 
+    content: counter(welcome-steps);
 
+    counter-increment: welcome-steps;
 
+    width: 50px;
 
+    height: 50px;
 
+    float: left;
 
+    margin-right: 1em;
 
+    background: #eeeeee;
 
+    border: 1px solid #d5d5d5;
 
+    border-radius: 50%;
 
+    font: bold 2em monospace;
 
+    text-align: center;
 
+    line-height: 49px; }
 
+  .steps > .steps__item .body {
 
+    float: left; }
 
+  .steps > .steps__item h2 {
 
+    font-weight: bold;
 
+    margin-top: 0; }
 
+  .steps > .steps__item p:last-child {
 
+    margin-bottom: 0; }
 
+
 
 .fa-btn {
 
 .fa-btn {
 
   margin-right: 10px; }
 
   margin-right: 10px; }

+ 4 - 2
resources/assets/sass/app.scss
View File 

@@ -1,8 +1,10 @@
 
-$font-family-sans-serif: "Lato", Helvetica, Arial, sans-serif;
 
-
 
+@import "partials/variables";
 
 @import "bootstrap";
 
 @import "bootstrap";
 
 @import "partials/auth";
 
 @import "partials/auth";
 
 @import "partials/navigation";
 
 @import "partials/navigation";
 
+@import "partials/banner";
 
+
 
+@import "pages/welcome";
 
 
 
 .fa-btn {
 
 .fa-btn {
 
 	margin-right: 10px;
 
 	margin-right: 10px;

+ 43 - 0
resources/assets/sass/pages/_welcome.scss
View File 

@@ -0,0 +1,43 @@
 
+.steps {
 
+	max-width: 80%;
 
+	padding-left: 0;
 
+	list-style: none;
 
+	counter-reset: welcome-steps;
 
+}
 
+
 
+.steps > .steps__item {
 
+	margin-bottom: 2.5em;
 
+	padding: 19px;
 
+	border: 1px solid $gray-lighter;
 
+	border-radius: 4px;
 
+	overflow: hidden;
 
+
 
+	// The step number.
 
+	&:before {
 
+		content: counter(welcome-steps);
 
+		counter-increment: welcome-steps;
 
+		width: 50px;
 
+		height: 50px;
 
+		float: left;
 
+		margin-right: 1em;
 
+		background: $gray-lighter;
 
+		border: 1px solid darken($gray-lighter, 10%);
 
+		border-radius: 50%;
 
+		font: bold 2em monospace;
 
+		text-align: center;
 
+		line-height: 49px;
 
+	}
 
+
 
+	.body {
 
+		float: left;
 
+	}
 
+
 
+	h2 {
 
+		font-weight: bold;
 
+		margin-top: 0;
 
+	}
 
+
 
+	p:last-child {
 
+		margin-bottom: 0;
 
+	}
 
+}

+ 18 - 0
resources/assets/sass/partials/_banner.scss
View File 

@@ -0,0 +1,18 @@
 
+.jumbotron {
 
+	background: $primary;
 
+	color: lighten($primary, 35%);
 
+	margin-top: -20px;
 
+}
 
+
 
+.jumbotron__header,
 
+.jumbotron h1 {
 
+	font-weight: bold;
 
+	color: white;
 
+	margin-top: 0;
 
+}
 
+
 
+.jumbotron__body {
 
+	max-width: 80%;
 
+	margin-bottom: 0;
 
+	line-height: 1.6em;
 
+}

+ 3 - 0
resources/assets/sass/partials/_variables.scss
View File 

@@ -0,0 +1,3 @@
 
+$font-family-sans-serif: "Lato", Helvetica, Arial, sans-serif;
 
+
 
+$primary: #F55430;

+ 4 - 7
resources/views/layouts/app.blade.php
View File 

@@ -7,9 +7,6 @@
 
 	<meta name="description" content="">
 
 	<meta name="description" content="">
 
 	<meta name="author" content="">
 
 	<meta name="author" content="">
 
 
 
-	<!-- FavIcon -->
 
-	<link rel="icon" href="../../favicon.ico">
 
-
 
 	<!-- Application Title -->
 
 	<!-- Application Title -->
 
 	<title>Laravel Application</title>
 
 	<title>Laravel Application</title>
 
 
 
@@ -29,7 +26,7 @@
 
 <body>
 
 <body>
 
 	<!-- Static navbar -->
 
 	<!-- Static navbar -->
 
 	<nav class="navbar navbar-default navbar-static-top" role="navigation">
 
 	<nav class="navbar navbar-default navbar-static-top" role="navigation">
 
-		<div class="container-fluid">
 
+		<div class="container">
 
 			<div class="navbar-header">
 
 			<div class="navbar-header">
 
 				<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
 
 				<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
 
 					<span class="sr-only">Toggle Navigation</span>
 
 					<span class="sr-only">Toggle Navigation</span>
 
@@ -37,7 +34,7 @@
 
 					<span class="icon-bar"></span>
 
 					<span class="icon-bar"></span>
 
 					<span class="icon-bar"></span>
 
 					<span class="icon-bar"></span>
 
 				</button>
 
 				</button>
 
-				<a class="navbar-brand" href="#">Laravel</a>
 
+				<a class="navbar-brand" href="/">Laravel</a>
 
 			</div>
 
 			</div>
 
 
 
 			<div id="navbar" class="navbar-collapse collapse">
 
 			<div id="navbar" class="navbar-collapse collapse">
 
@@ -63,13 +60,13 @@
 
 						<li><a href="/auth/register"><i class="fa fa-btn fa-user"></i>Register</a></li>
 
 						<li><a href="/auth/register"><i class="fa fa-btn fa-user"></i>Register</a></li>
 
 					</ul>
 
 					</ul>
 
 				@endif
 
 				@endif
 
-
 
 			</div>
 
 			</div>
 
 		</div>
 
 		</div>
 
 	</nav>
 
 	</nav>
 
 
 
+	@yield('banner')
 
 
 
-	<div class="container-fluid">
 
+	<div class="container">
 
 		@yield('content')
 
 		@yield('content')
 
 	</div>
 
 	</div>

+ 61 - 1
resources/views/welcome.blade.php
View File 

@@ -1,5 +1,65 @@
 
 @extends('layouts.app')
 
 @extends('layouts.app')
 
 
 
+@section('banner')
 
+<div class="jumbotron">
 
+    <div class="container">
 
+        <h1 class="jumbotron__header">Welcome to Laravel 5!</h1>
 
+
 
+        <p class="jumbotron__body">
 
+            Laravel is a web application framework with expressive, elegant syntax. We believe development
 
+            must be an enjoyable, creative experience to be truly fulfilling.
 
+        </p>
 
+    </div>
 
+</div>
 
+@stop
 
+
 
 @section('content')
 
 @section('content')
 
-Test
 
+<ol class="steps">
 
+    <li class="steps__item">
 
+        <div class="body">
 
+            <h2>Have a Look Around</h2>
 
+
 
+            <p>
 
+                Review <code>app/Http/Controllers/WelcomeController.php</code> to learn
 
+                how this page was constructed.
 
+            </p>
 
+        </div>
 
+    </li>
 
+
 
+    <li class="steps__item">
 
+        <div class="body">
 
+            <h2>Harness Your Skills</h2>
 
+
 
+            <p>
 
+                Once you've toyed around for a bit, you'll surely want to dig in and
 
+                learn more. Try:
 
+            </p>
 
+
 
+            <ul>
 
+                <li><a href="http://laravel.com/docs">Laravel Documentation</a></li>
 
+                <li><a href="https://laracasts.com">Laravel 5 From Scratch (via Laracasts)</a></li>
 
+            </ul>
 
+        </div>
 
+    </li>
 
+
 
+    <li class="steps__item">
 
+        <div class="body">
 
+            <h2>Forge Ahead</h2>
 
+
 
+            <p>
 
+                Finished building your app? It's time to deploy! Laravel still has your back. Use <a href="https://forge.laravel.com">Laravel Forge</a>.
 
+            </p>
 
+        </div>
 
+    </li>
 
+
 
+    <li class="steps__item">
 
+        <div class="body">
 
+            <h2>Profit</h2>
 
+
 
+            <p>
 
+                ...and go be with your family.
 
+            </p>
 
+        </div>
 
+    </li>
 
+</ol>
 
 @stop
 
 @stop