MediaWiki:Common.css: Difference between revisions

← Older edit Newer edit →

@@ Line 1,021: / Line 1,021: @@
     ========================================================= */
-.ooo-browser {
+.ooo-browser{
    display:flex;
-   gap:40px;
+   gap:36px;
    align-items:flex-start;
    margin-top:14px;
@@ Line 1,045: / Line 1,045: @@
 }
-/* Prevent infobox overflow inside browser panel */
+/* INFOBOX */
-.ooo-browser__panel .ooo-infobox {
+.ooo-browser__panel .ooo-infobox{
-   width:100% !important;
+   width:320px;
    max-width:100%;
+  margin:0;
+  float:none;
    box-sizing:border-box;
 }
@@ Line 1,055: / Line 1,057: @@
 /* Prevent tables inside infobox from breaking layout */
-.ooo-browser__panel .ooo-infobox table {
+.ooo-browser__panel .ooo-infobox table{
    width:100%;
    table-layout:fixed;
 }
-/* Prevent long lines pushing layout */
 .ooo-browser__panel .ooo-infobox td,
-.ooo-browser__panel .ooo-infobox th {
+.ooo-browser__panel .ooo-infobox th{
    word-break:break-word;
-}
-/* INFOBOX */
-.ooo-browser__panel .ooo-infobox{
-  width:320px;
-  max-width:100%;
-  margin:0;
-  float:none;
 }
@@ Line 1,127: / Line 1,118: @@
 }
-/* MOBILE */
+/* =========================================================
+   PANEL CONTENT LAYOUT
+   ========================================================= */
+.ooo-item-top{
+  display:flex;
+  gap:24px;
+  align-items:flex-start;
+}
+.ooo-item-top .ooo-infobox{
+  flex-shrink:0;
+}
+.ooo-item-description{
+  flex:1;
+  line-height:1.6;
+}
+.ooo-item-body{
+  margin-top:20px;
+  padding-top:18px;
+  border-top:1px solid var(--ooo-border);
+  max-width:540px;
+  line-height:1.65;
+}
+/* =========================================================
+   PANEL SECTION HEADINGS
+   ========================================================= */
+.ooo-section-heading{
+  font-weight:700;
+  font-size:1.15rem;
+  margin:14px 0 6px 0;
+  padding-bottom:4px;
+  border-bottom:2px solid var(--ooo-accent);
+}
+/* =========================================================
+   MOBILE / NARROW SCREENS
+   ========================================================= */
-@media (max-width:1100px){
+@media (max-width:1000px){
    .ooo-browser{
@@ Line 1,144: / Line 1,176: @@
      padding-left:0;
      border-top:1px solid var(--ooo-border);
-     padding-top:16px;
+     padding-top:18px;
+  }
+  .ooo-item-top{
+    flex-direction:column;
    }
@@ Line 1,277: / Line 1,313: @@
 .ooo-infobox-tabwrap .tabber__tab[aria-selected="true"]{
    border-radius:0 !important;
-}
-/* =========================================================
-   OOO ITEM PANEL LAYOUT (Stable)
-   ========================================================= */
-.ooo-item-top{
-  display:grid;
-  grid-template-columns:260px 1fr;
-  gap:24px;
-  align-items:start;
-}
-.ooo-item-top .ooo-infobox{
-  width:260px;
-  min-width:260px;
-}
-.ooo-item-description{
-  line-height:1.6;
-}
-.ooo-item-body{
-  margin-top:20px;
-  padding-top:18px;
-  border-top:1px solid var(--ooo-border);
-  max-width:540px;
-  line-height:1.65;
-}
-/* =========================================================
-   OOO PANEL SECTION HEADINGS
-   (Used inside browser panels instead of == wiki headings ==)
-   ========================================================= */
-.ooo-section-heading{
-  font-weight:700;
-  font-size:1.15rem;
-  margin:14px 0 6px 0;
-  padding-bottom:4px;
-  border-bottom:2px solid var(--ooo-accent);
 }