neon443/neon443.github.io
1
0
Fork 0
mirror of https://github.com/neon443/neon443.github.io.git synced 2026-03-11 07:09:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

finally done the ui refresh

Browse Source 
finallyyyy
yesssss
This commit is contained in:
neon443
2024-09-27 21:10:38 +01:00
parent b4dc1b9de5
commit 610cd1fcfb
8 changed files with 130 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
style.css
View File

@@ -5,7 +5,7 @@
/* Theme: #ddd */
/* text: #222 */
/* UI item bgs: #aaa */
/* for contrast: #aaa */
/* for contrast: #333 */
/* transparency: rgba(255, 255, 255, 0.25) */
/* box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.25); */
/* bar link hover bg color: #111 */
@@ -14,7 +14,7 @@
/* Theme: #222 */
/* text: #ddd */
/* UI item bgs: #555 */
/* for contrast: #555 */
/* for contrast: #ddd */
/* transparency: rgba(0, 0, 0, 0.25) */
/* box-shadow: 0px 0px 5px 5px rgba(255, 255, 255, 0.25); */
/* bar link hover bg color: #eee */
@@ -39,6 +39,7 @@ body {
background-color: #ddd;
}
p {
margin: 10px 0px;
font-size: 20px;
padding: 0px 20px;
}
@@ -57,6 +58,14 @@ h3 {
font-weight: 400;
padding: 0px 20px;
}
h5 {
font-size: 25px;
font-weight: 100;
padding: 0px 20px;
}
.center {
text-align: center;
}
/* regular text (body, p, b, h*) styles*/
.contentPush {
@@ -122,31 +131,54 @@ h3 {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); /* Responsive grid */
gap: 20px;
padding: 20px;
margin: 20px;
justify-content: center;
}
.app {
padding: 1px;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
text-decoration: none;
transition: 0.2s ease-in-out;
}
.app img {
margin-top: 5px;
width: auto;
height: 100px;
border-radius: 5px;
transition: transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.app:hover img {
.app:hover {
transform: scale(1.1); /* Grow effect */
font-weight: 1000;
font-size: large;
color: #ff6200;
background-color: rgba(255, 255, 255, 0.2);
background-clip: border-box;
box-shadow: 0px 0px 5px 5px rgba(255, 255, 255, 0.3);
}
.label {
margin-top: 5px;
margin-bottom: 5px;
}
.footer {
background-color: rgba(0, 0, 0, 0.2);
padding-top: 20px;
}
.footer img {
padding: 20px;
}
.themednotByAI {
content: url("./images/notByAI.svg");
}
@media (prefers-color-scheme: dark) {
@@ -170,12 +202,15 @@ h3 {
background-color: #333;
}
.barItem a:hover {
background-color: #888;
background-color: #ddd;
color: #222;
-webkit-box-shadow: 0px 0px 5px 5px rgba(200, 200, 200, 0.8);
-moz-box-shadow: 0px 0px 5px 5px rgba(200, 200, 200, 0.8);
box-shadow: 0px 0px 5px 5px rgba(200, 200, 200, 0.8);
}
.themednotByAI {
content: url("./images/notByAIDark.svg");
}
}
@media screen and (max-width: 600px) {
@@ -184,4 +219,4 @@ h3 {
height: 80px;
border-radius: 20px;
}
}
}