Файл: system/AJAX/AlphaPlayer/audio/style.css
Строк: 230
.player-play-phone {
padding: 15px;
position: relative;
overflow:
hidden;
}
.player-modal-button-op {
position: absolute;
bottom:
0;
left: -1px;
right: -1px;
}
.player-modal-button {
display:
inline-block;
box-sizing: border-box;
height: 47px;
line-height:
47px;
width: 33.3%;
text-align: center;
background: none;
border:
none;
outline: none;
color: #3A474C;
border-left: 1px #E2EAED solid;
border-top: 1px #E2EAED solid;
font-size: 14px;
vertical-align: top;
}
.player-bg {
background-color: #E4EAF5;
width: 100%;
height:
7px;
box-sizing: border-box;
border-radius: 4px;
}
.player-bar {
width: 0px;
height: 7px;
background-color: #6694EB;
border-radius:
4px;
position: relative;
}
.player-bar:after {
content: '';
position: absolute;
right: 0px;
width: 13px;
height: 13px;
bottom:
-3px;
border-radius: 100%;
display: inline-block;
background-color:
#6694EB;
}
.player-timer {
color: #A4A4A4;
font-size: 12px;
margin-top: 8px;
margin-left: 2px;
display: inline-block;
}
.player-duration {
color: #A4A4A4;
font-size: 12px;
margin-top: 8px;
margin-right: 2px;
display: inline-block;
float:
right;
}
.player-list-count {
color: #A4A4A4;
font-size: 12px;
margin-top: 8px;
margin-right: 2px;
display: inline-block;
position:
absolute;
left: 50%;
transform: translateX(-50%);
}
.player-music-info {
margin-top: 11px;
text-align: center;
}
.player-music-menu {
margin-top: 12px;
text-align: center;
position: relative;
}
.player-name {
font-size: 18px;
}
.player-artist {
font-size: 13px;
color: #6694EB;
margin-top:
7px;
}
.player-img {
display: inline-block;
width: 115px;
height: 115px;
border-radius: 8px;
background-color: #E4EAEF;
overflow: hidden;
}
.player-close {
display: inline-block;
top:
17px;
right: 20px;
width: 30px;
height: 30px;
line-height: 29px;
position: absolute;
background-color: #E4EAEF;
border-radius: 100%;
text-align: center;
}
.player-back {
display: inline-block;
left: 30px;
width: 40px;
height: 40px;
top: 5px;
line-height:
40px;
position: absolute;
background-color: #E4EAEF;
border-radius:
100%;
text-align: center;
}
.player-back i{
position: relative;
right: 2px;
}
.player-forward {
display: inline-block;
right:
30px;
width: 40px;
height: 40px;
top: 5px;
line-height: 40px;
position: absolute;
background-color: #E4EAEF;
border-radius: 100%;
text-align: center;
}
.player-forward i{
position: relative;
left: 2px;
}
.player-play_or_pause {
display: inline-block;
left: 50%;
width: 50px;
height: 50px;
line-height: 50px;
position:
absolute;
background-color: #E4EAEF;
border-radius: 100%;
text-align:
center;
transform: translateX(-50%);
}
.player-play_or_pause i{
position: relative;
left: 2px;
}
.music-play {
background-color:
rgba(100,100,100,0.7);
width: 35px;
height: 35px;
border-radius:
100%;
position: absolute;
text-align: center;
color: white;
border:
none;
left: 40%;
top: 50%;
transform: translate(-40%, -50%);
z-index: 2;
outline: none;
}
.music-play img{
max-width: 22px;
position: relative;
top: 1px;
}
.music-play i{
position:
relative;
top: 1px;
left: 1px;
}
.admin-web-player-content {
position: fixed;
left: 0;
width: 260px;
background-color: #292D30;
z-index: 999;
padding: 7px;
}
.admin-web-player-content2 {
position: relative;
color: #C5CFD7;
width: 100%;
box-sizing:
border-box;
padding-left: 30px;
padding-right: 30px;
padding-top:
10px;
padding-bottom: 10px;
}
.admin-web-player-play {
position: absolute;
left: 5px;
top: 9px;
}
.admin-web-player-list
{
white-space: nowrap;
font-size: 12px;
text-overflow: ellipsis;
overflow: hidden;
}
.admin-web-player-exit {
position:
absolute;
right: 5px;
top: 9px;
}
.admin-web-player-modal {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%,
-50%);
width: 350px;
height: 450px;
background-color: white;
z-index: 105;
border-radius: 15px;
-webkit-box-shadow: 4px 4px 8px 0px
rgba(34, 60, 80, 0.2);
-moz-box-shadow: 4px 4px 8px 0px rgba(34, 60, 80,
0.2);
box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.2);
overflow:
hidden;
}
.admin-web-player-modal-phone {
position: fixed;
left:
0;
right: 0;
top: 0;
bottom: 0;
background-color: rgba(34, 60, 80,
0.2);
z-index: 104;
}
.admin-touch-player-content {
background-color: #292D30;
padding: 2px;
background-color: white;
position: fixed;
max-width: 650px;
width: 100%;
z-index: 100;
border-bottom: 1px solid #F2F2F2;
}
.admin-touch-player-content2 {
position: relative;
color: #496876;
width: 100%;
box-sizing:
border-box;
padding-left: 45px;
padding-right: 45px;
padding-top:
10px;
padding-bottom: 10px;
}
.admin-touch-player-play {
position: absolute;
width: 45px;
left: 0;
text-align: center;
}
.admin-touch-player-list {
white-space: nowrap;
font-size:
12px;
text-overflow: ellipsis;
overflow: hidden;
}
.admin-touch-player-exit {
position: absolute;
right: 0;
top: 6px;
width: 45px;
text-align: center;
}
.admin-touch-player-modal {
position: fixed;
top: 50%;
left:
50%;
transform: translate(-50%, -50%);
width: 330px;
height: 440px;
background-color: white;
z-index: 105;
border-radius: 15px;
-webkit-box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.2);
-moz-box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.2);
box-shadow: 4px
4px 8px 0px rgba(34, 60, 80, 0.2);
overflow: hidden;
}
.admin-touch-player-modal-phone {
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
background-color: rgba(34, 60, 80,
0.2);
z-index: 104;
}
.web-player-content {
background-color: #292D30;
padding: 2px;
background-color: white;
position: fixed;
max-width: 242px;
width: 100%;
height: 28px;
z-index: 100;
border-bottom: 1px solid #F2F2F2;
}
.web-player-content2 {
position: relative;
color: #496876;
width: 100%;
box-sizing: border-box;
padding-left: 45px;
padding-right: 45px;
padding-top: 10px;
padding-bottom: 10px;
}
.web-player-play {
position: absolute;
width: 40px;
left: 0;
top: 8px;
text-align: center;
}
.web-player-list {
white-space:
nowrap;
font-size: 12px;
text-overflow: ellipsis;
overflow:
hidden;
width: 150px;
top: 9px;
left: 40px;
position: absolute;
}
.web-player-exit {
position: absolute;
right: 0;
top: 7px;
width: 40px;
text-align: center;
}
.web-player-modal {
position:
fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 330px;
height: 440px;
background-color: white;
z-index: 105;
border-radius: 15px;
-webkit-box-shadow: 4px 4px 8px 0px rgba(34, 60, 80,
0.2);
-moz-box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.2);
box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.2);
overflow: hidden;
}
.web-player-modal-phone {
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
background-color: rgba(34, 60, 80, 0.2);
z-index:
104;
}