MediaWiki:Common.css: Difference between revisions

← Older edit

@@ Line 37: / Line 37: @@
 }
-/* Optional: Add space at the top so the banner isn't covered by the logo/search bar */
 .mw-header {
-     margin-top: 20px; /* Adjust this value to the height of your banner */
+     margin-top: 10px;
 }
 #content {
-     background-color: #2f2f2f; /* Makes content semi-transparent */
+     background-color: #2f2f2f;
 }
-/* Make the top-right personal tools larger and stick to the corner */
 .vector-user-links {
      position: fixed;
@@ Line 57: / Line 56: @@
 }
-/* Adjust icons specifically if they look blurry after scaling */
 .vector-user-links .vector-icon {
-     width: 24px;  /* Increase base icon size */
+     width: 24px;
      height: 24px;
 }
-/* Change all links to silver */
 a {
-     color: #d1d1d1 !important; /* You can also use the hex code #C0C0C0 */
+     color: #d1d1d1 !important;
 }
-/* Optional: Change color for visited links to stay silver */
 a:visited {
      color: #A8A9AD !important;
 }
-/* Optional: Slightly brighter silver or a different effect on hover */
 a:hover {
      color: #e0e0e0 !important;
@@ Line 91: / Line 88: @@
      }
-    /* Style each row like a card */
      .mobile-card-table tr {
@@ Line 100: / Line 96: @@
 }
-.infobox {
-	float: right;
+.portable-infobox {
-	clear: right;
+    float: right;
-	margin: 0 0 0.5em 1em;
+    clear: right;
-	padding: 2px;
+    margin-top: 1% !important;
+    margin-right: 2.5% !important;
+    margin-left: 20px;
+    margin-bottom: 10px;
+    border-radius: 1.2%;
+    border: 6px solid #aaa;
+    overflow: hidden;
+    width: 350px !important;
+    box-shadow: 0 4px 10px rgba(0,0,0,0.15);
+    background-color: 232323 !important;
+}
+.portable-infobox .pi-title {
+    border-top-left-radius: 15px;
+    border-top-right-radius: 15px;
+}
+@media screen and (max-width: 1219px) {
+.portable-infobox {
+    float: none !important;
+    width: 100% !important;
+    max-width: 100% !important;
+    margin: 1em 0 !important;
+    box-sizing: border-box !important;
+    display: block !important;
+}
+.portable-infobox .wds-tabs__wrapper {
+    overflow-x: auto !important;
+    white-space: nowrap !important;
+    width: 100% !important;
+}
+.portable-infobox .pi-image img {
+    max-width: 100% !important;
+    height: auto !important;
+    width: auto !important;
+}
+@media screen and (max-width: 450px) {
+    .portable-infobox .pi-data {
+        display: block !important;
+    }
+    .portable-infobox .pi-data-label {
+        width: 100% !important;
+        text-align: left !important;
+        padding-bottom: 2px;
+    }
+    .portable-infobox .pi-data-value {
+        width: 100% !important;
+        text-align: left !important;
+        padding-left: 10px;
+    }
+}
 }