Created
July 5, 2021 00:31
-
-
Save calvinmorett/f096b2439152f98bd3f432395baed5d8 to your computer and use it in GitHub Desktop.
scanners.live
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html><!-- <!DOCTYPE html> --> | |
<html lang="en" prefix="og: http://ogp.me/ns#"> | |
<head> | |
<title>Scanners.live :: MKN</title> | |
<meta name="viewport" content="width=device-width, initial-scale=1"> | |
<meta name="description" content="Scanners.live" /> | |
<meta name="designer" content="Calvin"> | |
<meta name="robots" content="index,follow" /> | |
<meta name="Classification" content="Media"> | |
<meta name="keywords" content="scanners, scanners.live, police, fire, rescue, crime, blotter, current events, dispatcher, broadcastify, police scanners, fire department scanners, mkn, glens falls, indianapolis, san antonio, NY, IN, TX, new york, indiana, texas, california, ambient music, ambient, la, los angeles, ca" /> | |
<meta property="og:title" content="Scanners.live" /> | |
<!-- <meta property="og:image" content="x" /> --> | |
<meta property="og:site_name" content="Scanners.live" /> | |
<meta property="og:description" content="Scanners.live - Feed for Glens Falls, NY, Indiapolis, IN, San Antonio, TX and Los Angeles, CA." /> | |
<meta property="og:url" content="https://scanners.live" /> | |
<meta property="og:type" content="article:2021,07,04" /> | |
</head> | |
<body> | |
<div class="wrapper"> | |
<h1>scanners.live</h1> | |
<div class="row"> | |
<div class="col-sm"> | |
<section> | |
<div class="play"></div> | |
<p>Glens Falls, NY</p> | |
<audio controls> | |
<source src="https://broadcastify.cdnstream1.com/3316"> | |
</audio> | |
</section> | |
</div> | |
<div class="col-sm"> | |
<section> | |
<div class="play"></div> | |
<p>Indianapolis, IN</p> | |
<audio controls> | |
<source src="https://broadcastify.cdnstream1.com/32602"> | |
</audio> | |
</section> | |
</div> | |
</div> | |
<div class="row"> | |
<div class="col-sm"> | |
<section> | |
<div class="play"></div> | |
<p>San Antonio, TX</p> | |
<audio controls> | |
<source src="https://broadcastify.cdnstream1.com/13814"> | |
</audio> | |
</section> | |
</div> | |
<div class="col-sm"> | |
<section> | |
<div class="play"></div> | |
<p>Los Angeles, CA</p> | |
<audio controls> | |
<source src="https://broadcastify.cdnstream1.com/1874"> | |
</audio> | |
</section> | |
</div> | |
</div> | |
</div> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
*, *:before, *:after{text-shadow: 0 0 0; text-rendering: optimizeLegibility; text-rendering: geometricPrecision; font-smooth: always; font-smoothing: antialiased; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -moz-font-smoothing: antialiased; -webkit-font-smoothing: antialiased; -webkit-font-smoothing: subpixel-antialiased; } html, body{ padding:0; margin: 0 auto; } /* Body ========================= Center */ .body-container{ margin: 0 auto; } | |
/* i. styles for body and global */ | |
* { | |
box-sizing: border-box; | |
/* should be covered by reset */ | |
} | |
html { | |
font-size: 100%; | |
-webkit-text-size-adjust: 100%; | |
-ms-text-size-adjust: 100%; | |
-webkit-font-smoothing: antialiased; | |
} | |
::-moz-selection { | |
background: rgba(0, 0, 0, .99); | |
color: #fff; | |
text-shadow: none; | |
} | |
::selection { | |
background: rgba(0, 0, 0, .99); | |
color: #fff; | |
text-shadow: none; | |
} | |
html,body{ | |
color:#f1f3f4; | |
font-size:11px; | |
font-family:sans-serif; | |
line-height:1; | |
background:#111; | |
} | |
body { | |
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; | |
text-rendering: optimizeLegibility; | |
-webkit-font-smoothing: antialiased; | |
-moz-osx-font-smoothing: grayscale; | |
margin:2em; | |
} | |
.wrapper{ | |
margin:1em auto; | |
} | |
.wrapper section { | |
text-align: left; | |
} | |
.wrapper h1{ | |
letter-spacing:1px; | |
font-weight:normal; | |
color:#f1f3f4; | |
padding-bottom:10px; | |
} | |
.wrapper h1 span{ | |
color:transparent; | |
} | |
.wrapper h1:before{ | |
content:''; | |
background: rgba(255,0,0,1); | |
width:100vw; | |
height:1px; | |
margin-left:1px; | |
position:absolute; | |
top:0; | |
left:0; | |
animation:activated 1s ease infinite; | |
} | |
section{ | |
margin:2em 0; | |
border:1px solid transparent; | |
transition:all .3s ease; | |
cursor:pointer; | |
border:3px solid rgba(255,0,0,.5); | |
} | |
section p { | |
padding: 18px 15px 5px; | |
} | |
section:hover{ | |
color:red; | |
} | |
section audio{ | |
max-width:100%; | |
width: 100%; | |
height: 44px; | |
background:#f1f3f4; | |
transition:opacity .1s ease; | |
} | |
section:hover audio{ | |
opacity:1; | |
} | |
.active{ | |
color:red; | |
opacity:1; | |
} | |
.active:before { | |
content: ''; | |
display: inline-block; | |
background: red; | |
width: 10px; | |
height: 10px; | |
position: absolute; | |
border-radius: 100%; | |
animation: activated .5s ease infinite; | |
top: -5px; | |
left: -5px; | |
z-index:10; | |
} | |
@keyframes activated{ | |
0%{ | |
opacity:1;} | |
50%{ | |
opacity:0; | |
} | |
} | |
section{position:relative;} | |
.play:before,.play:after{ | |
content:''; | |
display:inline-block; | |
vertical-align:middle; | |
width:2px; | |
height:2px; | |
padding:6px; | |
top:-7px; | |
left:-7px; | |
position:absolute; | |
border:1px solid rgba(255,0,0,.5); | |
border-radius:100%; | |
background:#111; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.0/css/bootstrap.min.css" rel="stylesheet" /> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment