Files
personal-website/public/styles.css
T
marco 6e3715af7b
Deploy static site / deploy (push) Successful in 38s
added music players to music page
2026-04-24 13:31:09 +02:00

135 lines
1.6 KiB
CSS

@font-face {
font-family: ubuntuSansMono;
src: url(fonts/UbuntuSansMono-VariableFont_wght.ttf);
}
@font-face {
font-family: comicMono;
src: url(fonts/ComicMono.ttf);
}
body {
text-align: center;
background-color: #221826;
}
h1,
h2,
h3,
h4,
h5,
p {
font-family: ubuntuSansMono;
color: #DDDDEE
}
a {
color: #DD7FB6;
text-decoration: none
}
#navbar {
position: sticky;
top: 0;
overflow: hidden;
display: block;
}
#navbar a {
padding: 5px;
display: inline-block;
font-size: larger;
}
#language {
position: fixed;
bottom: 0;
right: 0;
float: right;
padding: 15px;
font-size: larger;
}
#sidebar {
position: fixed;
top: 0;
right: 0;
overflow: hidden;
flex-direction: column;
display: flex;
float: right;
padding: 15px;
}
#sidebar a {
float: right;
display: block;
text-align: end;
padding: 5px;
text-decoration: none;
font-size: larger;
}
a:hover {
color: #D0A7DF
}
iframe {
border: none;
}
iframe.nowplaying {
width: 400px;
height: 170px;
}
div.nowplaying {
position: fixed;
bottom: 15px;
left: 15px;
}
div.audiocard {
background-color: #51324A;
display: inline-flex;
text-align: left;
flex-direction: row;
box-sizing: border-box;
padding: 15px;
border-radius: 15px;
}
div.audioinner {
padding-left: 15px;
display: inline-flex;
flex-direction: column;
justify-content: space-between;
}
img.albumcoversmall {
height: 100px;
width: 90px;
}
div.audioinner a,
p {
margin: 5px;
}
iframe.bandcamptracksmall {
border: 0;
width: 400px;
height: 42px
}
/*colors:
#221826
#51324A
#804C6E
#DD7FB6
#D0A7DF
#DDDDEE
*/