mirror of
https://github.com/dergigi/boris.git
synced 2026-01-07 17:04:34 +01:00
fix(ui): ensure all icon buttons remain perfectly square
- Add padding: 0 and box-sizing: border-box to .icon-button - Add box-sizing: border-box to .profile-avatar - Update .sidebar-header-bar .toggle-sidebar-btn to use fixed width/height instead of min values - Add explicit styling for .bookmarks-container.collapsed .toggle-sidebar-btn - Ensure borders don't add to total dimensions (33px x 33px including borders)
This commit is contained in:
@@ -122,6 +122,7 @@ body {
|
||||
border: 1px solid #444;
|
||||
flex-shrink: 0;
|
||||
color: #ddd;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.profile-avatar img {
|
||||
@@ -138,16 +139,17 @@ body {
|
||||
background: transparent;
|
||||
color: #ddd;
|
||||
border: 1px solid #444;
|
||||
padding: 0.4rem;
|
||||
padding: 0;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-width: 33px;
|
||||
min-height: 33px;
|
||||
width: 33px;
|
||||
height: 33px;
|
||||
flex-shrink: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.sidebar-header-bar .toggle-sidebar-btn:hover {
|
||||
@@ -166,6 +168,31 @@ body {
|
||||
padding-top: 1rem;
|
||||
}
|
||||
|
||||
.bookmarks-container.collapsed .toggle-sidebar-btn {
|
||||
background: #2a2a2a;
|
||||
color: #ddd;
|
||||
border: 1px solid #444;
|
||||
padding: 0;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 33px;
|
||||
height: 33px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.bookmarks-container.collapsed .toggle-sidebar-btn:hover {
|
||||
background: #333;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bookmarks-container.collapsed .toggle-sidebar-btn:active {
|
||||
transform: translateY(1px);
|
||||
}
|
||||
|
||||
.user-info {
|
||||
margin: 0.5rem 0 0 0;
|
||||
color: #888;
|
||||
@@ -242,6 +269,8 @@ body {
|
||||
cursor: pointer;
|
||||
min-width: 33px;
|
||||
min-height: 33px;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.icon-button:hover { background: #333; }
|
||||
|
||||
Reference in New Issue
Block a user