etc404/thymecrunch
1
0
Fork 0
mirror of https://gitlab.com/etc404/software-engineering-project.git synced 2026-05-10 20:52:58 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

new recipe bar on home working

Browse Source
This commit is contained in:
kaipher7
2026-04-21 23:54:16 -06:00
parent c0b536cba6
commit f8f41d680b
9 changed files with 513 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/main/resources/static/css/home.css
+45 -12
View File
@@ -87,7 +87,7 @@ body, html {
background-color: var(--peach);
color: var(--dark);
padding: 6px;
font-size: 1.75em;
font-size: 1.8em;
font-weight: 900;
letter-spacing: 1.5px;
display: flex;
@@ -112,7 +112,7 @@ body, html {
}
.sidebar-left a:hover {
color: var(--dusty-red-hover);
color: var(--dusty-red);
}
.sidebar-left .nav_icon {
@@ -120,7 +120,7 @@ body, html {
border: none;
padding: 0;
cursor: pointer;
height: 100px;
height: 85px;
width: auto;
border-radius: 8px;
transition: transform 0.2s ease;
@@ -130,6 +130,7 @@ body, html {
transform: scale(1.05);
}
/* =========================
Floating Create Icon
========================= */
@@ -179,7 +180,7 @@ body, html {
.sidebar-right {
display: flex;
flex-direction: column;
justify-content: space-between;
justify-content: flex-start;
align-items: center;
margin: 25px;
padding: 5px;
@@ -191,20 +192,52 @@ body, html {
font-size: 1.6em;
font-weight: 900;
letter-spacing: 1.5px;
overflow: scroll;
scrollbar-width: none;
}
.sidebar-right ul {
list-style: none;
padding: 0;
.sidebar-right h1 {
margin-bottom: 10px;
}
.sidebar-right li {
margin-bottom: 5px;
.new-recipes {
display: flex;
flex-direction: column;
gap: 10px;
width: 100%;
padding: 0 8px;
}
.sidebar-right a {
color: var(--dusty-red);
text-decoration: none;
.new-recipe-item {
display: flex;
flex-direction: column;
align-items: center;
gap: 6px;
background: var(--dusty-red);
color: var(--dark-yellow);
border-radius: 10px;
padding: 6px;
width: 95%;
box-sizing: border-box;
margin: 5px;
}
.new-recipe-item:hover {
background: var(--dusty-red-hover);
}
.new-recipe-item p {
margin: 1px;
font-size: 0.65em;
font-weight: 700;
text-align: center;
}
.new-recipe-item img {
width: 100%;
height: 75px;
object-fit: cover;
border-radius: 6px;
}
/* =========================