mirror of
https://github.com/exane/not-gwent-online
synced 2024-12-23 21:03:14 +00:00
add music
This commit is contained in:
parent
2b068d4655
commit
6a970fef68
BIN
assets/music-mute.png
Normal file
BIN
assets/music-mute.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 16 KiB |
BIN
assets/music.png
Normal file
BIN
assets/music.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 16 KiB |
@ -13,6 +13,15 @@
|
||||
<script src="Config.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="music-container" title="Click to mute/unmute music">
|
||||
<span class="video-self"></span>
|
||||
<i class="music-icon active"></i>
|
||||
<div class="music-options">
|
||||
<label for="volume">Volume</label>
|
||||
<input type="text" class="volume" id="volume">
|
||||
<label for="volume">%</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="notifications"></div>
|
||||
@ -20,6 +29,10 @@
|
||||
</div>
|
||||
</div>
|
||||
<script src="build/app.js"></script>
|
||||
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
|
||||
<script src="build/tubeplayer.js"></script>
|
||||
<script src="build/temp.js"></script>
|
||||
<script>
|
||||
|
||||
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||||
|
@ -101,4 +101,63 @@ body {
|
||||
text-align: right;
|
||||
color: #8798ac;
|
||||
right: 20px;
|
||||
}
|
||||
|
||||
.music-container {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
transition: all .2s ease-in-out 0s;
|
||||
z-index: 20;
|
||||
padding: 30px;
|
||||
|
||||
&:hover .music-options {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
}
|
||||
|
||||
.music-icon {
|
||||
background: url(../../assets/music-mute.png) no-repeat;
|
||||
float: right;
|
||||
width: 35px;
|
||||
height: 33px;
|
||||
opacity: .8;
|
||||
cursor: pointer;
|
||||
transition: all .2s ease-in-out 0s;
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
&.active {
|
||||
background: url(../../assets/music.png) no-repeat;
|
||||
}
|
||||
}
|
||||
|
||||
.music-options {
|
||||
float: right;
|
||||
background: rgba(#000, .5);
|
||||
padding: 10px 20px;
|
||||
color: #8798ac;
|
||||
clear: both;
|
||||
margin: 15px 0 0 0;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
width: 170px;
|
||||
|
||||
label {
|
||||
float: left;
|
||||
margin: 4px 10px 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.volume {
|
||||
width: 40px;
|
||||
background: #404d5b;
|
||||
border: 0;
|
||||
padding: 5px;
|
||||
float: left;
|
||||
margin: 0 15px 0 0;
|
||||
text-align: center;
|
||||
}
|
Loading…
Reference in New Issue
Block a user