145 lines
2.5 KiB
CSS
145 lines
2.5 KiB
CSS
.vcd-screen-picker-modal {
|
|
padding: 1em;
|
|
}
|
|
|
|
.vcd-screen-picker-header h1 {
|
|
margin: 0;
|
|
}
|
|
|
|
.vcd-screen-picker-footer {
|
|
display: flex;
|
|
gap: 1em;
|
|
}
|
|
|
|
.vcd-screen-picker-card {
|
|
flex-grow: 1;
|
|
}
|
|
|
|
.vcd-screen-picker-grid {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
gap: 2em 1em;
|
|
}
|
|
|
|
.vcd-screen-picker-grid input {
|
|
appearance: none;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.vcd-screen-picker-selected img {
|
|
border: 2px solid var(--brand-500);
|
|
border-radius: 3px;
|
|
}
|
|
|
|
.vcd-screen-picker-grid label {
|
|
overflow: hidden;
|
|
padding: 8px;
|
|
cursor: pointer;
|
|
display: grid;
|
|
justify-items: center;
|
|
}
|
|
|
|
.vcd-screen-picker-grid label:hover {
|
|
outline: 2px solid var(--brand-500);
|
|
}
|
|
|
|
.vcd-screen-picker-grid div {
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
text-align: center;
|
|
font-weight: 600;
|
|
margin-inline: 0.5em;
|
|
}
|
|
|
|
.vcd-screen-picker-card {
|
|
padding: 0.5em;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.vcd-screen-picker-preview-img-linux {
|
|
width: 60%;
|
|
margin-bottom: 0.5em;
|
|
}
|
|
|
|
.vcd-screen-picker-preview-img {
|
|
width: 90%;
|
|
margin-bottom: 0.5em;
|
|
}
|
|
|
|
.vcd-screen-picker-preview {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
margin-bottom: 1em;
|
|
}
|
|
|
|
.vcd-screen-picker-radio input {
|
|
display: none;
|
|
}
|
|
|
|
.vcd-screen-picker-radio {
|
|
background-color: var(--background-secondary);
|
|
border: 1px solid var(--primary-800);
|
|
padding: 0.3em;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.vcd-screen-picker-radio h2 {
|
|
margin: 0;
|
|
}
|
|
|
|
.vcd-screen-picker-radio[data-checked="true"] {
|
|
background-color: var(--brand-500);
|
|
border-color: var(--brand-500);
|
|
}
|
|
|
|
.vcd-screen-picker-radio[data-checked="true"] h2 {
|
|
color: var(--interactive-active);
|
|
}
|
|
|
|
.vcd-screen-picker-quality {
|
|
display: flex;
|
|
gap: 1em;
|
|
margin-bottom: 0.5em;
|
|
}
|
|
|
|
.vcd-screen-picker-quality section {
|
|
flex: 1 1 auto;
|
|
}
|
|
|
|
.vcd-screen-picker-settings-button {
|
|
margin-left: auto;
|
|
margin-top: 0.3rem;
|
|
}
|
|
|
|
.vcd-screen-picker-radios {
|
|
display: flex;
|
|
width: 100%;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
.vcd-screen-picker-radios label {
|
|
flex: 1 1 auto;
|
|
text-align: center;
|
|
}
|
|
|
|
.vcd-screen-picker-radios label:first-child {
|
|
border-radius: 3px 0 0 3px;
|
|
}
|
|
|
|
.vcd-screen-picker-radios label:last-child {
|
|
border-radius: 0 3px 3px 0;
|
|
}
|
|
|
|
.vcd-screen-picker-audio {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.vcd-screen-picker-hint-description {
|
|
color: var(--header-secondary);
|
|
font-size: 14px;
|
|
line-height: 20px;
|
|
font-weight: 400;
|
|
}
|