Did some stuff on the projects page

This commit is contained in:
2026-03-27 18:37:24 +01:00
parent df387db473
commit 87ca29e63c
3 changed files with 179 additions and 8 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 274 B

After

Width:  |  Height:  |  Size: 272 B

View File

@@ -7,15 +7,94 @@
<!--<script src="script.js"></script> --> <!--<script src="script.js"></script> -->
</head> </head>
<body> <body>
<div class="disbox"> <div style="display: flex; direction: row; justify-content: center; margin-bottom: 50px;">
<div class="disboxh"> <div class="disbox">
<img class="ico" src="../assets/gitico.png"></img> <div class="disboxh">
<img class="ico" src="../assets/blogico.png"></img> <img class="ico" src="../assets/gitico.png"></img>
<img class="ico" src="../assets/blogico.png"></img>
</div>
<p class="disboxp">
loc_projects:<br><br>
During my <b>dev journey</b>, I had the opportunity to create some cool projects.<br><br>
I've collected here those that might <b>pick your interest</b>.
</p>
</div>
</div>
<div style="display: flex; direction: row; justify-content: center; margin-bottom: 50px;">
<div>
<div class="disbox" style="margin-bottom: 50px;">
<div class="disboxh">
<img class="ico" src="../assets/gitico.png"></img>
<img class="ico" src="../assets/blogico.png"></img>
</div>
<p class="disboxp">
loc_myfiches.com:<br><br>
During my <b>dev journey</b>, I had the opportunity to create some cool projects.<br><br>
I've collected here those that might <b>pick your interest</b>.
</p>
</div>
<div class="disbox">
<div class="disboxh">
<img class="ico" src="../assets/gitico.png"></img>
<img class="ico" src="../assets/blogico.png"></img>
</div>
<p class="disboxp">
loc_rusty_slicer:<br><br>
During my <b>dev journey</b>, I had the opportunity to create some cool projects.<br><br>
I've collected here those that might <b>pick your interest</b>.
</p>
</div>
</div>
<div style="width: 20px;"></div>
<div class="disbox">
<div class="disboxh">
<img class="ico" src="../assets/gitico.png"></img>
<img class="ico" src="../assets/blogico.png"></img>
</div>
<p class="disboxp">
loc_numworks_hacking:<br><br>
During my <b>dev journey</b>, I had the opportunity to create some cool projects.<br><br>
I've collected here those that might <b>pick your interest</b>.
<br>
patatipata<br/>
patatipata<br/>
patatipata<br/>
patatipata<br/>
patatipata<br/>
patatipata<br/>
patatipata<br/>
patatipata<br/>
patatipata<br/>
patatipata<br/>
patatipata<br/>
</p>
</div>
</div>
<div style="display: flex; direction: row; justify-content: center; margin-bottom: 50px;">
<div class="disbox">
<div class="disboxh">
<img class="ico" src="../assets/gitico.png"></img>
<img class="ico" src="../assets/blogico.png"></img>
</div>
<p class="disboxp">
loc_a_la_carte:<br><br>
During my <b>dev journey</b>, I had the opportunity to create some cool projects.<br><br>
I've collected here those that might <b>pick your interest</b>.
</p>
</div>
</div>
<div style="display: flex; direction: row; justify-content: center; margin-bottom: 50px;">
<div class="disbox">
<div class="disboxh">
<img class="ico" src="../assets/gitico.png"></img>
<img class="ico" src="../assets/blogico.png"></img>
</div>
<p class="disboxp">
loc_minecraft_mods:<br><br>
During my <b>dev journey</b>, I had the opportunity to create some cool projects.<br><br>
I've collected here those that might <b>pick your interest</b>.
</p>
</div> </div>
<p class="disboxp">
loc_projects:<br>
During my dev journey, I had the opportunity to create some projects, I've collected here, those that might pick your interest.
</p>
</div> </div>
</body> </body>
</html> </html>

View File

@@ -10,8 +10,15 @@ html {
color: #071c2dff; color: #071c2dff;
} }
b {
font-weight: normal;
color: #008000;
}
.disbox { .disbox {
font-family: "fmono"; font-family: "fmono";
max-width: 300px;
filter: drop-shadow(5px 5px 4px #707070);
} }
.disboxp { .disboxp {
@@ -19,6 +26,7 @@ html {
outline: solid; outline: solid;
outline-width: 2px; outline-width: 2px;
outline-color: black; outline-color: black;
background-color: white;
margin: 0px; margin: 0px;
padding: 5px; padding: 5px;
} }
@@ -35,3 +43,87 @@ html {
.ico { .ico {
margin-bottom: -3px; margin-bottom: -3px;
} }
/* Win32 classic scrollbar */
::-webkit-scrollbar {
width: 17px;
height: 17px;
}
::-webkit-scrollbar-track {
background: repeating-conic-gradient(
#b0b0b0 0% 25%,
#c8c8c8 0% 50%
) 0 0 / 2px 2px;
}
::-webkit-scrollbar-thumb {
background: #c0c0c0;
border-top: 2px solid #ffffff;
border-left: 2px solid #ffffff;
border-right: 2px solid #404040;
border-bottom: 2px solid #404040;
border-radius: 0;
}
::-webkit-scrollbar-thumb:active {
border-top: 2px solid #404040;
border-left: 2px solid #404040;
border-right: 2px solid #ffffff;
border-bottom: 2px solid #ffffff;
}
::-webkit-scrollbar-button {
background: #c0c0c0;
border-top: 2px solid #ffffff;
border-left: 2px solid #ffffff;
border-right: 2px solid #404040;
border-bottom: 2px solid #404040;
display: block;
width: 17px;
height: 17px;
}
::-webkit-scrollbar-button:active {
border-top: 2px solid #404040;
border-left: 2px solid #404040;
border-right: 2px solid #ffffff;
border-bottom: 2px solid #ffffff;
}
/* Up arrow */
::-webkit-scrollbar-button:vertical:decrement {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17'%3E%3Cpolygon points='8.5,4 13,13 4,13' fill='%23000'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
}
/* Down arrow */
::-webkit-scrollbar-button:vertical:increment {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17'%3E%3Cpolygon points='8.5,13 4,4 13,4' fill='%23000'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
}
/* Left arrow */
::-webkit-scrollbar-button:horizontal:decrement {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17'%3E%3Cpolygon points='4,8.5 13,4 13,13' fill='%23000'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
}
/* Right arrow */
::-webkit-scrollbar-button:horizontal:increment {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17'%3E%3Cpolygon points='13,8.5 4,4 4,13' fill='%23000'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
}
::-webkit-scrollbar-corner {
background: #c0c0c0;
}
::-webkit-scrollbar-button:start:increment,
::-webkit-scrollbar-button:end:decrement {
display: none;
}