Simplify web topbar layout
This commit is contained in:
@@ -1,7 +1,7 @@
|
|||||||
import { useEffect, useState } from 'react';
|
import { useEffect, useState } from 'react';
|
||||||
import { Link, useNavigate, useLocation } from 'react-router-dom';
|
import { Link, useNavigate, useLocation } from 'react-router-dom';
|
||||||
import { useAuth } from '../../contexts/AuthContext';
|
import { useAuth } from '../../contexts/AuthContext';
|
||||||
import { FileText, Shield, PenTool, LayoutDashboard, LogOut, Palette, Menu, X, KeyRound, Search, Plus, Users, Settings, ScrollText, Scale } from 'lucide-react';
|
import { FileText, Shield, PenTool, LayoutDashboard, LogOut, Palette, Menu, X, KeyRound, Users, Settings, ScrollText, Scale } from 'lucide-react';
|
||||||
import ChangePasswordModal from '../ui/ChangePasswordModal';
|
import ChangePasswordModal from '../ui/ChangePasswordModal';
|
||||||
|
|
||||||
const navSections = [
|
const navSections = [
|
||||||
@@ -151,14 +151,6 @@ export default function Layout({ children }) {
|
|||||||
<main className="main-content">
|
<main className="main-content">
|
||||||
<div className="topbar">
|
<div className="topbar">
|
||||||
<div className="topbar-title">{currentTitle}</div>
|
<div className="topbar-title">{currentTitle}</div>
|
||||||
<div className="search-box">
|
|
||||||
<Search size={13} />
|
|
||||||
<input placeholder="Buscar documentos..." aria-label="Buscar documentos" />
|
|
||||||
</div>
|
|
||||||
<button className="btn btn-primary topbar-cta" type="button" onClick={() => navigate('/documents')}>
|
|
||||||
<Plus size={14} />
|
|
||||||
Nuevo documento
|
|
||||||
</button>
|
|
||||||
</div>
|
</div>
|
||||||
{children}
|
{children}
|
||||||
</main>
|
</main>
|
||||||
|
|||||||
@@ -317,35 +317,6 @@ select {
|
|||||||
color: var(--c-text);
|
color: var(--c-text);
|
||||||
}
|
}
|
||||||
|
|
||||||
.search-box {
|
|
||||||
width: 220px;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
gap: 6px;
|
|
||||||
background: var(--c-bg);
|
|
||||||
border: 0.5px solid var(--c-border);
|
|
||||||
border-radius: 8px;
|
|
||||||
padding: 6px 10px;
|
|
||||||
color: var(--c-muted);
|
|
||||||
}
|
|
||||||
|
|
||||||
.search-box input {
|
|
||||||
width: 100%;
|
|
||||||
border: none;
|
|
||||||
outline: none;
|
|
||||||
background: transparent;
|
|
||||||
font-size: 12px;
|
|
||||||
color: var(--c-text);
|
|
||||||
}
|
|
||||||
|
|
||||||
.search-box input::placeholder {
|
|
||||||
color: var(--c-muted);
|
|
||||||
}
|
|
||||||
|
|
||||||
.topbar-cta {
|
|
||||||
white-space: nowrap;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* ─── Page ───────────────────────────────────────────────────── */
|
/* ─── Page ───────────────────────────────────────────────────── */
|
||||||
.page {
|
.page {
|
||||||
padding: 20px 24px;
|
padding: 20px 24px;
|
||||||
@@ -2051,11 +2022,6 @@ select {
|
|||||||
flex-basis: 100%;
|
flex-basis: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.search-box,
|
|
||||||
.topbar-cta {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.page {
|
.page {
|
||||||
padding: 16px;
|
padding: 16px;
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
|
|||||||
Reference in New Issue
Block a user