-
-
NovelMetrix
+
+
+
+
+
+
+
+
+ Boeken per maand per genre
+
+
-
Dashboard
+
+
+
+ Ratings
+
+
+
+ Talen
+
+
-
+
);
}
diff --git a/resources/sass/_login.scss b/resources/sass/_login.scss
new file mode 100644
index 0000000..a57192a
--- /dev/null
+++ b/resources/sass/_login.scss
@@ -0,0 +1,79 @@
+$color_1: #aaa;
+
+.login_overlay {
+ background: #eee;
+ position: absolute;
+ z-index: 2;
+ width: 100%;
+ height: 100%;
+ top: 0;
+}
+
+.login {
+ width: 350px;
+ min-height: 300px;
+ position: absolute;
+ z-index: 3;
+ top: 50%;
+ left: 50%;
+ -ms-transform: translateX(-50%) translateY(-50%);
+ transform: translateX(-50%) translateY(-50%);
+ border-radius: 5px;
+
+ form {
+ background: #ffffff;
+ box-shadow: 1px 1px 1px rgba(0,0,0,.05);
+ padding: 30px;
+
+ input {
+ background: #f9f9f9;
+ border: none;
+ border-radius: 5px;
+ padding: 10px 15px;
+ font-size: 13px;
+ }
+
+ .icon {
+ position: absolute;
+ right: 44px;
+ margin-top: 7px;
+ i {
+ color: $color_1;
+ font-size: 13px;
+ }
+ }
+
+ button {
+ background: #364c67;
+ width: 100%;
+ border: none;
+ padding: 10px 15px;
+ font-size: 13px;
+ &:hover {
+ background: #122235;
+ }
+ }
+ }
+
+ img {
+ display: block;
+ width: 200px;
+ margin: auto;
+ margin-bottom: 30px;
+ }
+
+ .login_logo {
+ width: 120px;
+ margin: auto;
+ margin-top: -65px;
+ background: #ffffff;
+ border-radius: 50%;
+ img {
+ width: 100%;
+ }
+ }
+
+ .register{
+ width:450px;
+ }
+}
diff --git a/resources/sass/_sidebar.scss b/resources/sass/_sidebar.scss
new file mode 100644
index 0000000..e297750
--- /dev/null
+++ b/resources/sass/_sidebar.scss
@@ -0,0 +1,74 @@
+$color_1: rgba(255,255,255,0.25);
+$color_2: rgba(255,255,255,0.3);
+$color_3: rgba(255,255,255,0.5);
+$color_4: #ffffff;
+
+.sidebar {
+ background: #333333;
+ width: 70px;
+ height: 100vh;
+ position: fixed;
+ padding-top: 47px;
+
+ span {
+ color: $color_1;
+ padding: 20px 20px 10px 20px;
+ display: block;
+ }
+
+ h3 {
+ color: $color_2;
+ font-size: 12px;
+ padding-bottom: 5px;
+ }
+
+ ul {
+ padding: 0;
+ margin: 0;
+
+ li {
+ color: $color_3;
+ list-style-type: none;
+ font-weight: 300;
+ cursor: pointer;
+ font-size: 12px;
+ padding: 20px 0px;
+ text-align: center;
+
+ i {
+ margin-right: 5px;
+ color: $color_3;
+ width: 15px;
+ font-size: 15px;
+ }
+ }
+
+ .active {
+ li {
+ background: rgba(0,0,0,0.3);
+ color: $color_4;
+ background: rgba(0,0,0,0.3) !important;
+
+ i {
+ color: $color_4;
+ }
+ }
+ }
+
+ a {
+ text-decoration: none;
+ }
+ }
+
+ button {
+ background: none;
+ border: none;
+ }
+
+ .bottom-menu {
+ position: absolute;
+ bottom: 0;
+ width: 100%;
+ border-top: solid 1px rgba(255,255,255,0.2);
+ }
+}
\ No newline at end of file
diff --git a/resources/sass/_topbar.scss b/resources/sass/_topbar.scss
new file mode 100644
index 0000000..a4889ef
--- /dev/null
+++ b/resources/sass/_topbar.scss
@@ -0,0 +1,71 @@
+$color_1: #ffffff;
+
+/* Topbar */
+
+.navbar.topbar {
+ background: #405181 !important;
+ width: 100%;
+ min-height: 50px;
+ padding-left: 10px;
+ position: fixed;
+ z-index: 1;
+
+ .logo {
+ width: 150px;
+ display: inline-block;
+ }
+}
+
+.topbar_right {
+ float: right;
+ padding: 23px 0;
+ margin-right: 30px;
+
+ ul {
+ margin: 0;
+
+ li {
+ list-style-type: none;
+ display: inline-block;
+ margin: 0 10px;
+ cursor: pointer;
+
+ i {
+ color: $color_1;
+ font-size: 14px;
+ }
+
+ &:hover {
+ i {
+ color: $color_1;
+ }
+ }
+ }
+ }
+}
+
+/* Choose Year */
+
+.chooseYear {
+ padding: 15px 15px;
+ color: $color_1;
+ display: inline-block;
+ span {
+ display: inline-block;
+ color: $color_1;
+ }
+ i {
+ color: $color_1;
+ font-size: 13px;
+ }
+ select {
+ font-size: 13px;
+ background: none;
+ color: $color_1;
+ padding: 5px;
+ &:focus-visible {
+ border: none !important;
+ outline: none !important;
+ }
+ }
+}
diff --git a/resources/sass/app.scss b/resources/sass/app.scss
index 1026a0b..f14b999 100644
--- a/resources/sass/app.scss
+++ b/resources/sass/app.scss
@@ -1,8 +1,45 @@
// Fonts
-@import url('https://fonts.bunny.net/css?family=Nunito');
+@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
// Variables
-@import 'variables';
+@import 'login';
+@import 'topbar';
+@import 'sidebar';
// Bootstrap
@import 'bootstrap/scss/bootstrap';
+
+html, body{
+ background:#fafdfb;
+ margin:0;
+ padding:0;
+ font-family: "Poppins", sans-serif;
+ letter-spacing: .3px;
+ font-weight: 400;
+ font-size: 14px;
+ color:#333;
+}
+
+.content{
+ padding: 80px 30px 30px 100px;
+}
+
+.books-per-month, .genresPercent, .books-per-country, .book, .ratings, .readed{
+ background: #ffffff;
+ padding: 20px;
+ box-shadow: 0 .15rem 1.75rem 0 rgba(58, 59, 69, .15);
+ margin-bottom: 20px;
+ border-radius: 10px;
+ padding:30px;
+ }
+
+ span.block_name {
+ color: #777;
+ font-weight: 300;
+ border-bottom: solid 1px #f5f6fa;
+ width: 100%;
+ display: block;
+ padding-bottom: 10px;
+ margin-bottom: 10px;
+ font-size: 14px;
+}
diff --git a/resources/views/.DS_Store b/resources/views/.DS_Store
new file mode 100644
index 0000000..cfff50d
Binary files /dev/null and b/resources/views/.DS_Store differ
diff --git a/resources/views/auth/login.blade.php b/resources/views/auth/login.blade.php
index ea9ac94..460dd8d 100644
--- a/resources/views/auth/login.blade.php
+++ b/resources/views/auth/login.blade.php
@@ -1,73 +1,35 @@
@extends('layouts.app')
@section('content')
-
-
-
-
-
+
+
+
-
+
+
+
+
+
+
+ @error('password')
+
+ {{ $message }}
+
+ @enderror
+
+
+
-
@endsection
diff --git a/resources/views/layouts/app.blade.php b/resources/views/layouts/app.blade.php
index 66a1a9e..0beadf8 100644
--- a/resources/views/layouts/app.blade.php
+++ b/resources/views/layouts/app.blade.php
@@ -7,7 +7,7 @@
-
{{ config('app.name', 'Laravel') }}
+
NovelMetrix
@@ -19,10 +19,10 @@