MediaWiki: Tweeki.css: Unterschied zwischen den Versionen

Version vom 30. Januar 2023, 16:15 Uhr

/* CSS placed here will affect users of the Tweeki skin */
/*Navbar hover effect */
.navbar-brand:hover {
  transform: scale(1.02);
 transition: transform 0.1s;
}
.dropdown-item:hover {
  transform: scale(1.03);
 transition: transform 0.1s;
}
.nav-link:hover {
  transform: scale(1.03);
 transition: transform 0.1s;
}
/* img hover effect */
.img-fluid:hover {
    transform: scale(1.1);
}
.img-fluid {
    transition: transform 0.2s;
}
/* background color when nav item is selected */
.dropdown-item.active, .dropdown-item:active {
  background-color: #ABB8C3;
  color: #fff;
  text-decoration: none;
/* loading gif (not working atm)
#loading {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 999;
}
#loading {
    background-image: url('images/4/42/Loading.gif');
    background-repeat: no-repeat;
    background-position: center;
}
@media
(max-width: 767px) {
.img-fluid
{
  box-sizing: border-box;
}

@@ Zeile 40: / Zeile 40: @@
 @media
 (max-width: 767px) {
-.col-2 {
+.img-fluid
-padding: 1px 1px !important; /* add spacing between images on small screens */
-}
-}
-.col-2 {
-display: flex;
-align-items: center;
-justify-content: center;
-min-height: 30px; /* minimum height for image container */
-}
-img {
-max-width: 100%;
-height: auto;
-}
 {
-.col-2 {
+   box-sizing: border-box;
-margin: 2px !important; /* add spacing between images on small screens */
-}
-}
-.container-fluid {
-  display: grid;
-   grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
-  grid-gap: 2px; /* sets the gap between grid items to 10px */
 }