universe

Universe
git clone https://git.dasho.dev/universe.git
Log | Files | Refs | Submodules | README

topnav.css (1944B)


      1 .topnav {
      2  position: fixed; /* Set the navbar to fixed position */
      3  top: 0; /* Position the navbar at the top of the page */
      4  width: 100%;
      5  height: 50px; /* Full width */
      6  background-color: var(--nav-bg);
      7 }
      8 .topnav ul {
      9  list-style: none;
     10  padding: 0;
     11  margin: 0;
     12  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2), 0 4px 20px 0 rgba(0, 0, 0, 0.19);
     13  z-index: 998;
     14 }
     15 
     16 .topnav ul li {
     17  display: block;
     18  position: relative;
     19  float: left;
     20 }
     21 
     22 /* This hides the dropdowns */
     23 
     24 .topnav li ul {
     25  display: none;
     26 }
     27 
     28 .topnav ul li a {
     29  display: block;
     30  padding: 0.8em;
     31  text-decoration: none;
     32  white-space: nowrap;
     33  color: var(--accent);
     34  overflow-y: auto;
     35 }
     36 
     37 .topnav ul li a:hover {
     38  color: var(--accent2);
     39  background: var(--accent);
     40 }
     41 
     42 /* Display the dropdown */
     43 
     44 .topnav li:hover > ul {
     45  display: block;
     46  position: absolute;
     47 }
     48 
     49 .topnav li:hover li {
     50  float: none;
     51 }
     52 
     53 .topnav li:hover a {
     54  color: black;
     55  background: #f9f9f9;
     56 }
     57 
     58 .topnav li:hover li a:hover {
     59  color: black;
     60  background: #ddd;
     61 }
     62 
     63 .topnav li ul li {
     64  border-top: 0;
     65 }
     66 
     67 /* Displays second level dropdowns to the right of the first level dropdown */
     68 
     69 .topnav ul ul ul {
     70  left: 100%;
     71  top: 0;
     72  overflow-y: auto;
     73 }
     74 
     75 /* Simple clearfix */
     76 
     77 .topnav ul:before,
     78 .topnav ul:after {
     79  content: " "; /* 1 */
     80  display: table; /* 2 */
     81 }
     82 
     83 .topnav ul:after {
     84  clear: both;
     85 }
     86 .parent li {
     87  margin: 0px -3px;
     88  padding: 0px;
     89 }
     90 
     91 .parent ul {
     92  max-height: 500px;
     93  min-width: 460px;
     94  overflow-y: auto;
     95  overflow-x: hidden;
     96  margin: 0px -3px;
     97  padding: 0px;
     98  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2), 0 4px 20px 0 rgba(0, 0, 0, 0.19);
     99 }
    100 
    101 .scrollable li {
    102  height: auto;
    103 }
    104 
    105 .navbartitle {
    106  margin: 0 auto;
    107  height: 50px;
    108  left: 50%;
    109  transform: translateX(-50%);
    110  padding: 0.8em;
    111  text-align: center;
    112  text-shadow: 0 0 0 #faf7fc;
    113  text-decoration: none;
    114  color: #faf7fc;
    115  font-size: 1rem;
    116  line-height: 1.5;
    117  position: fixed;
    118  z-index: 999;
    119  top: 0px;
    120 }