1 line
8.0 KiB
CSS
1 line
8.0 KiB
CSS
@font-face{font-family:ibm plex mono;font-style:normal;font-weight:400;src:url(./fonts/ibm-plex-mono-v7-latin-ext_latin-regular.woff2)format("woff2"),url(./fonts/ibm-plex-mono-v7-latin-ext_latin-regular.woff)format("woff")}@font-face{font-family:ibm plex mono;font-style:italic;font-weight:400;src:url(./fonts/ibm-plex-mono-v7-latin-ext_latin-italic.woff2)format("woff2"),url(./fonts/ibm-plex-mono-v7-latin-ext_latin-italic.woff)format("woff")}@font-face{font-family:ibm plex mono;font-style:normal;font-weight:700;src:url(./fonts/ibm-plex-mono-v7-latin-ext_latin-700.woff2)format("woff2"),url(./fonts/ibm-plex-mono-v7-latin-ext_latin-700.woff)format("woff")}@font-face{font-family:ibm plex mono;font-style:italic;font-weight:700;src:url(./fonts/ibm-plex-mono-v7-latin-ext_latin-700italic.woff2)format("woff2"),url(./fonts/ibm-plex-mono-v7-latin-ext_latin-700italic.woff)format("woff")}@font-face{font-family:ibm plex sans;font-style:normal;font-weight:100;src:url(./fonts/ibm-plex-sans-v9-latin-ext_latin-100.woff2)format("woff2"),url(./fonts/ibm-plex-sans-v9-latin-ext_latin-100.woff)format("woff")}@font-face{font-family:ibm plex sans;font-style:italic;font-weight:100;src:url(./fonts/ibm-plex-sans-v9-latin-ext_latin-100italic.woff2)format("woff2"),url(./fonts/ibm-plex-sans-v9-latin-ext_latin-100italic.woff)format("woff")}@font-face{font-family:ibm plex sans;font-style:normal;font-weight:200;src:url(./fonts/ibm-plex-sans-v9-latin-ext_latin-200.woff2)format("woff2"),url(./fonts/ibm-plex-sans-v9-latin-ext_latin-200.woff)format("woff")}@font-face{font-family:ibm plex sans;font-style:italic;font-weight:200;src:url(./fonts/ibm-plex-sans-v9-latin-ext_latin-200italic.woff2)format("woff2"),url(./fonts/ibm-plex-sans-v9-latin-ext_latin-200italic.woff)format("woff")}@font-face{font-family:ibm plex sans;font-style:normal;font-weight:300;src:url(./fonts/ibm-plex-sans-v9-latin-ext_latin-300.woff2)format("woff2"),url(./fonts/ibm-plex-sans-v9-latin-ext_latin-300.woff)format("woff")}@font-face{font-family:ibm plex sans;font-style:italic;font-weight:300;src:url(./fonts/ibm-plex-sans-v9-latin-ext_latin-300italic.woff2)format("woff2"),url(./fonts/ibm-plex-sans-v9-latin-ext_latin-300italic.woff)format("woff")}@font-face{font-family:ibm plex sans;font-style:normal;font-weight:400;src:url(./fonts/ibm-plex-sans-v9-latin-ext_latin-regular.woff2)format("woff2"),url(./fonts/ibm-plex-sans-v9-latin-ext_latin-regular.woff)format("woff")}@font-face{font-family:ibm plex sans;font-style:italic;font-weight:400;src:url(./fonts/ibm-plex-sans-v9-latin-ext_latin-italic.woff2)format("woff2"),url(./fonts/ibm-plex-sans-v9-latin-ext_latin-italic.woff)format("woff")}@font-face{font-family:ibm plex sans;font-style:normal;font-weight:500;src:url(./fonts/ibm-plex-sans-v9-latin-ext_latin-500.woff2)format("woff2"),url(./fonts/ibm-plex-sans-v9-latin-ext_latin-500.woff)format("woff")}@font-face{font-family:ibm plex sans;font-style:italic;font-weight:500;src:url(./fonts/ibm-plex-sans-v9-latin-ext_latin-500italic.woff2)format("woff2"),url(./fonts/ibm-plex-sans-v9-latin-ext_latin-500italic.woff)format("woff")}@font-face{font-family:ibm plex sans;font-style:normal;font-weight:600;src:url(./fonts/ibm-plex-sans-v9-latin-ext_latin-600.woff2)format("woff2"),url(./fonts/ibm-plex-sans-v9-latin-ext_latin-600.woff)format("woff")}@font-face{font-family:ibm plex sans;font-style:italic;font-weight:600;src:url(./fonts/ibm-plex-sans-v9-latin-ext_latin-600italic.woff2)format("woff2"),url(./fonts/ibm-plex-sans-v9-latin-ext_latin-600italic.woff)format("woff")}@font-face{font-family:ibm plex sans;font-style:normal;font-weight:700;src:url(./fonts/ibm-plex-sans-v9-latin-ext_latin-700.woff2)format("woff2"),url(./fonts/ibm-plex-sans-v9-latin-ext_latin-700.woff)format("woff")}@font-face{font-family:ibm plex sans;font-style:italic;font-weight:700;src:url(./fonts/ibm-plex-sans-v9-latin-ext_latin-700italic.woff2)format("woff2"),url(./fonts/ibm-plex-sans-v9-latin-ext_latin-700italic.woff)format("woff")}*{box-sizing:border-box}body{color:#fff;background:#646464}#main{position:absolute;top:0;left:0}.slide{width:1920px;height:1080px;overflow:hidden}.music-box{position:absolute;bottom:140px;left:60px;width:860px;margin-left:20px;padding-left:10px;padding-top:5px;padding-right:10px;padding-bottom:5px;font-family:ibm plex sans;font-weight:300;font-size:25px;color:#eee}.music{padding-left:10px;background:linear-gradient(110deg,rgba(95,124,125,.6) 0%,rgba(33,106,99,.2) 85%,rgba(77,120,18,0) 100%);border-left:6px solid;animation-name:border-color-anim;animation-duration:6s;animation-direction:alternate;animation-iteration-count:infinite;animation-timing-function:ease-in-out;text-shadow:0 0 6px #000;white-space:nowrap;overflow:hidden}.note{animation-name:color-anim;animation-duration:6s;animation-direction:alternate;animation-iteration-count:infinite;animation-timing-function:ease-in-out}.music .line1{display:flex;justify-content:space-between}.music .line2{overflow:hidden;text-overflow:ellipsis;padding-bottom:5px}.music .header{font-weight:600;white-space:normal;margin-left:.5rem}.music .title{margin-left:20px}.music .artist{font-style:italic}.music .by{margin-left:15px;margin-right:12px;font-style:italic}.music .license{font-size:20px;color:#ccc}.music.changed .glyph{animation-name:wiggle-anim;animation-duration:.1s;animation-iteration-count:50;animation-direction:alternate;animation-timing-function:linear}.music.changed .license{animation-name:opacity-anim;animation-duration:3s;animation-iteration-count:1;animation-timing-function:easy-out}.music.changed .line2{animation-name:slidein-anim;animation-duration:3s;animation-iteration-count:1;animation-timing-function:easy-out}@keyframes color-anim{0%{color:#ccd7d8}50%{color:#98adb0}100%{color:#80bec8}}@keyframes border-color-anim{0%{border-color:#ccd7d8}50%{border-color:#98adb0}100%{border-color:#80bec8}}@keyframes wiggle-anim{0%{transform:rotate(10deg)}100%{transform:rotate(-10deg)}}@keyframes slidein-anim{0%{transform:translateX(800px);opacity:0}40%{opacity:.6}100%{transform:translateX(0);opacity:1}}@keyframes opacity-anim{0%{opacity:0}100%{opacity:1}}.cms{display:none}.cms .meta-box{position:absolute;bottom:140px;right:60px;width:860px;height:81px;margin-right:20px;padding-left:10px;padding-top:5px;padding-right:10px;padding-bottom:5px;font-family:ibm plex sans;font-weight:300;font-size:25px;color:#eee;background-color:rgba(0,0,0,.8);box-shadow:2px 2px 8px 8px rgba(0,0,0,.8)}.cms .meta{padding-right:10px;background:linear-gradient(290deg,rgba(95,124,125,.6) 0%,rgba(33,106,99,.2) 85%,rgba(77,120,18,0) 100%);border-right:6px solid #98adb0;text-align:right}.cms .meta .header{font-weight:600;white-space:normal;margin-left:.5rem}.cms .meta .author{font-weight:500}.cms .meta.fresh .author{animation-name:opacity-anim;animation-duration:4s;animation-iteration-count:1;animation-timing-function:linear}.cms .content{position:absolute;top:0;left:0;width:100%;height:650px;height:790px;padding-top:140px;overflow:hidden}.cms .content .items{height:100%;max-height:100%}.cms .content .item{display:inline-block;width:1920px;height:100%;max-height:100%;text-align:center}.cms .content .item.fresh{animation-name:slide-in-anim;animation-duration:3s;animation-iteration-count:1;animation-timing-function:ease-out;animation-fill-mode:backwards,forwards}.cms .content .item.stale{animation-duration:3s;animation-iteration-count:1;animation-timing-function:ease-in;animation-fill-mode:both}.cms .content .item.stale.left{animation-name:slide-left-out-anim}.cms .content .item.stale.right{animation-name:slide-right-out-anim}.cms .content .item .cms-image{height:100%;max-height:100%}@keyframes slide-in-anim{0%{transform:translate3d(0,-200%,0);opacity:0%}100%{transform:translate3d(0,0,0);opacity:100%}}@keyframes slide-left-out-anim{0%{transform:translate3d(0,0,0);opacity:100%}100%{transform:translate3d(-100%,0,0);opacity:0%}}@keyframes slide-right-out-anim{0%{transform:translate3d(0,0,0);opacity:100%}100%{transform:translate3d(100%,0,0);opacity:0%}}.schedule{display:none}.bottom-bar{display:none}.hashtags{display:none}.music-box{background-color:rgba(0,0,0,.8);box-shadow:2px 2px 8px 8px rgba(0,0,0,.8)} |