Changeset View
Changeset View
Standalone View
Standalone View
web/calendar/filter-panel.css
div.container { | div.container { | ||||
position: fixed; | position: fixed; | ||||
width: 300px; | width: 300px; | ||||
top: 126px; | top: 126px; | ||||
bottom: 0; | bottom: 0; | ||||
background-attachment: fixed; | background-attachment: fixed; | ||||
display: flex; | display: flex; | ||||
flex-direction: column; | flex-direction: column; | ||||
border-right: 1px solid var(--border); | |||||
background-color: var(--filter-panel-bg); | |||||
} | } | ||||
div.filters { | div.filters { | ||||
color: #dddddd; | color: #dddddd; | ||||
overflow-y: auto; | overflow-y: auto; | ||||
height: 100%; | height: 100%; | ||||
} | } | ||||
div.option { | div.option { | ||||
margin: 5px 18px 5px 32px; | margin: 5px 18px 5px 32px; | ||||
▲ Show 20 Lines • Show All 74 Lines • ▼ Show 20 Lines | div.optionDetails { | ||||
font-size: 13px; | font-size: 13px; | ||||
display: inline-block; | display: inline-block; | ||||
text-indent: 24px; | text-indent: 24px; | ||||
padding-left: 10px; | padding-left: 10px; | ||||
padding-top: 1px; | padding-top: 1px; | ||||
} | } | ||||
div.searchContainer { | div.searchContainer { | ||||
padding: 8px 10px; | padding: 8px 10px; | ||||
background-color: rgba(0, 0, 0, 0.89); | flex-direction: row; | ||||
display: flex; | |||||
} | |||||
.collapseButton { | |||||
color: var(--filter-panel-fg); | |||||
margin-left: 12px; | |||||
margin-right: 6px; | |||||
align-self: center; | |||||
display: flex; | |||||
} | |||||
.collapseButton:hover { | |||||
color: var(--fg); | |||||
} | } | ||||
div.search { | div.search { | ||||
display: flex; | display: flex; | ||||
border-radius: 5px; | border-radius: 8px; | ||||
padding: 5px; | padding: 10px; | ||||
background-color: rgba(255, 255, 255, 0.27); | background-color: var(--text-input-bg); | ||||
align-items: center; | align-items: center; | ||||
flex-grow: 1; | |||||
height: 20px; | |||||
} | } | ||||
svg.searchVector { | svg.searchVector { | ||||
fill: white; | fill: var(--filter-panel-fg); | ||||
height: 22px; | height: 20px; | ||||
width: 22px; | width: 20px; | ||||
padding: 0 3px; | |||||
} | } | ||||
div.search > input { | div.search > input { | ||||
color: white; | color: white; | ||||
padding: 0; | padding: 0; | ||||
border: none; | border: none; | ||||
background-color: transparent; | background-color: transparent; | ||||
font-weight: 600; | font-weight: var(--normal); | ||||
font-size: 15px; | font-size: var(--s-font-14); | ||||
flex-grow: 1; | flex-grow: 1; | ||||
margin-left: 3px; | margin-left: 8px; | ||||
} | } | ||||
div.search > input:focus { | div.search > input:focus { | ||||
outline: none; | outline: none; | ||||
} | } | ||||
svg.clearQuery { | svg.clearQuery { | ||||
font-size: 15px; | font-size: 15px; | ||||
padding-bottom: 1px; | padding-bottom: 1px; | ||||
padding-right: 2px; | padding-right: 2px; | ||||
Show All 37 Lines |