khairul169/honey
1
0
Fork 0
mirror of https://github.com/khairul169/honey.git synced 2026-10-04 18:03:54 +07:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: open apps menu on scroll, set apps to grid view, etc

Browse Source
This commit is contained in:
khairul169
2024-08-11 03:08:59 +07:00
parent 598f269b08
commit dc48c53aa2
6 changed files with 518 additions and 104 deletions
Download Patch File Download Diff File Expand all files Collapse all files
css/Pages/Services.css
+41 -29
View File
@@ -1,52 +1,64 @@
.boxes {
display: flex;
flex: 1 1 0;
flex-wrap: wrap;
display: grid;
grid-template-columns: repeat(1, 1fr);
grid-gap: 8px;
padding: 16px;
}
.box {
min-width: 292px;
flex: 1;
margin: 2px;
border-radius: 20px;
padding: 8px;
display: flex;
align-items: center;
text-align: left;
text-decoration: none;
color: inherit;
transition: background .2s;
border-radius: 20px;
padding: 8px;
display: flex;
align-items: center;
text-align: left;
text-decoration: none;
color: inherit;
transition: background 0.2s;
}
.box:hover {
background: var(--hover);
background: var(--hover);
}
.box i {
font-size: 24px;
padding: 20px;
background: hsl(var(--color), 100%, 89%);
color: hsl(var(--color), 100%, 35%);
border-radius: 100px;
margin: 2px 12px 2px 2px;
font-size: 24px;
padding: 20px;
background: hsl(var(--color), 100%, 89%);
color: hsl(var(--color), 100%, 35%);
border-radius: 100px;
margin: 2px 12px 2px 2px;
}
a.box {
cursor: pointer;
padding: 14px;
cursor: pointer;
padding: 14px;
}
.box img {
width: 64px;
height: 64px;
object-fit: cover;
margin-right: 12px;
width: 64px;
height: 64px;
object-fit: cover;
margin-right: 12px;
}
.box .name {
font-size: 18px;
font-size: 16px;
}
.box .desc {
opacity: .6;
opacity: 0.6;
}
/* media query for medium screens */
@media only screen and (min-width: 512px) {
.boxes {
grid-template-columns: repeat(2, 1fr);
}
}
/* large screens */
@media only screen and (min-width: 768px) {
.boxes {
grid-template-columns: repeat(3, 1fr);
}
}