Wikia.css

Revision as of 12:49, 20 May 2020

/*
   (leaving this here for syntax-highlighting reference)

   The extended PICO-8 palette in web format, confirmed via capture
   names as suggested by https://www.romanzolotarev.com/pico-8-color-palette/
   
      0 #000000 black
      1 #1D2B53 dark-blue
      2 #7E2553 dark-purple
      3 #008751 dark-green
      4 #AB5236 brown
      5 #5F574F dark-gray
      6 #C2C3C7 light-gray
      7 #FFF1E8 white
      8 #FF004D red
      9 #FFA300 orange
     10 #FFEC27 yellow
     11 #00E436 green
     12 #29ADFF blue
     13 #83769C indigo
     14 #FF77A8 pink
     15 #FFCCAA peach
     :
    128 #291814 (name?)
    129 #111D35 (name?)
    130 #422136 (name?)
    131 #125359 (name?)
    132 #742F29 (name?)
    133 #49333B (name?)
    134 #A28879 (name?)
    135 #F3EF7D (name?)
    136 #BE1250 (name?)
    137 #FF6C24 (name?)
    138 #A8E72E (name?)
    139 #00B543 (name?)
    140 #065AB5 (name?)
    141 #754665 (name?)
    142 #FF6E59 (name?)
    143 #FF9D81 (name?)
*/


/* ----------------------------------------------------------------
     <syntaxhighlight lang="lua">
   ---------------------------------------------------------------- */

.lua.source-lua
{
    font-family: Monaco, Menlo, Ubuntu Mono, Consolas, source-code-pro, monospace;
    font-style: normal; 
    font-weight: bold;
    line-height: 1em;
    tab-size: 2;
    -o-tab-size: 2;
    -moz-tab-size: 2;
}

.lua.source-lua .de1
{
    color: #D5D4D4;
    border-top: 1px solid #FF004D;
    border-left: 1px solid #141e39;
    border-right: 1px solid #141e39;
    border-bottom: 1px solid #FF004D;

    font-family: Monaco, Menlo, Ubuntu Mono, Consolas, source-code-pro, monospace;
    font-style: normal; 
    font-weight: bold;
    line-height: 1em;
}
.lua.source-lua .de2
{
    color: #D5D4D4;
    border-top: 1px solid #FF004D;
    border-left: 1px solid #141e39;
    border-right: 1px solid #141e39;
    border-bottom: 1px solid #FF004D;

    font-family: Monaco, Menlo, Ubuntu Mono, Consolas, source-code-pro, monospace;
    font-style: normal; 
    font-weight: bold;
    line-height: 1em;
}

.lua.source-lua pre.de1
{
    background-color: #1D2B53;
    padding: 4px 2px 7px 4px;
    overflow: auto;
    word-wrap: normal;

    font-family: Monaco, Menlo, Ubuntu Mono, Consolas, source-code-pro, monospace;
    font-style: normal; 
    font-weight: bold;
    line-height: 1em;
}
.lua.source-lua pre.de2
{
    background-color: #1D2B53;
    padding: 4px 2px 7px 4px;
    overflow: auto;
    word-wrap: normal;

    font-family: Monaco, Menlo, Ubuntu Mono, Consolas, source-code-pro, monospace;
    font-style: normal; 
    font-weight: bold;
    line-height: 1em;
}

/* brackets   */ .lua.source-lua span.br0    { color: #FFF1E8; } 
/* comments   */ .lua.source-lua span.co0    { color: #83769C; font-style: normal; } 
/* comments   */ .lua.source-lua span.co1    { color: #83769C; font-style: normal; } 
/* comments   */ .lua.source-lua span.co2    { color: #83769C; font-style: normal; } 
/* comments   */ .lua.source-lua span.coMULTI{ color: #83769C; font-style: normal; } 
/* esc-seqs0  */ .lua.source-lua span.es0    { color: #29ADFF; }
/* keywords1  */ .lua.source-lua span.kw1    { color: #FF77A8; } 
/* keywords2  */ .lua.source-lua span.kw2    { color: #FF77A8; } 
/* keywords3  */ .lua.source-lua span.kw3    { color: #00E436; }
/* keywords4  */ .lua.source-lua span.kw4    { color: #29ADFF; }
/* methods0   */ .lua.source-lua span.me0    { color: #C2C3C7; } 
/* methods1   */ .lua.source-lua span.me1    { color: #C2C3C7; } 
/* methods2   */ .lua.source-lua span.me2    { color: #C2C3C7; } 
/* numbers    */ .lua.source-lua span.nu0    { color: #29ADFF; }
/* variables0 */ .lua.source-lua span.re0    { color: #C2C3C7; }
/* variables1 */ .lua.source-lua span.re0    { color: #C2C3C7; }
/* variables2 */ .lua.source-lua span.re0    { color: #C2C3C7; }
/* variables3 */ .lua.source-lua span.re0    { color: #C2C3C7; }
/* variables4 */ .lua.source-lua span.re0    { color: #C2C3C7; }
/* variables5 */ .lua.source-lua span.re0    { color: #C2C3C7; }
/* operators  */ .lua.source-lua span.sy0    { color: #FFF1E8; } 
/* strings    */ .lua.source-lua span.st0    { color: #29ADFF; }
/* strings?   */ .lua.source-lua span.st_h   { color: #29ADFF; }

/* ----------------------------------------------------------------
     <syntaxhighlight lang="io">

     literally just cut-and-pasted lua and changed "lua" to "io",
     with colors set to light gray on black, so we can use "io"
     to create similar formatting in examples at the shell prompt
   ---------------------------------------------------------------- */

.io.source-io
{
    font-family: Monaco, Menlo, Ubuntu Mono, Consolas, source-code-pro, monospace;
    font-style: normal; 
    font-weight: bold;
    line-height: 1em;
}

.io.source-io .de1
{
    color: #C2C3C7;
    border-top: 1px solid #000000;
    border-left: 1px solid #000000;
    border-right: 1px solid #000000;
    border-bottom: 1px solid #000000;

    font-family: Monaco, Menlo, Ubuntu Mono, Consolas, source-code-pro, monospace;
    font-style: normal; 
    font-weight: bold;
    line-height: 1em;
}
.io.source-io .de2
{
    color: #C2C3C7;
    border-top: 1px solid #000000;
    border-left: 1px solid #000000;
    border-right: 1px solid #000000;
    border-bottom: 1px solid #000000;

    font-family: Monaco, Menlo, Ubuntu Mono, Consolas, source-code-pro, monospace;
    font-style: normal; 
    font-weight: bold;
    line-height: 1em;
}

.io.source-io pre.de1
{
    background-color: #000000;
    padding: 4px 2px 7px 4px;
    overflow: auto;
    word-wrap: normal;

    font-family: Monaco, Menlo, Ubuntu Mono, Consolas, source-code-pro, monospace;
    font-style: normal; 
    font-weight: bold;
    line-height: 1em;
}
.io.source-io pre.de2
{
    background-color: #000000;
    padding: 4px 2px 7px 4px;
    overflow: auto;
    word-wrap: normal;

    font-family: Monaco, Menlo, Ubuntu Mono, Consolas, source-code-pro, monospace;
    font-style: normal; 
    font-weight: bold;
    line-height: 1em;
}

/* brackets   */ .io.source-io span.br0    { color: #C2C3C7; } 
/* comments   */ .io.source-io span.co0    { color: #C2C3C7; font-style: normal; } 
/* comments   */ .io.source-io span.co1    { color: #C2C3C7; font-style: normal; } 
/* comments   */ .io.source-io span.co2    { color: #C2C3C7; font-style: normal; } 
/* comments   */ .io.source-io span.coMULTI{ color: #C2C3C7; font-style: normal; } 
/* esc-seqs0 */ .io.source-io span.es0    { color: #C2C3C7; }
/* keywords1  */ .io.source-io span.kw1    { color: #C2C3C7; } 
/* keywords2  */ .io.source-io span.kw2    { color: #C2C3C7; } 
/* keywords3  */ .io.source-io span.kw3    { color: #C2C3C7; }
/* keywords4  */ .io.source-io span.kw4    { color: #C2C3C7; }
/* methods0   */ .io.source-io span.me0    { color: #C2C3C7; } 
/* methods1   */ .io.source-io span.me1    { color: #C2C3C7; } 
/* methods2   */ .io.source-io span.me2    { color: #C2C3C7; } 
/* numbers    */ .io.source-io span.nu0    { color: #C2C3C7; }
/* variables0 */ .io.source-io span.re0    { color: #C2C3C7; }
/* variables1 */ .io.source-io span.re0    { color: #C2C3C7; }
/* variables2 */ .io.source-io span.re0    { color: #C2C3C7; }
/* variables3 */ .io.source-io span.re0    { color: #C2C3C7; }
/* variables4 */ .io.source-io span.re0    { color: #C2C3C7; }
/* variables5 */ .io.source-io span.re0    { color: #C2C3C7; }
/* operators  */ .io.source-io span.sy0    { color: #C2C3C7; } 
/* strings    */ .io.source-io span.st0    { color: #C2C3C7; }
/* strings?   */ .io.source-io span.st_h   { color: #C2C3C7; }

/* ----------------------------------------------------------------
     <syntaxhighlight lang="JavaScript">
   ---------------------------------------------------------------- */

.javascript.source-javascript pre.de1 {
    color: #D5D4D4;
    
    background-color: #1D2B53;
    border: 1px solid #595959;
    line-height: 14px;
    overflow: auto;
    padding: 12px;
    word-wrap: normal;
    font-family: Monaco, Menlo, Ubuntu Mono, Consolas, source-code-pro, monospace;
}

.javascript.source-javascript span.kw1 { color: #FF77A8; }
.javascript.source-javascript span.kw2 { color: #FF77A8; }
.javascript.source-javascript span.br0 { color: #FFF1E8; }
.javascript.source-javascript span.sy0 { color: #FFF1E8; }
.javascript.source-javascript span.kw3 { color: #00E436; }
.javascript.source-javascript span.nu0 { color: #29ADFF; }
.javascript.source-javascript span.kw4 { color: #29ADFF; }
.javascript.source-javascript span.st0 { color: #29ADFF; }

/* ----------------------------------------------------------------
     <code>
   ---------------------------------------------------------------- */

code {
    /* color: #C2C3C7; have to settle for default color, or links turn gray too */
    font-family: Monaco, Menlo, Ubuntu Mono, Consolas, source-code-pro, monospace;
    font-style: normal; 
    font-weight: bold;

    background-color: #222;
    
    border: 0.2em solid #222;
    -moz-border-radius: 0.2em;
    -webkit-border-radius: 0.2em;
    border-radius: 0.2em;
}

/* ----------------------------------------------------------------
     <var>
   ---------------------------------------------------------------- */

var {
    /* color: #C2C3C7; have to settle for default color, or links turn gray too */
    font-family: Monaco, Menlo, Ubuntu Mono, Consolas, source-code-pro, monospace;
    font-style: normal; 
    font-weight: bold;
    
    background-color: #222;
    
    border: 0.2em solid #222;
    -moz-border-radius: 0.2em;
    -webkit-border-radius: 0.2em;
    border-radius: 0.2em;
}

/* ----------------------------------------------------------------
     <kbd>
   ---------------------------------------------------------------- */

kbd {
    border: 1px solid #aaa;
    -moz-border-radius: 0.2em;
    -webkit-border-radius: 0.2em;
    border-radius: 0.2em;
    -moz-box-shadow: 0.1em 0.1em 0.2em rgba(0,0,0,0.1);
    -webkit-box-shadow: 0.1em 0.1em 0.2em rgba(0,0,0,0.1);
    box-shadow: 0.1em 0.1em 0.2em rgba(0,0,0,0.1);
    background-color: #f9f9f9;
    background-image: -moz-linear-gradient(top, #eee, #f9f9f9, #eee);
    background-image: -o-linear-gradient(top, #eee, #f9f9f9, #eee);
    background-image: -webkit-linear-gradient(top, #eee, #f9f9f9, #eee);
    background-image: linear-gradient(to bottom, #eee, #f9f9f9, #eee);
    padding: 0.1em 0.3em;
    font-family: inherit;
    font-size: 0.85em;
    color: #232323;
}

/* an experiment that isn't working, pay it no mind */
.tablebit {
    font-family: Monaco, Menlo, Ubuntu Mono, Consolas, source-code-pro, monospace;
    font-style: normal; 
    font-weight: bold;
    padding-left: 0;
    padding-right: 0;
}