From 7a91dfd23d5b4f0f885c37337896ff91520f32af Mon Sep 17 00:00:00 2001 From: jay Date: Fri, 6 Mar 2020 23:05:30 -0300 Subject: Subiendo cliente web de BaI Radio --- bairadio.css | 313 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 313 insertions(+) create mode 100644 bairadio.css (limited to 'bairadio.css') diff --git a/bairadio.css b/bairadio.css new file mode 100644 index 0000000..369c386 --- /dev/null +++ b/bairadio.css @@ -0,0 +1,313 @@ +* { + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + word-wrap: break-word; + cursor: url(data:image/x-win-bitmap;base64,AAACAAEAICAAAAAAAADoAgAAFgAAACgAAAAgAAAAQAAAAAEABAAAAAAAgAIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACAAACAAAAAgIAAgAAAAIAAgACAgAAAgICAAMDAwAAAAP8AAP8AAAD//wD/AAAA/wD/AP//AAD///8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAB4gAAAAAAAAAAAAAAAAAAAf4AAAAAAAAAAAAAAAAAAB/gAAAAAAAAAAAAAAAAAAAf4AAAAAAAAAAAAAAAAcAB/gAAAAAAAAAAAAAAAAHgAf4AAAAAAAAAAAAAAAAB/gPgAAAAAAAAAAAAAAAAAf/gAAAAAAAAAAAAAAAAAAH//iIiAAAAAAAAAAAAAAAB//4iIAAAAAAAAAAAAAAAAf/iIgAAAAAAAAAAAAAAAAH/4iAAAAAAAAAAAAAAAAAB/iIAAAAAAAAAAAAAAAAAAf4gAAAAAAAAAAAAAAAAAAHiAAAAAAAAAAAAAAAAAAAB4AAAAAAAAAAAAAAAAAAAAcAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD//////////////////////////////////////////////////////////////////////j////w////8P///+H///3h///8w////EP///wH///8AH///AD///wB///8A////Af///wP///8H////D////x////8/////f////w==),auto; +} + +html, body { + background: #000; + color: #fff; + font-family: Arial, sans-serif; + font-size: 16px; + margin: 0; + padding: 0; + text-align: center; +} + +a, a:visited, a:hover { + color: #3833a1; +} + +a:active { + color: #f00; +} + +h1 { + margin: 16px 0; +} + +.outer { + border: 1px solid #0d0d14; + background: #13141d; + background: linear-gradient(to right, #13141d, #28273e); + width: 600px; + display: inline-block; +} + +.inner { + border-top: 1px solid #5c5c64; + border-left: 1px solid #5c5c64; + padding: 4px; +} + +.content { + border: 2px solid #0f0f16; + box-shadow: 1px 1px #646471, 1px 1px #646471 inset; + padding: 4px; +} + +.line { + margin: 0; + margin-bottom: 4px; + padding: 0; + vertical-align: middle; +} + +.line:last-child { + margin-bottom: 0; +} + +.block { + display: inline-block; +} + +.box { + background: #000; + border-top: 1px solid #242337; + border-right: 1px solid #737388; + border-bottom: 1px solid #737388; + border-left: 1px solid #242337; + color: #0f0; + display: inline-block; + padding: 2px; +} + +.boxtitle { + font-weight: bold; + text-shadow: 1px 1px #000; +} + +.collapse .inner { + display: flex; + display: -moz-flex; + display: -ms-flex; + display: -webkit-flex; + align-items: center; +} + +.collapse .content { + border: 0; + box-shadow: none; + flex-grow: 1; + -ms-flex-grow: 1; + -moz-flex-grow: 1; + -webkit-flex-grow: 1; + margin-left: 4px; + padding: 0; +} + +#box-history.collapse .content { + width: 400px; +} + +.collapse #history { + height: 1.4em; + overflow-y: hidden; +} + +.collapse .pastsong:hover { + background: none; +} + +#main { + display: flex; + display: -moz-flex; + display: -ms-flex; + display: -webkit-flex; +} + +.main-sep { + width: 4px; +} + +#main-cont { + flex: 1; + -ms-flex: 1; + -moz-flex: 1; + -webkit-flex: 1; + flex-grow: 1; + -ms-flex-grow: 1; + -moz-flex-grow: 1; + -webkit-flex-grow: 1; +} + +#nowplaying { + display: block; + font-size: 21px; + text-shadow: 0 0 5px; + width: 482px; + white-space: nowrap; + overflow: hidden; + padding: 4px 2px; +} + +#nowplaying-txt { + display: inline-block; +} + +#nowplaying-txt:hover { + animation-play-state: paused; + -moz-animation-play-state: paused; + -webkit-animation-play-state: paused; +} + +#artist { + font-weight: bold; +} + +#details { + font-size: 14px; +} + +#details .box { + margin: 0 2px; + padding: 1px 2px; +} + +#server_name { + max-width: 450px; +} + +#volume { + cursor: url(data:image/x-win-bitmap;base64,AAACAAEAICAAAAAAAADoAgAAFgAAACgAAAAgAAAAQAAAAAEABAAAAAAAgAIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACAAACAAAAAgIAAgAAAAIAAgACAgAAAwMDAAICAgAAAAP8AAP8AAAD//wD/AAAA/wD/AP//AAD///8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACHcAAAAAAAAAAAAAAAAAAAj3AAAAAAAAAAAAAAAAAACPcAAHAAAAAHAAAAAAAAAAj3AAdwAHcAB3AAAAAAgACPcAAP8AD/AA/wAAAAAIcAj3AAAPAAAAAPAAAAAACPcPcAAAAAAAAAAAAAAAAAj/cAAAAAAAAAAAAAAAAAAI//d3dwAAAAAAAAAAAAAACP/3d3AAAAAAAAAAAAAAAAj/d3cAAAAAAAAAAAAAAAAI/3dwAAAAAAAAAAAAAAAACPd3AAAAAAAAAAAAAAAAAAj3cAAAAAAAAAAAAAAAAAAIdwAAAAAAAAAAAAAAAAAACHAAAAAAAAAAAAAAAAAAAAgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD//////////////////////////////////////////////////////////////////////j////w////8M/P/+GMx/3hCEP8wwhD/EOMx/wHz8/8AH///AD///wB///8A////Af///wP///8H////D////x////8/////f////w==),auto; +} + +#history { + display: block; + min-height: 1em; + max-height: 5em; + overflow-y: auto; + text-align: left; +} + +.pastsong { + padding: 0 2px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} + +.pastsong:hover { + background: #00f; +} + +#chat-count { + font-weight: initial; +} + +#chat-all { + display: block; + height: 10em; + min-height: 5em; + text-align: left; + overflow-y: auto; +} + +#chat-all .msg { + border-bottom: 1px solid; + padding: 4px 2px; +} + +#chat-all .msg:last-child { + border-bottom: 0; +} + +#msg_cont { + display: flex; + display: -moz-flex; + display: -ms-flex; + display: -webkit-flex; + margin-top: 4px; +} + +#msg_type { + background: none; + border-top: 2px solid #100f18; + border-left: 2px solid #100f18; + border-right: 2px solid #6a6a7a; + border-bottom: 2px solid #6a6a7a; + color: #fff; + flex: 1; + -ms-flex: 1; + -moz-flex: 1; + -webkit-flex: 1; + margin-right: 4px; + padding: 2px; + width: 100%; +} + +#msg_send { + background: #bdced6; + border-top: 1px solid #f9feff; + border-left: 1px solid #f9feff; + border-right: 1px solid #adb5c6; + border-bottom: 1px solid #adb5c6; + color: #2f374d; + flex-shrink: 0; + font-size: 10px; + margin: 1px; + padding: 0 4px; + text-transform: uppercase; + outline: 1px outset #adb5c6; +} + +#msg_send:active { + background: #7b8c9c; + border: 1px solid #adbdc6; + color: #000; + outline: 1px solid #000; +} + +#msg_send:disabled { + background: #444; + border-top: 1px solid #7f7f7f; + border-left: 1px solid #7f7f7f; + border-right: 1px solid #333; + border-bottom: 1px solid #333; + color: #111; + outline: 1px outset #5a5a5a; +} + +#vis-cont { + display: inline-block; + max-height: 91px; + max-width: 91px; + width: 91px; +} + +#vis { + display: block; + height: 85px; + width: 85px; +} + +#vis.show-play-btn { + background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAZCAYAAADqrKTxAAABhGlDQ1BJQ0MgcHJvZmlsZQAAKJF9kT1Iw0AcxV9bS0VaBO0g4pChOrUgKuKoVShChVArtOpgcukXNGlIUlwcBdeCgx+LVQcXZ10dXAVB8APEydFJ0UVK/F9SaBHjwXE/3t173L0D/M0qU82ecUDVLCOTSgq5/KoQekUAQQwggrjETH1OFNPwHF/38PH1LsGzvM/9OSJKwWSATyCeZbphEW8QT29aOud94igrSwrxOXHcoAsSP3JddvmNc8lhP8+MGtnMPHGUWCh1sdzFrGyoxFPEMUXVKN+fc1nhvMVZrdZZ+578heGCtrLMdZojSGERSxAhQEYdFVRhIUGrRoqJDO0nPfzDjl8kl0yuChg5FlCDCsnxg//B727N4uSEmxROAsEX2/4YBUK7QKth29/Htt06AQLPwJXW8deawMwn6Y2OFjsC+reBi+uOJu8BlzvA0JMuGZIjBWj6i0Xg/Yy+KQ8M3gJ9a25v7X2cPgBZ6ip9AxwcAmMlyl73eHdvd2//nmn39wM5PnKQmgaw4AAAAAZiS0dEAP8A/wD/oL2nkwAAAAlwSFlzAAAuIwAALiMBeKU/dgAAAHFJREFUOMud1EsOwCAIBNBx7n9nu7GNH5CZslLMi6hEoKPDDAKAC/mNDMhlJkIeGQEyzBaQ6coF8lpHAlmeOoCU7niDlF90grT6Z8D2v/ecaGh0gbfTADqagIY2UKMA3FECcnQBMSrAiQSwIhHYv9AbD4kSHCjuBbjMAAAAAElFTkSuQmCC) no-repeat center; +} + +#resize { + background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAABhGlDQ1BJQ0MgcHJvZmlsZQAAKJF9kT1Iw0AcxV9bS0VaBO0g4pChOrUgKuKoVShChVArtOpgcukXNGlIUlwcBdeCgx+LVQcXZ10dXAVB8APEydFJ0UVK/F9SaBHjwXE/3t173L0D/M0qU82ecUDVLCOTSgq5/KoQekUAQQwggrjETH1OFNPwHF/38PH1LsGzvM/9OSJKwWSATyCeZbphEW8QT29aOud94igrSwrxOXHcoAsSP3JddvmNc8lhP8+MGtnMPHGUWCh1sdzFrGyoxFPEMUXVKN+fc1nhvMVZrdZZ+578heGCtrLMdZojSGERSxAhQEYdFVRhIUGrRoqJDO0nPfzDjl8kl0yuChg5FlCDCsnxg//B727N4uSEmxROAsEX2/4YBUK7QKth29/Htt06AQLPwJXW8deawMwn6Y2OFjsC+reBi+uOJu8BlzvA0JMuGZIjBWj6i0Xg/Yy+KQ8M3gJ9a25v7X2cPgBZ6ip9AxwcAmMlyl73eHdvd2//nmn39wM5PnKQmgaw4AAAAAZiS0dEAP8A/wD/oL2nkwAAAAlwSFlzAAAuIwAALiMBeKU/dgAAAGFJREFUCNdlzMENAjEMRNGflLMXQCJ7xem/CM9UYg6bIAS+vj9uxzGhit8b56M6AK39gZX0VgtWsCElOsAOviFi0j+LcS9bSCZiYiW9KJ7nrWyjFK8IbF1vx9iQC64oYvIGzlo/pBk1ZaEAAAAASUVORK5CYII=) no-repeat center; + float: right; + position: relative; + right: -10px; + height: 10px; + width: 10px; +} + +#resize:hover { + cursor: url(data:image/x-win-bitmap;base64,AAACAAEAICAAAAAAAADoAgAAFgAAACgAAAAgAAAAQAAAAAEABAAAAAAAgAIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACAAACAAAAAgIAAgAAAAIAAgACAgAAAwMDAAICAgAAAAP8AAP8AAAD//wD/AAAA/wD/AP//AAD///8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAPcAAAAAAAAAAAAAAAAAAA/3cAAAAAAAAAAAAACHcAAAAAAAAAAAAAAAAAAAj3AAAAAAAAAAAAAAAAAACPcAAAAAAAAAAAAAAAAAAAj3AAAA9wAAAAAAAAAAgACPcAAAAPcAAAAAAAAAAIcAj3AAAAAAAAAAAAAAAACPcPcAAAAAAAAAAAAAAAAAj/cAAAAAAAAAAAAAAAAAAI//d3dwAA/3cAAAAAAAAACP/3d3AAAA9wAAAAAAAAAAj/d3cAAAAAAAAAAAAAAAAI/3dwAAAAAAAAAAAAAAAACPd3AAAAAAAAAAAAAAAAAAj3cAAAAAAAAAAAAAAAAAAIdwAAAAAAAAAAAAAAAAAACHAAAAAAAAAAAAAAAAAAAAgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD////////////////////////////////////////////////////////////8////+H///jA///wwP//8P///+Hz//3h4f/8w+H//EPz//wH///8AED//ADA//wB4f/8A/P//Af///wP///8H////D////x////8/////f////w==),auto; +} + +.outer, #footer { + margin-bottom: 16px; +} + +#footer { + font-size: smaller; +} + +.bar { + fill: #0f0; +} -- cgit v1.2.1-18-gbd029