Gallardo7761/contaminus
Archived
1
0
Fork 0
Code Pull Requests Activity

Add FloatingMenu component and integrate DocsButton; update styles for ThemeButton and FloatingMenu

Browse Source
This commit is contained in:
Jose
2025-05-26 23:18:31 +02:00
parent 7b13affb3c
commit 3d9728874a
8 changed files with 196 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
frontend/src/css/DocsButton.css Normal file
View File

@@ -0,0 +1,19 @@
.docs-button {
z-index: 1000;
border: none;
border-radius: 50%;
width: 50px;
height: 50px;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--primary-color);
color: white;
cursor: pointer;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
transition: background-color 0.3s, transform 0.3s;
}
.docs-button:hover {
background-color: var(--secondary-color);
}

55
frontend/src/css/FloatingMenu.css Normal file
View File

@@ -0,0 +1,55 @@
.floating-menu {
position: fixed;
bottom: 20px;
right: 20px;
z-index: 1000;
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 10px;
}
.menu-buttons {
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 10px;
}
.menu-toggle {
border: none;
border-radius: 50%;
width: 50px;
height: 50px;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--primary-color);
color: white;
cursor: pointer;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
transition: background-color 0.3s, transform 0.3s;
}
.menu-toggle:hover {
background-color: var(--secondary-color);
}
.menu-buttons button {
border: none;
border-radius: 50%;
width: 50px;
height: 50px;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--primary-color);
color: white;
cursor: pointer;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
transition: background-color 0.3s, transform 0.3s;
}
.menu-buttons button:hover {
background-color: var(--secondary-color);
}

5
frontend/src/css/ThemeButton.css
View File

@@ -1,7 +1,4 @@
.theme-toggle {
position: fixed;
bottom: 20px;
right: 20px;
z-index: 1000;
border: none;
border-radius: 50%;
@@ -19,4 +16,4 @@
.theme-toggle:hover {
background-color: var(--secondary-color);
}
}