988 lines
20 KiB
CSS
988 lines
20 KiB
CSS
|
|
||
|
|
/*
|
||
|
|
----------------------------------------------------------------------------
|
||
|
|
EmacsWiki light theme
|
||
|
|
----------------------------------------------------------------------------
|
||
|
|
A combination of some of the existing themes on the EmacsWiki at
|
||
|
|
http://emacswiki.org, with various other additions.
|
||
|
|
The base theme was the cali2.css theme - question marks indicate things left
|
||
|
|
over which might be removable.
|
||
|
|
Released under the MIT License.
|
||
|
|
----------------------------------------------------------------------------
|
||
|
|
*/
|
||
|
|
|
||
|
|
|
||
|
|
/* ---------------------------------------------------------------------- */
|
||
|
|
/* Base */
|
||
|
|
/* ---------------------------------------------------------------------- */
|
||
|
|
|
||
|
|
body {
|
||
|
|
margin: 0 0 1.5em 0;
|
||
|
|
padding: 1em 1em;
|
||
|
|
color: #111;
|
||
|
|
background-color: #fffefe;
|
||
|
|
font-size: 100%;
|
||
|
|
}
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
body {
|
||
|
|
color: #ccc;
|
||
|
|
background-color: #181818;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Screenshots, Images */
|
||
|
|
img {
|
||
|
|
max-width: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Code - used for keysequences, function references (anything in `...') */
|
||
|
|
/* Pre - used for blocks of code */
|
||
|
|
code, pre {
|
||
|
|
color: #444;
|
||
|
|
background-color: #f9f8f8;
|
||
|
|
border: 1px solid #ddd;
|
||
|
|
|
||
|
|
font-family: monospace;
|
||
|
|
|
||
|
|
/* For some reason, using a different font than the default monospace */
|
||
|
|
/* increases the size of the text, so need to counteract that here */
|
||
|
|
/* font-size: 0.8em; */
|
||
|
|
}
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
code, pre {
|
||
|
|
color: #ccc;
|
||
|
|
background-color: #222;
|
||
|
|
border: 1px solid #333;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
code {
|
||
|
|
padding: 1px;
|
||
|
|
}
|
||
|
|
pre {
|
||
|
|
margin: 1em 0;
|
||
|
|
padding: 1em 2em;
|
||
|
|
overflow: auto; /* add horizontal scrollbar if necessary */
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
/* Links */
|
||
|
|
a {
|
||
|
|
color: #06b;
|
||
|
|
background-color: inherit;
|
||
|
|
|
||
|
|
/* This works on firefox, but just shows as a plain underline in chrome, which looks terrible */
|
||
|
|
/* text-decoration: underline dotted #09c; */
|
||
|
|
|
||
|
|
/* Faking a dotted underline, works on all browsers but can't adjust position */
|
||
|
|
text-decoration: none;
|
||
|
|
/* border-bottom: 1px dotted #09c; */
|
||
|
|
}
|
||
|
|
a:link, a:visited {
|
||
|
|
background-color: inherit;
|
||
|
|
}
|
||
|
|
a:active, a:hover {
|
||
|
|
color: #09d;
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
a {
|
||
|
|
color: #9c5;
|
||
|
|
}
|
||
|
|
a:active, a:hover {
|
||
|
|
color: #ae6;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
/* external links */
|
||
|
|
/* a.url:before { content: "\2197"; } */
|
||
|
|
/* .safari a.url:before { content: url(http://www.emacswiki.org/alex/pics/arrow.png); } */
|
||
|
|
/* image links */
|
||
|
|
a.image img {
|
||
|
|
border: none;
|
||
|
|
}
|
||
|
|
a.left {
|
||
|
|
float: left;
|
||
|
|
margin: 20px;
|
||
|
|
}
|
||
|
|
a.right {
|
||
|
|
float: right;
|
||
|
|
margin: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Images */
|
||
|
|
/* dim images for dark theme */
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
img {filter: brightness(70%);}
|
||
|
|
img:hover {filter: brightness(100%);}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Headers */
|
||
|
|
h1, h2, h3, h4 {
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
font-weight: normal;
|
||
|
|
line-height: normal;
|
||
|
|
clear: both;
|
||
|
|
}
|
||
|
|
@media (max-width: 580px) {
|
||
|
|
h2 {font-size: 1.5em;}
|
||
|
|
h3 {font-size: 1.2em;}
|
||
|
|
h4 {font-size: 1.7em;}
|
||
|
|
}
|
||
|
|
@media (min-width: 580px) {
|
||
|
|
h2 {font-size: 1.7em;}
|
||
|
|
h3 {font-size: 1.3em;}
|
||
|
|
h4 {font-size: 1em;}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* h1 */
|
||
|
|
/* defined further below */
|
||
|
|
|
||
|
|
/* h2 */
|
||
|
|
h2 {
|
||
|
|
/* line under header */
|
||
|
|
margin-top: 1.2em;
|
||
|
|
margin-bottom: 1em;
|
||
|
|
border-bottom: 1px solid #aaa;
|
||
|
|
|
||
|
|
/* divider between sections */
|
||
|
|
/* margin-top: 1em; */
|
||
|
|
/* padding-top: 1em; */
|
||
|
|
/* border-top: 1px solid #bbb; */
|
||
|
|
/* margin-bottom: 1em; */
|
||
|
|
}
|
||
|
|
|
||
|
|
/* h3 */
|
||
|
|
h3 {
|
||
|
|
font-style: italic;
|
||
|
|
margin-top: 0.1em;
|
||
|
|
padding-top: 0.5em;
|
||
|
|
margin-bottom: 0.5em;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* h4 */
|
||
|
|
h4 {
|
||
|
|
font-style: italic;
|
||
|
|
margin-top: 0.1em;
|
||
|
|
padding-top: 0.5em;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* hr */
|
||
|
|
hr {
|
||
|
|
border: 0;
|
||
|
|
height: 0;
|
||
|
|
border-bottom: 1px solid #ccc;
|
||
|
|
padding-top: 1em;
|
||
|
|
margin-bottom: 2em;
|
||
|
|
width: 100%;
|
||
|
|
clear: both;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Tables */
|
||
|
|
table {
|
||
|
|
/* border-collapse: collapse; /\* otherwise leaves gaps in between cell outlines *\/ */
|
||
|
|
}
|
||
|
|
table tr.first td {
|
||
|
|
border-bottom: 1px solid #bbb;
|
||
|
|
}
|
||
|
|
table td,th {
|
||
|
|
padding: 0 1ex;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
/* odd/even rows */
|
||
|
|
/* table tr.odd { */
|
||
|
|
/* background-color: #fcfbfb; */
|
||
|
|
/* } */
|
||
|
|
|
||
|
|
|
||
|
|
/* Table on the new page */
|
||
|
|
/* ? */
|
||
|
|
p.table a { float: left; width: 20ex; }
|
||
|
|
p.table + p { clear: both; padding-top: 10px; }
|
||
|
|
|
||
|
|
|
||
|
|
/* Definition lists */
|
||
|
|
dt {
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
/* ---------------------------------------------------------------------- */
|
||
|
|
/* Layout */
|
||
|
|
/* ---------------------------------------------------------------------- */
|
||
|
|
|
||
|
|
|
||
|
|
/* Header - includes logo, search bar, goto bar, and article title */
|
||
|
|
.specialdays {
|
||
|
|
display: block;
|
||
|
|
position: absolute;
|
||
|
|
top: 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Logo */
|
||
|
|
/* hide the existing logo and override it with a different image */
|
||
|
|
img.logo {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
a.logo {
|
||
|
|
display: block;
|
||
|
|
/* just a placeholder for the moment */
|
||
|
|
background: url(./images/logo218x38.png);
|
||
|
|
width: 218px;
|
||
|
|
height: 38px;
|
||
|
|
top: 22px;
|
||
|
|
left: 22px;
|
||
|
|
border-bottom: none;
|
||
|
|
text-decoration: none;
|
||
|
|
float: left;
|
||
|
|
}
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
a.logo {
|
||
|
|
filter: invert(90%) hue-rotate(150deg) saturate(0.9);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Search bar */
|
||
|
|
/* don't let search bar overwrite logo */
|
||
|
|
@media (max-width: 580px) {
|
||
|
|
form.search {
|
||
|
|
margin-top: 0.5em;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
nav {
|
||
|
|
float: right;
|
||
|
|
height: 2.5em;
|
||
|
|
}
|
||
|
|
form.search {
|
||
|
|
float: right;
|
||
|
|
clear: both;
|
||
|
|
}
|
||
|
|
nav p {
|
||
|
|
margin: 0;
|
||
|
|
margin-top: 0.1em;
|
||
|
|
padding: 0;
|
||
|
|
}
|
||
|
|
label[for="searchlang"], input#searchlang {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Bars (Goto bar, Translation bar, Edit bar) */
|
||
|
|
span.bar a {
|
||
|
|
font-size: 1em;
|
||
|
|
color: #444;
|
||
|
|
}
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
span.bar a {
|
||
|
|
color: #888;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Goto bar (SiteMap, HowTo, etc) */
|
||
|
|
@media (max-width: 580px) { /* show along top */
|
||
|
|
span.gotobar {
|
||
|
|
float: left;
|
||
|
|
margin-top: 0.5em;
|
||
|
|
}
|
||
|
|
span.gotobar a + a:before {
|
||
|
|
content: "|";
|
||
|
|
color: #ccc;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (min-width: 580px) { /* show on left side */
|
||
|
|
span.gotobar {
|
||
|
|
position: absolute;
|
||
|
|
top: 3.5em;
|
||
|
|
left: 20px;
|
||
|
|
width: 140px; /* left+width=160px */
|
||
|
|
padding-right: 1em;
|
||
|
|
padding-top: 30px;
|
||
|
|
border-top: 1px solid #aaa;
|
||
|
|
}
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
span.gotobar {
|
||
|
|
border-top: 1px solid #444;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
span.gotobar a {
|
||
|
|
display: block;
|
||
|
|
margin-top: 0.5em;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
span.gotobar {
|
||
|
|
line-height: 1em;
|
||
|
|
}
|
||
|
|
span.gotobar a {
|
||
|
|
border-bottom: none;
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
span.gotobar a:hover {
|
||
|
|
color: #09d;
|
||
|
|
}
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
span.bar a:hover {
|
||
|
|
color: #ae6;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Messages */
|
||
|
|
div.message {
|
||
|
|
position: absolute;
|
||
|
|
left: 300px;
|
||
|
|
top: 1em;
|
||
|
|
height: 1.4em;
|
||
|
|
margin: 0;
|
||
|
|
padding: 5px 2em 2px;
|
||
|
|
background-color: MediumTurquoise;
|
||
|
|
color: #000;
|
||
|
|
box-shadow: 2px 2px 2px 0 #888;
|
||
|
|
}
|
||
|
|
div.message p {
|
||
|
|
margin: 0;
|
||
|
|
}
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
div.message {
|
||
|
|
border: solid 1px #08f;
|
||
|
|
background-color: black;
|
||
|
|
color: #08f;
|
||
|
|
box-shadow: none;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
/* h1 (title) */
|
||
|
|
@media (max-width: 580px) {
|
||
|
|
header h1 {
|
||
|
|
margin-top: 1em;
|
||
|
|
float: left;
|
||
|
|
clear: both;
|
||
|
|
font-size: 2em;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (min-width: 580px) {
|
||
|
|
header h1 {
|
||
|
|
margin-left: 160px;
|
||
|
|
border-left: 1px solid #aaa;
|
||
|
|
border-top: 1px solid #aaa;
|
||
|
|
padding-left: 20px;
|
||
|
|
font-size: 2.5em;
|
||
|
|
}
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
header h1 {
|
||
|
|
border-left: 1px solid #444;
|
||
|
|
border-top: 1px solid #444;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
header h1 {
|
||
|
|
padding-top: 30px;
|
||
|
|
}
|
||
|
|
header h1 a {
|
||
|
|
color: inherit;
|
||
|
|
background-color: inherit;
|
||
|
|
border-bottom: none;
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Content */
|
||
|
|
@media (max-width: 580px) {
|
||
|
|
div.wrapper {
|
||
|
|
clear: both;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@media (min-width: 580px) {
|
||
|
|
div.wrapper {
|
||
|
|
margin-left: 160px; /* see gotobar */
|
||
|
|
border-left: 1px solid #aaa;
|
||
|
|
padding: 1em;
|
||
|
|
}
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
div.wrapper {
|
||
|
|
border-left: 1px solid #444;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
div.wrapper {
|
||
|
|
min-height: 14em; /* so gotobar won't overwrite footer on small pages */
|
||
|
|
}
|
||
|
|
div.wrapper {
|
||
|
|
padding-top: 0.5em;
|
||
|
|
}
|
||
|
|
div.close {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Table of contents */
|
||
|
|
.toc {
|
||
|
|
width: 50%;
|
||
|
|
font-size: 90%;
|
||
|
|
padding: 0 1em;
|
||
|
|
margin: 2em 0;
|
||
|
|
line-height: 1.4em;
|
||
|
|
border: 1px solid #ccc;
|
||
|
|
}
|
||
|
|
.toc a {
|
||
|
|
color: #666;
|
||
|
|
/* color: #09d; */
|
||
|
|
/* border-bottom: 1px dotted #09c; */
|
||
|
|
}
|
||
|
|
.toc a:hover {
|
||
|
|
color: #09d;
|
||
|
|
}
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
.toc {
|
||
|
|
border: 1px solid #333;
|
||
|
|
}
|
||
|
|
.toc a {
|
||
|
|
color: #999;
|
||
|
|
}
|
||
|
|
.toc a:hover {
|
||
|
|
color: #ae6;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Portraits */
|
||
|
|
/* see https://oddmuse.org/wiki/Portraits_Support_Extension */
|
||
|
|
/* see also News page, below */
|
||
|
|
div.portrait {
|
||
|
|
margin: 0;
|
||
|
|
float: left;
|
||
|
|
clear: left;
|
||
|
|
font-size: 0.75em;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
div.portrait p {
|
||
|
|
margin: 0;
|
||
|
|
padding-top: 1ex;
|
||
|
|
}
|
||
|
|
/* for the image inside a.newauthor */
|
||
|
|
img.portrait {
|
||
|
|
margin: 0;
|
||
|
|
margin-right: 0.5em;
|
||
|
|
float: left;
|
||
|
|
clear: left;
|
||
|
|
/* picture frame */
|
||
|
|
padding: 6px;
|
||
|
|
background-color: white;
|
||
|
|
border: 1px solid #999;
|
||
|
|
/* scale the image */
|
||
|
|
width: 100%;
|
||
|
|
/* preferred image size is 48x48px */
|
||
|
|
max-width: 62px;
|
||
|
|
}
|
||
|
|
/* portrait caption */
|
||
|
|
div.portrait a.local {
|
||
|
|
float: left;
|
||
|
|
display: block;
|
||
|
|
clear: both;
|
||
|
|
text-decoration: none;
|
||
|
|
border-bottom: none;
|
||
|
|
min-width: 74px; /* 62px from above + 2*6px padding */
|
||
|
|
margin-right: 1em;
|
||
|
|
}
|
||
|
|
div.comment {
|
||
|
|
clear: both;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* IRC */
|
||
|
|
.irc .time {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
dl.irc dt {
|
||
|
|
float: left;
|
||
|
|
text-align: right;
|
||
|
|
width: 20ex;
|
||
|
|
}
|
||
|
|
dl.irc dd {
|
||
|
|
display: block;
|
||
|
|
margin-left: 22ex;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
/* Calendar */
|
||
|
|
/* (pre gets different colors below) */
|
||
|
|
div.month {
|
||
|
|
padding: 0;
|
||
|
|
margin: 0 2ex;
|
||
|
|
}
|
||
|
|
div.month a {
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
div.month pre {
|
||
|
|
color: inherit;
|
||
|
|
background-color: inherit;
|
||
|
|
}
|
||
|
|
body div.month {
|
||
|
|
float: right;
|
||
|
|
padding: 0 1ex;
|
||
|
|
}
|
||
|
|
.year div.month {
|
||
|
|
float: left;
|
||
|
|
padding: 0;
|
||
|
|
}
|
||
|
|
div.month a.edit {
|
||
|
|
color: inherit;
|
||
|
|
background-color: inherit;
|
||
|
|
font-weight: inherit;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* diff */
|
||
|
|
div.diff { padding-left: 5%; padding-right: 5%; }
|
||
|
|
div.old p, div.new p { margin: 0; } /* so padding below will work right */
|
||
|
|
div.old, div.new { padding: 0.5em; }
|
||
|
|
div.old { background-color: #f98; color: #000; }
|
||
|
|
div.new { background-color: #aea; color: #000; }
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
div.old { background-color: #911; color: inherit; }
|
||
|
|
div.new { background-color: #393; color: inherit; }
|
||
|
|
/* inner shadow */
|
||
|
|
div.old, div.new {
|
||
|
|
-moz-box-shadow: inset 0 0 5px #000;
|
||
|
|
-webkit-box-shadow: inset 0 0 5px #000;
|
||
|
|
box-shadow: inset 0 0 5px #000;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Footer */
|
||
|
|
footer {
|
||
|
|
clear: both;
|
||
|
|
font-size: 0.9em;
|
||
|
|
}
|
||
|
|
footer hr {
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
margin-bottom: 1em;
|
||
|
|
border-bottom: 1px solid #aaa;
|
||
|
|
}
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
footer hr {
|
||
|
|
border-bottom: 1px solid #444;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Footer edit bar */
|
||
|
|
footer span.edit {
|
||
|
|
display: block;
|
||
|
|
position: absolute;
|
||
|
|
top: 30px;
|
||
|
|
left: 206px;
|
||
|
|
white-space: nowrap;
|
||
|
|
}
|
||
|
|
|
||
|
|
div.time a.author, div.time a.diff {
|
||
|
|
color: gray;
|
||
|
|
border-bottom: 1px dotted #09c;
|
||
|
|
}
|
||
|
|
div.time a.author:hover, div.time a.diff:hover {
|
||
|
|
color: #09d;
|
||
|
|
}
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
div.time a.author, footer .time .diff, .footer div.time a.diff {
|
||
|
|
color: gray;
|
||
|
|
border-bottom: 1px dotted #cf8;
|
||
|
|
}
|
||
|
|
div.time a.author, div.time a.diff {
|
||
|
|
border-bottom: none;
|
||
|
|
}
|
||
|
|
div.time a.author:hover, footer .time .diff:hover, .footer div.time a.diff:hover {
|
||
|
|
color: #ae6;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Legal */
|
||
|
|
@media (max-width: 580px) {
|
||
|
|
/* hide CC logo */
|
||
|
|
.licence {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
p.legal {
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
font-style: italic;
|
||
|
|
font-size: 1.1em;
|
||
|
|
}
|
||
|
|
p.legal a {
|
||
|
|
color: gray;
|
||
|
|
border-bottom: 1px dotted #09c;
|
||
|
|
}
|
||
|
|
p.legal a:hover {
|
||
|
|
color: #09d;
|
||
|
|
}
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
p.legal a {
|
||
|
|
color: gray;
|
||
|
|
border-bottom: 1px dotted #cfc;
|
||
|
|
}
|
||
|
|
p.legal a:hover {
|
||
|
|
color: #ae6;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
/* also has <div style="float:right; margin-left:1ex;"> */
|
||
|
|
a.license {
|
||
|
|
border-bottom: none;
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Center lower menu items and add border*/
|
||
|
|
|
||
|
|
/* Translation bar */
|
||
|
|
span.translation.bar {
|
||
|
|
display: block;
|
||
|
|
text-align: center;
|
||
|
|
font-size: 0.9em;
|
||
|
|
}
|
||
|
|
/* hide the br element, which we don't need */
|
||
|
|
.translation br {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
/* add a little space between languages */
|
||
|
|
.translation a + a {
|
||
|
|
margin-left: 0.5ex;
|
||
|
|
}
|
||
|
|
.translation a {
|
||
|
|
border-bottom: 1px dotted #09c;
|
||
|
|
}
|
||
|
|
.translation a:hover {
|
||
|
|
color: #09d;
|
||
|
|
}
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
.translation a {
|
||
|
|
border-bottom: inherit;
|
||
|
|
}
|
||
|
|
.translation a:hover {
|
||
|
|
/* color: inherit; */
|
||
|
|
color: #ae6;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
/* Edit bar (buttons) */
|
||
|
|
.edit.bar {
|
||
|
|
display: block;
|
||
|
|
text-align: center;
|
||
|
|
padding: 5px 0px 15px 0;
|
||
|
|
}
|
||
|
|
/* account for missing translation bar in testEdit.htm */
|
||
|
|
hr + .edit.bar {
|
||
|
|
padding-top: 2em;
|
||
|
|
padding-bottom: 1.5em;
|
||
|
|
}
|
||
|
|
/* Last edit */
|
||
|
|
div.time {
|
||
|
|
display: block;
|
||
|
|
text-align: center;
|
||
|
|
margin-bottom: 1em;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Display buttons */
|
||
|
|
.edit.bar a {
|
||
|
|
display:inline-block;
|
||
|
|
zoom:1;
|
||
|
|
padding:4px 12px;
|
||
|
|
margin-bottom:0;
|
||
|
|
/* font-size:14px; */
|
||
|
|
line-height:20px;
|
||
|
|
text-align:center;
|
||
|
|
vertical-align:middle;
|
||
|
|
cursor:pointer;
|
||
|
|
color:#333333;
|
||
|
|
text-shadow:0 1px 1px rgba(255, 255, 255, 0.75);
|
||
|
|
background-color:#f5f5f5;
|
||
|
|
background-image:-moz-linear-gradient(top, #ffffff, #e6e6e6);
|
||
|
|
background-image:-webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
|
||
|
|
background-image:-webkit-linear-gradient(top, #ffffff, #e6e6e6);
|
||
|
|
background-image:-o-linear-gradient(top, #ffffff, #e6e6e6);
|
||
|
|
background-image:linear-gradient(to bottom, #ffffff, #e6e6e6);
|
||
|
|
background-repeat:repeat-x;
|
||
|
|
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);
|
||
|
|
border-color:#e6e6e6 #e6e6e6 #bfbfbf;
|
||
|
|
border-color:rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
|
||
|
|
border:1px solid #cccccc;
|
||
|
|
border:0;
|
||
|
|
border-bottom-color:#b3b3b3;
|
||
|
|
-webkit-border-radius:4px;
|
||
|
|
-moz-border-radius:4px;
|
||
|
|
border-radius:4px;
|
||
|
|
margin-left:.3em;
|
||
|
|
-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
|
||
|
|
-moz-box-shadow:inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
|
||
|
|
box-shadow:inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
|
||
|
|
}
|
||
|
|
.edit.bar a:hover,.edit.bar a:focus,.edit.bar a:active, .edit.bar a.active,.edit.bar a.disabled,.edit.bar a[disabled] {
|
||
|
|
background-image: linear-gradient(to bottom, #f8f8f8, #f0f0f0);
|
||
|
|
}
|
||
|
|
.edit.bar a:active, .edit.bar a.active {
|
||
|
|
background-color:#cccccc;
|
||
|
|
}
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
.edit.bar a:hover {
|
||
|
|
color:#80f;
|
||
|
|
}
|
||
|
|
.edit.bar a {
|
||
|
|
filter: invert(90%);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
/* Printing */
|
||
|
|
@media print {
|
||
|
|
div.diff, div.diff+hr, div.refer, div.near, div.sister, div.cal, footer,
|
||
|
|
span.specialdays, span.gotobar, a.edit, a.number span,
|
||
|
|
div.rc form, div.definition { display: none; }
|
||
|
|
body { font: 12pt "Neep", "Arial", sans-serif; color: #000; }
|
||
|
|
a:link, a:visited { color: #000; text-decoration: none; font-style: oblique; }
|
||
|
|
a[class="url number"]:after, a[class="inter number"]:after { content: "[" attr(href) "]"; }
|
||
|
|
a[class="local number"]:after { content: "[" attr(title) "]"; }
|
||
|
|
a.near { font-weight: normal; text-decoration: none; font-style: oblique; }
|
||
|
|
a.near:link, a.near:visited, a.near:active, a.near:hover {
|
||
|
|
color: inherit; background-color: inherit;
|
||
|
|
}
|
||
|
|
a[class="near"]:after { content: " [" attr(title) "]"; }
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Syntax highlighting */
|
||
|
|
/* from emacs.css */
|
||
|
|
span.builtin { color: #483d8b; } /* DarkSlateBlue */
|
||
|
|
span.comment { color: #b22222; } /* Firebrick */
|
||
|
|
span.constant { color: #008b8b; } /* DarkCyan */
|
||
|
|
span.function { color: #0000ff; } /* Blue1 */
|
||
|
|
span.keyword { color: #7f007f; } /* Purple */
|
||
|
|
span.string { color: #8b475d; } /* VioletRed4 */
|
||
|
|
span.type { color: #228b22; } /* ForestGreen */
|
||
|
|
span.warning { color: #ff0000; font-weight: bold; } /* Red1 */
|
||
|
|
span.comment span,
|
||
|
|
span.string span { color: inherit; }
|
||
|
|
span.comment span.important.constant,
|
||
|
|
span.string span.important.constant { color: #008b8b; }
|
||
|
|
|
||
|
|
/* old: Equivalent to Output::HTML */
|
||
|
|
span.linecomment { color: green; }
|
||
|
|
span.blockcomment { color: green; }
|
||
|
|
span.prepro { color: purple; }
|
||
|
|
span.select { font-weight: bold; }
|
||
|
|
span.quote { color: blue; }
|
||
|
|
span.category_1 { color: teal; }
|
||
|
|
span.category_2 { color: blue; }
|
||
|
|
span.category_3 { color: blue; }
|
||
|
|
|
||
|
|
|
||
|
|
/* dark version */
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
/* adapted from ample-flat theme */
|
||
|
|
span.builtin { color: #9fbfdf; } /* light-blue */
|
||
|
|
span.comment { color: #857575; } /* gray */
|
||
|
|
span.constant { color: #ab85a3; } /* purple */
|
||
|
|
span.function { color: #a9df90; } /* green */
|
||
|
|
span.keyword { color: #91a0b3; } /* blue */
|
||
|
|
span.string { color: #ddbc91; } /* tan */
|
||
|
|
span.type { color: #ad8572; } /* red */
|
||
|
|
span.warning { color: red; }
|
||
|
|
span.comment span,
|
||
|
|
span.string span { color: inherit; }
|
||
|
|
span.comment span.important.constant,
|
||
|
|
span.string span.important.constant { color: #706565; }
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
/* ---------------------------------------------------------------------- */
|
||
|
|
/* Pages */
|
||
|
|
/* ---------------------------------------------------------------------- */
|
||
|
|
|
||
|
|
|
||
|
|
/* Recent Changes */
|
||
|
|
/* hide the hr since the header div already has a line */
|
||
|
|
div.rc {
|
||
|
|
padding-top: 0;
|
||
|
|
}
|
||
|
|
div.rc hr {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
div.rc h2 {
|
||
|
|
margin-top: 0;
|
||
|
|
}
|
||
|
|
div.rc table {
|
||
|
|
border-collapse: separate;
|
||
|
|
border-spacing: 2px;
|
||
|
|
}
|
||
|
|
div.rc td, th {
|
||
|
|
border: none;
|
||
|
|
}
|
||
|
|
div.rc form {
|
||
|
|
border-top: 1px solid #ccc;
|
||
|
|
padding: 1em 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Edit */
|
||
|
|
textarea {
|
||
|
|
font-family: Consolas, 'Bitstream Vera Sans Mono', Monaco, 'Lucida Console', Courier, monospace;
|
||
|
|
font-size: 0.9em;
|
||
|
|
}
|
||
|
|
textarea[name="text"] {
|
||
|
|
width: 100%;
|
||
|
|
height: 80%;
|
||
|
|
}
|
||
|
|
textarea[name="summary"] {
|
||
|
|
width: 100%;
|
||
|
|
height: 3em;
|
||
|
|
}
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
textarea, input {
|
||
|
|
background-color: #181818;
|
||
|
|
color: #ccc;
|
||
|
|
border: 1px solid #555;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
/* Comment */
|
||
|
|
div.comment form {
|
||
|
|
padding: 1em;
|
||
|
|
border-top: 1px solid #ccc;
|
||
|
|
}
|
||
|
|
span.time {
|
||
|
|
/* The default font EB Garamond doesn't have monospace numbers, so use this. */
|
||
|
|
font-family: Times, "Times Roman", "Times New Roman", serif;
|
||
|
|
}
|
||
|
|
textarea[name="aftertext"] {
|
||
|
|
width: 100%;
|
||
|
|
height: 10em;
|
||
|
|
margin: 0.5em 0;
|
||
|
|
}
|
||
|
|
div.comment p {
|
||
|
|
}
|
||
|
|
/* ? */
|
||
|
|
div.commentshown {
|
||
|
|
font-size: smaller;
|
||
|
|
padding: 0 2em 1ex 2em;
|
||
|
|
}
|
||
|
|
div.commentshown hr {
|
||
|
|
margin: 1em;
|
||
|
|
}
|
||
|
|
.commenthidden { display: none; }
|
||
|
|
.commentshown { display: block; }
|
||
|
|
|
||
|
|
|
||
|
|
/* News */
|
||
|
|
/* headings */
|
||
|
|
div.journal {
|
||
|
|
padding-top: 1em;
|
||
|
|
}
|
||
|
|
article {
|
||
|
|
padding-top: 1em;
|
||
|
|
border-top: 1px solid #ccc;
|
||
|
|
padding-bottom: 1em;
|
||
|
|
}
|
||
|
|
h1 a.local {
|
||
|
|
color: #222;
|
||
|
|
font-size: 0.9em;
|
||
|
|
border-bottom: none;
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
h1 a.local {
|
||
|
|
color: #ccc;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
div.color {
|
||
|
|
clear: both;
|
||
|
|
margin: 0;
|
||
|
|
padding: 1ex 1em;
|
||
|
|
min-height: 100px; /* give room for portraits */
|
||
|
|
}
|
||
|
|
/* alternate conversations with .one/.two */
|
||
|
|
div.color.one {
|
||
|
|
color: #444;
|
||
|
|
background-color: #f4f3f2;
|
||
|
|
border: 1px solid #ddd;
|
||
|
|
/* border: 1px dotted #999; */
|
||
|
|
}
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
div.color.one {
|
||
|
|
color: #ccc;
|
||
|
|
background-color: #282828;
|
||
|
|
border: 1px solid #333;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
/* news text */
|
||
|
|
/* make text match the top margin of the portrait */
|
||
|
|
article div.portrait + p {
|
||
|
|
margin-top: 0.5ex;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* anonymised IP numbers */
|
||
|
|
|
||
|
|
.red {
|
||
|
|
background: red;
|
||
|
|
color: red;
|
||
|
|
}
|
||
|
|
|
||
|
|
.orange {
|
||
|
|
background: orange;
|
||
|
|
color: orange;
|
||
|
|
}
|
||
|
|
|
||
|
|
.yellow {
|
||
|
|
background: yellow;
|
||
|
|
color: yellow;
|
||
|
|
}
|
||
|
|
|
||
|
|
.green {
|
||
|
|
background: green;
|
||
|
|
color: green;
|
||
|
|
}
|
||
|
|
|
||
|
|
.blue {
|
||
|
|
background: blue;
|
||
|
|
color: blue;
|
||
|
|
}
|
||
|
|
|
||
|
|
.indigo {
|
||
|
|
background: indigo;
|
||
|
|
color: indigo;
|
||
|
|
}
|
||
|
|
|
||
|
|
.violet {
|
||
|
|
background: violet;
|
||
|
|
color: violet;
|
||
|
|
}
|
||
|
|
|
||
|
|
.white {
|
||
|
|
background: white;
|
||
|
|
color: white;
|
||
|
|
}
|
||
|
|
|
||
|
|
.ip-code {
|
||
|
|
border: 1px solid #666;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Local Variables: */
|
||
|
|
/* css-indent-offset: 4 */
|
||
|
|
/* whitespace-mode: t */
|
||
|
|
/* End: */
|