kuu7o/nitter
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add location field to search panel

Browse Source
This commit is contained in:
Zed
2019-09-19 23:36:21 +02:00
parent 8324508b2c
commit 62df60be78
7 changed files with 73 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
src/sass/include/_mixins.css
View File

@@ -59,14 +59,25 @@
}
}
@mixin search-resize($width, $rows, $height) {
@mixin search-resize($width, $rows) {
@media(max-width: $width) {
.search-toggles {
grid-template-columns: repeat($rows, auto);
}
#search-panel-toggle:checked ~ .search-panel {
max-height: $height !important;
@if $rows == 6 {
max-height: 200px !important;
}
@if $rows == 5 {
max-height: 300px !important;
}
@if $rows == 4 {
max-height: 300px !important;
}
@if $rows == 3 {
max-height: 365px !important;
}
}
}
}

10
src/sass/inputs.scss
View File

@@ -42,12 +42,16 @@ input::-webkit-datetime-edit-year-field:focus {
}
.date-range {
display: block;
.date-input {
display: inline-block;
position: relative;
}
.icon-container {
margin-left: -22px;
margin-right: 4px;
pointer-events: none;
position: absolute;
top: 2px;
right: 5px;
}
.search-title {

45
src/sass/search.scss
View File

@@ -40,7 +40,7 @@
@include input-colors;
}
@include create-toggle(search-panel, 190px);
@include create-toggle(search-panel, 200px);
}
.search-panel {
@@ -74,6 +74,31 @@
}
}
.search-row {
display: flex;
flex-wrap: wrap;
line-height: unset;
> div {
flex-grow: 1;
flex-shrink: 1;
}
input {
height: 21px;
}
.pref-input {
display: block;
padding-bottom: 5px;
input {
height: 21px;
margin-top: 1px;
}
}
}
.search-toggles {
flex-grow: 1;
display: grid;
@@ -82,14 +107,14 @@
}
.profile-tabs {
@include search-resize(785px, 5, 240px);
@include search-resize(725px, 4, 240px);
@include search-resize(600px, 6, 190px);
@include search-resize(530px, 5, 240px);
@include search-resize(480px, 4, 240px);
@include search-resize(410px, 3, 305px);
@include search-resize(820px, 5);
@include search-resize(725px, 4);
@include search-resize(600px, 6);
@include search-resize(560px, 5);
@include search-resize(480px, 4);
@include search-resize(410px, 3);
}
@include search-resize(530px, 5, 240px);
@include search-resize(480px, 4, 240px);
@include search-resize(410px, 3, 305px);
@include search-resize(560px, 5);
@include search-resize(480px, 4);
@include search-resize(410px, 3);