Option to have round avatars

epicyon-blog.css

@@ -1,6 +1,7 @@
 @charset "UTF-8";
 
 :root {
+    --avatar-rounding: 10%;
     --main-bg-color: #282c37;
     --link-bg-color: #282c37;
     --title-color: #999;
@@ -795,6 +796,7 @@ div.gallery img {
         padding: 0px 0px;
         -ms-transform: translateY(-10%);
         transform: translateY(-10%);
+        border-radius: var(--avatar-rounding);
     }
     .cwButton {
         border-radius: var(--button-corner-radius);
@@ -1150,6 +1152,7 @@ div.gallery img {
         padding: 0px 0px;
         -ms-transform: translateY(-10%);
         transform: translateY(-10%);
+        border-radius: var(--avatar-rounding);
     }
     .cwButton {
         border-radius: var(--button-corner-radius);

epicyon-links.css

@@ -1,6 +1,7 @@
 @charset "UTF-8";
 
 :root {
+    --avatar-rounding: 10%;
     --main-bg-color: #282c37;
     --link-bg-color: #282c37;
     --dropdown-fg-color: #dddddd;
@@ -1052,6 +1053,7 @@ aside .toggle-inside li {
         padding: 0px 0px;
         -ms-transform: translateY(-10%);
         transform: translateY(-10%);
+        border-radius: var(--avatar-rounding);
     }
     .buttonevent {
         border-radius: var(--button-corner-radius);
@@ -1522,6 +1524,7 @@ aside .toggle-inside li {
         padding: 0px 0px;
         -ms-transform: translateY(-10%);
         transform: translateY(-10%);
+        border-radius: var(--avatar-rounding);
     }
     .buttonevent {
         border-radius: var(--button-corner-radius);

epicyon-profile.css

@@ -1,6 +1,7 @@
 @charset "UTF-8";
 
 :root {
+    --avatar-rounding: 10%;
     --timeline-icon-width: 50px;
     --timeline-icon-width-mobile: 100px;
     --header-bg-color: #282c37;
@@ -341,7 +342,7 @@ a:focus {
 }
 
 .profileHeader .title {
-    border-radius: 10%;
+    border-radius: var(--avatar-rounding);
     position: absolute;
     bottom: 100%;
     left: 25px;
@@ -1332,6 +1333,7 @@ div.container {
         padding: 0px 0px;
         -ms-transform: translateY(-10%);
         transform: translateY(-10%);
+        border-radius: var(--avatar-rounding);
     }
     .buttonevent {
         border-radius: var(--button-event-corner-radius);
@@ -1975,6 +1977,7 @@ div.container {
         padding: 0px 0px;
         -ms-transform: translateY(-10%);
         transform: translateY(-10%);
+        border-radius: var(--avatar-rounding);
     }
     .buttonevent {
         border-radius: var(--button-event-corner-radius);

theme/light/theme.json

@@ -1,4 +1,5 @@
 {
+    "avatar-rounding": "50%",
     "button-selected": "#999",
     "button-background": "#bbbbbb",
     "button-background-hover": "#999",

theme/night/theme.json

@@ -1,4 +1,5 @@
 {
+    "avatar-rounding": "50%",
     "newswire-publish-icon": "True",
     "full-width-timeline-buttons": "False",
     "icons-as-buttons": "False",

theme/zen/theme.json

@@ -1,4 +1,5 @@
 {
+    "avatar-rounding": "50%",
     "dropdown-bg-color-hover": "#463b35",
     "cw-color": "#d5c7b7",
     "main-fg-color": "#d5c7b7",