X-Git-Url: https://git.r.bdr.sh/rbdr/r.bdr.sh/blobdiff_plain/a9be3ad40d9bec903f3c5dc4fa9ecf231b28240f..0f128ed7b91f3678f604a8fae35239f113779f72:/jekyll/css/application.css diff --git a/jekyll/css/application.css b/jekyll/css/application.css index 9e1f2db..24f5ca2 100644 --- a/jekyll/css/application.css +++ b/jekyll/css/application.css @@ -200,7 +200,8 @@ code {overflow-wrap: normal} width: 8.571em; float: left; text-align: right; - padding: 1.071em; + padding: 0.5em 1.071em; + text-transform: uppercase; } .guestbook-form .guestbook-control { @@ -230,3 +231,94 @@ code {overflow-wrap: normal} .guestbook-post .author { font-weight: bold; } + +/* + * The Recorder CSS + */ +.pepperoni-widget { + justify-content: space-between; + display: flex; +} + +.pepperoni-widget .record-button { + display: flex; + font-size: 1.538461em; + padding: 1em; + margin: 1em; + height: 1em; + background-color: #f1f1f1; + cursor: pointer; + transition: background-color 0.2s ease, color 0.2s ease; +} + +.record-info { + margin: 1em 0; +} + +.pepperoni-widget .record-button.recording { + background-color: #00cc12; + color: white; + padding: 1em 1.1em 1em 0.68em; +} + +.pepperoni-widget .record-button:hover { + text-decoration: none; + background-color: #fafafa; +} + +.pepperoni-widget .record-button.recording:hover { + background-color: #d30058; + color: #f1f1f1; +} + +.pepperoni-widget .record-progress { + justify-content: space-between; + display: flex; + margin: 0.5em 0.76em; +} + +.record-progress-bar-container { + background-color: #f1f1f1; + height: 2em; + width: 15.385em; + margin-right: 0.76em; +} + +.record-progress-bar { + height: 2em; + background-color: #d30058; + width: 0; +} + +.record-clear { + margin-top: 0.1em; + text-transform: uppercase; + font-size: 1em; + width: 4em; + cursor: pointer; +} + +.record-clear:hover { + text-decoration: none; +} + +.record-preview { + margin: 0.76em; + width: 15.385em; + height: 2em; +} + +.guestbook-submit { + border-radius: 0; + border: 0; + background-color: #d30058; + font-family: 'Oswald', sans-serif; + color: #fff; + padding: 1em; + margin-left: 15em; +} + +.filter-switches label { + display: inline; + margin-right: 2em; +}