stremio-web/src/common/ColorInput/styles.less
2019-10-05 23:42:27 +03:00

81 lines
No EOL
2 KiB
Text

.color-input-modal-container {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
pointer-events: auto;
background-color: var(--color-backgrounddarker40);
.color-input-container {
flex: none;
display: flex;
flex-direction: column;
align-items: center;
max-width: 25rem;
padding: 1rem;
background-color: var(--color-surfacelighter);
.header-container {
flex: none;
align-self: stretch;
display: flex;
flex-direction: row;
align-items: flex-start;
.title {
flex: 1;
margin-right: 1rem;
font-size: 1.2rem;
max-height: 2.4em;
}
.close-button-container {
flex: none;
width: 1.5rem;
height: 1.5rem;
padding: 0.25rem;
&:hover, &:focus {
background-color: var(--color-surfacedark20);
}
&:focus {
outline-color: var(--color-surfacedarker);
}
.icon {
display: block;
width: 100%;
height: 100%;
fill: var(--color-surfacedarker);
}
}
}
.color-picker {
flex: none;
margin: 1rem;
}
.submit-button-container {
flex: none;
align-self: stretch;
padding: 1rem;
background-color: var(--color-signal5);
&:hover, &:focus {
filter: brightness(1.2);
}
&:focus {
outline-color: var(--color-surfacedarker);
}
.label {
max-height: 2.4em;
text-align: center;
color: var(--color-surfacelighter);
}
}
}
}