From b5fc6b3cf33c026f3d8722ed9f7bbf61933c1204 Mon Sep 17 00:00:00 2001
From: Bob Mottram <bob@freedombone.net>
Date: Sun, 25 Oct 2020 17:44:47 +0000
Subject: [PATCH] Tab-like buttons

---
 epicyon-profile.css | 22 ++++++++++++++--------
 theme.py            |  4 +++-
 2 files changed, 17 insertions(+), 9 deletions(-)

diff --git a/epicyon-profile.css b/epicyon-profile.css
index aca7482ce..db846a91c 100644
--- a/epicyon-profile.css
+++ b/epicyon-profile.css
@@ -97,6 +97,8 @@
     --button-event-fg-color: white;
     --hashtag-background-color: black;
     --hashtag-fg-color: white;
+    --tab-border-width: 0px;
+    --tab-border-color: grey;	
 }
 
 @font-face {
@@ -1239,18 +1241,19 @@ aside .toggle-inside li {
     .button {
         border-radius: var(--button-corner-radius);
         background-color: var(--button-background);
-        border: none;
         color: var(--button-text);
         text-align: center;
         font-size: var(--font-size-header);
         font-family: Arial, Helvetica, sans-serif;
         padding: var(--button-height-padding);
         width: 10%;
-        max-width: 200px;
         min-width: var(--button-width-chars);
         transition: all 0.5s;
         cursor: pointer;
         margin: 5px;
+	border-top: var(--tab-border-width) solid var(--tab-border-color);	
+	border-left: var(--tab-border-width) solid var(--tab-border-color);	
+	border-right: var(--tab-border-width) solid var(--tab-border-color);	
     }
     .publishbtn {
         border-radius: var(--button-corner-radius);
@@ -1287,18 +1290,19 @@ aside .toggle-inside li {
     .buttonselected {
         border-radius: var(--button-corner-radius);
         background-color: var(--button-selected);
-        border: none;
         color: var(--button-selected-text);
         text-align: center;
         font-size: var(--font-size-header);
         font-family: Arial, Helvetica, sans-serif;
         padding: var(--button-height-padding);
         width: 10%;
-        max-width: 100px;
         min-width: var(--button-width-chars);
         transition: all 0.5s;
         cursor: pointer;
         margin: 5px;
+	border-top: var(--tab-border-width) solid var(--tab-border-color);	
+	border-left: var(--tab-border-width) solid var(--tab-border-color);	
+	border-right: var(--tab-border-width) solid var(--tab-border-color);	
     }
     .buttonselectedhighlighted {
         border-radius: var(--button-corner-radius);
@@ -1822,18 +1826,19 @@ aside .toggle-inside li {
     .button {
         border-radius: var(--button-corner-radius);
         background-color: var(--button-background);
-        border: none;
         color: var(--button-text);
         text-align: center;
         font-size: var(--font-size-button-mobile);
         font-family: Arial, Helvetica, sans-serif;
         padding: var(--button-height-padding-mobile);
         width: 20%;
-        max-width: 400px;
         min-width: var(--button-width-chars);
         transition: all 0.5s;
         cursor: pointer;
         margin: 15px;
+	border-top: var(--tab-border-width) solid var(--tab-border-color);	
+	border-left: var(--tab-border-width) solid var(--tab-border-color);	
+	border-right: var(--tab-border-width) solid var(--tab-border-color);	
     }
     .publishbtn {
         border-radius: var(--button-corner-radius);
@@ -1870,18 +1875,19 @@ aside .toggle-inside li {
     .buttonselected {
         border-radius: var(--button-corner-radius);
         background-color: var(--button-selected);
-        border: none;
         color: var(--button-selected-text);
         text-align: center;
         font-size: var(--font-size-button-mobile);
         font-family: Arial, Helvetica, sans-serif;
         padding: var(--button-height-padding-mobile);
         width: 20%;
-        max-width: 400px;
         min-width: var(--button-width-chars);
         transition: all 0.5s;
         cursor: pointer;
         margin: 15px;
+	border-top: var(--tab-border-width) solid var(--tab-border-color);	
+	border-left: var(--tab-border-width) solid var(--tab-border-color);	
+	border-right: var(--tab-border-width) solid var(--tab-border-color);	
     }
     .buttonselectedhighlighted {
         border-radius: var(--button-corner-radius);
diff --git a/theme.py b/theme.py
index e77bf70ea..b159946bf 100644
--- a/theme.py
+++ b/theme.py
@@ -909,6 +909,9 @@ def setThemeLight(baseDir: str):
 def setThemeIndymediaModern(baseDir: str):
     name = 'indymediamodern'
     themeParams = {
+        "tab-border-width": "3px",
+        "tab-border-color": "grey",
+        "button-corner-radius": "0px",
         "login-button-color": "#25408f",
         "login-button-fg-color": "white",
         "column-left-width": "10vw",
@@ -919,7 +922,6 @@ def setThemeIndymediaModern(baseDir: str):
         "newswire-item-moderated-color": "red",
         "newswire-date-moderated-color": "red",
         "newswire-date-color": "grey",
-        "button-corner-radius": "7px",
         "timeline-border-radius": "0px",
         "button-background": "#767674",
         "button-background-hover": "#567674",