makes detailed anime page bit more prettier

2 files changed, 24 insertions, 23 deletions

diff --git a/resources/views/anime.blade.php b/resources/views/anime.blade.php
index 4ec398a..2bc0692 100644
--- a/resources/views/anime.blade.php
+++ b/resources/views/anime.blade.php
@@ -1,7 +1,7 @@
 @extends('layouts.app', [ 'title' => $anime["title_pref"]] )
 
 @section('content')
-<div class="container" id="index">
+<div class="container bg-white-transparent shadow-sm" id="index" style="padding: 20px;">
 	<h1>{{ $anime->title_pref }}</h1>
 
 	<div class="row">
@@ -62,7 +62,7 @@ new Chart(document.getElementById('score_chart'), {
 	    file: 'false',
 	    borderColor: 'rgb(75, 192, 192)',
 	    lineTension: 0.01,
-	    backgroundColor: 'white',
+	    backgroundColor: 'rgb(255,255,255,0)',
         }]
     },
     options: {
@@ -87,7 +87,7 @@ new Chart(document.getElementById('rank_chart'), {
 	    file: 'false',
 	    borderColor: 'rgb(75, 192, 192)',
 	    lineTension: 0.01,
-	    backgroundColor: 'white',
+	    backgroundColor: 'rgb(255,255,255,0)',
         }]
     },
     options: {
@@ -112,7 +112,7 @@ new Chart(document.getElementById('popularity_chart'), {
 	    file: 'false',
 	    borderColor: 'rgb(75, 192, 192)',
 	    lineTension: 0.01,
-	    backgroundColor: 'white',
+	    backgroundColor: 'rgb(255,255,255,0)',
         }]
     },
     options: {
@@ -137,7 +137,7 @@ new Chart(document.getElementById('favorites_chart'), {
 	    file: 'false',
 	    borderColor: 'rgb(75, 192, 192)',
 	    lineTension: 0.01,
-	    backgroundColor: 'white',
+	    backgroundColor: 'rgb(255,255,255,0)',
         }]
     },
     options: {
@@ -163,7 +163,7 @@ new Chart(document.getElementById('members_chart'), {
 	    file: 'false',
 	    borderColor: 'rgb(75, 192, 192)',
 	    lineTension: 0.01,
-	    backgroundColor: 'white',
+	    backgroundColor: 'rgb(255,255,255,0)',
 	},
 */
 	{
@@ -172,7 +172,7 @@ new Chart(document.getElementById('members_chart'), {
 	    file: 'false',
 	    borderColor: 'green',
 	    lineTension: 0.01,
-	    backgroundColor: 'white',
+	    backgroundColor: 'rgb(255,255,255,0)',
 	},
 	{
 	    label: 'On-Hold',
@@ -180,7 +180,7 @@ new Chart(document.getElementById('members_chart'), {
 	    file: 'false',
 	    borderColor: 'orange',
 	    lineTension: 0.01,
-	    backgroundColor: 'white',
+	    backgroundColor: 'rgb(255,255,255,0)',
 	},
 	{
 	    label: 'Plan-To-Watch',
@@ -188,7 +188,7 @@ new Chart(document.getElementById('members_chart'), {
 	    file: 'false',
 	    borderColor: 'grey',
 	    lineTension: 0.01,
-	    backgroundColor: 'white',
+	    backgroundColor: 'rgb(255,255,255,0)',
 	},
 	{
 	    label: 'Dropped',
@@ -196,7 +196,7 @@ new Chart(document.getElementById('members_chart'), {
 	    file: 'false',
 	    borderColor: 'red',
 	    lineTension: 0.01,
-	    backgroundColor: 'white',
+	    backgroundColor: 'rgb(255,255,255,0)',
 	},
 	{
 	    label: 'Completed',
@@ -204,7 +204,7 @@ new Chart(document.getElementById('members_chart'), {
 	    file: 'false',
 	    borderColor: 'blue',
 	    lineTension: 0.01,
-	    backgroundColor: 'white',
+	    backgroundColor: 'rgb(255,255,255,0)',
 	},
 	{
 	    label: 'Scored',
@@ -212,7 +212,7 @@ new Chart(document.getElementById('members_chart'), {
 	    file: 'false',
 	    borderColor: 'rgb(75, 192, 192)',
 	    lineTension: 0.01,
-	    backgroundColor: 'white',
+	    backgroundColor: 'rgb(255,255,255,0)',
 	}
 	]
     },
@@ -238,7 +238,8 @@ new Chart(document.getElementById('score_distribution_chart'), {
 		    file: 'false',
 		    borderColor: 'green',
 		    lineTension: 0.01,
-		    backgroundColor: 'white',
+		    /*backgroundColor: 'rbg(255,255,255,0.5)',*/
+		    backgroundColor: 'rgb(255,255,255,0)',
 		},
 		{
 		    label: 'Score 9',
@@ -246,7 +247,7 @@ new Chart(document.getElementById('score_distribution_chart'), {
 		    file: 'false',
 		    borderColor: 'green',
 		    lineTension: 0.01,
-		    backgroundColor: 'white',
+		    backgroundColor: 'rgb(255,255,255,0)',
 		},
 		{
 		    label: 'Score 8',
@@ -254,7 +255,7 @@ new Chart(document.getElementById('score_distribution_chart'), {
 		    file: 'false',
 		    borderColor: 'green',
 		    lineTension: 0.01,
-		    backgroundColor: 'white',
+		    backgroundColor: 'rgb(255,255,255,0)',
 		},
 		{
 		    label: 'Score 7',
@@ -262,7 +263,7 @@ new Chart(document.getElementById('score_distribution_chart'), {
 		    file: 'false',
 		    borderColor: 'green',
 		    lineTension: 0.01,
-		    backgroundColor: 'white',
+		    backgroundColor: 'rgb(255,255,255,0)',
 		},
 		{
 		    label: 'Score 6',
@@ -270,7 +271,7 @@ new Chart(document.getElementById('score_distribution_chart'), {
 		    file: 'false',
 		    borderColor: 'orange',
 		    lineTension: 0.01,
-		    backgroundColor: 'white',
+		    backgroundColor: 'rgb(255,255,255,0)',
 		},
 		{
 		    label: 'Score 5',
@@ -278,7 +279,7 @@ new Chart(document.getElementById('score_distribution_chart'), {
 		    file: 'false',
 		    borderColor: 'orange',
 		    lineTension: 0.01,
-		    backgroundColor: 'white',
+		    backgroundColor: 'rgb(255,255,255,0)',
 		},
 		{
 		    label: 'Score 4',
@@ -286,7 +287,7 @@ new Chart(document.getElementById('score_distribution_chart'), {
 		    file: 'false',
 		    borderColor: 'red',
 		    lineTension: 0.01,
-		    backgroundColor: 'white',
+		    backgroundColor: 'rgb(255,255,255,0)',
 		},
 		{
 		    label: 'Score 3',
@@ -294,7 +295,7 @@ new Chart(document.getElementById('score_distribution_chart'), {
 		    file: 'false',
 		    borderColor: 'red',
 		    lineTension: 0.01,
-		    backgroundColor: 'white',
+		    backgroundColor: 'rgb(255,255,255,0)',
 		},
 		{
 		    label: 'Score 2',
@@ -302,7 +303,7 @@ new Chart(document.getElementById('score_distribution_chart'), {
 		    file: 'false',
 		    borderColor: 'red',
 		    lineTension: 0.01,
-		    backgroundColor: 'white',
+		    backgroundColor: 'rgb(255,255,255,0)',
 		},
 		{
 		    label: 'Score 1',
@@ -310,7 +311,7 @@ new Chart(document.getElementById('score_distribution_chart'), {
 		    file: 'false',
 		    borderColor: 'red',
 		    lineTension: 0.01,
-		    backgroundColor: 'white',
+		    backgroundColor: 'rgb(255,255,255,0)',
 		}
 	]
     },
diff --git a/resources/views/layouts/app.blade.php b/resources/views/layouts/app.blade.php
index cb13360..734c7eb 100644
--- a/resources/views/layouts/app.blade.php
+++ b/resources/views/layouts/app.blade.php
@@ -87,7 +87,7 @@
                             </li>
                         @endguest
 			<form class="form-inline mt-2 mt-md-0 navbar-searchform" action="{{ route('search') }}">
-                                <input name="q" class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search" required>
+                                <input name="q" class="form-control mr-sm-2" type="text" placeholder="Search title, synopsis..." aria-label="Search" required>
                                 <button class="btn btn-outline-primary my-2 my-sm-0" type="submit">Search</button>
                         </form>
                     </ul>