User:Xenwolf/common.css: Difference between revisions

From Xenharmonic Wiki
Jump to navigation Jump to search
Xenwolf (talk | contribs)
import useful CSS from User:Xenwolf/vector.css
Xenwolf (talk | contribs)
test in-browser sound generation
Line 1: Line 1:
/* make h1 headings within page body stand out */
.sequence-audio-button {
div#bodyContent h1{
background: #777777;
  background-color: #fee;
}
.sequence-audio-button:hover,.sequence-audio-button:active {
cursor: not-allowed;
}
 
.sequence-audio-button.sequence-audio-valid {
background: #ffffaa;
}
.sequence-audio-button.sequence-audio-valid:hover,.sequence-audio-button.sequence-audio-valid:active {
background: #eeee66;
cursor: pointer;
}
 
.sequence-audio-button.sequence-audio-playing {
background: #aaffaa;
}
.sequence-audio-button.sequence-audio-playing:hover,.sequence-audio-button.sequence-audio-playing:active {
background: #66ee66;
cursor: wait;
}
 
.sequence-audio-button.sequence-audio-valid.white-key {
background: #ffffff;
}
.sequence-audio-button.sequence-audio-valid.white-key:hover,.sequence-audio-button.sequence-audio-valid.white-key:active {
background: #ffffaa;
}
 
.sequence-audio-button.sequence-audio-valid.black-key {
background: #000000;
}
.sequence-audio-button.sequence-audio-valid.black-key:hover,.sequence-audio-button.sequence-audio-valid.black-key:active {
background: #005555;
}
}


/* for [[Template::Monzo]] and [[Template::Val]] */
.sequence-audio-button.sequence-audio-invalid {
span.monzo,
background: #ffaaaa;
span.val {
  background-color: #eef;
}
}
.monzo > span.left-delim,
.sequence-audio-button.sequence-audio-invalid:hover,.sequence-audio-button.sequence-audio-invalid:active {
.monzo > span.right-delim,
background: #ee6666;
.val > span.left-delim,
cursor: not-allowed;
.val > span.right-delim {
  padding: 0 0.5em;
}
}

Revision as of 18:28, 26 October 2022

.sequence-audio-button {
	background: #777777;
}
.sequence-audio-button:hover,.sequence-audio-button:active {
	cursor: not-allowed;
}

.sequence-audio-button.sequence-audio-valid {
	background: #ffffaa;
}
.sequence-audio-button.sequence-audio-valid:hover,.sequence-audio-button.sequence-audio-valid:active {
	background: #eeee66;
	cursor: pointer;
}

.sequence-audio-button.sequence-audio-playing {
	background: #aaffaa;
}
.sequence-audio-button.sequence-audio-playing:hover,.sequence-audio-button.sequence-audio-playing:active {
	background: #66ee66;
	cursor: wait;
}

.sequence-audio-button.sequence-audio-valid.white-key {
	background: #ffffff;
}
.sequence-audio-button.sequence-audio-valid.white-key:hover,.sequence-audio-button.sequence-audio-valid.white-key:active {
	background: #ffffaa;
}

.sequence-audio-button.sequence-audio-valid.black-key {
	background: #000000;
}
.sequence-audio-button.sequence-audio-valid.black-key:hover,.sequence-audio-button.sequence-audio-valid.black-key:active {
	background: #005555;
}

.sequence-audio-button.sequence-audio-invalid {
	background: #ffaaaa;
}
.sequence-audio-button.sequence-audio-invalid:hover,.sequence-audio-button.sequence-audio-invalid:active {
	background: #ee6666;
	cursor: not-allowed;
}