MediaWiki:Common.css: Difference between revisions

mNo edit summary
mNo edit summary
Line 1,018: Line 1,018:


/* =========================================================
/* =========================================================
   OOO BROWSER (Reusable left-list + right-details panel)
   OOO BROWSER (Stable layout)
  Works for Buildings / Vehicles / Factory
   ========================================================= */
   ========================================================= */


.ooo-browser {
.ooo-browser{
   display:flex;
   display:grid;
  grid-template-columns:240px 1fr;
   gap:34px;
   gap:34px;
   align-items:flex-start;
   align-items:start;
   margin-top:14px;
   margin-top:14px;
}
}


/* Sticky wrapper */
/* left column */
.ooo-browser__listwrap{
.ooo-browser__list{
   position:sticky;
   position:sticky;
   top:90px;
   top:90px;
Line 1,036: Line 1,036:
}
}


/* Left list */
/* item buttons */
.ooo-browser__list{
  width:240px;
  flex-shrink:0;
}
 
/* Item button */
.ooo-browser__item{
.ooo-browser__item{
   display:block;
   display:block;
Line 1,073: Line 1,067:
}
}


/* Arrow indicator */
.ooo-browser__item.is-active::after{
.ooo-browser__item.is-active::after{
   content:"▶";
   content:"▶";
Line 1,084: Line 1,077:
}
}


/* Optional subtitle */
.ooo-browser__item small{
  display:block;
  margin-top:2px;
  font-weight:600;
  opacity:0.75;
}
/* Right panel */
.ooo-browser__panel{
.ooo-browser__panel{
  flex:1;
  max-width:520px;
   border-left:1px solid var(--ooo-border);
   border-left:1px solid var(--ooo-border);
   padding-left:24px;
   padding-left:24px;
  max-width:520px;
}
}


Line 1,107: Line 1,089:
}
}


/* Panels */
/* panels */
.ooo-browser__info{
.ooo-browser__info{
   display:none;
   display:none;
Line 1,116: Line 1,098:
}
}


/* Mobile */
/* mobile */
@media (max-width:900px){
@media (max-width:900px){
   .ooo-browser{
   .ooo-browser{
     flex-direction:column;
     grid-template-columns:1fr;
     gap:16px;
  }
 
  .ooo-browser__list{
    position:relative;
     top:auto;
   }
   }


Line 1,130: Line 1,117:
   }
   }


  .ooo-browser__listwrap{
    position:relative;
    top:auto;
  }
}
}