Actions

MediaWiki

MediaWiki:Common.css

From Dune Awakening DB

Revision as of 02:01, 23 May 2025 by Operator (talk | contribs)

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/**********************************************************
 *  Common.css – global tweaks + radial menu + breadcrumbs
 *  (clean v2 · 2025-05-23)
 **********************************************************/

/*──────── 1. GLOBAL LAYOUT TOUCH-UPS ───────*/
#tagline, h3#tagline{display:none!important;}
h1.title, .mw-page-title-main, h1.firstHeading{
  margin-top:0!important; line-height:1.2!important; font-size:28px!important;}
#content, .mw-body, .mw-content-ltr, .mw-content-rtl{padding-top:0!important; margin-top:0!important;}
html, body{overflow-x:hidden!important;}

 /* hide Pivot off-canvas elements on all devices */
nav.tab-bar.hide-for-print,
.left-off-canvas-toggle,
.right-off-canvas-toggle,
aside.right-off-canvas-menu,
#right-nav-aside{display:none!important;}

/*──────── 2. BREADCRUMB STRIP ───────*/
.dune-breadcrumb-nav{
  display:flex; align-items:center; margin-bottom:12px;
  font-size:20px; background:rgba(0,0,2,.7);
  border:1px solid #fce7c8; padding:4px 8px; border-radius:2px;}
.dune-breadcrumb-nav a{color:#fce7c8; text-decoration:none; transition:.2s;}
.dune-breadcrumb-nav a:hover{color:#E3BB7A;}
.breadcrumb-home-link{display:flex; align-items:center;}
.breadcrumb-home-icon{width:16px; height:16px; margin-right:5px;}
.dune-breadcrumb-separator{margin:0 8px; color:#BBBBBB;}

/*──────── 3.  DUNE RADIAL MENU  (unchanged) ───────*/
/* Paste your *entire* radial-menu block below.
   It is shown truncated here for brevity -- keep every line. */

.dune-radial-menu{
  position:fixed; top:50%; left:50%; width:500px; height:500px;
  transform:translate(-50%,-50%) scale(0); z-index:9999;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:transform .4s ease, opacity .3s ease;
}
.dune-radial-menu.active{
  transform:translate(-50%,-50%) scale(1); opacity:1;
  visibility:visible; pointer-events:all;
}

/*=============================================================
  PATCH-20250523-RC1 – Radial menu literal colours
  WHY  : after we removed CSS variables, the menu lost its
         palette.  This patch replaces var() with hard values.
  SCOPE: .dune-radial-menu … (only lines that referenced vars)
===============================================================*/

/* central colours – copied from original tokens */
.dune-radial-item,
.dune-radial-center,
.dune-subcategory-container{
  background-color:rgba(12,10,20,.80);           /* was var(--dune-darker) */
  border:2px solid #fce7c8;                      /* was var(--dune-gold)   */
}

.dune-radial-item:hover,
.dune-radial-center:hover{
  box-shadow:0 0 10px rgba(200,161,101,.20);     /* was var(--dune-gold-glow) */
}

.dune-subcategory-header{
  background-color:rgba(0,0,2,.70);              /* was var(--dune-panel-bg-dark) */
  color:#fce7c8;                                 /* var(--dune-gold) */
  border-bottom:1px solid #fce7c8;
}

.dune-subcategory-item{
  color:#fce7c8;
}

.dune-subcategory-item:hover{
  background-color:rgba(200,161,101,.15);        /* was var(--dune-gold-glow) */
}

.dune-radial-overlay{
  background:rgba(0,0,0,.40);
}

/* mobile grid tweaks that referenced vars */
@media screen and (max-width:768px){
  .dune-radial-menu.mobile-grid{
    background:rgba(0,0,2,.70);
    border:1px solid #fce7c8;
  }
  .dune-radial-item{
    border:1px solid #fce7c8;
  }
  .dune-subcategory-item{
    background:rgba(0,0,2,.70);
    border:1px solid #fce7c8;
  }
}


/*=============================================================
  PATCH-20250524-RM – radial-menu literal palette
===============================================================*/

.dune-radial-item,
.dune-radial-center,
.dune-subcategory-container{
  background:#0c0a14;                 /* was var(--dune-darker) */
  border:2px solid #fce7c8;           /* was var(--dune-gold)   */
}

.dune-radial-item:hover,
.dune-radial-center:hover{
  box-shadow:0 0 10px rgba(200,161,101,.20); /* glow */
}

.dune-subcategory-header{
  background:rgba(0,0,2,.70);         /* var(--dune-panel-bg-dark) */
  color:#fce7c8; border-bottom:1px solid #fce7c8;
}

.dune-subcategory-item     {color:#fce7c8;}
.dune-subcategory-item:hover{background:rgba(200,161,101,.15);}

.dune-radial-overlay{background:rgba(0,0,0,.40);}   /* keep dim backdrop */

/* mobile grid fixes */
@media (max-width:768px){
  .dune-radial-menu.mobile-grid{background:rgba(0,0,2,.70);border:1px solid #fce7c8;}
  .dune-radial-item           {border:1px solid #fce7c8;}
  .dune-subcategory-item      {background:rgba(0,0,2,.70);border:1px solid #fce7c8;}
}