Estado inicial: frontend React + backend Laravel

2026-05-15 16:13:33 +01:00
commit 41c5f87d5b
216 changed files with 29916 additions and 0 deletions
@@ -0,0 +1,103 @@
+.sidebar {
+    width: 260px;
+    height: 100vh;
+    background: #ffffff;
+    border-right: 1px solid #e9ecef;
+    padding: 20px 16px;
+    display: flex;
+    flex-direction: column;
+    flex-shrink: 0;
+}
+
+.sidebarOpen, .sidebarClose {
+    background-color: var(--bg-primary-color-opacity);
+    color: var(--text-primary-color);
+    border: none;
+    border-radius: var(--border-radius-button);
+    padding: 6px 12px;
+    font-weight: 600;
+    transition: all 0.3s ease;
+}
+
+@media (max-width: 1200px) {
+    .sidebar{
+        display: none;
+    }
+    .sidebarIconsMenu{
+        display: none;
+    }
+    .sidebarOpen, .sidebarClose {
+        display: none;
+    }
+}
+
+.logoLink {
+    display: inline-flex;
+    margin-bottom: 24px;
+}
+
+.logo {
+    width: 180px;
+    height: auto;
+}
+
+.nav {
+    flex: 1;
+}
+
+.navList {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+    display: flex;
+    flex-direction: column;
+    gap: 6px;
+}
+
+.navItem {
+    margin: 0;
+}
+
+.navLink {
+    display: block;
+    width: 100%;
+    text-decoration: none;
+    color: #495057;
+    border-radius: 8px;
+    padding: 10px 12px;
+    transition: background-color 0.2s ease, color 0.2s ease;
+    &:hover{
+        background-color: var(--bg-grey);
+        color: var(--text-black);
+    }
+}
+
+.navLinkActive {
+    color: var(--primary-color);
+    background-color: var(--bg-primary-color-opacity);
+    font-weight: 600;
+}
+
+.logoutWrapper {
+    margin-top: 16px;
+    padding-top: 16px;
+    border-top: 1px solid #e9ecef;
+}
+
+.logoutButton {
+    display: inline-flex;
+    justify-content: center;
+    width: 100%;
+    text-decoration: none;
+    color: var(--text-white);
+    background-color: var(--primary-color);
+    border-radius: 8px;
+    padding: 10px 12px;
+    font-weight: 600;
+    transition: all 0.3s ease;
+    &:hover{
+        background-color: var(--bg-primary-color-opacity);
+        color: var(--text-primary-color);
+    }
+}
+