From 9c367e7d35cc0b0c48f677268559d789f9e73af5 Mon Sep 17 00:00:00 2001
From: Alex Ling <hkalexling@gmail.com>
Date: Thu, 4 Jun 2020 05:36:39 +0000
Subject: [PATCH] Format HTML files with html-beautify

---
 src/views/admin.ecr            |   2 +-
 src/views/download-manager.ecr |  42 +++----
 src/views/download.ecr         | 130 ++++++++++-----------
 src/views/index.ecr            |  66 +++++------
 src/views/layout.ecr           | 134 ++++++++++-----------
 src/views/login.ecr            |  69 +++++------
 src/views/message.ecr          |   2 +-
 src/views/reader.ecr           | 114 +++++++++---------
 src/views/title.ecr            | 208 ++++++++++++++++-----------------
 src/views/user-edit.ecr        |  20 +---
 src/views/user.ecr             |  22 ++--
 11 files changed, 404 insertions(+), 405 deletions(-)

diff --git a/src/views/admin.ecr b/src/views/admin.ecr
index 59c6c7a..9700fe8 100644
--- a/src/views/admin.ecr
+++ b/src/views/admin.ecr
@@ -15,4 +15,4 @@
 
 <% content_for "script" do %>
 <script src="<%= base_url %>js/admin.js"></script>
-<% end %>
+<% end %>
\ No newline at end of file
diff --git a/src/views/download-manager.ecr b/src/views/download-manager.ecr
index 0786ec7..e188438 100644
--- a/src/views/download-manager.ecr
+++ b/src/views/download-manager.ecr
@@ -1,32 +1,32 @@
 <div class="uk-margin">
-	<div id="actions" class="uk-margin">
-		<button class="uk-button uk-button-default" onclick="remove()">Delete Completed Tasks</button>
-		<button class="uk-button uk-button-default" onclick="refresh()">Retry Failed Tasks</button>
-		<button class="uk-button uk-button-default" onclick="load()">Refresh Queue</button>
-		<button class="uk-button uk-button-default" onclick="toggle()" id="pause-resume-btn" hidden></button>
-	</div>
-	<div id="config" class="uk-margin">
-		<label><input id="auto-refresh" class="uk-checkbox" type="checkbox" checked> Auto Refresh</label>
-	</div>
+  <div id="actions" class="uk-margin">
+    <button class="uk-button uk-button-default" onclick="remove()">Delete Completed Tasks</button>
+    <button class="uk-button uk-button-default" onclick="refresh()">Retry Failed Tasks</button>
+    <button class="uk-button uk-button-default" onclick="load()">Refresh Queue</button>
+    <button class="uk-button uk-button-default" onclick="toggle()" id="pause-resume-btn" hidden></button>
+  </div>
+  <div id="config" class="uk-margin">
+    <label><input id="auto-refresh" class="uk-checkbox" type="checkbox" checked> Auto Refresh</label>
+  </div>
 </div>
 <table class="uk-table uk-table-striped uk-overflow-auto">
-    <thead>
-        <tr>
-			<th>Chapter</th>
-			<th>Manga</th>
-			<th>Progress</th>
-			<th>Time</th>
-			<th>Status</th>
-			<th>Actions</th>
-        </tr>
-    </thead>
+  <thead>
+    <tr>
+      <th>Chapter</th>
+      <th>Manga</th>
+      <th>Progress</th>
+      <th>Time</th>
+      <th>Status</th>
+      <th>Actions</th>
+    </tr>
+  </thead>
 </table>
 
 <% content_for "script" do %>
 <script>
-	var baseURL = "<%= mangadex_base_url %>".replace(/\/$/, "");
+  var baseURL = "<%= mangadex_base_url %>".replace(/\/$/, "");
 </script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>
 <script src="<%= base_url %>js/alert.js"></script>
 <script src="<%= base_url %>js/download-manager.js"></script>
-<% end %>
+<% end %>
\ No newline at end of file
diff --git a/src/views/download.ecr b/src/views/download.ecr
index 71f750e..d11c864 100644
--- a/src/views/download.ecr
+++ b/src/views/download.ecr
@@ -1,83 +1,83 @@
 <h2 class=uk-title>Download from MangaDex</h2>
 <div class="uk-grid-small" uk-grid>
-	<div class="uk-width-3-4">
-		<input id="search-input" class="uk-input" type="text" placeholder="MangaDex manga ID or URL">
-	</div>
-	<div class="uk-width-1-4">
-		<div id="spinner" uk-spinner class="uk-align-center" hidden></div>
-		<button id="search-btn" class="uk-button uk-button-default" onclick="search()">Search</button>
-	</div>
+  <div class="uk-width-3-4">
+    <input id="search-input" class="uk-input" type="text" placeholder="MangaDex manga ID or URL">
+  </div>
+  <div class="uk-width-1-4">
+    <div id="spinner" uk-spinner class="uk-align-center" hidden></div>
+    <button id="search-btn" class="uk-button uk-button-default" onclick="search()">Search</button>
+  </div>
 </div>
 <div class"uk-grid-small" uk-grid hidden id="manga-details">
-	<div class="uk-width-1-4@s">
-		<img id="cover">
-	</div>
-	<div class="uk-width-1-4@s">
-		<p id="title"></p>
-		<p id="artist"></p>
-		<p id="author"></p>
-	</div>
-	<div id="filter-form" class="uk-form-stacked uk-width-1-2@s" hidden>
-		<p class="uk-text-lead uk-margin-remove-bottom">Filter Chapters</p>
-		<p class="uk-text-meta uk-margin-remove-top" id="count-text"></p>
-			<div class="uk-margin">
-				<label class="uk-form-label" for="lang-select">Language</label>
-				<div class="uk-form-controls">
-					<select class="uk-select filter-field" id="lang-select">
-					</select>
-				</div>
-			</div>
-			<div class="uk-margin">
-				<label class="uk-form-label" for="group-select">Group</label>
-				<div class="uk-form-controls">
-					<select class="uk-select filter-field" id="group-select">
-					</select>
-				</div>
-			</div>
-			<div class="uk-margin">
-				<label class="uk-form-label" for="volume-range">Volume</label>
-				<div class="uk-form-controls">
-					<input class="uk-input filter-field" type="text" id="volume-range" placeholder="e.g., 127, 10-14, >30, <=212, or leave it empty.">
-				</div>
-			</div>
-			<div class="uk-margin">
-				<label class="uk-form-label" for="chapter-range">Chapter</label>
-				<div class="uk-form-controls">
-					<input class="uk-input filter-field" type="text" id="chapter-range" placeholder="e.g., 127, 10-14, >30, <=212, or leave it empty.">
-				</div>
-			</div>
-	</div>
+  <div class="uk-width-1-4@s">
+    <img id="cover">
+  </div>
+  <div class="uk-width-1-4@s">
+    <p id="title"></p>
+    <p id="artist"></p>
+    <p id="author"></p>
+  </div>
+  <div id="filter-form" class="uk-form-stacked uk-width-1-2@s" hidden>
+    <p class="uk-text-lead uk-margin-remove-bottom">Filter Chapters</p>
+    <p class="uk-text-meta uk-margin-remove-top" id="count-text"></p>
+    <div class="uk-margin">
+      <label class="uk-form-label" for="lang-select">Language</label>
+      <div class="uk-form-controls">
+        <select class="uk-select filter-field" id="lang-select">
+        </select>
+      </div>
+    </div>
+    <div class="uk-margin">
+      <label class="uk-form-label" for="group-select">Group</label>
+      <div class="uk-form-controls">
+        <select class="uk-select filter-field" id="group-select">
+        </select>
+      </div>
+    </div>
+    <div class="uk-margin">
+      <label class="uk-form-label" for="volume-range">Volume</label>
+      <div class="uk-form-controls">
+        <input class="uk-input filter-field" type="text" id="volume-range" placeholder="e.g., 127, 10-14, >30, <=212, or leave it empty.">
+      </div>
+    </div>
+    <div class="uk-margin">
+      <label class="uk-form-label" for="chapter-range">Chapter</label>
+      <div class="uk-form-controls">
+        <input class="uk-input filter-field" type="text" id="chapter-range" placeholder="e.g., 127, 10-14, >30, <=212, or leave it empty.">
+      </div>
+    </div>
+  </div>
 </div>
 <div id="selection-controls" class="uk-margin" hidden>
-	<div class="uk-margin">
-		<button class="uk-button uk-button-default" onclick="selectAll()">Select All</button>
-		<button class="uk-button uk-button-default" onclick="unselect()">Clear Selections</button>
-		<button class="uk-button uk-button-primary" id="download-btn" onclick="download()">Download Selected</button>
-		<div id="download-spinner" uk-spinner class="uk-margin-left" hidden></div>
-	</div>
-	<p class="uk-text-meta">Click on a table row to select the chapter. Drag your mouse over multiple rows to select them all. Hold Ctrl to make multiple non-adjacent selections.</p>
+  <div class="uk-margin">
+    <button class="uk-button uk-button-default" onclick="selectAll()">Select All</button>
+    <button class="uk-button uk-button-default" onclick="unselect()">Clear Selections</button>
+    <button class="uk-button uk-button-primary" id="download-btn" onclick="download()">Download Selected</button>
+    <div id="download-spinner" uk-spinner class="uk-margin-left" hidden></div>
+  </div>
+  <p class="uk-text-meta">Click on a table row to select the chapter. Drag your mouse over multiple rows to select them all. Hold Ctrl to make multiple non-adjacent selections.</p>
 </div>
 <p id="filter-notification" hidden></p>
 <table class="uk-table uk-table-striped uk-overflow-auto" hidden>
-    <thead>
-        <tr>
-            <th>ID</th>
-            <th>Title</th>
-            <th>Language</th>
-			<th>Group</th>
-			<th>Volume</th>
-			<th>Chapter</th>
-			<th>Timestamp</th>
-        </tr>
-    </thead>
+  <thead>
+    <tr>
+      <th>ID</th>
+      <th>Title</th>
+      <th>Language</th>
+      <th>Group</th>
+      <th>Volume</th>
+      <th>Chapter</th>
+      <th>Timestamp</th>
+    </tr>
+  </thead>
 </table>
 
 <% content_for "script" do %>
 <script>
-	var baseURL = "<%= mangadex_base_url %>".replace(/\/$/, "");
+  var baseURL = "<%= mangadex_base_url %>".replace(/\/$/, "");
 </script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
 <script src="<%= base_url %>js/alert.js"></script>
 <script src="<%= base_url %>js/download.js"></script>
-<% end %>
+<% end %>
\ No newline at end of file
diff --git a/src/views/index.ecr b/src/views/index.ecr
index 8072968..51c9b55 100644
--- a/src/views/index.ecr
+++ b/src/views/index.ecr
@@ -1,43 +1,43 @@
 <h2 class=uk-title>Library</h2>
 <p class="uk-text-meta"><%= titles.size %> titles found</p>
 <div class="uk-grid-small" uk-grid>
-	<div class="uk-margin-bottom uk-width-3-4@s">
-		<form class="uk-search uk-search-default">
-			<span uk-search-icon></span>
-			<input class="uk-search-input" type="search" placeholder="Search">
-		</form>
-	</div>
-	<div class="uk-margin-bottom uk-width-1-4@s">
-		<div class="uk-form-horizontal">
-			<select class="uk-select" id="sort-select">
-				<option id="name-up">▲ Name</option>
-				<option id="name-down">▼ Name</option>
-				<option id="date-up">▲ Date Modified</option>
-				<option id="date-down">▼ Date Modified</option>
-				<option id="progress-up">▲ Progress</option>
-				<option id="progress-down">▼ Progress</option>
-			</select>
-		</div>
-	</div>
+  <div class="uk-margin-bottom uk-width-3-4@s">
+    <form class="uk-search uk-search-default">
+      <span uk-search-icon></span>
+      <input class="uk-search-input" type="search" placeholder="Search">
+    </form>
+  </div>
+  <div class="uk-margin-bottom uk-width-1-4@s">
+    <div class="uk-form-horizontal">
+      <select class="uk-select" id="sort-select">
+        <option id="name-up">▲ Name</option>
+        <option id="name-down">▼ Name</option>
+        <option id="date-up">▲ Date Modified</option>
+        <option id="date-down">▼ Date Modified</option>
+        <option id="progress-up">▲ Progress</option>
+        <option id="progress-down">▼ Progress</option>
+      </select>
+    </div>
+  </div>
 </div>
 <div id="item-container" class="uk-child-width-1-4@m uk-child-width-1-2" uk-grid>
   <%- titles.each_with_index do |t, i| -%>
   <div class="item" data-mtime="<%= t.mtime.to_unix %>" data-progress="<%= percentage[i] %>">
-	  <a class="acard" href="<%= base_url %>book/<%= t.id %>">
-        <div class="uk-card uk-card-default">
-            <div class="uk-card-media-top">
-              <img data-src="<%= t.cover_url %>" data-width data-height alt="" uk-img>
-            </div>
-            <div class="uk-card-body">
-			<%- if t.entries.size > 0 -%>
-              <div class="uk-card-badge uk-label"><%= (percentage[i] * 100).round(1) %>%</div>
-			<%- end -%>
-			<h3 class="uk-card-title break-word" data-title="<%= t.display_name.gsub("\"", "&quot;") %>"><%= t.display_name %></h3>
-              <p><%= t.size %> entries</p>
-            </div>
+    <a class="acard" href="<%= base_url %>book/<%= t.id %>">
+      <div class="uk-card uk-card-default">
+        <div class="uk-card-media-top">
+          <img data-src="<%= t.cover_url %>" data-width data-height alt="" uk-img>
         </div>
-      </a>
-    </div>
+        <div class="uk-card-body">
+          <%- if t.entries.size > 0 -%>
+          <div class="uk-card-badge uk-label"><%= (percentage[i] * 100).round(1) %>%</div>
+          <%- end -%>
+          <h3 class="uk-card-title break-word" data-title="<%= t.display_name.gsub("\"", "&quot;") %>"><%= t.display_name %></h3>
+          <p><%= t.size %> entries</p>
+        </div>
+      </div>
+    </a>
+  </div>
   <%- end -%>
 </div>
 
@@ -46,4 +46,4 @@
 <script src="<%= base_url %>js/dots.js"></script>
 <script src="<%= base_url %>js/search.js"></script>
 <script src="<%= base_url %>js/sort-items.js"></script>
-<% end %>
+<% end %>
\ No newline at end of file
diff --git a/src/views/layout.ecr b/src/views/layout.ecr
index 5e5ed23..f0030ba 100644
--- a/src/views/layout.ecr
+++ b/src/views/layout.ecr
@@ -1,76 +1,78 @@
 <!DOCTYPE html>
 <html>
-  <head>
-    <meta charset="utf-8">
-    <meta name="X-UA-Compatible" content="IE=edge">
-    <title>Mango</title>
-    <meta name="description" content="Mango Manga Server">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/css/uikit.min.css" />
-	<link rel="stylesheet" href="<%= base_url %>css/mango.css" />
-	<script defer src="<%= base_url %>js/fontawesome.min.js"></script>
-	<script defer src="<%= base_url %>js/solid.min.js"></script>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
-	<script src="<%= base_url %>js/theme.js"></script>
-  </head>
 
-  <body>
-    <div class="uk-offcanvas-content">
-      <div class="uk-navbar-container uk-navbar-transparent" uk-navbar="uk-navbar">
-        <div id="mobile-nav" uk-offcanvas="overlay: true">
-          <div class="uk-offcanvas-bar uk-flex uk-flex-column">
-            <ul class="uk-nav uk-nav-primary uk-nav-center uk-margin-auto-vertical">
-				<li><a href="<%= base_url %>">Home</a></li>
-			  <% if is_admin %>
-			  <li><a href="<%= base_url %>admin">Admin</a></li>
-			  <li><a href="<%= base_url %>download">Download</a></li>
-			  <% end %>
-              <hr uk-divider>
-			  <li><a onclick="toggleTheme()"><i class="fas fa-adjust"></i></a></li>
-			  <li><a href="<%= base_url %>logout">Logout</a></li>
-            </ul>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div class="uk-position-top">
-      <div class="uk-navbar-container uk-navbar-transparent" uk-navbar="uk-navbar">
-        <div class="uk-navbar-left uk-hidden@s">
-          <div class="uk-navbar-toggle" uk-navbar-toggle-icon="uk-navbar-toggle-icon" uk-toggle="target: #mobile-nav"></div>
-        </div>
-        <div class="uk-navbar-left uk-visible@s">
-			<a class="uk-navbar-item uk-logo" href="<%= base_url %>"><img src="<%= base_url %>img/icon.png"></a>
-          <ul class="uk-navbar-nav">
-			  <li><a href="<%= base_url %>">Home</a></li>
-			<% if is_admin %>
-			<li><a href="<%= base_url %>admin">Admin</a></li>
-			<li><a href="<%= base_url %>download">Download</a></li>
-			<% end %>
-          </ul>
-        </div>
-        <div class="uk-navbar-right uk-visible@s">
-          <ul class="uk-navbar-nav">
-			  <li><a onclick="toggleTheme()"><i class="fas fa-adjust"></i></a></li>
-			  <li><a href="<%= base_url %>logout">Logout</a></li>
+<head>
+  <meta charset="utf-8">
+  <meta name="X-UA-Compatible" content="IE=edge">
+  <title>Mango</title>
+  <meta name="description" content="Mango Manga Server">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/css/uikit.min.css" />
+  <link rel="stylesheet" href="<%= base_url %>css/mango.css" />
+  <script defer src="<%= base_url %>js/fontawesome.min.js"></script>
+  <script defer src="<%= base_url %>js/solid.min.js"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
+  <script src="<%= base_url %>js/theme.js"></script>
+</head>
+
+<body>
+  <div class="uk-offcanvas-content">
+    <div class="uk-navbar-container uk-navbar-transparent" uk-navbar="uk-navbar">
+      <div id="mobile-nav" uk-offcanvas="overlay: true">
+        <div class="uk-offcanvas-bar uk-flex uk-flex-column">
+          <ul class="uk-nav uk-nav-primary uk-nav-center uk-margin-auto-vertical">
+            <li><a href="<%= base_url %>">Home</a></li>
+            <% if is_admin %>
+            <li><a href="<%= base_url %>admin">Admin</a></li>
+            <li><a href="<%= base_url %>download">Download</a></li>
+            <% end %>
+            <hr uk-divider>
+            <li><a onclick="toggleTheme()"><i class="fas fa-adjust"></i></a></li>
+            <li><a href="<%= base_url %>logout">Logout</a></li>
           </ul>
         </div>
       </div>
     </div>
-    <div class="uk-section uk-section-small">
-    </div>
-    <div class="uk-section uk-section-small">
-      <div class="uk-container uk-container-small">
-		  <div id="alert"></div>
-        <%= content %>
+  </div>
+  <div class="uk-position-top">
+    <div class="uk-navbar-container uk-navbar-transparent" uk-navbar="uk-navbar">
+      <div class="uk-navbar-left uk-hidden@s">
+        <div class="uk-navbar-toggle" uk-navbar-toggle-icon="uk-navbar-toggle-icon" uk-toggle="target: #mobile-nav"></div>
+      </div>
+      <div class="uk-navbar-left uk-visible@s">
+        <a class="uk-navbar-item uk-logo" href="<%= base_url %>"><img src="<%= base_url %>img/icon.png"></a>
+        <ul class="uk-navbar-nav">
+          <li><a href="<%= base_url %>">Home</a></li>
+          <% if is_admin %>
+          <li><a href="<%= base_url %>admin">Admin</a></li>
+          <li><a href="<%= base_url %>download">Download</a></li>
+          <% end %>
+        </ul>
+      </div>
+      <div class="uk-navbar-right uk-visible@s">
+        <ul class="uk-navbar-nav">
+          <li><a onclick="toggleTheme()"><i class="fas fa-adjust"></i></a></li>
+          <li><a href="<%= base_url %>logout">Logout</a></li>
+        </ul>
       </div>
     </div>
-	<script>
-		setTheme(getTheme());
-		const base_url = "<%= base_url %>";
-	</script>
-    <script src="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/js/uikit.min.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/js/uikit-icons.min.js"></script>
+  </div>
+  <div class="uk-section uk-section-small">
+  </div>
+  <div class="uk-section uk-section-small">
+    <div class="uk-container uk-container-small">
+      <div id="alert"></div>
+      <%= content %>
+    </div>
+  </div>
+  <script>
+    setTheme(getTheme());
+    const base_url = "<%= base_url %>";
+  </script>
+  <script src="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/js/uikit.min.js"></script>
+  <script src="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/js/uikit-icons.min.js"></script>
 
-    <%= yield_content "script" %>
-  </body>
-</html>
+  <%= yield_content "script" %>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/src/views/login.ecr b/src/views/login.ecr
index 0d07a79..b4ef4a9 100644
--- a/src/views/login.ecr
+++ b/src/views/login.ecr
@@ -1,43 +1,46 @@
 <!DOCTYPE html>
 <html>
+
 <head>
-    <meta charset="utf-8">
-    <meta name="X-UA-Compatible" content="IE=edge">
-    <title>Mango</title>
-    <meta name="description" content="Mango Manga Server">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/css/uikit.min.css" />
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
-	<script src="<%= base_url %>js/theme.js"></script>
+  <meta charset="utf-8">
+  <meta name="X-UA-Compatible" content="IE=edge">
+  <title>Mango</title>
+  <meta name="description" content="Mango Manga Server">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/css/uikit.min.css" />
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
+  <script src="<%= base_url %>js/theme.js"></script>
 </head>
+
 <body>
-    <div class="uk-section uk-flex uk-flex-middle uk-animation-fade" uk-height-viewport="">
-        <div class="uk-width-1-1">
-            <div class="uk-container">
-                <div class="uk-grid-margin uk-grid uk-grid-stack" uk-grid="">
-                    <div class="uk-width-1-1@m">
-                        <div class="uk-margin uk-width-large uk-margin-auto uk-card uk-card-default uk-card-body uk-box-shadow-large">
-                            <h3 class="uk-card-title uk-text-center">Log In</h3>
-                            <form action="<%= base_url %>login" method="post">
-                                <div class="uk-margin">
-                                    <div class="uk-inline uk-width-1-1"><span class="uk-form-icon" uk-icon="icon:user"></span><input class="uk-input uk-form-large" type="text" name="username"></div>
-                                </div>
-                                <div class="uk-margin">
-                                    <div class="uk-inline uk-width-1-1"><span class="uk-form-icon" uk-icon="icon:lock"></span><input class="uk-input uk-form-large" type="password" name="password"></div>
-                                </div>
-                                <div class="uk-margin"><button class="uk-button uk-button-primary uk-button-large uk-width-1-1">Login</button></div>
-                            </form>
-                        </div>
-                    </div>
+  <div class="uk-section uk-flex uk-flex-middle uk-animation-fade" uk-height-viewport="">
+    <div class="uk-width-1-1">
+      <div class="uk-container">
+        <div class="uk-grid-margin uk-grid uk-grid-stack" uk-grid="">
+          <div class="uk-width-1-1@m">
+            <div class="uk-margin uk-width-large uk-margin-auto uk-card uk-card-default uk-card-body uk-box-shadow-large">
+              <h3 class="uk-card-title uk-text-center">Log In</h3>
+              <form action="<%= base_url %>login" method="post">
+                <div class="uk-margin">
+                  <div class="uk-inline uk-width-1-1"><span class="uk-form-icon" uk-icon="icon:user"></span><input class="uk-input uk-form-large" type="text" name="username"></div>
                 </div>
+                <div class="uk-margin">
+                  <div class="uk-inline uk-width-1-1"><span class="uk-form-icon" uk-icon="icon:lock"></span><input class="uk-input uk-form-large" type="password" name="password"></div>
+                </div>
+                <div class="uk-margin"><button class="uk-button uk-button-primary uk-button-large uk-width-1-1">Login</button></div>
+              </form>
             </div>
+          </div>
         </div>
+      </div>
     </div>
-	<script>
-		setTheme(getTheme());
-	</script>
-    <script src="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/js/uikit.min.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/js/uikit-icons.min.js"></script>
+  </div>
+  <script>
+    setTheme(getTheme());
+  </script>
+  <script src="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/js/uikit.min.js"></script>
+  <script src="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/js/uikit-icons.min.js"></script>
 </body>
-</html>
+
+</html>
\ No newline at end of file
diff --git a/src/views/message.ecr b/src/views/message.ecr
index 1a5b8d8..7546751 100644
--- a/src/views/message.ecr
+++ b/src/views/message.ecr
@@ -1 +1 @@
-<p class="uk-text-lead uk-text-center"><%= message %></p>
+<p class="uk-text-lead uk-text-center"><%= message %></p>
\ No newline at end of file
diff --git a/src/views/reader.ecr b/src/views/reader.ecr
index b24b153..f402b39 100644
--- a/src/views/reader.ecr
+++ b/src/views/reader.ecr
@@ -1,68 +1,70 @@
 <!DOCTYPE html>
 <html class="reader-bg">
-  <head>
-    <meta charset="utf-8">
-    <meta name="X-UA-Compatible" content="IE=edge">
-    <title>Mango</title>
-    <meta name="description" content="Mango Manga Server">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/css/uikit.min.css" />
-	<link rel="stylesheet" href="<%= base_url %>css/mango.css" />
-  </head>
 
-  <body>
-	  <script src="<%= base_url %>js/theme.js"></script>
-    <div class="uk-section uk-section-default uk-section-small reader-bg">
-      <div class="uk-container uk-container-small">
-          <%- urls.each_with_index do |url, i| -%>
-          <img class="uk-align-center" data-src="<%= url %>" data-width data-height uk-img id="<%= reader_urls[i] %>" onclick="showControl(<%= pages.to_a[i] %>);">
-          <%- end -%>
-          <%- if next_url -%>
-          <a class="next-url" href="<%= next_url %>"></a>
-          <%- end -%>
-      </div>
-      <%- if next_entry_url -%>
-      <button id="next-btn" class="uk-align-center uk-button uk-button-primary" hidden onclick="redirect('<%= next_entry_url %>')">Next Entry</button>
-      <%- else -%>
-      <button id="next-btn" class="uk-align-center uk-button uk-button-primary" hidden onclick="redirect('<%= exit_url %>')">Exit Reader</button>
+<head>
+  <meta charset="utf-8">
+  <meta name="X-UA-Compatible" content="IE=edge">
+  <title>Mango</title>
+  <meta name="description" content="Mango Manga Server">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/css/uikit.min.css" />
+  <link rel="stylesheet" href="<%= base_url %>css/mango.css" />
+</head>
+
+<body>
+  <script src="<%= base_url %>js/theme.js"></script>
+  <div class="uk-section uk-section-default uk-section-small reader-bg">
+    <div class="uk-container uk-container-small">
+      <%- urls.each_with_index do |url, i| -%>
+      <img class="uk-align-center" data-src="<%= url %>" data-width data-height uk-img id="<%= reader_urls[i] %>" onclick="showControl(<%= pages.to_a[i] %>);">
+      <%- end -%>
+      <%- if next_url -%>
+      <a class="next-url" href="<%= next_url %>"></a>
       <%- end -%>
     </div>
+    <%- if next_entry_url -%>
+    <button id="next-btn" class="uk-align-center uk-button uk-button-primary" hidden onclick="redirect('<%= next_entry_url %>')">Next Entry</button>
+    <%- else -%>
+    <button id="next-btn" class="uk-align-center uk-button uk-button-primary" hidden onclick="redirect('<%= exit_url %>')">Exit Reader</button>
+    <%- end -%>
+  </div>
 
-    <div id="hidden" hidden></div>
+  <div id="hidden" hidden></div>
 
-    <div id="modal-sections" class="uk-flex-top" uk-modal>
-      <div class="uk-modal-dialog uk-margin-auto-vertical">
-        <button class="uk-modal-close-default" type="button" uk-close></button>
-        <div class="uk-modal-header">
-          <h3 class="uk-modal-title">Options</h3>
+  <div id="modal-sections" class="uk-flex-top" uk-modal>
+    <div class="uk-modal-dialog uk-margin-auto-vertical">
+      <button class="uk-modal-close-default" type="button" uk-close></button>
+      <div class="uk-modal-header">
+        <h3 class="uk-modal-title">Options</h3>
+      </div>
+      <div class="uk-modal-body">
+        <div class="uk-margin">
+          <p id="progress-label"></p>
         </div>
-        <div class="uk-modal-body">
-			<div class="uk-margin">
-				<p id="progress-label"></p>
-			</div>
-          <div class="uk-margin">
-            <label class="uk-form-label" for="form-stacked-select">Jump to page</label>
-            <div class="uk-form-controls">
-              <select id="page-select" class="uk-select">
-                <%- (1..entry.pages).each do |p| -%>
-                <option value="<%= p %>"><%= p %></option>
-                <%- end -%>
-              </select>
-            </div>
+        <div class="uk-margin">
+          <label class="uk-form-label" for="form-stacked-select">Jump to page</label>
+          <div class="uk-form-controls">
+            <select id="page-select" class="uk-select">
+              <%- (1..entry.pages).each do |p| -%>
+              <option value="<%= p %>"><%= p %></option>
+              <%- end -%>
+            </select>
           </div>
         </div>
-        <div class="uk-modal-footer uk-text-right">
-          <button class="uk-button uk-button-danger" type="button" onclick="redirect('<%= exit_url %>')">Exit Reader</button>
-        </div>
+      </div>
+      <div class="uk-modal-footer uk-text-right">
+        <button class="uk-button uk-button-danger" type="button" onclick="redirect('<%= exit_url %>')">Exit Reader</button>
       </div>
     </div>
-	<script>
-		const base_url = "<%= base_url %>"
-	</script>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/js/uikit.min.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/js/uikit-icons.min.js"></script>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.7/ScrollMagic.min.js"></script>
-    <script src="<%= base_url %>js/reader.js"></script>
-  </body>
-</html>
+  </div>
+  <script>
+    const base_url = "<%= base_url %>"
+  </script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
+  <script src="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/js/uikit.min.js"></script>
+  <script src="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/js/uikit-icons.min.js"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.7/ScrollMagic.min.js"></script>
+  <script src="<%= base_url %>js/reader.js"></script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/src/views/title.ecr b/src/views/title.ecr
index a4d4401..0a26823 100644
--- a/src/views/title.ecr
+++ b/src/views/title.ecr
@@ -1,72 +1,72 @@
 <div>
-	<h2 class=uk-title><span><%= title.display_name %></span>
-		&nbsp;
-		<% if is_admin %>
-			<a onclick="edit()" class="uk-icon-button" uk-icon="icon:pencil"></a>
-		<% end %>
-	</h2>
+  <h2 class=uk-title><span><%= title.display_name %></span>
+    &nbsp;
+    <% if is_admin %>
+    <a onclick="edit()" class="uk-icon-button" uk-icon="icon:pencil"></a>
+    <% end %>
+  </h2>
 </div>
 <ul class="uk-breadcrumb">
-	<li><a href="<%= base_url %>">Library</a></li>
-	<%- title.parents.each do |t| -%>
-	<li><a href="<%= base_url %>book/<%= t.id %>"><%= t.display_name %></a></li>
-	<%- end -%>
-	<li class="uk-disabled"><a><%= title.display_name %></a></li>
+  <li><a href="<%= base_url %>">Library</a></li>
+  <%- title.parents.each do |t| -%>
+  <li><a href="<%= base_url %>book/<%= t.id %>"><%= t.display_name %></a></li>
+  <%- end -%>
+  <li class="uk-disabled"><a><%= title.display_name %></a></li>
 </ul>
 <p class="uk-text-meta"><%= title.size %> entries found</p>
 <div class="uk-grid-small" uk-grid>
-	<div class="uk-margin-bottom uk-width-3-4@s">
-		<form class="uk-search uk-search-default">
-			<span uk-search-icon></span>
-			<input class="uk-search-input" type="search" placeholder="Search">
-		</form>
-	</div>
-	<div class="uk-margin-bottom uk-width-1-4@s">
-		<div class="uk-form-horizontal">
-			<select class="uk-select" id="sort-select">
-				<option id="auto-up">▲ Auto</option>
-				<option id="auto-down">▼ Auto</option>
-				<option id="name-up">▲ Name</option>
-				<option id="name-down">▼ Name</option>
-				<option id="date-up">▲ Date Modified</option>
-				<option id="date-down">▼ Date Modified</option>
-				<option id="progress-up">▲ Progress</option>
-				<option id="progress-down">▼ Progress</option>
-			</select>
-		</div>
-	</div>
+  <div class="uk-margin-bottom uk-width-3-4@s">
+    <form class="uk-search uk-search-default">
+      <span uk-search-icon></span>
+      <input class="uk-search-input" type="search" placeholder="Search">
+    </form>
+  </div>
+  <div class="uk-margin-bottom uk-width-1-4@s">
+    <div class="uk-form-horizontal">
+      <select class="uk-select" id="sort-select">
+        <option id="auto-up">▲ Auto</option>
+        <option id="auto-down">▼ Auto</option>
+        <option id="name-up">▲ Name</option>
+        <option id="name-down">▼ Name</option>
+        <option id="date-up">▲ Date Modified</option>
+        <option id="date-down">▼ Date Modified</option>
+        <option id="progress-up">▲ Progress</option>
+        <option id="progress-down">▼ Progress</option>
+      </select>
+    </div>
+  </div>
 </div>
 <div id="item-container" class="uk-child-width-1-4@m uk-child-width-1-2" uk-grid>
-	<%- title.titles.each_with_index do |t, i| -%>
-	<div class="item" data-mtime="<%= t.mtime.to_unix %>" data-progress="0.0">
-		<a class="acard" href="<%= base_url %>book/<%= t.id %>">
-        <div class="uk-card uk-card-default">
-            <div class="uk-card-media-top">
-              <img data-src="<%= t.cover_url %>" data-width data-height alt="" uk-img>
-            </div>
-            <div class="uk-card-body">
-			<h3 class="uk-card-title break-word" data-title="<%= t.display_name.gsub("\"", "&quot;") %>"><%= t.display_name %></h3>
-              <p><%= t.size %> entries</p>
-            </div>
+  <%- title.titles.each_with_index do |t, i| -%>
+  <div class="item" data-mtime="<%= t.mtime.to_unix %>" data-progress="0.0">
+    <a class="acard" href="<%= base_url %>book/<%= t.id %>">
+      <div class="uk-card uk-card-default">
+        <div class="uk-card-media-top">
+          <img data-src="<%= t.cover_url %>" data-width data-height alt="" uk-img>
         </div>
-      </a>
-	</div>
-	<%- end -%>
+        <div class="uk-card-body">
+          <h3 class="uk-card-title break-word" data-title="<%= t.display_name.gsub("\"", "&quot;") %>"><%= t.display_name %></h3>
+          <p><%= t.size %> entries</p>
+        </div>
+      </div>
+    </a>
+  </div>
+  <%- end -%>
   <%- title.entries.each_with_index do |e, i| -%>
   <div class="item" data-mtime="<%= e.mtime.to_unix %>" data-progress="<%= percentage[i] %>" id="<%= e.id %>">
-      <a class="acard">
-		  <div class="uk-card uk-card-default" onclick="showModal(&quot;<%= e.encoded_path %>&quot;, '<%= e.pages %>', <%= (percentage[i] * 100).round(1) %>, &quot;<%= title.encoded_display_name %>&quot;, &quot;<%= e.encoded_display_name %>&quot;, '<%= e.title_id %>', '<%= e.id %>')">
-          <div class="uk-card-media-top">
-            <img data-src="<%= e.cover_url %>" alt="" data-width data-height uk-img>
-          </div>
-          <div class="uk-card-body">
-            <div class="uk-card-badge uk-label"><%= (percentage[i] * 100).round(1) %>%</div>
-			<h3 class="uk-card-title break-word" data-title="<%= e.display_name.gsub("\"", "&quot;") %>"><%= e.display_name %></h3>
-              <p><%= e.pages %> pages</p>
-          </div>
+    <a class="acard">
+      <div class="uk-card uk-card-default" onclick="showModal(&quot;<%= e.encoded_path %>&quot;, '<%= e.pages %>', <%= (percentage[i] * 100).round(1) %>, &quot;<%= title.encoded_display_name %>&quot;, &quot;<%= e.encoded_display_name %>&quot;, '<%= e.title_id %>', '<%= e.id %>')">
+        <div class="uk-card-media-top">
+          <img data-src="<%= e.cover_url %>" alt="" data-width data-height uk-img>
+        </div>
+        <div class="uk-card-body">
+          <div class="uk-card-badge uk-label"><%= (percentage[i] * 100).round(1) %>%</div>
+          <h3 class="uk-card-title break-word" data-title="<%= e.display_name.gsub("\"", "&quot;") %>"><%= e.display_name %></h3>
+          <p><%= e.pages %> pages</p>
+        </div>
       </div>
-      </a>
-    </div>
+    </a>
+  </div>
   <%- end -%>
 </div>
 
@@ -74,14 +74,14 @@
   <div class="uk-modal-dialog uk-margin-auto-vertical">
     <button class="uk-modal-close-default" type="button" uk-close></button>
     <div class="uk-modal-header">
-	<div>
-		<h3 class="uk-modal-title break-word" id="modal-title"><span></span>
-			&nbsp;
-			<% if is_admin %>
-				<a class="uk-icon-button" uk-icon="icon:pencil"></a>
-			<% end %>
-		</h3>
-	</div>
+      <div>
+        <h3 class="uk-modal-title break-word" id="modal-title"><span></span>
+          &nbsp;
+          <% if is_admin %>
+          <a class="uk-icon-button" uk-icon="icon:pencil"></a>
+          <% end %>
+        </h3>
+      </div>
       <p class="uk-text-meta uk-margin-remove-bottom break-word" id="path-text"></p>
       <p class="uk-text-meta uk-margin-remove-top" id="pages-text"></p>
     </div>
@@ -104,47 +104,47 @@
   <div class="uk-modal-dialog uk-margin-auto-vertical">
     <button class="uk-modal-close-default" type="button" uk-close></button>
     <div class="uk-modal-header">
-	<div>
-		<h3 class="uk-modal-title break-word" id="modal-title">Edit</h3>
-	</div>
+      <div>
+        <h3 class="uk-modal-title break-word" id="modal-title">Edit</h3>
+      </div>
     </div>
     <div class="uk-modal-body">
-		<div class="uk-margin">
-			<label class="uk-form-label" for="display-name">Display Name</label>
-			<div class="uk-inline">
-				<a class="uk-form-icon uk-form-icon-flip" uk-icon="icon:check"></a>
-				<input class="uk-input" type="text" name="display-name" id="display-name-field">
-			</div>
-		</div>
-		<div class="uk-margin">
-			<label class="uk-form-label">Cover Image</label>
-			<div class="uk-grid">
-				<div class="uk-width-1-2@s">
-					<img id="cover" data-title-cover="<%= title.cover_url %>" alt="" data-width data-height uk-img>
-				</div>
-				<div class="uk-width-1-2@s">
-					<div id="cover-upload" class="upload-field uk-placeholder uk-text-center uk-flex uk-flex-middle" data-title-id="<%= title.id %>">
-						<div>
-							<span uk-icon="icon: cloud-upload"></span>
-							<span class="uk-text-middle">Upload a cover image by dropping it here or</span>
-							<div uk-form-custom>
-								<input type="file" accept="image/jpeg, image/png">
-								<span class="uk-link">selecting one</span>
-							</div>
-						</div>
-					</div>
+      <div class="uk-margin">
+        <label class="uk-form-label" for="display-name">Display Name</label>
+        <div class="uk-inline">
+          <a class="uk-form-icon uk-form-icon-flip" uk-icon="icon:check"></a>
+          <input class="uk-input" type="text" name="display-name" id="display-name-field">
+        </div>
+      </div>
+      <div class="uk-margin">
+        <label class="uk-form-label">Cover Image</label>
+        <div class="uk-grid">
+          <div class="uk-width-1-2@s">
+            <img id="cover" data-title-cover="<%= title.cover_url %>" alt="" data-width data-height uk-img>
+          </div>
+          <div class="uk-width-1-2@s">
+            <div id="cover-upload" class="upload-field uk-placeholder uk-text-center uk-flex uk-flex-middle" data-title-id="<%= title.id %>">
+              <div>
+                <span uk-icon="icon: cloud-upload"></span>
+                <span class="uk-text-middle">Upload a cover image by dropping it here or</span>
+                <div uk-form-custom>
+                  <input type="file" accept="image/jpeg, image/png">
+                  <span class="uk-link">selecting one</span>
+                </div>
+              </div>
+            </div>
 
-				</div>
-			</div>
-			<progress id="upload-progress" class="uk-progress" value="0" max="100" hidden></progress>
-		</div>
-		<div id="title-progress-control" hidden>
-			<label class="uk-form-label">Progress</label>
-			<p class="uk-margin-remove-vertical">
-			<button id="read-btn" class="uk-button uk-button-default" onclick="updateProgress('<%= title.id %>', null, 1)">Mark all as read (100%)</button>
-			<button id="unread-btn" class="uk-button uk-button-default" onclick="updateProgress('<%= title.id %>', null, 0)">Mark all as unread (0%)</button>
-			</p>
-		</div>
+          </div>
+        </div>
+        <progress id="upload-progress" class="uk-progress" value="0" max="100" hidden></progress>
+      </div>
+      <div id="title-progress-control" hidden>
+        <label class="uk-form-label">Progress</label>
+        <p class="uk-margin-remove-vertical">
+          <button id="read-btn" class="uk-button uk-button-default" onclick="updateProgress('<%= title.id %>', null, 1)">Mark all as read (100%)</button>
+          <button id="unread-btn" class="uk-button uk-button-default" onclick="updateProgress('<%= title.id %>', null, 0)">Mark all as unread (0%)</button>
+        </p>
+      </div>
     </div>
   </div>
 </div>
@@ -156,4 +156,4 @@
 <script src="<%= base_url %>js/title.js"></script>
 <script src="<%= base_url %>js/search.js"></script>
 <script src="<%= base_url %>js/sort-items.js"></script>
-<% end %>
+<% end %>
\ No newline at end of file
diff --git a/src/views/user-edit.ecr b/src/views/user-edit.ecr
index 7598002..9b354d2 100644
--- a/src/views/user-edit.ecr
+++ b/src/views/user-edit.ecr
@@ -2,11 +2,7 @@
 
   <div class="uk-margin">
     <label class="uk-form-label" for="form-stacked-text">Username</label>
-    <input class="uk-input" type="text" name="username"
-      <%- if username -%>
-      value=<%= username %>
-      <%- end -%>
-    >
+    <input class="uk-input" type="text" name="username" <%- if username -%> value=<%= username %> <%- end -%>>
   </div>
   <%- if new_user -%>
   <div class="uk-margin">
@@ -16,11 +12,7 @@
   <%- end -%>
   <div class="uk-margin">
     <label class="uk-form-label" for="form-stacked-text">Admin Access</label>
-    <input class="uk-checkbox" type="checkbox" name="admin"
-    <%- if admin == true -%>
-      checked
-    <%- end -%>
-    >
+    <input class="uk-checkbox" type="checkbox" name="admin" <%- if admin == true -%> checked <%- end -%>>
   </div>
 
   <%- if !new_user -%>
@@ -43,12 +35,12 @@
   var username;
   var error;
   <%- if !new_user -%>
-    username = '/<%= username %>';
+  username = '/<%= username %>';
   <%- end -%>
-    <%- if error -%>
-    error = '<%= error %>';
+  <%- if error -%>
+  error = '<%= error %>';
   <%- end -%>
 </script>
 <script src="<%= base_url %>js/alert.js"></script>
 <script src="<%= base_url %>js/user-edit.js"></script>
-<% end %>
+<% end %>
\ No newline at end of file
diff --git a/src/views/user.ecr b/src/views/user.ecr
index 295db45..3887d2a 100644
--- a/src/views/user.ecr
+++ b/src/views/user.ecr
@@ -8,16 +8,16 @@
   </thead>
   <tbody>
     <%- users.each do |u| -%>
-	<tr>
-		<td><%= u[0] %></td>
-		<td><%= u[1] %></td>
-		<td>
-			<a href="<%= base_url %>admin/user/edit?username=<%= u[0] %>&admin=<%= u[1] %>" uk-icon="file-edit"></a>
-			<%- if u[0] != username %>
-			<a href="#" onclick="remove('<%= u[0] %>');return false;" uk-icon="trash"></a>
-			<%- end %>
-		</td>
-	</tr>
+    <tr>
+      <td><%= u[0] %></td>
+      <td><%= u[1] %></td>
+      <td>
+        <a href="<%= base_url %>admin/user/edit?username=<%= u[0] %>&admin=<%= u[1] %>" uk-icon="file-edit"></a>
+        <%- if u[0] != username %>
+        <a href="#" onclick="remove('<%= u[0] %>');return false;" uk-icon="trash"></a>
+        <%- end %>
+      </td>
+    </tr>
     <%- end -%>
   </tbody>
 </table>
@@ -28,4 +28,4 @@
 <% content_for "script" do %>
 <script src="<%= base_url %>js/alert.js"></script>
 <script src="<%= base_url %>js/user.js"></script>
-<% end %>
+<% end %>
\ No newline at end of file