Jump to content

MediaWiki:Gadget-colorblind.css: Difference between revisions

From Philosophical Research
create
 
m use important
 
(5 intermediate revisions by the same user not shown)
Line 1: Line 1:
/* red/green colorblind overlay for hue.css */
/* red/green colorblind overlay for hue.css - this has mostly been tested, but the non-political "fantasy element" swatches aren't finished */
/* for some reason this stylesheet is loaded at the wrong time and won't work without "important". this wasn't an issue during testing but the Gadgets system works differently I guess. */


ol.hue li.number_empty   { border-color: transparent; }  ol.hue li.number_empty:before { background: #101010;  color: white; }
/* general categories */
.hue .field_nations  { border-color: #797979 !important; background: hsl(20,  40%,  65%) !important; }
.hue .field_exstruct { border-color: #6A5555 !important; background: hsl(242, 32%,  83%) !important; }
.hue .field_trotsky  { background: hsl(70,  50%,  70%) !important; }
.hue .field_gramsci  { border-color: #7e2b42 !important; background: hsl(250, 100%, 80%) !important; }
.hue .field_mdem    { border-color: #33161b !important; background: hsl(84,  81%,  28%) !important; }
.hue .field_anarchy  { border-color: #003108 !important; background: hsl(265, 17%,  24%) !important; }
.hue .field_fantasy  { border-color: #8785d0 !important; background: hsl(258, 48%,  95%) !important; }
.hue .field_horror  { border-color: hsl(213, 60%, 37%) !important; background: hsl(251, 18%, 53%) !important; }
/* field_internal is fine */
.hue.data_mage .bloc_earth, .hue.data_teadragon .suit_spring  { background: hsl(152, 81%, 49%) !important; }
.hue.data_mage .bloc_sun, .hue.data_teadragon .suit_autumn    { background: hsl(3,  82%, 39%) !important; }
.hue.data_mage .bloc_sea    { background: hsl(208, 87%, 39%) !important; }
/* bloc_steel and bloc_death look just fine already */
.hue.data_teadragon .suit_spring { border-color: hsl(354, 70%, 25%) !important; }
.hue.data_teadragon .suit_summer { border-color: hsl(51,  70%, 25%) !important; background: hsl(56,  82%, 72%) !important; }
.hue.data_teadragon .suit_autumn { border-color: hsl(3,  70%, 25%) !important; }
.hue.data_teadragon .suit_winter { border-color: hsl(141, 70%, 25%) !important; background: hsl(240, 40%, 80%) !important; }
.hue.data_pkmn .element_normal   { border-color: hsl(25, 26%, 48%) !important; background: hsl(120, 1%, 76%) !important; }
.hue.data_pkmn .element_fighting { border-color: #ff8000 !important; background: #ffac59 !important; }
  .hue.data_pkmn .element_poison  { border-color: hsl(0, 44%, 36%) !important; background: hsl(278, 38%, 51%) !important; }
  .hue.data_pkmn .element_ground  { border-color: #915121 !important; background: #b88e6f !important; }
  .hue.data_pkmn .element_rock    { border-color: #afa981 !important; background: #cbc7ad !important; }
.hue.data_pkmn .element_bug      { border-color: #91a119 !important; background: #b8c26a !important; }
.hue.data_pkmn .element_ghost    { border-color: #704170 !important; background: #a284a2 !important; }
.hue.data_pkmn .element_steel    { border-color: #60a1b8 !important; background: #98c2d1 !important; }
.hue.data_pkmn .element_water    { border-color: #2980ef !important; background: #74acf5 !important; }
.hue.data_pkmn .element_electric { border-color: hsl(46, 69%, 49%) !important; background: #fcd659 !important; }
.hue.data_pkmn .element_psychic  { border-color: #ef4179 !important; background: #f584a8 !important; }
.hue.data_pkmn .element_dragon  { border-color: #5060e1 !important; background: #8d98ec !important; }
.hue.data_pkmn .element_dark    { border-color: #624d4e !important; background: #998b8c !important; }
.hue.data_pkmn .element_fairy    { border-color: #ef70ef !important; background: #f5a2f5 !important; }


ol.hue li.field_fantasy  { border-color: #909090; }  ol.hue li.field_fantasy:before  { background: #e4e4e4; color: black; }
/* these swatches kept being indistinguishable in practice, so I combined them */
ol.hue li.field_geo      { border-color: #8D8D8D; }  ol.hue li.field_geo:before      { background: #c9c9c9; color: black; }
.hue .field_geo, .hue.data_pkmn .element_flying
ol.hue li.field_trotsky { border-color: #707070; }  ol.hue li.field_trotsky:before  { background: #b4b4b4; color: black; }
  { border-color: hsl(189, 21%, 38%) !important; background: hsl(144, 47%, 69%) !important; }
ol.hue li.field_exstruct { border-color: #5F5F5F; }  ol.hue li.field_exstruct:before { background: #c0c0c0; color: black; }
  .hue .field_ML, .hue.data_pkmn .element_fire
ol.hue li.field_nations { border-color: #797979; }  ol.hue li.field_nations:before { background: #a7a7a7; color: white; }
  { border-color: #820212 !important; background: hsl(352, 43%, 44%) !important; }
ol.hue li.field_horror  { border-color: #6c6c6c; }  ol.hue li.field_horror:before   { background: #8F8F8F; color: black; }
.hue.data_mage .bloc_earth, .hue.data_pkmn .element_grass
ol.hue li.field_ML      { border-color: #565656; } ol.hue li.field_ML:before       { background: #707070; color: white; }
  { background: hsl(152, 81%, 49%) !important; }
ol.hue li.field_mdem     { border-color: #2e2e2e; }  ol.hue li.field_mdem:before    { background: #505050; color: white; }
  /* these were always the same on the regular stylesheet */
.hue.data_pkmn .element_ice, .hue.data_adventuretime-2010 .element_ice  { border-color: hsl(192, 88%, 60%) !important; background: hsl(190, 70%,  85%) !important; }
.hue.data_adventuretime-2010 .element_candy { border-color: hsl(214, 63%, 32%) !important; background: hsl(336, 97%, 68%) !important; }
  ol.hue .field_trotsky, ol.hue .field_ML, ol.hue .field_mdem,
  ol.hue li.field_exstruct, ol.hue .field_nations,
  ol.hue li.field_geo, ol.hue li.field_fantasy, ol.hue li.field_horror { color: inherit; }
  ol.hue li.number_empty { color: white; }
  .mw-body .hue .field_ML:before, .mw-body .hue .field_ML .figure, .mw-body .hue .field_anarchy:before, .mw-body .hue .field_anarchy .figure,
  .mw-body .hue.data_mage .bloc_death:before, .mw-body .hue.data_mage .bloc_death .figure,
  .mw-body ol.hue .number_empty, ol.hue .field_horror.element_empty:before { color: #fafafa !important; }
  .mw-body .hue .field_mdem:before, .mw-body .hue .field_mdem .figure  { color: #eeffe8 !important; }


ol.hue li.field_fantasy  { border-color: #909090; }  ol.hue li.field_fantasy:before  { background: hsl(258, 48%,  95%); }
/* [[Category:Fake Item lists]] */
ol.hue li.field_geo      { border-color: #8D8D8D; }  ol.hue li.field_geo:before      { background: hsl(190, 40%,  79%); }
ol.hue li.field_trotsky  { border-color: #707070; }  ol.hue li.field_trotsky:before  { background: hsl(70,  50%,  70%); }
ol.hue li.field_exstruct { border-color: #5F5F5F; }  ol.hue li.field_exstruct:before { background: hsl(340, 40%,  75%); }
ol.hue li.field_nations  { border-color: #797979; }  ol.hue li.field_nations:before  { background: hsl(20,  40%,  65%); }
ol.hue li.field_horror  { border-color: #6c6c6c; }  ol.hue li.field_horror:before  { background: hsl(203, 40%,  56%); }
ol.hue li.field_ML      { border-color: #565656; }  ol.hue li.field_ML:before      { background: hsl(1,  30%,  44%); }
ol.hue li.field_mdem    { border-color: #2e2e2e; }  ol.hue li.field_mdem:before    { background: hsl(290, 30%,  31%); }

Latest revision as of 20:53, 28 July 2025

/* red/green colorblind overlay for hue.css - this has mostly been tested, but the non-political "fantasy element" swatches aren't finished */
/* for some reason this stylesheet is loaded at the wrong time and won't work without "important". this wasn't an issue during testing but the Gadgets system works differently I guess. */

 /* general categories */
 .hue .field_nations  { border-color: #797979 !important; background: hsl(20,  40%,  65%) !important; }
 .hue .field_exstruct { border-color: #6A5555 !important; background: hsl(242, 32%,  83%) !important; }
 .hue .field_trotsky  { background: hsl(70,  50%,  70%) !important; }
 .hue .field_gramsci  { border-color: #7e2b42 !important; background: hsl(250, 100%, 80%) !important; }
 .hue .field_mdem     { border-color: #33161b !important; background: hsl(84,  81%,  28%) !important; }
 .hue .field_anarchy  { border-color: #003108 !important; background: hsl(265, 17%,  24%) !important; }
 .hue .field_fantasy  { border-color: #8785d0 !important; background: hsl(258, 48%,  95%) !important; }
 .hue .field_horror   { border-color: hsl(213, 60%, 37%) !important; background: hsl(251, 18%, 53%) !important; }
 /* field_internal is fine */
 
 .hue.data_mage .bloc_earth, .hue.data_teadragon .suit_spring  { background: hsl(152, 81%, 49%) !important; }
 .hue.data_mage .bloc_sun, .hue.data_teadragon .suit_autumn    { background: hsl(3,   82%, 39%) !important; }
 .hue.data_mage .bloc_sea    { background: hsl(208, 87%, 39%) !important; }
 /* bloc_steel and bloc_death look just fine already */
 
 .hue.data_teadragon .suit_spring { border-color: hsl(354, 70%, 25%) !important; }
 .hue.data_teadragon .suit_summer { border-color: hsl(51,  70%, 25%) !important; background: hsl(56,  82%, 72%) !important; }
 .hue.data_teadragon .suit_autumn { border-color: hsl(3,   70%, 25%) !important; }
 .hue.data_teadragon .suit_winter { border-color: hsl(141, 70%, 25%) !important; background: hsl(240, 40%, 80%) !important; }
 
 .hue.data_pkmn .element_normal   { border-color: hsl(25, 26%, 48%) !important; background: hsl(120, 1%, 76%) !important; }
 .hue.data_pkmn .element_fighting { border-color: #ff8000 !important; background: #ffac59 !important; }
 .hue.data_pkmn .element_poison   { border-color: hsl(0, 44%, 36%) !important; background: hsl(278, 38%, 51%) !important; }
 .hue.data_pkmn .element_ground   { border-color: #915121 !important; background: #b88e6f !important; }
 .hue.data_pkmn .element_rock     { border-color: #afa981 !important; background: #cbc7ad !important; }
 .hue.data_pkmn .element_bug      { border-color: #91a119 !important; background: #b8c26a !important; }
 .hue.data_pkmn .element_ghost    { border-color: #704170 !important; background: #a284a2 !important; }
 .hue.data_pkmn .element_steel    { border-color: #60a1b8 !important; background: #98c2d1 !important; }
 .hue.data_pkmn .element_water    { border-color: #2980ef !important; background: #74acf5 !important; }
 .hue.data_pkmn .element_electric { border-color: hsl(46, 69%, 49%) !important; background: #fcd659 !important; }
 .hue.data_pkmn .element_psychic  { border-color: #ef4179 !important; background: #f584a8 !important; }
 .hue.data_pkmn .element_dragon   { border-color: #5060e1 !important; background: #8d98ec !important; }
 .hue.data_pkmn .element_dark     { border-color: #624d4e !important; background: #998b8c !important; }
 .hue.data_pkmn .element_fairy    { border-color: #ef70ef !important; background: #f5a2f5 !important; }

 /* these swatches kept being indistinguishable in practice, so I combined them */
 .hue .field_geo, .hue.data_pkmn .element_flying
   { border-color: hsl(189, 21%, 38%) !important; background: hsl(144, 47%, 69%) !important; }
 .hue .field_ML, .hue.data_pkmn .element_fire
   { border-color: #820212 !important;  background: hsl(352, 43%, 44%) !important; }
 .hue.data_mage .bloc_earth, .hue.data_pkmn .element_grass
   { background: hsl(152, 81%, 49%) !important; }
 /* these were always the same on the regular stylesheet */
 .hue.data_pkmn .element_ice, .hue.data_adventuretime-2010 .element_ice  { border-color: hsl(192, 88%, 60%) !important; background: hsl(190, 70%,  85%) !important; }
 .hue.data_adventuretime-2010 .element_candy  { border-color: hsl(214, 63%, 32%) !important; background: hsl(336, 97%, 68%) !important; }
 
 ol.hue .field_trotsky, ol.hue .field_ML, ol.hue .field_mdem,
   ol.hue li.field_exstruct, ol.hue .field_nations,
   ol.hue li.field_geo, ol.hue li.field_fantasy, ol.hue li.field_horror  { color: inherit; }
 ol.hue li.number_empty  { color: white; }
 
  .mw-body .hue .field_ML:before, .mw-body .hue .field_ML .figure, .mw-body .hue .field_anarchy:before, .mw-body .hue .field_anarchy .figure,
   .mw-body .hue.data_mage .bloc_death:before, .mw-body .hue.data_mage .bloc_death .figure,
   .mw-body ol.hue .number_empty,  ol.hue .field_horror.element_empty:before  { color: #fafafa !important; }
  .mw-body .hue .field_mdem:before, .mw-body .hue .field_mdem .figure  { color: #eeffe8 !important; }

/* [[Category:Fake Item lists]] */