mirror of https://github.com/FreeTubeApp/FreeTube
83 lines
1.7 KiB
Sass
83 lines
1.7 KiB
Sass
.settingsSection
|
|
background-color: var(--card-bg-color)
|
|
width: 85%
|
|
margin: 0 auto
|
|
@media only screen and (max-width: 800px)
|
|
width: 100%
|
|
|
|
&[open]
|
|
padding-bottom: 15px
|
|
|
|
> div
|
|
width: 100%
|
|
padding: 0px 20px
|
|
box-sizing: border-box
|
|
> div:not(:last-child):not(.ft-flex-box)
|
|
@media only screen and (max-width: 800px)
|
|
margin-bottom: 20px
|
|
|
|
.sectionLine
|
|
width: 100%
|
|
height: 2px
|
|
border: 0
|
|
margin-top: -1px
|
|
background-color: var(--primary-color)
|
|
|
|
.sectionHeader
|
|
display: block
|
|
cursor: pointer
|
|
padding: 1px
|
|
|
|
.sectionTitle
|
|
margin-left: 2%
|
|
|
|
:deep(.switchGrid)
|
|
display: grid
|
|
grid-template-columns: auto auto
|
|
justify-content: space-evenly
|
|
align-items: center
|
|
|
|
@media only screen and (max-width: 680px)
|
|
grid-template-columns: auto
|
|
|
|
:deep(.switchColumnGrid)
|
|
@extend :deep(.switchGrid)
|
|
align-items: start
|
|
|
|
:deep(.switchColumn)
|
|
display: flex
|
|
flex-direction: column
|
|
justify-items: start
|
|
|
|
:deep(.center)
|
|
text-align: center
|
|
|
|
@media only screen and (max-width: 460px)
|
|
:deep(.settingsFlexStart460px)
|
|
justify-content: flex-start
|
|
|
|
@media only screen and (max-width: 500px)
|
|
:deep(.settingsFlexStart500px)
|
|
justify-content: flex-start
|
|
|
|
@media only screen and (max-width: 680px)
|
|
.settingsSection
|
|
> div
|
|
:deep(.text.bottom)
|
|
left: -85px
|
|
:deep(.switch-ctn.containsTooltip)
|
|
left: -10px
|
|
margin-right: 5px
|
|
padding: 0px 10px 0px 10px
|
|
:not(.select, .selectLabel)
|
|
> :deep(.tooltip)
|
|
display: inline-block
|
|
position: absolute
|
|
right: -25px
|
|
top: 12px
|
|
.settingsFlexStart460px :deep(.tooltip)
|
|
right: 0px
|
|
top: -2px
|
|
:deep(.switch-ctn)
|
|
margin: 10px 7px
|