Apri/Chiudi la barra di ricerca
Apri/Chiudi il menu
120
157
5
1677
DnD Mattarollo
Toggle preferences menu
Apri/Chiudi il menu personale
Accesso non effettuato
Il tuo indirizzo IP sarà visibile pubblicamente se effettuerai modifiche.

Pagina principale: differenze tra le versioni

Da DnD Mattarollo.
Altre azioni
← Differenza precedente
 
(22 versioni intermedie di uno stesso utente non sono mostrate)
Riga 13: Riga 13:


<!-- Importa Google Font -->
<!-- Importa Google Font -->
<link href="https://fonts.googleapis.com/css2?family=IM+Fell+English&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=IM+Fell+English+SC&display=swap" rel="stylesheet">


<style>
<style>
   .categories-container {
   .categories-container {
     display: flex;
     display: grid;
     flex-wrap: wrap;
     grid-template-columns: repeat(5, 1fr); /* 5 icone per riga su desktop */
     justify-content: center;
     gap: 10px;
     gap: 10px; /* riduce spazio fra righe */
     justify-items: center;
   }
   }
   .category-link {
   .category-link {
    flex: 1 1 18%;
    max-width: 155px;
     text-align: center;
     text-align: center;
    max-width: 150px;
   }
   }
   .category-link img {
   .category-link img {
Riga 33: Riga 32:
   }
   }
   .category-title {
   .category-title {
     font-family: 'IM Fell English', serif;
     font-family: 'IM Fell English SC', serif;
     color: white;
     color: white;
     text-transform: capitalize;
     text-transform: capitalize;
     font-size: 1.4em; /* titoli più grandi */
     font-size: 1.3em;
     margin-top: 4px;
     margin-top: 4px;
    text-decoration: none;
  }
  .category-link a {
    text-decoration: none;
    color: white;
  }
  .category-link a:hover .category-title {
    text-decoration: underline;
   }
   }


   /* Layout responsive per mobile */
   /* Layout responsive per mobile: 2 per riga */
   @media (max-width: 768px) {
   @media (max-width: 768px) {
    .categories-container {
      grid-template-columns: repeat(2, 1fr);
    }
     .category-link {
     .category-link {
      flex: 1 1 45%; /* 2 per riga */
       max-width: none;
       max-width: none;
     }
     }
Riga 50: Riga 59:


<div class="categories-container">
<div class="categories-container">
  <!-- Prima riga -->
   <div class="category-link">
   <div class="category-link">
     <a href="/index.php/Category:Flora" title="Flora">
     <a href="/index.php/Category:Flora" title="Flora">
       <img src="/images/4/4a/1.png" alt="Flora">
       <img src="/images/4/4a/1.png" alt="Flora">
      <div class="category-title">Flora</div>
     </a>
     </a>
    <div class="category-title">Flora</div>
   </div>
   </div>


Riga 60: Riga 70:
     <a href="/index.php/Category:Fauna" title="Fauna">
     <a href="/index.php/Category:Fauna" title="Fauna">
       <img src="/images/f/fb/2.png" alt="Fauna">
       <img src="/images/f/fb/2.png" alt="Fauna">
      <div class="category-title">Fauna</div>
     </a>
     </a>
    <div class="category-title">Fauna</div>
   </div>
   </div>


Riga 67: Riga 77:
     <a href="/index.php/Category:NPC" title="NPC">
     <a href="/index.php/Category:NPC" title="NPC">
       <img src="/images/1/10/3.png" alt="NPC">
       <img src="/images/1/10/3.png" alt="NPC">
      <div class="category-title">Npc</div>
     </a>
     </a>
    <div class="category-title">Npc</div>
   </div>
   </div>


Riga 74: Riga 84:
     <a href="/index.php/Category:Oggetti" title="Oggetti">
     <a href="/index.php/Category:Oggetti" title="Oggetti">
       <img src="/images/0/09/4.png" alt="Oggetti">
       <img src="/images/0/09/4.png" alt="Oggetti">
      <div class="category-title">Oggetti</div>
     </a>
     </a>
    <div class="category-title">Oggetti</div>
   </div>
   </div>


Riga 81: Riga 91:
     <a href="/index.php/Category:Insediamenti" title="Insediamenti">
     <a href="/index.php/Category:Insediamenti" title="Insediamenti">
       <img src="/images/8/82/5.png" alt="Insediamenti">
       <img src="/images/8/82/5.png" alt="Insediamenti">
      <div class="category-title">Insediamenti</div>
     </a>
     </a>
    <div class="category-title">Insediamenti</div>
   </div>
   </div>


  <!-- Seconda riga -->
   <div class="category-link">
   <div class="category-link">
     <a href="/index.php/Category:Comunità_ed_Organizzazioni" title="Organizzazioni">
     <a href="/index.php/Category:Comunità_ed_Organizzazioni" title="Organizzazioni">
       <img src="/images/5/59/11.png" alt="Organizzazioni">
       <img src="/images/5/59/11.png" alt="Organizzazioni">
      <div class="category-title">Organizzazioni</div>
     </a>
     </a>
    <div class="category-title">Organizzazioni</div>
   </div>
   </div>


Riga 95: Riga 106:
     <a href="/index.php/Category:Eventi_e_Personaggi_Storici" title="Storia">
     <a href="/index.php/Category:Eventi_e_Personaggi_Storici" title="Storia">
       <img src="/images/5/58/10.png" alt="Storia">
       <img src="/images/5/58/10.png" alt="Storia">
      <div class="category-title">Storia</div>
     </a>
     </a>
    <div class="category-title">Storia</div>
   </div>
   </div>


Riga 102: Riga 113:
     <a href="/index.php/Category:Luoghi d'Interesse" title="Luoghi d'interesse">
     <a href="/index.php/Category:Luoghi d'Interesse" title="Luoghi d'interesse">
       <img src="/images/f/f1/6.png" alt="Luoghi d'interesse">
       <img src="/images/f/f1/6.png" alt="Luoghi d'interesse">
      <div class="category-title">Luoghi D'interesse</div>
     </a>
     </a>
    <div class="category-title">Luoghi D'interesse</div>
   </div>
   </div>


Riga 109: Riga 120:
     <a href="/index.php/Mappa_di_Hesperia" title="Mappa">
     <a href="/index.php/Mappa_di_Hesperia" title="Mappa">
       <img src="/images/9/9e/7.png" alt="Mappa">
       <img src="/images/9/9e/7.png" alt="Mappa">
      <div class="category-title">Mappa</div>
     </a>
     </a>
    <div class="category-title">Mappa</div>
   </div>
   </div>


Riga 116: Riga 127:
     <a href="/index.php/Category:Figure_di_Culto" title="Pantheon">
     <a href="/index.php/Category:Figure_di_Culto" title="Pantheon">
       <img src="/images/6/60/8.png" alt="Pantheon">
       <img src="/images/6/60/8.png" alt="Pantheon">
      <div class="category-title">Pantheon</div>
     </a>
     </a>
    <div class="category-title">Pantheon</div>
   </div>
   </div>
</div>
</div>




Riga 130: Riga 140:
<html>
<html>
<style>
<style>
.diario-wrapper {
.note-viaggio{
   display: flex;
   display:grid;
   flex-wrap: wrap;
   grid-template-columns:1fr 1fr;
   align-items: flex-start;
  gap:24px;
   gap: 20px;
   align-items:start;
   margin-bottom: 20px;
   margin-bottom:20px;
   font-family:inherit;
}
}


.diario-wrapper img {
/* Colonna sinistra */
   max-width: 150px;
.col-sx{
  height: auto;
  display:flex;
   flex-shrink: 0;
  align-items:flex-start;
  gap:20px;
}
.col-sx img{
   max-width:150px; height:auto; flex-shrink:0;
}
.diario-links{
   display:flex; flex-direction:column; gap:8px;
}
}


.diario-links {
/* Colonna destra: TESTO a sinistra, IMMAGINE a destra (vicinissimi) */
   display: flex;
.col-dx{
   flex-direction: column;
   display:flex;
   gap: 8px;
   align-items:center;          /* centrati verticalmente */
  justify-content:flex-end;
   gap:8px;                     /* distanza minima */
}
.col-dx img{
  max-width:150px; height:auto; flex-shrink:0;
}
.col-dx .etichetta{
  max-width:210px; min-width:0; /* wrapping */
}
.col-dx .etichetta a{
  display:inline-block;
  text-decoration:none;        /* come il link dell’Astrologa */
  text-align:left; line-height:1.2;
  white-space:normal; word-break:break-word; hyphens:auto;
  /* nessun colore forzato: usa quelli standard del tema */
}
}


@media (max-width: 600px) {
/* Responsive: su telefono prima le IMMAGINI, poi i TESTI */
   .diario-wrapper {
@media (max-width:600px){
    flex-direction: column;
   .note-viaggio{ display:block; }
     align-items: center;
 
    text-align: center;
  .col-sx, .col-dx{
     display:block; text-align:center; margin-bottom:16px;
   }
   }


   .diario-links {
   .col-sx img, .col-dx img{
     align-items: center;
     display:block; margin:0 auto 12px auto;
   }
   }
  .diario-links{ align-items:center; text-align:center; }
  /* Forza ordine: immagine sopra, testo sotto */
  .col-dx{ display:flex; flex-direction:column; gap:8px; }
}
}
</style>
</style>


<div class="diario-wrapper">
<div class="note-viaggio">
   <img src="/images/4/48/Diarioastrologa.png" alt="Diario dell'Astrologa">
   <!-- Colonna sinistra -->
  <div class="diario-links">
  <div class="col-sx">
    <a href="Diario dell'Astrologa"><b>📜Diario dell'Astrologa</b></a>
    <img src="/images/4/48/Diarioastrologa.png" alt="Diario dell'Astrologa">
    <a href="Elenco degli NPC">🔖Elenco degli NPC</a>
    <div class="diario-links">
    <a href="Elenco degli Oggetti">🔖Elenco degli Oggetti</a>
      <a href="/Diario_dell'Astrologa"><b>📜 Diario dell'Astrologa</b></a>
    <a href="Elenco degli Insediamenti">🔖Elenco degli Insediamenti</a>
      <a href="/Elenco_degli_NPC">🔖 Elenco degli NPC</a>
    <a href="Elenco dei Luoghi d'Interesse">🔖Elenco dei Luoghi d'Interesse</a>
      <a href="/Elenco_degli_Oggetti">🔖 Elenco degli Oggetti</a>
    <a href="Flora e Fauna">🔖Flora e Fauna</a>
      <a href="/Elenco_degli_Insediamenti">🔖 Elenco degli Insediamenti</a>
      <a href="/Elenco_dei_Luoghi_d'Interesse">🔖 Elenco dei Luoghi d'Interesse</a>
      <a href="/Flora_e_Fauna">🔖 Flora e Fauna</a>
    </div>
  </div>
 
  <!-- Colonna destra (testo a sinistra, immagine a destra) -->
  <div class="col-dx">
    <div class="etichetta">
      <a href="Diario_di_Marcus_Harrington"><b>Diario di Bordo di Marcus Harrington</b></a>
    </div>
    <img src="/images/b/b8/Diariopirata.png" alt="Diario del Capitano">
   </div>
   </div>
</div>
</div>
</html>
</html>
<br>


==La Compagnia di Verdeluna==
==La Compagnia di Verdeluna==
<br>
<br>
<table style="text-align:center; width:100%;">
{| style="text-align:center; width:100%;"
  <tr>
|-
    <td>[[File:Ausrine.png|100px|link=Ausrine]]<br>[[Ausrine|Aušrinė Wildstar]]</td>
| [[File:Ausrine.png|100px|link=Ausrine]]<br>[[Ausrine|Aušrinė Wildstar]]
    <td>[[File:Cirano.png|100px|link=Cirano]]<br>[[Cirano]]</td>
| [[File:Cirano.png|100px|link=Cirano]]<br>[[Cirano]]
    <td>[[File:Lysarien Biancofiore.jpg|100px|link=Lysarien Biancofiore]]<br>[[Lysarien Biancofiore|Lysariën Biancofiore]]</td>
| [[File:Lysarien Biancofiore.png|100px|link=Lysarien Biancofiore]]<br>[[Lysarien Biancofiore|Lysariën Biancofiore]]
  </tr>
|-
  <tr>
| [[File:Marcus.png|100px|link=Marcus Harrington]]<br>[[Marcus Harrington]]
    <td>[[File:Marcus.png|100px|link=Marcus Harrington]]<br>[[Marcus Harrington]]</td>
| [[File:Ranga.png|100px|link=Ranga]]<br>[[Ranga]]
    <td>[[File:Ranga.png|100px|link=Ranga]]<br>[[Ranga]]</td>
| [[File:Susanoo.png|100px|link=Susanoo Bluesprites]]<br>[[Susanoo Bluesprites]]
    <td>[[File:Susanoo.png|100px|link=Susanoo Bluesprites]]<br>[[Susanoo Bluesprites]]</td>
|}
  </tr>
</table>
<br>
<br>


Versione attuale delle 15:57, 9 set 2025

Benvenuti nella Wiki della campagna "Fate of Hesperia"

Consulta la guida utente per maggiori informazioni sull'uso di questa wiki.
Per informazioni su come formattare le pagine consulta questa semplice guida: Guida alla Formattazione.
Utilizza la barra di ricerca a sinistra per trovare pagine o argomenti specifici.

Per iniziare

modifica


Flora
Flora
Fauna
Fauna
NPC
Npc
Oggetti
Oggetti
Insediamenti
Insediamenti
Organizzazioni
Organizzazioni
Storia
Storia
Luoghi d'interesse
Luoghi D'interesse
Mappa
Mappa
Pantheon
Pantheon


Note di Viaggio

modifica


Diario dell'Astrologa
📜 Diario dell'Astrologa 🔖 Elenco degli NPC 🔖 Elenco degli Oggetti 🔖 Elenco degli Insediamenti 🔖 Elenco dei Luoghi d'Interesse 🔖 Flora e Fauna
Diario di Bordo di Marcus Harrington
Diario del Capitano

La Compagnia di Verdeluna

modifica



Aušrinė Wildstar
Cirano
Lysariën Biancofiore

Marcus Harrington
Ranga
Susanoo Bluesprites


Altro

modifica
Estratto da "http://85.215.166.81/index.php?title=Pagina_principale&oldid=1181"
Ultima modifica
Questa pagina è stata modificata per l'ultima volta il 9 set 2025 alle 15:57.