diff --git a/Dipinti/Dipinti.css b/Dipinti/Dipinti.css new file mode 100644 index 0000000..01d7c65 --- /dev/null +++ b/Dipinti/Dipinti.css @@ -0,0 +1,315 @@ +body { + background-color: #141414; + color: #cccccc; +} + +.DL, .INS { + border: 2px solid #1A1A1A; + border-radius: 59px; + box-sizing: border-box; + color: #ffffffff; + cursor: pointer; + font-family: 'Courier New', Courier, monospace; + font-size: 16px; + font-weight: 600; + line-height: normal; + margin: 0; + min-height: 60px; + min-width: 0; + outline: none; + padding: 20px 24px; + text-align: center; + text-decoration: none; + transition: all 300ms cubic-bezier(.23, 1, 0.32, 1); + user-select: none; + -webkit-user-select: none; + touch-action: manipulation; + width: 100%; + will-change: transform; + display: block; +} +.image-container { + text-align: center; + margin: 20px; +} + +.image-DIVISORIO { + text-align: center; + margin: 40px; +} + +.riga { + display: flex; + justify-content: center; + align-items: center; + flex-direction: row; +} + +.image-container img { + max-width: 100%; + height: auto; + border-radius: 30px; +} + +.image-DIVISORIO img { + max-width: 100%; + height: auto; +} + +.titolo { + font-weight: 600; + text-align: center; + font-size: 50pt; +} + +.courier-prime-regular, .titolo { + font-family: "Courier Prime", monospace; + font-weight: 400; + font-style: normal; + margin: 20px; + max-width: 100%; + height: auto; + font-size: 40pt; + border-radius: 30px; +} + +.terminale { + font-family: "Courier Prime", monospace; + font-weight: 400; + font-style: normal; + margin: 0; /* Rimuovi i margini */ + padding: 0; /* Rimuovi i padding */ + line-height: 1; /* Imposta l'altezza della linea */ + white-space: pre; /* Mantieni gli spazi */ +} + +.message-important{ + font-family: "Courier Prime", monospace; + font-weight: 400; + font-style: normal; + background-color: #0000FF; + text-align: center; + color: #FFFFFF; + width: auto; + height: auto; +} + +.DL { + appearance: none; + background-color: #0071e3; +} + +.DL:disabled { + pointer-events: none; + background-color: #1A1A1A; +} + +.DL:hover { + background-color: #0071e387; + font-size: 19px; +} + +.DL:active { + box-shadow: none; + transform: translateY(0); +} + +h1, h2, h3, h4 { + color: #cccccc; + align-content: center; +} + +ul, ol { + margin-bottom: 20px; +} + +code { + background-color: #f4f4f4; + padding: 2px 6px; + border-radius: 4px; +} +li img { + display: block; /* Imposta l'immagine come blocco */ +} + +.homebutton { + display: flex; /* Utilizza il layout flessibile */ + align-items: center; /* Allinea verticalmente al centro */ + justify-content: center; /* Allinea orizzontalmente al centro */ +} + +.front1 { + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; + text-align: center; + margin: 20px; +} + +.front1 object { + max-width: 100%; + height: 100%; + border-radius: 10px; +} + +.front2 { + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; + text-align: center; + margin: 20px; +} + +.front2 svg { + max-width: 100%; + height: auto; +} + +.button-container { + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; + width: auto; + height: auto; +} + +.no-link-style { + text-decoration: none; + color: inherit; + cursor: default; + margin: 20px; + max-width: 100%; + height: auto; + border-radius: 30px; + +} + +.INS { + appearance: none; + background-color: #5f00e3; +} + +.INS:disabled { + pointer-events: none; + background-color: #1A1A1A; +} + +.INS:hover { + background-color: #5f00e39a; + font-size: 19px; +} + +.INS:active { + box-shadow: none; + transform: translateY(0); +} + +.window1 { + background-color: #000000; + border-radius: 30px; + padding: 10px; + width: 100%; + height: 50%; + display: flex; + flex-direction: column; + align-items: center; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5); +} + +.container { + display: flex; + flex-direction: column; + justify-content: center; + gap: 20px; +} + +.BUTTON_TUI { + margin: 0; + border: 0; + display: inline-block; + text-align: center; + white-space: nowrap; + color: #FDFDFF; + text-decoration: none; + line-height: 1.2; + font-size: 18px; + background-color: #0000FF; + padding: 3px 50px; + cursor: pointer; + font-family: "Courier Prime", monospace; + font-weight: 400; + font-style: normal; +} +.BUTTON_TUI:hover { + background-color: #FFFFFF; + color: #0056B3; +} + +.BUTTON_TUI:disabled{ + pointer-events: none; + background-color: #1f1f1f; +} + +.BUTTON_CLI { + margin: 0; + border: 0; + display: inline-block; + text-align: center; + white-space: nowrap; + color: #bfbfbc; + text-decoration: none; + line-height: 1.2; + font-size: 18px; + background-color: #0C3140; + padding: 3px 50px; + cursor: pointer; + font-family: "Courier Prime", monospace; + font-weight: 400; + font-style: normal; +} +.BUTTON_CLI:hover { + background-color: #FFFFFF; + color: #000000; +} + +.BUTTON_CLI:disabled{ + pointer-events: none; + background-color: #1f1f1f; +} + +.BUTTON_TUI_FAKE { + margin: 0; + border: 0; + display: inline-block; + text-align: center; + white-space: nowrap; + color: #FDFDFF; + text-decoration: none; + line-height: 1.2; + font-size: 18px; + padding: 3px 50px; + cursor: pointer; + font-family: "Courier Prime", monospace; + font-weight: 400; + font-style: normal; + pointer-events: none; + background-color: #ffffff00; +} + +.BUTTON_TUI_FAKE:disabled { + color: #FDFDFF; +} + + +@media (max-width: 1080px) { +.container { +flex-direction: column; /* Imposta la direzione principale del layout flessibile in verticale */ +} + +.window1 { +width: 98%; +} +} \ No newline at end of file diff --git a/Dipinti/index.html b/Dipinti/index.html new file mode 100644 index 0000000..517a2e7 --- /dev/null +++ b/Dipinti/index.html @@ -0,0 +1,54 @@ +<!DOCTYPE html> +<html lang="it"> +<head> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <title>SYSCOM</title> + <link rel="preconnect" href="https://fonts.googleapis.com"> + <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> + <link href="https://fonts.googleapis.com/css2?family=Courier+Prime:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet"> + <link rel="stylesheet" href="Dipinti.css"> + +<link rel="apple-touch-icon" sizes="180x180" href="../favicon_icons/SYSCOM/apple-touch-icon.png"> +<link rel="icon" type="image/png" sizes="32x32" href="../favicon_icons/SYSCOM/favicon-32x32.png"> +<link rel="icon" type="image/png" sizes="16x16" href="../favicon_icons/SYSCOM/favicon-16x16.png"> +<link rel="manifest" href="../favicon_icons/SYSCOM/site.webmanifest"> +<meta name="msapplication-TileColor" content="#da532c"> +<meta name="theme-color" content="#ffffff"> +<script src="SYSCOM-CLI.js"></script> +<script src="SYSCOM-CLI-INPUT.js"></script> +</head> +<body> + <div class="homebutton"> + <a href="../"> + <img src="../images/logo.png" alt="Home Button" height="300" width="300"/> + </a> + </div> + <h1 class="titolo">Galleria dei Dipinti</h1> + <p></p> + +<div class="container"> + <div class="window1"> + <div class="front1"> + <object data="../images/Quadri/Menschenrechte.jpg" type="image/jpg"></object> + </div> + <h3 class="courier-prime-regular">Menschenrechte</h3> + <div class="courier-prime-regular"> + <p></p> + <div class="message-important"><p>COPYRIGHT MMXXV<br>Vittoria Italia Azzurra Nicole<br>(alias Pierluigi Ciancio).</p></div> + </div> + </div> + + <div class="window1"> + <div class="front1"> + <object data="../images/logo_error.png" type="image/jpg"></object> + </div> + <h3 class="courier-prime-regular">NOT FOUND</h3> + <div class="courier-prime-regular"> + <p></p> + <div class="message-important"><p>COPYRIGHT MMXXV<br>Vittoria Italia Azzurra Nicole<br>(alias Pierluigi Ciancio).</p></div> + </div> + </div> + +</body> +</html> \ No newline at end of file diff --git a/images/Quadri/Menschenrechte.jpg b/images/Quadri/Menschenrechte.jpg new file mode 100644 index 0000000..7c64d64 Binary files /dev/null and b/images/Quadri/Menschenrechte.jpg differ diff --git a/index.css b/index.css index 7529d6c..edf4cf4 100644 --- a/index.css +++ b/index.css @@ -73,6 +73,9 @@ body { body { zoom: 110%; } + .Menu{ + zoom: 155%; + } } @media (min-width: 1080px) and (max-width: 2560px) { diff --git a/index.html b/index.html index 946dcce..3f63cf9 100644 --- a/index.html +++ b/index.html @@ -20,10 +20,11 @@ <div class="Menu"> <h1 class="Titolo">Vittoria Web</h1> <ul class="Link-ipertestuali"> - <li><h2><a href="./SYSCOM" style="text-decoration: none;" class="no-link-color" >SYSCOM</a></h2></li> - <li><h2><a href="" style="text-decoration: none;" class="dis" >ArcaTele</a></h2></li> + <li><h2><a href="./Dipinti" style="text-decoration: none" class="no-link-color">Dipinti</a></h2></li> <li><h2><a href="./MDS" style="text-decoration: none;" class="no-link-color" >Macchina da Scrivere</a></h2></li> + <li><h2><a href="./SYSCOM" style="text-decoration: none;" class="no-link-color" >SYSCOM</a></h2></li> <li><h2><a href="https://modrinth.com/user/Vittoria" style="text-decoration: none" class="no-link-color">Resourcepacks</a></h2></li> + <li><h2><a href="" style="text-decoration: none;" class="dis" >ArcaTele</a></h2></li> </ul> <h3 style="text-align: center;"><a href="https://github.com/VittoriaAlata" class="no-link-color">Autrice</a></h3> <hr class="small-hr">