Jump to content

User:Reversedragon/FirstNineThousand/hue.css/v2-1: Difference between revisions

From LithoGraphica
Reversedragon (talk | contribs)
Bureaucrats, Conference pass, Interface administrators, Arts-aligned editors, Crimson-aligned editors, Violet-aligned editors, Administrators
18,646 edits
new unfinished draft version of Hue
 
Reversedragon (talk | contribs)
Bureaucrats, Conference pass, Interface administrators, Arts-aligned editors, Crimson-aligned editors, Violet-aligned editors, Administrators
18,646 edits
Reversedragon changed the content model of the page User:Reversedragon/FirstNineThousand/hue.css/v2-1 from "wikitext" to "CSS"
 
(No difference)

Latest revision as of 15:02, 15 October 2026

/* number list basics */

ol.hue  { list-style-type: none; }

ol.hue h4  { display: inline; }

.hue dfn  { font-style: normal; }

.hue .definition ins, .hue .definition a, .hue .definition abbr, .hue .clarifier,
  /* old versions */
.hue del.field, .hue ins.field
   { text-decoration: none; border-bottom: none; }

/* backgrounds */
.hue .icon2  { background: none; }

/* definition lists */
dl.hue .value-main  { display: grid; grid-template-columns: 15.2em auto; }
dl.hue .row dd  { display: inline-block; }


/* hidden in all hue lists */
.hue .definition a:after, .hue .field-tag a:after, .hue .proposed-icon a:after  { display: none; }
/* hidden in number lists */
ol.hue .wave-score  { display: none; }
/* hidden in definition lists */
dl.hue .search-hint, dl.hue .field_tag, dl.hue .definition .flag,
.data_wavebuild .row dt, .data_wavebuild .p153 .value-main, .data_wavebuild .p153 .p145, .data_wavebuild a:after
  { display: none; }


/* number lists */
ol.hue  { position: relative; line-height: inherit; }
.mw-content-ltr ol.hue { margin-left: 0; }  .mw-content-rtl ol.hue { margin-right: 0; }

ol.hue li  { display: block; position: relative; z-index: 1; margin-bottom: 0.1em; min-width: 10em; }
.mw-content-ltr ol.hue li { padding-left: 10em; }  .mw-content-rtl ol.hue li { padding-right: 10em; }  /* hue list beginning-edge margin */
/* hue list hanging indent */
ol.hue .icon2 .item-number,  ol.hue .icon1:before, ol.hue.icon1-0 li:before  { margin: 0 0.5em 0 0.5em; padding: 0 0.7em; }
.mw-content-ltr ol.hue .icon2 .item-number,  .mw-content-ltr ol.hue .icon1:before, .mw-content-ltr ol.hue.icon1-0 li:before  { margin-left:  -9.95em; }
.mw-content-rtl ol.hue .icon2 .item-number,  .mw-content-rtl ol.hue .icon1:before, .mw-content-rtl ol.hue.icon1-0 li:before  { margin-right: -9.95em; }


@media screen {


/* hidden */
.search-hint  { visibility: hidden; height: 0; width: 0; position: absolute; top: 0; }

/* number lists */

ol.hue  { position: relative; line-height: inherit; }
.mw-content-ltr ol.hue { margin-left: 0; }  .mw-content-rtl ol.hue { margin-right: 0; }

ol.hue li  { display: block; position: relative; z-index: 1; margin-bottom: 0.1em; min-width: 10em; }
.mw-content-ltr ol.hue li { padding-left: 10em; }  .mw-content-rtl ol.hue li { padding-right: 10em; }  /* hue list beginning-edge margin */
/* hue list hanging indent */
ol.hue .icon2 .item-number,  ol.hue .icon1:before, ol.hue.icon1-0 li:before  { margin: 0 0.5em 0 0.5em; padding: 0 0.7em; }
.mw-content-ltr ol.hue .icon2 .item-number,  .mw-content-ltr ol.hue .icon1:before, .mw-content-ltr ol.hue.icon1-0 li:before  { margin-left:  -9.95em; }
.mw-content-rtl ol.hue .icon2 .item-number,  .mw-content-rtl ol.hue .icon1:before, .mw-content-rtl ol.hue.icon1-0 li:before  { margin-right: -9.95em; }

/* number list */

ol.hue.clean .icon1[data-qid][data-dimension]:before, ol.hue.clean.icon1-0 li[data-qid][data-dimension]:before
  { content: attr(data-dimension)"–"attr(data-qid); }  /* generate numbers on old lists; backwards compatibility */

/* position for numberings and backgrounds */
ol.hue .icon2 .item-number, .hue .icon2 .background,  ol.hue .icon1:before, .hue .icon1:after  { content: " "; }  /* generated elements */
.hue .icon2 .background,  .hue .icon1:after  { display: block; position: absolute; }
ol.hue .icon2 .item-number,  ol.hue .icon1:before, ol.hue.icon1-0 li:before  { display: inline-block; position: relative; z-index: 4; }

/* item numbers */
ol.hue .icon2 .item-number,  ol.hue .icon1:before, ol.hue.icon1-0 li:before  { min-width: 7em; border-style: solid; border-width: 0 4px 0 4px; text-align: right; }
   .mw-content-rtl ol.hue .icon2 .item-number,  .mw-content-rtl ol.hue .icon1:before, ol.hue.icon1-0 li:before  { text-align: left; }
/* secondary field code icon on item number */
ol.hue .icon2 .field-code { position: absolute; z-index: 5; width: 2em; padding: 0; text-align: center; left: 0.8em; }
   .mw-content-rtl ol.hue .icon2 .field-code { right: 0.8em; }
/* font-size: 85%; */

ol.hue .icon2 .item-number  { top: 0; }

.search-hint  { margin: 0; left: 0; }

ol.hue .icon2 .field-icon .field-spacer, ol.hue .icon2 .field-icon rp.visual
  { display: none; }


ol.hue .icon2 .item-sense-code  { font-size: 77%; margin-left: 0.22em; font-style: italic; }  /* sense code displayed on Item */

/* wider hue lists */
ol.hue-8em .icon2 .item-number,  ol.hue-8em .icon1:before, ol.hue-8em.icon1-0 li:before  { min-width: 8em; }


/* data tables */

dl.hue .row { border-width: 0 0 1px 0; }  dl.hue .row:last-child { border-width: 0 0 0 0; }  /* border around each row */
dl.hue .row dt:first-child { border-width: 0 1px 0 0; box-sizing: border-box; }  /* grid overlays padded boxes weirdly without border-box */
dl.hue dfn { min-width: 11em; padding: 0.12em 0.8em 0 0; }
dl.hue .row dl dt  { margin-left: 1.5em; }
dl.hue .row dl dt:first-child { border-width: 1px; }

.mw-content-ltr .hue .wave-score { margin-left: 0.4em; }  .mw-content-rtl .hue .wave-score { margin-right: 0.4em; }  /* wave score beginning-edge margin */

/* stuff inside definitions */

.hue .definition a code  { background: none; border: none; }  /* tidy up code tag inside Item */

/* backgrounds */

.hue .icon1 dfn  { z-index: 1; }

.hue .icon2 .background, .hue .icon1:after  { width: 100%; height: 100%; left: 0; top: 0; opacity: 0.1; }
.hue .icon2 .background  { z-index: -1; opacity: 0.1; }
.hue .icon1:after  { z-index: 1; /*opacity: 0.9;*/ opacity: 0.6; }


/* colors */

.hue .icon2 .definition, .hue .icon2 .field-code,
.hue dt .definition
  { background: none; }

.hue .definition a  { color: inherit; }

/* number list colors */
ol.hue .icon2 .item-number,  ol.hue .icon1:before, ol.hue.icon1-0 li:before  { background-color: inherit; }
ol.hue .icon2 .item-number,  ol.hue .icon1:before, ol.hue.icon1-0 li:before  { border-color: inherit; }
.mw-body ol.hue,  .mw-body ol.hue .icon2 .field-code,  .mw-body ol.hue .icon1,  dl.hue dfn  { color: inherit; }
/* colorless list entry */
ol.hue li  { border-color: #808080; background: #e9e9e9; }

/* definition list colors */
dl.hue, .wikitable dt, .wikitable dfn:before, .wikitable dfn .figure, p dfn.hue-term.manual .figure  { border: 1px solid var(--border-color-base,#a2a9b1); }
dl.hue, .wikitable .row, .wikitable dt, .wikitable dd,  dl.hue dfn:after { background: var(--background-color-neutral-subtle,#f8f9fa); }
.wikitable dt,  dl.hue dt dfn:after { background: var(--background-color-neutral,#eaecf0); }

.hue .icon1:after,  ol.hue.icon1-0 li:after, ol.hue.icon1-0 dfn:after
  { background: var(--background-color-base,#fff); }  /* second-background for number lists */


}
@media print {

.search-hint,
.data_wavebuild .rejected-combo
  { display: none; }

}

/*  new.html
<ol class="hue clean field_horror field_ML" data-rem="NEW">
<li class="field_fantasy field_horror manual icon1" data-dimension="S" data-qid="56,84" value="5684" data-icon="S1/DFy"><span class="search-hint" aria-hidden="true">Q5684/Q56,84</span>Starlight Glimmer (<cite data-entity="">My Little Pony: Friendship is Magic</cite>)

</li><li class="field_ML manual icon1" data-dimension="S" data-qid="56,84" value="5684" data-icon="S1/ML"><span class="search-hint" aria-hidden="true">Q5684/Q56,84</span>Starlight Glimmer  -&gt;  you may put this character in red for Alternate Universe scenarios only

</li><li class="mix-match-not  manual icon2" value="5684" data-icon="S1/MX">
  <mark class="background field_mdem"></mark>
  <data lang="en" class="definition plainlinks manual flag field_fantasy">
  <abbr class="field-icon tts field_mdem" title="S1 Signifier Item / metatransitional literature / Item ID Q56,84 / main sense">
    <ruby class="item-number field_mdem"><span class="visual">S–56,84</span><rp>;</rp><rt class="aural">56,84. (S)</rt></ruby>
    <ruby class="field-code"><rp class="visual" aria-hidden="true">[</rp><rp class="aural">(</rp><a href="https://research.moraleconomy.au/index.php?title=Ontology:Q92">MX</a><rp class="aural">)</rp><rp class="visual" aria-hidden="true">]</rp><ins class="field-spacer"> / </ins></ruby><ins class="spacer"> </ins>
  </abbr>
  <dfn>Starlight Glimmer</dfn>
  <ins class="wave-score tts">
    <span class="sum"><a href="https://research.moraleconomy.au/index.php?title=Ontology:P158">1</a></span>
    <span class="quilt"><span class="visual" aria-hidden="true">:</span><del class="aural">-</del><a href="https://research.moraleconomy.au/index.php?title=Ontology:P156">1</a></span>
    <span class="ply"><span class="visual" aria-hidden="true">:</span><del class="aural">-</del><a href="https://research.moraleconomy.au/index.php?title=Ontology:P157">1</a></span></ins>
  </data>  -&gt;  test for new formatting<br/> the violet sky opened<br/> indigo drifted over the moon

</li></ol>

Template:HueCSS/v1
  User:Reversedragon/FirstNineThousand/hue.css/v1-1
  User:Reversedragon/FirstNineThousand/hue2.css/v1-1
*/


@media screen {
  /* special setup for rainbow swatches - these are overridden by everything else */
  .hue .field_LGBT { border-color: #1b3671; background: #a399f2; /* lavender */ }

  /* general categories */
  .hue .field_internal { border-color: #909090; background: #d3d3d3; /* silver; LightGray */ }
  .hue .field_geo      { border-color: #3d4831; background: #749363; /* chlorophyll green, earth */ }
  .hue .field_nations  { border-color: #ae8847; background: #ddb887; /* khaki; Burlywood */ }
  .hue .field_ML       { border-color: #820212; background: #c24252; /* crimson */ }
  .hue .field_mdem     { border-color: #5330ab; background: #9370db; /* violet; MediumPurple */ }
  .hue .field_anarchy  { border-color: #3f3b3b; background: #7f7f8e; /* charcoal */ }
  .hue .field_fantasy  { border-color: #40ae50; background: #90ee90; /* bright green; LightGreen */ }
    /* colors */
  .hue .field_ML, .hue .field_anarchy  { color: rgba(255, 255, 255, 0.975); }

  /* swatches subject to 'final clash' effect - in which activating "IV" polarizes swatches into bourgeois/Trotskyist swatches */
  .hue .field_gramsci, .hue.field_trotsky .field_onecountry, .hue.field_trotsky .field_tendency-soup
    { border-color: #7e2b42; background: #f589a7; /* strawberry */ }
  .hue .field_exstruct, .hue.field_trotsky .field_unionbureaucrats
    { border-color: #4969e9; background: #afcce6; /* sky blue */ }
  .hue .field_trotsky, .hue.field_trotsky .field_engels
    { border-color: #b71a0a; background: #fd9920; /* flame; igneous; DarkOrange */ }

  /* rare fields - these override the common fields if one of those is specified */
  .hue.field_GNU .field_GNU       { border-color: #ec8500; background: #292960; /* penguin */ }
  .hue.field_horror .field_horror { border-color: #0f130b; background: #227910; /* dark green */ }
  .hue .number_empty, .hue .element_empty  { border-color: transparent; background: #404040; }
  /* relativity */
  .hue.field_relativity .field_relativity  { border-color: #a1ca58; background: #374a2b; /* void aurora green */ }
  dl.hue.field_relativity .field_relativity .figure, dl.hue.field_relativity .field_relativity:before  { background: #374a2b linear-gradient(166deg,#374a2b 31%,#a1ca58 50%,#374a2b 69%); }
  .hue.field_relativity .hue-term .field_relativity  { background: #374a2b linear-gradient(150deg,#374a2b 31%,#a1ca58 50%,#374a2b 69%); }
  /* LGBT swatch - styling just the numbers is a bit of a pain right now */
  .hue li.field_LGBT:before, .hue li[value].field_LGBT:before, .hue .field_LGBT .figure  { background: #a399f2 linear-gradient(90deg,rgba(194, 87, 87, 0.7), rgba(170, 154, 75, 0.7), rgba(147, 219, 64, 0.7), rgba(123, 224, 140, 0.7), rgba(96, 210, 188, 0.7), rgba(70, 196, 235, 0.7), rgba(96, 116, 230, 0.7), rgba(119, 47, 173, 0.7));  border-color: #605a60; }
  ol.hue li.field_LGBT:before, ol.hue li[value].field_LGBT:before, ol.hue .field_LGBT .figure  { border-color: #650668; border-left-color: #680f06; border-right-color: #650668; }
  dl.hue .field_LGBT:before, dl.hue .field_LGBT .figure  { background: #a399f2 linear-gradient(135deg,rgba(194,87,87,0.7),rgba(170,154,75,0.7),rgba(178,219,64,0.7),rgba(123,224,167,0.7),rgba(15, 177, 240, 0.7),rgba(90, 85, 244, 0.7)); }
    /* colors */
  ol.hue .number_empty, ol.hue .field_geo.element_empty, ol.hue .field_horror.element_empty  { color: rgba(255, 255, 255, 0.975); }

  /* hyper-specific political-agorisms or Leninisms */
  .hue.field_exstruct .field_rdemocracy { border-color: #273d99; background: #59a8ee; /* vivid sky; "sky2" */ }
  .hue.field_exstruct .field_reagan     { border-color: #0b184d; background: #1518c6; /* dark blue */ }
  .hue.field_exstruct .field_humanities { border-color: #515a8c; background: #9de1d7; /* tide blue, cyan */ }
  .hue.field_exstruct .field_freud      { border-color: #042019; background: #114779; /* abyss blue */ }
  .hue.field_exstruct .field_rhizome    { border-color: #11236a; background: #5b7993; /* blue black */ }
  .hue.field_ML .field_mao        { border-color: #750a32; background: #bf3a73; /* hyacinth; berry red */ }
  .hue.field_ML .field_althusser  { border-color: #4f1313; background: #c596d2; /* dusky lavender */ }
  .hue.field_ML .field_14quarters { border-color: #882670; background: #ee4e29; /* vermilion */ }
  /* hyper-specific eclectic anarchisms */
  .hue .field_BPP, .hue.field_exstruct .field_robinson-gilmore, .hue.field_ML .field_robinson-gilmore
  { border-color: #80516b; background: #571257; /* buttertree or nsafu */ }
    /* colors */
  .hue.field_exstruct .field_reagan, .hue.field_ML .field_althusser, .hue.field_ML .field_14quarters, .hue .field_BPP  { color: rgba(255, 255, 255, 0.975); }
       /* .mw-body .hue.field_ML .field_14quarters */

  /* series-specific tweaks */
    /* Arcmage */
  .hue.data_mage .bloc_earth  { border-color: #4e6400; background: #afc641; }
  .hue.data_mage .bloc_sun    { border-color: #821408; background: #d07450; }
  .hue.data_mage .bloc_sea    { border-color: #093e73; background: #1e99bd; }
  .hue.data_mage .bloc_steel  { border-color: #645a5a; background: #ececec; }
  .hue.data_mage .bloc_death  { border-color: #937a1b; background: #4d293e; color: rgba(255, 255, 255, 0.975); }
    /* tea dragon society */
  .hue.data_teadragon .suit_spring { border-color: hsl(354, 40%, 65%); background: hsl(102, 77%, 72%); }
  .hue.data_teadragon .suit_summer { border-color: hsl(138, 70%, 25%); background: hsl(56,  82%, 72%); }
  .hue.data_teadragon .suit_autumn { border-color: hsl(3,   70%, 25%); background: hsl(14,  91%, 72%); }
  .hue.data_teadragon .suit_winter { border-color: hsl(141, 70%, 25%); background: hsl(240, 40%, 80%); }
       /* these were in HSL to be easier to balance against each other */

  .hue.series_pkmn .element_ice, .hue.data_adventuretime-2010 .element_ice  { border-color: #3dcef3; background: #81dff7; }
  .hue.data_urbanfantasy .element_candy, .hue.data_adventuretime-2010 .element_candy  { border-color: #9d2abc; background: #fd5dcc; }

  .hue.series_pkmn .element_normal   { border-color: #9fa19f; background: #c1c2c1; }
  .hue.series_pkmn .element_fighting { border-color: #ff8000; background: #ffac59; }
  .hue.series_pkmn .element_flying   { border-color: #81b9ef; background: #add2f5; }
  .hue.series_pkmn .element_poison   { border-color: #9141cb; background: #b884dd; }
  .hue.series_pkmn .element_ground   { border-color: #915121; background: #b88e6f; }
  .hue.series_pkmn .element_rock     { border-color: #afa981; background: #cbc7ad; }
  .hue.series_pkmn .element_bug      { border-color: #91a119; background: #b8c26a; }
  .hue.series_pkmn .element_ghost    { border-color: #704170; background: #a284a2; }
  .hue.series_pkmn .element_steel    { border-color: #60a1b8; background: #98c2d1; }
  .hue.series_pkmn .element_fire     { border-color: #e62829; background: #ef7374; }
  .hue.series_pkmn .element_water    { border-color: #2980ef; background: #74acf5; }
  .hue.series_pkmn .element_grass    { border-color: #3fa129; background: #82c274; }
  .hue.series_pkmn .element_electric { border-color: #fac000; background: #fcd659; }
  .hue.series_pkmn .element_psychic  { border-color: #ef4179; background: #f584a8; }
  .hue.series_pkmn .element_dragon   { border-color: #5060e1; background: #8d98ec; }
  .hue.series_pkmn .element_dark     { border-color: #624d4e; background: #998b8c; }
  .hue.series_pkmn .element_fairy    { border-color: #ef70ef; background: #f5a2f5; }

  /* swatch text colors
  .mw-body .hue .field_mdem:before, .mw-body .hue .field_mdem .figure,
  .mw-body .hue.field_exstruct .field_freud .figure, .hue.field_exstruct .field_freud:before,
  .mw-body .hue.field_relativity .field_relativity .figure, .hue.field_relativity .field_relativity:before,
  .mw-body .hue.field_horror .field_horror .figure, .hue.field_horror .field_horror:before
  { color: rgba(255, 255, 255, 0.945); }
  .mw-body .hue.field_ML .field_althusser:before, .mw-body .hue.field_ML .field_althusser .figure,
  .mw-body .hue.field_trotsky .field_engels:before, .mw-body .hue.field_trotsky .field_engels .figure,
  .mw-body .hue.field_trotsky .field_onecountry:before, .mw-body .hue.field_trotsky .field_onecountry .figure,
  .mw-body .hue.field_trotsky .field_tendency-soup:before, .mw-body .hue.field_trotsky .field_tendency-soup .figure
  { color: rgb(32, 33, 34); }
  */

}
Retrieved from "https://research.moraleconomy.au/index.php?title=User:Reversedragon/FirstNineThousand/hue.css/v2-1&oldid=46861"