From 21aadcad966ec4471cc570b2b3de495e42e7cbbc Mon Sep 17 00:00:00 2001
From: Captain ALM <captainalm@captainalm.com>
Date: Wed, 27 Jul 2022 11:53:55 +0100
Subject: [PATCH] .

---
 base.css                         | 16 ++++++++--------
 dark.css                         |  2 +-
 index.go.html                    |  3 +++
 light.css                        |  2 +-
 pageHandler/pages/index/entry.go |  4 ++++
 5 files changed, 17 insertions(+), 10 deletions(-)

diff --git a/base.css b/base.css
index 9627ba6..1df1e06 100644
--- a/base.css
+++ b/base.css
@@ -21,18 +21,18 @@ main{
     top: 0;
     width: 100%;
 }
-.home-button{
+.home-button, .sort-button{
     display: inline-block;
-    width: 76px;
+    width: 64px;
     height: 82px;
     overflow: hidden;
+    text-align: center;
 }
-.home-button > div{
+.home-button > div, .sort-button > div{
     display: inline;
     font-size: 60px;
-    padding: 12px 8px;
+    padding: 10px;
     vertical-align: middle;
-    text-align: center;
 }
 .nav{
     width: 100%;
@@ -40,7 +40,7 @@ main{
     overflow: hidden;
 	max-height: 0;
 }
-.nav-menu{
+.nav-menu, .sort-menu, .duration-hold{
 	display: none;
 }
 .menu a{
@@ -104,7 +104,7 @@ main{
     align-content: center;
     width: 100%;
 }
-.main-box > div{
+.main-box > div, footer > p{
     margin: 3px 0;
     padding: 2px;
     box-sizing: content-box;
@@ -166,7 +166,7 @@ main{
 	margin: 2px;
 }
 @media (min-width: 540px){
-    .main-box > div{
+    .main-box > div, footer > p{
         margin: 5px;
     }
     .item-table-360{
diff --git a/dark.css b/dark.css
index a6a4bc7..f408aa8 100644
--- a/dark.css
+++ b/dark.css
@@ -12,7 +12,7 @@ a{
 .home-button > div, .menu a{
 	color: #e0e0e0;
 }
-.home-button:hover, .menu a:hover, .hmb:hover{
+.home-button:hover, .menu a:hover, .hmb:hover, .sort-button div, .sort-menu:checked ~ .sort-button div{
 	background-color: #606061;
 }
 .hmb-line, .hmb-line::before, .hmb-line::after{
diff --git a/index.go.html b/index.go.html
index 23467fb..f61034e 100644
--- a/index.go.html
+++ b/index.go.html
@@ -26,6 +26,8 @@
     <a href="?light&{{ .Parameters }}" class="home-button no-dec"><div><b>&#9737;</b></div></a>
     {{ end }}
     {{ end }}
+    <input class="sort-menu" type="checkbox" id="sort-menu"/>
+    <label class="sort-button no-dec" for="sort-menu"><div><b>&#8595;</b></div></label>
     <input class="nav-menu" type="checkbox" id="nav-menu"/>
     <label class="hmb" for="nav-menu"><span class="hmb-line"></span></label>
     <nav class="nav">
@@ -93,6 +95,7 @@
             </div>
             {{ end }}
         </div>
+        <div class="duration-hold">{{ .GetInt64Duration }}</div>
     </div>
     {{ end }}
 </main>
diff --git a/light.css b/light.css
index 26825a8..982c14c 100644
--- a/light.css
+++ b/light.css
@@ -12,7 +12,7 @@ a{
 .home-button > div, .menu a{
     color: #1f1f1f;
 }
-.home-button:hover, .menu a:hover, .hmb:hover{
+.home-button:hover, .menu a:hover, .hmb:hover, .sort-button div, .sort-menu:checked ~ .sort-button div{
     background-color: #9f9f9e;
 }
 .hmb-line, .hmb-line::before, .hmb-line::after{
diff --git a/pageHandler/pages/index/entry.go b/pageHandler/pages/index/entry.go
index 881db5a..f129589 100644
--- a/pageHandler/pages/index/entry.go
+++ b/pageHandler/pages/index/entry.go
@@ -55,6 +55,10 @@ func (ey EntryYaml) GetDuration() time.Duration {
 	return ey.GetEndTime().Sub(ey.StartDate.Time).Truncate(time.Second)
 }
 
+func (ey EntryYaml) GetInt64Duration() int64 {
+	return int64(ey.GetDuration())
+}
+
 func (ey EntryYaml) GetImageCount() int {
 	return int(math.Min(math.Min(float64(len(ey.ThumbnailLocations)), float64(len(ey.ImageLocations))), float64(len(ey.ImageAltTexts))))
 }