Aggiunti Dipinti

VittoriaAlata · Jan 14, 2025 · 504cd5c · 504cd5c
1 parent 019bfbd
commit 504cd5c
Show file tree

Hide file tree

Showing 5 changed files with 375 additions and 2 deletions.
diff --git a/Dipinti/Dipinti.css 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%;
+}
+}
diff --git a/Dipinti/index.html 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>
diff --git a/images/Quadri/Menschenrechte.jpg b/images/Quadri/Menschenrechte.jpg
diff --git 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
@@ -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">
-Original file line number
+Diff line change
@@ Expand Up / @@ -73,6 +73,9 @@ body { @@
         body {
             zoom: 110%;
         }
+        .Menu{
+            zoom: 155%;
+        }
     }
     @media (min-width: 1080px) and (max-width: 2560px) {
@@ Expand Down @@