Reversedragon: Reversedragon changed the content model of the page User:Reversedragon/FirstNineThousand/hue.css/v2-1 from "wikitext" to "CSS"

2026-10-15T15:02:54Z

Reversedragon changed the content model of the page User:Reversedragon/FirstNineThousand/hue.css/v2-1 from "wikitext" to "CSS"

← Older revision	Revision as of 15:02, 15 October 2026
(No difference)

Reversedragon: new unfinished draft version of Hue

2026-10-15T15:02:02Z

new unfinished draft version of Hue

New page

/* 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">Q5684/Q56,84Starlight 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">Q5684/Q56,84Starlight Glimmer -> 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">

<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">S–56,84<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">
<a href="https://research.moraleconomy.au/index.php?title=Ontology:P158">1</a>
:<del class="aural">-</del><a href="https://research.moraleconomy.au/index.php?title=Ontology:P156">1</a>
:<del class="aural">-</del><a href="https://research.moraleconomy.au/index.php?title=Ontology:P157">1</a></ins>
</data> -> test for new formatting the violet sky opened 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); }
*/

}

User:Reversedragon/FirstNineThousand/hue.css/v2-1 - Revision history

Reversedragon: Reversedragon changed the content model of the page User:Reversedragon/FirstNineThousand/hue.css/v2-1 from "wikitext" to "CSS"

Reversedragon: new unfinished draft version of Hue