krao/fourge-portal
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Apply pill shape (border-radius 20px) to all buttons and sidebar nav items

Browse Source
This commit is contained in:
Krao Hasanee
2026-05-14 15:48:23 -04:00
parent 53b591697a
commit 13bb0f7914
2 changed files with 7 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/index.css
+5 -5
View File
@@ -131,7 +131,7 @@ body {
top: 0; top: 0;
width: 26px; width: 26px;
height: 26px; height: 26px;
border-radius: 6px; border-radius: 20px;
border: 1px solid #333; border: 1px solid #333;
background: transparent; background: transparent;
color: var(--sidebar-text); color: var(--sidebar-text);
@@ -161,7 +161,7 @@ body {
.sidebar-link { .sidebar-link {
display: flex; align-items: center; gap: 10px; display: flex; align-items: center; gap: 10px;
padding: 9px 12px; border-radius: 6px; padding: 9px 12px; border-radius: 20px;
color: var(--sidebar-text); text-decoration: none; color: var(--sidebar-text); text-decoration: none;
font-size: 13px; font-weight: 500; font-size: 13px; font-weight: 500;
transition: background 0.15s, color 0.15s; transition: background 0.15s, color 0.15s;
@@ -169,7 +169,7 @@ body {
width: 100%; text-align: left; width: 100%; text-align: left;
} }
.sidebar-link:hover { background: var(--sidebar-hover-bg); color: #fff; } .sidebar-link:hover { background: var(--sidebar-hover-bg); color: #fff; }
.sidebar-link.active { background: var(--sidebar-active-bg); color: #fff; border-left: 2px solid var(--accent); padding-left: 10px; } .sidebar-link.active { background: var(--sidebar-active-bg); color: #fff; border: 1px solid rgba(245,165,35,0.3); }
.sidebar-link .icon { font-size: 15px; width: 18px; text-align: center; opacity: 0.7; } .sidebar-link .icon { font-size: 15px; width: 18px; text-align: center; opacity: 0.7; }
.sidebar-bottom { .sidebar-bottom {
@@ -185,7 +185,7 @@ body {
.sidebar-theme-toggle { .sidebar-theme-toggle {
background: transparent; background: transparent;
border: 1px solid #333; border: 1px solid #333;
border-radius: 6px; border-radius: 20px;
padding: 7px 10px; padding: 7px 10px;
cursor: pointer; cursor: pointer;
color: #888; color: #888;
@@ -772,7 +772,7 @@ body {
/* Buttons */ /* Buttons */
.btn { .btn {
display: inline-flex; align-items: center; gap: 6px; display: inline-flex; align-items: center; gap: 6px;
padding: 9px 18px; border-radius: 6px; font-size: 13px; padding: 9px 18px; border-radius: 20px; font-size: 13px;
font-weight: 600; cursor: pointer; border: 1px solid transparent; font-weight: 600; cursor: pointer; border: 1px solid transparent;
transition: all 0.15s; text-decoration: none; white-space: nowrap; transition: all 0.15s; text-decoration: none; white-space: nowrap;
font-family: inherit; line-height: 1; font-family: inherit; line-height: 1;
src/pages/team/BrandBook.jsx
+2 -2
View File
@@ -2373,7 +2373,7 @@ function DimensionEditorModal({ sourceImage, onApply, onCancel }) {
<button onClick={onCancel} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-muted)', fontSize: 18, lineHeight: 1, padding: '0 2px' }}>✕</button> <button onClick={onCancel} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-muted)', fontSize: 18, lineHeight: 1, padding: '0 2px' }}>✕</button>
</div> </div>
<div style={{ padding: '10px 18px', borderBottom: '1px solid var(--border)', display: 'flex', alignItems: 'center', gap: 10, flexWrap: 'wrap', background: 'var(--card-bg-2, var(--card-bg))', flexShrink: 0 }}> <div style={{ padding: '10px 18px', borderBottom: '1px solid var(--border)', display: 'flex', alignItems: 'center', gap: 10, flexWrap: 'wrap', background: 'var(--card-bg-2, var(--card-bg))', flexShrink: 0 }}>
<div style={{ display: 'flex', border: '1px solid var(--border)', borderRadius: 6, overflow: 'hidden' }}> <div style={{ display: 'flex', border: '1px solid var(--border)', borderRadius: 20, overflow: 'hidden' }}>
{[ {[
['line', 'Line'], ['line', 'Line'],
['box', 'Box'], ['box', 'Box'],
@@ -3485,7 +3485,7 @@ function PhotoEditorModal({
{/* Toolbar */} {/* Toolbar */}
<div style={{ padding: '10px 18px', borderBottom: '1px solid var(--border)', display: 'flex', alignItems: 'center', gap: 12, flexWrap: 'wrap', background: 'var(--card-bg-2, var(--card-bg))', flexShrink: 0 }}> <div style={{ padding: '10px 18px', borderBottom: '1px solid var(--border)', display: 'flex', alignItems: 'center', gap: 12, flexWrap: 'wrap', background: 'var(--card-bg-2, var(--card-bg))', flexShrink: 0 }}>
<div style={{ display: 'flex', border: '1px solid var(--border)', borderRadius: 6, overflow: 'hidden' }}> <div style={{ display: 'flex', border: '1px solid var(--border)', borderRadius: 20, overflow: 'hidden' }}>
{[ {[
['select', 'Select'], ['select', 'Select'],
['dimension', 'Line Dim'], ['dimension', 'Line Dim'],