Add style.css and fix hyperlinks in pages

5b284520 · Joaquin Inigo Crisologo · d99c3e49 · 5b284520 · 5b284520 · 5b284520
Commit 5b284520 authored Mar 28, 2023 by Joaquin Inigo Crisologo
5 changed files
--- a/joaqscrisologo_reading/bookshelf/templates/bookshelf/author_detail.html
+++ b/joaqscrisologo_reading/bookshelf/templates/bookshelf/author_detail.html
@@ -11,5 +11,5 @@
 	<li> <b>Bio:</b> {{object.bio}} </li>
 </ul>
 <br><hr><br><br>
-<a href="../home/">Home</a> &nbsp; <a href="../authors/">Authors</a> &nbsp; <a href="../books/">Books</a>
+<a href="../../../home/">Home</a> &nbsp; <a href="../../../authors/">Authors</a> &nbsp; <a href="../../../books/">Books</a>
 {% endblock %}
\ No newline at end of file
--- a/joaqscrisologo_reading/bookshelf/templates/bookshelf/books_detail.html
+++ b/joaqscrisologo_reading/bookshelf/templates/bookshelf/books_detail.html
@@ -6,12 +6,12 @@
 {% block content %}
 <h1> {{object}} </h1><br>
 <ul>
-	<li> <b>Author:</b> <a href="object.author.get_absolute_url">{{object.author}}</a> </li>
+	<li> <b>Author:</b> <a href="{{object.author.get_absolute_url}}">{{object.author}}</a> </li>
 	<li> <b>Publisher:</b> {{object.publisher}} </li>
 	<li> <b>Year Published:</b> {{object.year_published}} </li>
 	<li> <b>ISBN:</b> {{object.ISBN}} </li>
 	<li> <b>Blurb:</b> {{object.blurb}} </li>
 </ul>
 <br><hr><br><br>
-<a href="../home/">Home</a> &nbsp; <a href="../authors/">Authors</a> &nbsp; <a href="../books/">Books</a>
+<a href="../../../home/">Home</a> &nbsp; <a href="../../../authors/">Authors</a> &nbsp; <a href="../../../books/">Books</a>
 {% endblock %}
\ No newline at end of file
--- a/joaqscrisologo_reading/bookshelf/templates/bookshelf/home.html
+++ b/joaqscrisologo_reading/bookshelf/templates/bookshelf/home.html
@@ -4,9 +4,9 @@

 {% block title %} My Favorite Books & Authors {% endblock %}
 {% block content %}
-<h1> Welcome to Joaqs' Database of Favorite Books & Authors! </h1><h6> That is definitely not just the list of best-selling books on Wikipedia! </h6><br>
+<h1> Welcome to Joaqs' Database of Favorite Books & Authors! </h1><h6> That is definitely not just the list of best-selling books on Wikipedia :> </h6><br>
 <p> Hi! My name is Joaqs! I usually like science fiction books and non-fiction books, but my favorite book series is A Song of Ice and Fire by George R. R. Martin. </p>
-<p> While I don't have a favorite author, I usually enjoy books that are experimental or have good twists. </p> 
+<p> While I don't have a favorite author, I usually enjoy books that are experimental or have good twists. &#9786; </p> 
 <br><hr><br><br>
 <a href="../authors/">Authors</a> &nbsp; <a href="../books/">Books</a>
 {% endblock %}
\ No newline at end of file
--- a/joaqscrisologo_reading/static/style.css
+++ b/joaqscrisologo_reading/static/style.css
 body {
-	background-color: black;
-	color: white;
\ No newline at end of file
+	background-image: linear-gradient(to right, #000, #333);
+	color: rgb(100, 100, 100);
+	font-size: 14px;
+	font-family: Garamond, serif;
+	
+	margin: 20px;
+}
+
+p {
+	color: lightgrey;
+}
+
+a {
+	color: currentColor;
+	transition: color 0.5s;
+}
+
+a:hover {
+	color: white;
+}
+	
+li {
+	transition: color 0.5s, font-size 0.5s, text-shadow 0.5s;
+	font-size: 14px;
+	text-shadow: 0 0 0 currentColor;
+	list-style-type: none;
+}
+
+li::before {
+	content: '\21B3';
+}
+
+li:hover {
+	color: white;
+	font-size: 18px;
+	text-shadow: 0 0 5px currentColor;
+}
+
+h1 {
+	color: white;
+}
+
+h6 {
+	color: white;
+}
+
--- a/joaqscrisologo_reading/templates/base.html
+++ b/joaqscrisologo_reading/templates/base.html
 <!DOCTYPE html>
 <html lang="en">
 	<head>
-		<link rel="stylesheet" href="style.css">
+		{% load static %}
+		<link rel="stylesheet" href="{% static 'style.css' %}">
 		<title>{% block title %}My Favorite Books & Authors{% endblock %}</title>
 		{% block styles %}{% endblock %}
 	</head>