audio-video-links-generator/style.css

114 lines
1.6 KiB
CSS
Raw Normal View History

2022-01-09 14:19:32 +01:00
* {
margin: 0px;
padding: 0px;
box-sizing: border-box;
text-rendering: optimizelegibility;
font-smooth: auto;
-webkit-font-smoothing: auto;
}
body {
font-family: "Open Sans";
color: hsl(258.8, 17.4%, 3%);
}
section {
display: flex;
flex-flow: row;
flex-wrap: nowrap;
}
h1 {
margin-bottom: 1rem;
}
.inputs {
display: flex;
flex-flow: column;
width: 24rem;
margin-right: 1rem;
}
.input {
display: flex;
flex-flow: column;
margin-bottom: 1rem;
}
.output {
display: flex;
flex-flow: column;
height: 20vh;
}
textarea {
border: 1px solid #5e636e;
padding: .5rem;
overflow-y: scroll;
font-size: .667rem;
font-family: 'Courier New', Courier, monospace;
width: 100%;
height: 100%;
margin-bottom: 1rem;
}
button {
padding: 0.25rem .5rem;
margin-bottom: 1rem;
}
.preview {
width: 700px;
border: 1px solid #5e636e;
}
section {
padding: 1rem;
}
.player {
width: 100%;
margin-bottom: 2rem;
}
.podcast-logos {
display: flex;
flex-flow: row wrap;
justify-content: center;
align-items: center;
}
.audio-logos {
margin-top: 2rem;
}
.video-logos {
margin-bottom: 2rem;
}
.podcast-logos > a {
margin: 0.75rem 0;
}
.podcast-logos > a,
.podcast-logos > a:hover {
text-decoration: none !important;
box-shadow: none !important;
}
.podcast-logos > a > img {
width: auto !important;
margin: 0 0.75rem;
max-width: 120px;
height: 3rem;
}
@media (prefers-color-scheme: dark) {
.logo {
content: var(--dark-image);
background-color: #191b1f;
display: block;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
}