Bootstrap and tutorial 4 finished

7 files changed, 99 insertions, 15 deletions

diff --git a/app/Http/Controllers/PagesController.php b/app/Http/Controllers/PagesController.php
index 3d65be8..2ccafc8 100644
--- a/app/Http/Controllers/PagesController.php
+++ b/app/Http/Controllers/PagesController.php
@@ -19,7 +19,7 @@ class PagesController extends Controller
             'title' => 'Services',
             'services' => ['Web design', 'Programming', 'SEO']
         ];
-        return view('pages.index')->with($data);
+        return view('pages.services')->with($data);
     }
 
     public function about()
diff --git a/public/css/app.css b/public/css/app.css
index aa1634c..5bf38f6 100644
--- a/public/css/app.css
+++ b/public/css/app.css
@@ -1,3 +1,3 @@
-body {
-  background-color: red;
-}
+/*body {*/
+  /*background-color: red;*/
+/*}*/
diff --git a/resources/css/app.css b/resources/css/app.css
index aa1634c..5bf38f6 100644
--- a/resources/css/app.css
+++ b/resources/css/app.css
@@ -1,3 +1,3 @@
-body {
-  background-color: red;
-}
+/*body {*/
+  /*background-color: red;*/
+/*}*/
diff --git a/resources/views/inc/navbar.blade.php b/resources/views/inc/navbar.blade.php
new file mode 100644
index 0000000..4c559df
--- /dev/null
+++ b/resources/views/inc/navbar.blade.php
@@ -0,0 +1,59 @@
+<!--
+<nav class="navbar navbar-expand-md navbar-dark bg-dark fixed-top">
+  <a class="navbar-brand" href="#">Navbar</a>
+
+  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
+    <span class="navbar-toggler-icon"></span>
+  </button>
+
+  <div class="collapse navbar-collapse" id="navbarsExampleDefault">
+    <ul class="navbar-nav mr-auto">
+      <li class="nav-item active">
+        <a class="nav-link" href="/">Home<span class="sr-only">(current)</span></a>
+      </li>
+      <li class="nav-item">
+        <a class="nav-link" href="/services">Services</a>
+      </li>
+      <li class="nav-item">
+        <a class="nav-link" href="/about">About</a>
+      </li>
+      {{--<li class="nav-item">--}}
+        {{--<a class="nav-link disabled" href="#" tabindex="-1" aria-disabled="true">Disabled</a>--}}
+      {{--</li>--}}
+
+      {{--<li class="nav-item dropdown">--}}
+        {{--<a class="nav-link dropdown-toggle" href="#" id="dropdown01" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</a>--}}
+        {{--<div class="dropdown-menu" aria-labelledby="dropdown01">--}}
+          {{--<a class="dropdown-item" href="#">Action</a>--}}
+          {{--<a class="dropdown-item" href="#">Another action</a>--}}
+          {{--<a class="dropdown-item" href="#">Something else here</a>--}}
+        {{--</div>--}}
+      {{--</li>--}}
+
+    </ul>
+
+    {{--<form class="form-inline my-2 my-lg-0">--}}
+      {{--<input class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search">--}}
+      {{--<button class="btn btn-secondary my-2 my-sm-0" type="submit">Search</button>--}}
+    {{--</form>--}}
+
+  </div>
+</nav>
+-->
+<nav class="navbar navbar-expand-md navbar-light bg-light">
+    <a href="http://yota.yu1srs.org.rs" class="navbar-brand">YOTA</a>
+    <button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#navbarCollapse">
+        <span class="navbar-toggler-icon"></span>
+    </button>
+
+    <div class="collapse navbar-collapse" id="navbarCollapse">
+        <div class="navbar-nav">
+            <a href="/" class="nav-item nav-link active">Home</a>
+            <a href="/services" class="nav-item nav-link">Services</a>
+            <a href="/about" class="nav-item nav-link">About</a>
+        </div>
+        <div class="navbar-nav ml-auto">
+            <a href="#" class="nav-item nav-link">Login</a>
+        </div>
+    </div>
+</nav>
diff --git a/resources/views/layouts/app.blade.php b/resources/views/layouts/app.blade.php
index 2ba5a22..a2def85 100644
--- a/resources/views/layouts/app.blade.php
+++ b/resources/views/layouts/app.blade.php
@@ -3,10 +3,22 @@
     <head>
         <meta charset="utf-8">
         <meta name="viewport" content="width=device-width, initial-scale=1">
+
         <link rel="stylesheet" href="{{ asset('css/app.css') }}" type="text/css">
+        <!-- CSS only -->
+        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">
+
+        <!-- JS, Popper.js, and jQuery -->
+        <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
+        <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
+        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>
+
         <title>Main page</title>
     </head>
     <body>
-        @yield('content')
+        @include('inc.navbar')
+        <div class="container">
+            @yield('content')
+        </div>
     </body>
 </html>
diff --git a/resources/views/pages/index.blade.php b/resources/views/pages/index.blade.php
index e1e5fbf..0be22fc 100644
--- a/resources/views/pages/index.blade.php
+++ b/resources/views/pages/index.blade.php
@@ -3,11 +3,11 @@
 @section('content')
     <h1>{{ $title ?? 'Index'}}</h1>
     <p>Something...</p>
-    @if(count($services) > 0)
-    <ul>
-        @foreach($services as $service)
-            <li>{{$service}}</li>
-        @endforeach
-    </ul>
-    @endif
+    {{--@if(count($services) > 0)--}}
+    {{--<ul class="list-group">--}}
+        {{--@foreach($services as $service)--}}
+            {{--<li class="list-group-item">{{$service}}</li>--}}
+        {{--@endforeach--}}
+    {{--</ul>--}}
+    {{--@endif--}}
 @endsection
diff --git a/resources/views/pages/services.blade.php b/resources/views/pages/services.blade.php
new file mode 100644
index 0000000..3654510
--- /dev/null
+++ b/resources/views/pages/services.blade.php
@@ -0,0 +1,13 @@
+@extends('layouts.app')
+
+@section('content')
+    <h1>{{ $title ?? 'Index'}}</h1>
+    <p>Something...</p>
+    @if(count($services) > 0)
+    <ul class="list-group">
+        @foreach($services as $service)
+            <li class="list-group-item">{{$service}}</li>
+        @endforeach
+    </ul>
+    @endif
+@endsection