MediaWiki:Gadget-checkboxList.css

Z Kiwiki
Skočit na navigaci Skočit na vyhledávání

Poznámka: Aby sa zmeny prejavili, po uložení musíte vymazať vyrovnávaciu pamäť vášho prehliadača.

  • Mozilla Firefox / Safari: Držte stlačený Shift a kliknite na Reload alebo stlačte buď Ctrl-F5 alebo Ctrl-R (⌘-R na Mac)
  • Google Chrome: Stlačte Ctrl-Shift-R (⌘-Shift-R na Mac)
  • Internet Explorer: Držte Ctrl a kliknite na Refresh alebo stlačte Ctrl-F5
  • Opera: Prejdite do Menu → Settings (Opera → Preferences on a Mac) a potom do Privacy & security → Clear browsing data → Cached images and files.
/* CSS for [[MediaWiki:Gadget-checkboxList.js]] */
/* Use with [[Template:Checklist]] */

/* ===========================
      lighttable checklists
   =========================== */

/* checklist will otherwise render anything floated to the right unclickable
   due to overlap; 300px is the width of infoboxes and default thumbnail size */
.lighttable.checklist {
    max-width: calc(100% - 350px);
}

/* mobile skin and {{Quest details}} */
body.skin-minerva .lighttable.checklist,
.questdetails .lighttable.checklist {
    max-width: 100%;
}

/* kill excessive margin if nested */
.lighttable.checklist ul ul {
    margin-left: .5em;
}

.lighttable.checklist li {
    padding-left: 1.75em;
    margin-bottom: .3em;
    position: relative;
    list-style: none;
    cursor: pointer;
}

/* ---------------------------
         unchecked state
   --------------------------- */

.lighttable.checklist li::before {
    content: '';
    position: absolute;
    height: 1rem;
    width: 1rem;
    top: .3rem;
    left: 0;
    background-image: url('filepath://Checkbox-unchecked.svg');
    background-size: 1rem;
}

/* unchecked hover state */
.lighttable.checklist li:not(.checked):hover::before {
    background-color: #e4eaee;
    border-radius: .2rem;
}

body.wgl-darkmode .lighttable.checklist li:not(.checked):hover::before {
    background-color: #313e59;
}

/* ---------------------------
          checked state
   --------------------------- */

/* only fade the text content, not the checkbox; exclude nested checklists and
   bold/italics, otherwise the fading gets applied twice */

.lighttable.checklist .checked > *:not(ul):not(i):not(b) {
    opacity: 0.5;
}

.lighttable.checklist .checked::before {
    background-image: url('filepath://Checkbox-checked.svg');
}

.lighttable.checklist .checked {
    color: rgba(54, 65, 79, 0.5); /* #36414f in rgba */
}

body.wgl-darkmode .lighttable.checklist .checked {
	color: rgba(204, 217, 244, 0.5); /* #ccd9f4 in rgba */
}