Making avatar a bit more rounded

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

src/renderer/components/avatar/avatar.module.css

@@ -42,7 +42,7 @@
 }
 
 .rounded {
-  border-radius: var(--border-radius);
+  border-radius: 4px;
 }
 
 .disabled {

src/renderer/components/hotbar/hotbar-icon.module.css

@@ -26,7 +26,7 @@
   display: flex;
   cursor: pointer;
   position: relative;
-  border-radius: var(--border-radius);
+  border-radius: 6px;
   transition: box-shadow 0.1s ease-in-out;
 
   &:not(.active):hover {
@@ -38,6 +38,10 @@
   cursor: context-menu;
 }
 
+.avatar {
+  border-radius: 6px;
+}
+
 .active {
   box-shadow: var(--iconActiveShadow);
 }

src/renderer/components/hotbar/hotbar-icon.tsx

@@ -77,7 +77,7 @@ export const HotbarIcon = observer(({ menuItems = [], size = 40, tooltip, ...pro
         id={id}
         title={title}
         colorHash={`${title}-${source}`}
-        className={cssNames({ [styles.active]: active })}
+        className={cssNames(styles.avatar, { [styles.active]: active })}
         disabled={disabled}
         size={size}
         src={src}