Jump to content

Alathra:Navigation: Difference between revisions

m CSS test
No edit summary
 
(17 intermediate revisions by the same user not shown)
Line 1: Line 1:
{{#css:
{{#css:
   #nav {
   #nav {
     height: 400px;
     height: auto;
     width: auto;
     width: auto;
     display: flex;
     display: flex;
     flex-direction: column;
     justify-content: center;
  }
 
  #nav-row {
    margin-bottom: 30px;
    width: 100%;
    display: flex;
     flex-direction: row;
     flex-direction: row;
     justify-content: center;
     flex-wrap: wrap;
     gap: 50px;
     gap: 30px;
   }
   }
    
    
  @media screen and (max-width: 800px) {
    #nav {
      height: 500px;
      align-items: center;
    }
    #nav-row {
      gap: 20px;
      flex-wrap: wrap;
    }
  }
 
  @media screen and (max-width: 660px) {
    #nav {
      height: 700px;
    }
  }
  @media screen and (max-width: 570px) {
    #nav {
      height: 800px;
    }
  }
 
  @media screen and (max-width: 455px) {
    #nav {
      height: 1000px;
    }
  }
 
  @media screen and (max-width: 395px) {
    #nav {
      height: 1200px;
    }
  }
}}
}}
<div id="nav">
<div id="nav">
<div id="nav-row">
{{Navcard
{{Navcard
|image=Reading guides.png
|image=Reading guides.png
Line 59: Line 19:
{{Navcard
{{Navcard
|image=History category.png
|image=History category.png
|link=[[History]]
|link=[[Alathra:Under Work]]
|text=History
|text=History
}}
}}
{{Navcard
{{Navcard
|link=[[Events]]
|image = Nation banners.png
|text=Events
|link=[[Alathra:Under Work]]
}}
</div>
<div id="nav-row">
{{Navcard
|size=mini
|link=[[Nations]]
|text=Nations
|text=Nations
}}
}}
{{Navcard
{{Navcard
|size=mini
|image = Outpost castle.png
|link=[[Towns]]
|link=[[Alathra:Under Work]]
|text=Towns
|text=Towns
}}
{{Navcard
|size=mini
|link=[[Individuals]]
|text=Individuals
}}
}}
{{Navcard
{{Navcard
|image=Universe category.png
|image=Universe category.png
|size=mini
|link=[[Alathra:Under Work]]
|link=[[Universe]]
|text=Universe
|text=Universe
}}
}}
{{Navcard
{{Navcard
|image=Cartography category.png
|image=Cartography category.png
|size=mini
|link=[[Alathra:Under Work]]
|link=[[Cartography]]
|text=Cartography
|text=Cartography
}}
}}
</div>
</div>
</div>

Latest revision as of 09:11, 28 June 2025