Widget:AudioPlayer2: Difference between revisions

From The Midnight Wiki
No edit summary
m (Text replacement - "f30b43" to "fd184e")
 
(7 intermediate revisions by the same user not shown)
Line 2: Line 2:
{{#widget:AudioPlayer2|mp3=/images/b/be/Lost_boy_v2_80_.mp3}}
{{#widget:AudioPlayer2|mp3=/images/b/be/Lost_boy_v2_80_.mp3}}
{{#widget:AudioPlayer2|mp3=/images/5/5a/Gloria_rough_08.12.12_guide_.mp3}}
{{#widget:AudioPlayer2|mp3=/images/5/5a/Gloria_rough_08.12.12_guide_.mp3}}
== Sample result ==
== Sample result ==


Line 10: Line 11:
<style>
<style>
.player {
.player {
   background-color: hsl(194,100%,50%);
   background: var(--tmw-after-gradient);
   width: 330px;
   width: 330px;
   height: 190px;
   height: 190px;
   position: relative;
   position: relative;
   border-radius: 8px;
   border-radius: 8px;
   box-shadow: 0 8px 0 0 hsl(205,100%,41%);
   box-shadow: -1px 4px 10px 5px hsl(216,100%,8%);
   z-index: 1;
   z-index: 1;
}
}
Line 51: Line 52:
   height: 15px;
   height: 15px;
   width: 15px;
   width: 15px;
   border: 20px solid #f81472;
   border: 20px solid #fd184e;
   border-radius: 50%;
   border-radius: 50%;
}  
}  
Line 151: Line 152:
     right: 6px;
     right: 6px;
     top: 131px;
     top: 131px;
    filter: none;
}
.player-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
}
}
</style>
</style>

Latest revision as of 22:14, 1 April 2024

Press the button to play/pause

Adjust volume with slider

Press the button to play/pause

Adjust volume with slider

Sample result