MediaWiki:Common.css: Difference between revisions

From Wiki of ZZT
Jump to navigation Jump to search
(Revise navbox CSS: use more classes, style lists inline)
(Add WIP styles for byte layout diagram)
 
(3 intermediate revisions by the same user not shown)
Line 30: Line 30:
border: 1px solid #aaa;
border: 1px solid #aaa;
box-sizing: border-box;
box-sizing: border-box;
margin: 1em 0;
}
}
.navbox .title th {
.navbox .title th {
background: #B6B6E7;
background: #B6CEE7;
}
}
.navbox .group th {
.navbox .group th {
background: #DBDBF3;
background: #DBE7F3;
padding-left: 1em;
padding-left: 1em;
padding-right: 1em;
padding-right: 1em;
Line 56: Line 57:
}
}
.navbox li:nth-child(n+2):before {
.navbox li:nth-child(n+2):before {
content: " \00b7  ";
content: " · ";
font-weight: bold;
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;
}