Difference between revisions of "Template:TU Dresden/CSS"

 
(11 intermediate revisions by 2 users not shown)
Line 204: Line 204:
 
         background:#8A2BE2;
 
         background:#8A2BE2;
 
}
 
}
 +
 +
.table-scrollable {
 +
  width: 100%;
 +
  overflow-y: auto;
 +
  margin: 0 0 1em;
 +
}
 +
 +
.table-scrollable::-webkit-scrollbar {
 +
  -webkit-appearance: none;
 +
  width: 14px;
 +
  height: 14px;
 +
}
 +
 +
.table-scrollable::-webkit-scrollbar-thumb {
 +
  border-radius: 8px;
 +
  border: 3px solid #fff;
 +
  background-color: rgba(0, 0, 0, .3);
 +
}
 +
 
.contentbox p, .contentbox .pdf-resources, .contentbox .excel-resources, .contentbox ul, .contentbox ol, .contentbox .read-more {
 
.contentbox p, .contentbox .pdf-resources, .contentbox .excel-resources, .contentbox ul, .contentbox ol, .contentbox .read-more {
 
     display: block;
 
     display: block;
Line 512: Line 531:
 
}
 
}
  
−
nav ul a:hover, nav ul li:hover .dropbtn{
+
nav ul a:hover, nav ul li:hover .dropbtn, .show .dropbtn{
 
     background-color: var(--logo-pink);
 
     background-color: var(--logo-pink);
 
     box-shadow: 0 6px 12px rgba(0,0,0,0.5),0 12px 32px rgba(0,0,0,0.1);
 
     box-shadow: 0 6px 12px rgba(0,0,0,0.5),0 12px 32px rgba(0,0,0,0.1);
Line 524: Line 543:
 
}
 
}
  
−
nav ul li:hover .nav-dropdown {
+
nav ul li:hover .nav-dropdown, .show .nav-dropdown {
 
     display: block;
 
     display: block;
 
     box-shadow: 0 6px 12px rgba(0,0,0,0.5),0 12px 32px rgba(0,0,0,0.1);  
 
     box-shadow: 0 6px 12px rgba(0,0,0,0.5),0 12px 32px rgba(0,0,0,0.1);  
Line 575: Line 594:
 
     box-shadow: 0 3px 6px rgba(0,0,0,0.25),0 6px 16px rgba(0,0,0,0.05);
 
     box-shadow: 0 3px 6px rgba(0,0,0,0.25),0 6px 16px rgba(0,0,0,0.05);
 
     height: 45px;
 
     height: 45px;
 +
}
 +
 +
@media (pointer: coarse) {
 +
    .dropbtn span {
 +
        padding-top: 26px;
 +
        padding-bottom: 26px;
 +
        margin-top: -26px;
 +
        margin-bottom: -26px;
 +
        padding-left: 10px;
 +
        padding-right: 10px;
 +
    }
 +
    .dropbtn span:after {
 +
        transform: rotate(-90deg);
 +
        display: inline-block;
 +
        font-weight: bold;
 +
        font-family: var(--headfont);
 +
        content: '\2039';
 +
    }
 
}
 
}
  
Line 638: Line 675:
 
     height: 210px;
 
     height: 210px;
 
     border-radius: 105px;
 
     border-radius: 105px;
−
     background: var(--logo-dark-blue);
+
     background: rgb(28, 20, 68);
 
     box-shadow: 0 6px 12px rgba(0,0,0,0.5),0 12px 32px rgba(0,0,0,0.1);
 
     box-shadow: 0 6px 12px rgba(0,0,0,0.5),0 12px 32px rgba(0,0,0,0.1);
 
     z-index: 3;
 
     z-index: 3;
Line 699: Line 736:
 
     text-align: center;
 
     text-align: center;
 
     width: 100%;
 
     width: 100%;
−
    bottom: 30px;
 
 
     position: absolute;
 
     position: absolute;
 
}
 
}
Line 982: Line 1,018:
 
         width: 100%;
 
         width: 100%;
 
         box-shadow: none;
 
         box-shadow: none;
−
        height: 70px;
 
 
     }
 
     }
  
Line 998: Line 1,033:
 
     .navbar {
 
     .navbar {
 
         display: none;
 
         display: none;
 +
    }
 +
 +
    nav ul a:hover, nav ul li:hover .dropbtn, .show .dropbtn{
 +
        height: 70px;
 +
    }
 +
 +
    a.active, nav ul li.active .dropbtn{
 +
        height: 70px;
 
     }
 
     }
  
Line 1,038: Line 1,081:
 
}
 
}
 
.view h2 {
 
.view h2 {
−
    text-transform: uppercase;
 
 
     color: #fff;
 
     color: #fff;
 
     text-align: center;
 
     text-align: center;
Line 1,062: Line 1,104:
 
     background: #000;
 
     background: #000;
 
     color: #fff;
 
     color: #fff;
−
    text-transform: uppercase;
 
 
}
 
}
 
.view a.info:hover {
 
.view a.info:hover {
Line 1,110: Line 1,151:
 
     92% { transform: translateY(-12px);}
 
     92% { transform: translateY(-12px);}
 
     55%, 75%, 87%, 97%, 100% { transform: translateY(0px);}
 
     55%, 75%, 87%, 97%, 100% { transform: translateY(0px);}
−
}
 
−
 
−
@media screen and (max-width: 600px) {
 
−
table {width:100%;}
 
−
thead {display: none;}
 
−
tr:nth-of-type(2n) {background-color: inherit;}
 
−
tr td:first-child {background: #f0f0f0; font-weight:bold;font-size:1.3em;}
 
−
tbody td {display: block;  text-align:center;}
 
−
tbody td:before {
 
−
    content: attr(data-th);
 
−
    display: block;
 
−
    text-align:center; 
 
−
  }
 
 
}
 
}
  
 
</style>
 
</style>
 
</html>
 
</html>

Latest revision as of 23:25, 15 December 2017