sam-dude · sam-dude · Sep 30, 2022
diff --git a/Reader Mode/comfortaa/Comfortaa-Bold.ttf b/Reader Mode/comfortaa/Comfortaa-Bold.ttf
diff --git a/Reader Mode/comfortaa/Comfortaa-Light.ttf b/Reader Mode/comfortaa/Comfortaa-Light.ttf
diff --git a/Reader Mode/comfortaa/Comfortaa-Regular.ttf b/Reader Mode/comfortaa/Comfortaa-Regular.ttf
diff --git a/Reader Mode/comfortaa/DESCRIPTION.en_us.html b/Reader Mode/comfortaa/DESCRIPTION.en_us.html
@@ -0,0 +1 @@
+<p>Comfortaa is a rounded geometric sans-serif type design intended for large sizes. It is absolutely free, both for personal and commercial use.</p> <p>If you like it please <a href="http://aajohan.deviantart.com/art/Comfortaa-font-105395949"> visit my DeviantArt page</a> and fav it (but obviously only if you like it.) You are also more than welcome to comment about anything you want (I'm open to critique). I obviously would love to see how my font is being used, so feel free to comment with a link to your work, or send me a message.</p> <p>I hope you will enjoy using my font!</p>
diff --git a/Reader Mode/comfortaa/METADATA.pb b/Reader Mode/comfortaa/METADATA.pb
@@ -0,0 +1,39 @@
+name: "Comfortaa"
+designer: "Johan Aakerlund"
+license: "OFL"
+category: "DISPLAY"
+date_added: "2011-08-10"
+fonts {
+  name: "Comfortaa"
+  style: "normal"
+  weight: 300
+  filename: "Comfortaa-Light.ttf"
+  post_script_name: "Comfortaa-Light"
+  full_name: "Comfortaa Light"
+  copyright: "Copyright 2011 The Comfortaa Project Authors (https://github.com/alexeiva/comfortaa), with Reserved Font Name \"Comfortaa\"."
+}
+fonts {
+  name: "Comfortaa"
+  style: "normal"
+  weight: 400
+  filename: "Comfortaa-Regular.ttf"
+  post_script_name: "Comfortaa-Regular"
+  full_name: "Comfortaa Regular"
+  copyright: "Copyright 2011 The Comfortaa Project Authors (https://github.com/alexeiva/comfortaa), with Reserved Font Name \"Comfortaa\"."
+}
+fonts {
+  name: "Comfortaa"
+  style: "normal"
+  weight: 700
+  filename: "Comfortaa-Bold.ttf"
+  post_script_name: "Comfortaa-Bold"
+  full_name: "Comfortaa Bold"
+  copyright: "Copyright 2011 The Comfortaa Project Authors (https://github.com/alexeiva/comfortaa), with Reserved Font Name \"Comfortaa\"."
+}
+subsets: "cyrillic"
+subsets: "cyrillic-ext"
+subsets: "greek"
+subsets: "latin"
+subsets: "latin-ext"
+subsets: "menu"
+subsets: "vietnamese"
diff --git a/Reader Mode/comfortaa/OFL.txt b/Reader Mode/comfortaa/OFL.txt
@@ -0,0 +1,93 @@
+Copyright 2011 The Comfortaa Project Authors (https://github.com/alexeiva/comfortaa), with Reserved Font Name "Comfortaa".
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded, 
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.
diff --git a/Reader Mode/css/index.css b/Reader Mode/css/index.css
@@ -0,0 +1,140 @@
+@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500;600;700&display=swap');
+
+@import url('https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&display=swap');
+
+*{
+  margin: 0;
+  padding: 0;
+  font-family: 'Comfortaa', cursive;
+  box-sizing: border-box;
+}
+body{
+   display: flex;
+   justify-content: center;
+   align-items: center;
+}
+#wrapper{
+   margin: 5% 6%;
+   background-color: #dbbea1;
+   border-radius: 5px; 
+   box-shadow: 1px 3px 5px rgba(0,0,0,0.2);
+   width: 50vw;
+   padding-bottom: 20px;
+}
+
+input{
+  color: #373939;
+  box-shadow:inset 4px 4px 4px -1px rgba(170,183,186,0.439),inset -5px -5px 5px -1px rgba(255,255,255,0.70);
+  background: #efeef1;
+  border: none;
+  cursor: pointer;
+  border-radius: 40px;
+  font-size: 15px;
+  padding: 5px 15px;
+  outline: none;
+  transition: 0.5s;
+
+}
+input:hover{
+   box-shadow:inset 2px 2px 2px -1px rgba(170,183,186,0.439),inset -2px -2px 2px -1px rgba(255,255,255,0.70);
+   transform: scale(1.01);
+
+}
+button{
+   border: none;
+   cursor: pointer;
+   border-radius: 20px;
+   color: #fcfbfd;
+   box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.2);
+  padding: 6px 12px;
+  background: #db7f67;
+  margin: auto;
+
+}
+
+header{
+  height: 170px;
+  color: #db7f67;
+  background: #a37b73;
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  border-radius: 5px;
+  margin-bottom: 12px;
+  flex-wrap: nowrap;
+}
+h1,
+#quote{
+   text-align: center;
+   padding-bottom: 10px;
+}
+p{
+   padding-bottom: 15px;
+   color: #fcfbfd;
+   font-weight: 500;
+}
+.title{
+   padding: 12px 0 0;
+}
+h2{
+   padding: 15px 0 ;
+}
+/*Book lists*/
+#book-list{
+   padding: 0 20px;
+}
+#book-list ul{
+   list-style: none;
+   margin: 0 15px 0;
+}
+#book-list ul li{
+   padding: 14px 10px ;
+   border-left:3px solid #a37b73;
+   margin: 32px auto;
+   border-bottom-right-radius: 3px;
+   transition: 0.5s;
+   display: flex;
+   justify-content: space-between;
+   align-items: center;
+}
+#book-list ul li:hover{
+   box-shadow: 0.5px 3px 4px #888;
+   border-color: #db7f67;
+}
+
+#add-book{
+   align-items: center;
+   justify-content: center;
+   display: flex;
+   padding: 3% 9% ;
+}
+.delete{
+   background: #db7f67;
+   padding: 4px 7px;
+   border-radius: 5px;
+   color: #efeef1;
+   cursor: pointer;
+}
+.delete:hover{
+   background: #2e2320;
+}
+#search-books{
+  flex: 1;
+}
+
+/*Svg Styling*/
+.red{
+  color: #ffffff;
+  width: 14px;
+}
+/* Smaller Screen Optimisation */
+@media only screen  and (max-width:768px) {
+   #wrapper{
+      width: 80vw;
+   }
+}
+#newBook{
+   flex: 1;
+   margin-right: 20px;
+}
diff --git a/Reader Mode/delete-svgrepo-com.svg b/Reader Mode/delete-svgrepo-com.svg
diff --git a/Reader Mode/index.html b/Reader Mode/index.html
@@ -0,0 +1,57 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <link rel="stylesheet" href="css/index.css">
+
+  <title>Reader Mode</title>
+</head>
+
+<body>
+
+	<div id="wrapper">
+
+	  <header>
+	    <div id="page-banner">
+	      <h1 class="title">Booklist</h1>
+	      <p id="quote"><i><sub>"...the life of a Bibliophile"</sub></i></p>
+		  <a href="https://www.google.com">Google</a>
+	      <form id="search-books"  accept-charset="utf-8">
+	         <input id="searchBooks" type="text" placeholder="Search books..."/>
+	      </form>
+	    </div>
+	  </header>
+
+	  <div id="book-list">
+	    <h2 class="title">Books to Read</h2>
+	    <ul>
+	      <li >
+	        <span class="name">Name of the Wind</span>
+	        <span class="delete">delete</span>
+	      </li>
+	      <li>
+	         <span class="name">Kafka on the Web</span>
+	         <span class="delete">delete</span>
+	      </li>
+	      <li>
+	         <span class="name">The Love of Me</span>
+	         <span class="delete">delete</span>
+	      </li>
+	      <li>
+	         <span class="name">Weekends Warriors</span>
+	         <span class="delete"> delete </span>
+	      </li>
+	    </ul>
+	  </div>
+
+	  <form id="add-book">
+	    <input id="newBook" type="text" placeholder="Add a new book..."/>
+	    <button>Add</button>
+	  </form>
+	</div>
+
+	<script src="./js/App.js"></script>
+</body>
+</html>
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		<p>Comfortaa is a rounded geometric sans-serif type design intended for large sizes. It is absolutely free, both for personal and commercial use.</p> <p>If you like it please <a href="http://aajohan.deviantart.com/art/Comfortaa-font-105395949"> visit my DeviantArt page</a> and fav it (but obviously only if you like it.) You are also more than welcome to comment about anything you want (I'm open to critique). I obviously would love to see how my font is being used, so feel free to comment with a link to your work, or send me a message.</p> <p>I hope you will enjoy using my font!</p>