| Display title | Widget:AudioPlayer2 |
| Default sort key | AudioPlayer2 |
| Page length (in bytes) | 3,775 |
| Namespace ID | 274 |
| Namespace | Widget |
| Page ID | 1816 |
| Page content language | en - English |
| Page content model | wikitext |
| Indexing by robots | Allowed |
| Number of redirects to this page | 0 |
| Edit | Allow only users with "editwidgets" permission (infinite) |
| Move | Allow only users with "editwidgets" permission (infinite) |
| Page creator | Timothy (talk | contribs) |
| Date of page creation | 21:14, 12 June 2023 |
| Latest editor | Timothy (talk | contribs) |
| Date of latest edit | 21:14, 1 April 2024 |
| Total number of edits | 97 |
| Total number of distinct authors | 1 |
| Recent number of edits (within past 90 days) | 0 |
| Recent number of distinct authors | 0 |
Description | Content |
Article description: (description)
This attribute controls the content of the description and og:description elements. | .player {
background: var(--tmw-after-gradient);
width: 330px;
height: 190px;
position: relative;
border-radius: 8px;
box-shadow: -1px 4px 10px 5px hsl(216,100%,8%);
z-index: 1;
}
.record {
height: 175px;
width: 175px;
background-color: #181312;
border-radius: 50%;
position: absolute;
top: 7px;
left: 28px;
display: flex;
align-items: center;
justify-content: center;
}
.record:before,
.record:after {
position: absolute;
content: "";
border: 5px solid transparent;
border-top-color: #2c2424;
border-bottom-color: #2c2424;
border-radius: 50%;
}
.record:before {
height: 135px;
width: 135px;
}
.record:after {
height: 95px;
width: 95px;
}
.player-label {
background-color: #181312;
height: 15px;
width: 15px;
border: 20px solid #f30b43;
border-radius: 50%;
}
.tone-arm {
height: 90px;
width: 6px;
background-color: #ffffff;
position: absolute;
top: 25px;
right: 95px;
transition: 1s;
transform-origin: top;
}
.control {
background-color: #181312;
height: 17px;
width: 17px;
border: 10px solid #2c2c2c;
border-radius: 50%;
position: absolute;
top: -16px;
left: -16px;
}
.tone-arm:before {
content: "";
height: 40px;
width: 6px;
background-color: #ffffff;
position: absolute;
transform: rotate(30deg);
bottom: -36px;
right: 10px;
}
.tone-arm:after {
content: "";
position: absolute;
height: 0;
width: 10px;
border-top: 18px solid #b2aea6;
border-left: 2px solid transparent;
border-right: 2px solid transparent;
top: 108px;
right: 12.5px;
transform: rotate(30deg);
}
.btn {
height: 28px;
width: 28px;
background-color: #d11b66;
border-radius: 50%;
position: absolute;
bottom: 5px;
left: 7px;
border: 3.5px solid #95003d;
outline: none;
padding: 0 !important;
cursor: pointer;
}
.slider {
-webkit-appearance: none;
appearance: none;
transform: rotate(-90deg);
width: 90px;
height: 7px;
position: absolute;
left: 252px;
top: 60px;
background-color: #d11b66;
outline: none;
border-radius: 3px;
border: 6px solid #95003d;
}
.slider::-webkit-slider-thumb {
-webkit-appearance: none;
appearance: none;
width: 10px;
height: 12px;
background-color: #ffffff;
cursor: pointer;
}
.play {
transform: rotate(30deg);
transform-origin: top;
transition: 1s;
}
.on {
animation: spin 3s 1s linear infinite;
}
@keyframes spin {
100% {
transform: rotate(360deg);
}
}
.player-wrapper .sign-logo {
width: 120px;
height: 50.14px;
right: 6px;
top: 131px;
filter: none;
}
.player-wrapper {
display: flex;
flex-direction: column;
align-items: center;
}
Press the button to play/pause |
