Jump to content

MediaWiki:Mobile.css: Difference between revisions

From Anandamakaranda
← Older editNewer edit →
No edit summary
No edit summary
Line 1: Line 1:
/* Floating TOC button */
/* ================================================================
#gr-toc-button {
  MediaWiki:Mobile.css
    position: fixed;
  Loaded only on Minerva (mobile skin).
    bottom: 20px;
  ================================================================ */
    right: 18px;
 
    width: 52px;
 
    height: 52px;
/* ── 1. AUTO-ZOOM PREVENTION ─────────────────────────────────────
    border-radius: 50%;
  iOS and Android zoom the viewport when a focused input has
    background: #b5451b;
  font-size < 16px. Every input on the site must be >= 16px.
    color: white;
  ──────────────────────────────────────────────────────────────── */
    z-index: 9999;
 
    display: flex;
/* Reader toolbar search input */
    align-items: center;
#gr-search-panel input {
    justify-content: center;
  font-size: 16px !important;
    font-size: 24px;
    box-shadow: 0 4px 14px rgba(0,0,0,.25);
    cursor: pointer;
}
}


/* TOC overlay */
/* New document dialog inputs */
#gr-toc-overlay {
#gr-newdoc-overlay input,
    position: fixed;
#gr-newdoc-overlay select,
    top: 0;
#gr-newdoc-overlay textarea {
    right: -90%;
  font-size: 16px !important;
    width: 82%;
    max-width: 340px;
    height: 100%;
    background: #fff;
    z-index: 10000;
    overflow-y: auto;
    transition: right .25s ease;
    box-shadow: -4px 0 18px rgba(0,0,0,.2);
    padding: 20px;
}
}


#gr-toc-overlay.open {
/* Annotation composer inputs (gr_annotations gadget) */
    right: 0;
.gra-composer-input,
.gra-fb-select,
#gra-nt-input,
#gra-bm-input,
#gra-fb-text,
#gra-fb-email {
  font-size: 16px !important;
}
}


/* Dark backdrop */
#gr-toc-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.45);
    z-index: 9998;
    display: none;
}


#gr-toc-backdrop.open {
/* ── 2. LONG-PRESS CONTEXT MENU SUPPRESSION ──────────────────────
    display: block;
  -webkit-touch-callout: none  → stops iOS "Copy / Look Up / Share"
}
                                  popup on long press of buttons
  user-select: none            → prevents text selection on button labels
  touch-action: manipulation  → removes 300ms tap delay and prevents
                                  context menu on long press (iOS + Android)
  ──────────────────────────────────────────────────────────────── */


/* TOC styling */
/* Sanskrit keyboard keys */
#gr-toc-overlay .toc {
.gr-kb-key,
    display:block !important;
.gr-kb-key-iast,
    border:none;
.gr-kb-action,
    padding:0;
.gr-kb {
    font-size:16px;
  -webkit-touch-callout: none;
  user-select: none;
  touch-action: manipulation;
}
}


#gr-toc-overlay ul {
/* Annotation FAB buttons and mobile action bar */
    list-style:none;
.gra-mob-btn,
    padding-left:14px;
.gra-fab-btn,
#gra-toggle,
#gra-mob-feedback,
#gra-mob-note,
#gra-mob-bookmark,
#gra-mob-dismiss {
  -webkit-touch-callout: none;
  user-select: none;
  touch-action: manipulation;
}
}


#gr-toc-overlay li {
/* Reader toolbar buttons */
    margin:10px 0;
#gr-static-bar .gr-btn,
#gr-static-bar .gr-icon-btn {
  -webkit-touch-callout: none;
  user-select: none;
  touch-action: manipulation;
}
}


#gr-toc-overlay a {
/* siteNav FAB buttons */
    text-decoration:none;
#se-docnav-btn,
    color:#222;
#se-scrolltop {
  -webkit-touch-callout: none;
  user-select: none;
  touch-action: manipulation;
}
}

Revision as of 08:24, 21 May 2026

/* ================================================================
   MediaWiki:Mobile.css
   Loaded only on Minerva (mobile skin).
   ================================================================ */


/* ── 1. AUTO-ZOOM PREVENTION ─────────────────────────────────────
   iOS and Android zoom the viewport when a focused input has
   font-size < 16px. Every input on the site must be >= 16px.
   ──────────────────────────────────────────────────────────────── */

/* Reader toolbar search input */
#gr-search-panel input {
  font-size: 16px !important;
}

/* New document dialog inputs */
#gr-newdoc-overlay input,
#gr-newdoc-overlay select,
#gr-newdoc-overlay textarea {
  font-size: 16px !important;
}

/* Annotation composer inputs (gr_annotations gadget) */
.gra-composer-input,
.gra-fb-select,
#gra-nt-input,
#gra-bm-input,
#gra-fb-text,
#gra-fb-email {
  font-size: 16px !important;
}


/* ── 2. LONG-PRESS CONTEXT MENU SUPPRESSION ──────────────────────
   -webkit-touch-callout: none  → stops iOS "Copy / Look Up / Share"
                                   popup on long press of buttons
   user-select: none            → prevents text selection on button labels
   touch-action: manipulation   → removes 300ms tap delay and prevents
                                   context menu on long press (iOS + Android)
   ──────────────────────────────────────────────────────────────── */

/* Sanskrit keyboard keys */
.gr-kb-key,
.gr-kb-key-iast,
.gr-kb-action,
.gr-kb {
  -webkit-touch-callout: none;
  user-select: none;
  touch-action: manipulation;
}

/* Annotation FAB buttons and mobile action bar */
.gra-mob-btn,
.gra-fab-btn,
#gra-toggle,
#gra-mob-feedback,
#gra-mob-note,
#gra-mob-bookmark,
#gra-mob-dismiss {
  -webkit-touch-callout: none;
  user-select: none;
  touch-action: manipulation;
}

/* Reader toolbar buttons */
#gr-static-bar .gr-btn,
#gr-static-bar .gr-icon-btn {
  -webkit-touch-callout: none;
  user-select: none;
  touch-action: manipulation;
}

/* siteNav FAB buttons */
#se-docnav-btn,
#se-scrolltop {
  -webkit-touch-callout: none;
  user-select: none;
  touch-action: manipulation;
}
Retrieved from "https://dev.anandamakaranda.in/index.php?title=MediaWiki:Mobile.css&oldid=5758"