elisabetta/cryptoseals
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

???
All checks were successful
Deploy / trigger (push) Successful in 35s
Details

Browse Source
This commit is contained in:
elisabetta
2026-04-04 23:26:36 +02:00
parent d271d7939c
commit 8a9dc99496
7 changed files with 94 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
backend/src/main/resources/get/cesare.html
View File

@@ -10,7 +10,12 @@
</head> </head>
<body> <body>
<div>
<div id="stars-container">
<div id="stars"></div>
<div id="stars2"></div>
<div id="stars3"></div>
</div>
<nav class="navbar"> <nav class="navbar">
<a href="index.html" class="nav-brand"> <a href="index.html" class="nav-brand">
<img src="seal1.png" height="80" alt="🦭"> <img src="seal1.png" height="80" alt="🦭">

18
backend/src/main/resources/get/index.html
View File

@@ -1,5 +1,6 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="it"> <html lang="it">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
@@ -8,8 +9,14 @@
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="style.css">
<script src="index.js" defer></script> <script src="index.js" defer></script>
</head> </head>
<body>
<body>
<div>
<div id="stars-container">
<div id="stars"></div>
<div id="stars2"></div>
<div id="stars3"></div>
</div>
<nav class="navbar"> <nav class="navbar">
<a href="index.html" class="nav-brand"> <a href="index.html" class="nav-brand">
<img src="seal1.png" height="80" alt="🦭"> <img src="seal1.png" height="80" alt="🦭">
@@ -26,17 +33,19 @@
</ul> </ul>
</nav> </nav>
<div class="container" style="display: flex; flex-direction: column; align-items: center; justify-content: center; height: 60vh;"> <div class="container"
style="display: flex; flex-direction: column; align-items: center; justify-content: center; height: 60vh;">
<h1>Welcome to CryptoSeals</h1> <h1>Welcome to CryptoSeals</h1>
<p class="descrizione"> <p class="descrizione">
Dive deep, Seal your data. <i class="fa-solid fa-water"></i><br><br> Dive deep, Seal your data. <i class="fa-solid fa-water"></i><br><br>
Scegli uno strumento dal menu per iniziare a proteggere i tuoi messaggi! Scegli uno strumento dal menu per iniziare a proteggere i tuoi messaggi!
</p> </p>
<img src="seal1.png" alt="Mascotte CryptoSeals" style="max-width: 250px; border-radius: 20px; box-shadow: 0 10px 30px rgba(16, 185, 129, 0.2);" onerror="this.src='https://cdn-icons-png.flaticon.com/512/3063/3063126.png';">
</div> </div>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" style="margin-bottom: -5px;"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" style="margin-bottom: -5px;">
<path fill="#0b0f19" fill-opacity="1" d="M0,160L48,170.7C96,181,192,203,288,208C384,213,480,203,576,176C672,149,768,107,864,117.3C960,128,1056,192,1152,213.3C1248,235,1344,213,1392,202.7L1440,192L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path> <path fill="#0b0f19" fill-opacity="1"
d="M0,160L48,170.7C96,181,192,203,288,208C384,213,480,203,576,176C672,149,768,107,864,117.3C960,128,1056,192,1152,213.3C1248,235,1344,213,1392,202.7L1440,192L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z">
</path>
</svg> </svg>
<footer> <footer>
@@ -47,4 +56,5 @@
</div> </div>
</footer> </footer>
</body> </body>
</html> </html>

18
backend/src/main/resources/get/index.js
View File

@@ -4,3 +4,21 @@ function toggleMenu() {
} }
// Anno dinamico Footer // Anno dinamico Footer
document.getElementById("year").innerText = new Date().getFullYear(); document.getElementById("year").innerText = new Date().getFullYear();
// Funzione per generare le ombre casuali delle stelle
function generateStars(n) {
let shadows = '';
for (let i = 0; i < n; i++) {
// Genera coordinate casuali fino a 2000px
let x = Math.floor(Math.random() * 2000);
let y = Math.floor(Math.random() * 2000);
shadows += `${x}px ${y}px #FFF`;
if (i < n - 1) shadows += ', ';
}
return shadows;
}
// Applica le stelle generate alle variabili CSS
document.documentElement.style.setProperty('--shadows-small', generateStars(700));
document.documentElement.style.setProperty('--shadows-medium', generateStars(200));
document.documentElement.style.setProperty('--shadows-big', generateStars(100));

7
backend/src/main/resources/get/rsa.html
View File

@@ -8,7 +8,12 @@
<script src="rsa.js" defer></script> <script src="rsa.js" defer></script>
</head> </head>
<body> <body>
<div>
<div id="stars-container">
<div id="stars"></div>
<div id="stars2"></div>
<div id="stars3"></div>
</div>
<nav class="navbar"> <nav class="navbar">
<a href="index.html" class="nav-brand"> <a href="index.html" class="nav-brand">
<img src="seal1.png" height="80" alt="🦭"> <img src="seal1.png" height="80" alt="🦭">

0
backend/src/main/resources/get/stars.js Normal file
View File

43
backend/src/main/resources/get/style.css
View File

@@ -283,3 +283,46 @@ footer a {
display: block; display: block;
} }
} }
/* --- SFONDO SPAZIALE ANIMATO --- */
.sfondo-spazio {
position: fixed; /* Lo fissa allo schermo */
top: 0; left: 0; width: 100%; height: 100%;
z-index: -1; /* Manda le stelle DIETRO le tue card e la navbar */
background: radial-gradient(ellipse at bottom, #1B2735 0%, #090A0F 100%);
overflow: hidden;
}
#stars-container {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
z-index: -1;
pointer-events: none;
background: radial-gradient(ellipse at bottom, #1B2735 0%, #090A0F 100%);
overflow: hidden;
}
#stars, #stars2, #stars3 { background: transparent; }
/* Stelle Piccole */
#stars { width: 1px; height: 1px; box-shadow: var(--shadows-small); animation: animStar 50s linear infinite; }
#stars::after { content: " "; position: absolute; top: 2000px; width: 1px; height: 1px; background: transparent; box-shadow: var(--shadows-small); }
/* Stelle Medie */
#stars2 { width: 2px; height: 2px; box-shadow: var(--shadows-medium); animation: animStar 100s linear infinite; }
#stars2::after { content: " "; position: absolute; top: 2000px; width: 2px; height: 2px; background: transparent; box-shadow: var(--shadows-medium); }
/* Stelle Grandi */
#stars3 { width: 3px; height: 3px; box-shadow: var(--shadows-big); animation: animStar 150s linear infinite; }
#stars3::after { content: " "; position: absolute; top: 2000px; width: 3px; height: 3px; background: transparent; box-shadow: var(--shadows-big); }
@keyframes animStar {
from { transform: translateY(0px); }
to { transform: translateY(-2000px); }
}
body {
color: white;
}

17
backend/src/main/resources/get/team.html
View File

@@ -35,27 +35,22 @@
<div class="team-container"> <div class="team-container">
<div class="team-card"> <div class="team-card">
<div class="avatar" <div class="avatar"
style="width: 200px; height: 100px; margin: 0 auto 15px auto; overflow: hidden; border-radius: 10px;"> style="width: 190px; height: 140px; margin: 0,auto; overflow: hidden; border-radius: 10px;">
<img src='elisabetta.png' <img src='elisabetta.png'
style="width: 100%; height: 100%; object-fit: cover; object-position: top center;"> style="width: 140%; height: 150%; object-fit: cover; object-position: top center;">
</div> </div>
<h2>Elisabetta Raione</h2> <h2 style="color: #0b0f19;">Elisabetta Raione</h2>
<p class="ruolo">Foca 1</p> <p class="ruolo">Foca 1</p>
<p style="color: #0b0f19; font-size: 14px;">Si occupa dell'architettura del server Javalin e
dell'integrazione con il frontend.</p>
</div> </div>
<div class="team-card"> <div class="team-card">
<div class="avatar" <div class="avatar"
style="width: 200px; height: 100px; margin: 0 auto 15px auto; overflow: hidden; border-radius: 10px;"> style="width: 190px; height: 140px; margin: 0 auto; overflow: hidden; border-radius: 10px;">
<img src='manuela1.png' <img src='manuela1.png'
style="width: 100%; height: 100%; object-fit: cover; object-position: center center;"> style="width: 70%; height: 90%; object-fit: cover; object-position: top center;">
</div> </div>
<h2>Manuela Mango</h2> <h2 style="color: #0b0f19;">Manuela Mango</h2>
<p class="ruolo">Foca 2</p> <p class="ruolo">Foca 2</p>
<p style="color: #0b0f19; font-size: 14px;">Specializzato nell'implementazione matematica degli
algoritmi
RSA e Vigenère.</p>
</div> </div>
</div> </div>
</div> </div>