MediaWiki:Common.css: Difference between revisions

From Wiki of ZZT
Jump to navigation Jump to search
(Add EGA font)
 
(Add WIP styles for byte layout diagram)
 
(9 intermediate revisions by the same user not shown)
Line 3: Line 3:
@font-face {
@font-face {
font-family: "EGA8";
font-family: "EGA8";
src: url("/w/images/f/f4/Px437_ibm_ega8-webfont.woff2") format("woff2");
src: url("/w/images/a/ae/Web437_IBM_EGA_8x14.woff") format("woff");
}
 
.blinking {
animation: 2.5s linear infinite blinking_text;
}
@keyframes blinking_text {
35% {
opacity: 100%;
}
45% {
opacity: 0%;
}
55% {
opacity: 0%;
}
65% {
opacity: 100%;
}
}
 
 
/* Navbox CSS */
.navbox {
width: 100%;
border: 1px solid #aaa;
box-sizing: border-box;
margin: 1em 0;
}
.navbox .title th {
background: #B6CEE7;
}
.navbox .group th {
background: #DBE7F3;
padding-left: 1em;
padding-right: 1em;
}
.navbox .group td {
padding-left: 0.5em;
padding-right: 0.5em;
width: 100%;
}
.navbox .group:nth-child(2n+1) td {
background: #f5f5f5;
}
 
/* Style lists as dot-separated items */
.navbox ul {
margin: 0;
}
.navbox li {
display: inline;
}
.navbox li:nth-child(n+2):before {
content: " · ";
font-weight: bold;
}
 
/* Experimental: styles for a future byte layout diagram*/
table.byte-layout {
  border-collapse: collapse;
}
table.byte-layout th, table.byte-layout td {
    padding: 5px;
}
table.byte-layout tr:first-child th {
  width: 50px;
}
table.byte-layout tr:nth-child(n+2) td {
  border: 1px solid black;
}
table.byte-layout .integer {
  background-color: #fcc;
}
table.byte-layout .byte {
  background-color: #f3e2d8;
}
table.byte-layout .literal {
  background-color: #cedbf5;
}
table.byte-layout .boolean {
  background-color: #def2dc;
}
table.byte-layout .pointer {
  background-color: #f4dcf2;
}
table.byte-layout .string {
  background: linear-gradient(90deg, #b9dce4 0 50px, #dff1f0 50px 100%);
}
table.byte-layout .string-continued {
  background-color: #dff1f0;
}
table.byte-layout .padding {
  background-color: #c3c3c3;
}
table.byte-layout tr td.skip {
  background-color: inherit;
  text-align: center;
  border: 0px;
}
}

Latest revision as of 07:55, 15 February 2021

/* CSS placed here will be applied to all skins */

@font-face {
	font-family: "EGA8";
	src: url("/w/images/a/ae/Web437_IBM_EGA_8x14.woff") format("woff");
}

.blinking {
	animation: 2.5s linear infinite blinking_text;
}
@keyframes blinking_text {
	35% {
		opacity: 100%;
	}
	45% {
		opacity: 0%;
	}
	55% {
		opacity: 0%;
	}
	65% {
		opacity: 100%;
	}
}


/* Navbox CSS */
.navbox {
	width: 100%;
	border: 1px solid #aaa;
	box-sizing: border-box;
	margin: 1em 0;
}
.navbox .title th {
	background: #B6CEE7;
}
.navbox .group th {
	background: #DBE7F3;
	padding-left: 1em;
	padding-right: 1em;
}
.navbox .group td {
	padding-left: 0.5em;
	padding-right: 0.5em;
	width: 100%;
}
.navbox .group:nth-child(2n+1) td {
	background: #f5f5f5;
}

/* Style lists as dot-separated items */
.navbox ul {
	margin: 0;
}
.navbox li {
	display: inline;
}
.navbox li:nth-child(n+2):before {
	content: " · ";
	font-weight: bold;
}

/* Experimental: styles for a future byte layout diagram*/
table.byte-layout {
  border-collapse: collapse;
}
table.byte-layout th, table.byte-layout td {
    padding: 5px;
}
table.byte-layout tr:first-child th {
  width: 50px;
}
table.byte-layout tr:nth-child(n+2) td {
  border: 1px solid black;
}
table.byte-layout .integer {
  background-color: #fcc;
}
table.byte-layout .byte {
  background-color: #f3e2d8;
}
table.byte-layout .literal {
  background-color: #cedbf5;
}
table.byte-layout .boolean {
  background-color: #def2dc;
}
table.byte-layout .pointer {
  background-color: #f4dcf2;
}
table.byte-layout .string {
  background: linear-gradient(90deg, #b9dce4 0 50px, #dff1f0 50px 100%);
}
table.byte-layout .string-continued {
  background-color: #dff1f0;
}
table.byte-layout .padding {
  background-color: #c3c3c3;
}
table.byte-layout tr td.skip {
  background-color: inherit;
  text-align: center;
  border: 0px;
}