ryang3d/sbv
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

more mobile fixes with direct linking and others

Browse Source
This commit is contained in:
lowcarbdev
2025-11-22 22:35:37 -07:00
parent b6d63fc2d2
commit c542c9aebb
3 changed files with 50 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/DateFilter.jsx
+14 -13
View File
@@ -9,12 +9,13 @@ function DateFilter({ startDate, endDate, minDate, maxDate, onStartDateChange, o
return (
<div className="px-2 py-1 bg-light">
<div className="d-flex align-items-center gap-2 flex-wrap small">
<div className="d-flex align-items-center gap-1">
<svg style={{width: '1rem', height: '1rem'}} className="text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" />
</svg>
<label className="fw-semibold mb-0">From:</label>
<div className="d-flex align-items-center gap-1 gap-sm-2 small">
<svg style={{width: '1rem', height: '1rem'}} className="text-primary flex-shrink-0 d-none d-sm-block" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" />
</svg>
<div className="d-flex align-items-center gap-1 date-picker-wrapper">
<label className="fw-semibold mb-0 flex-shrink-0 small">From:</label>
<DatePicker
selected={startDate}
onChange={onStartDateChange}
@@ -24,13 +25,13 @@ function DateFilter({ startDate, endDate, minDate, maxDate, onStartDateChange, o
minDate={minDate}
maxDate={maxDate}
dateFormat="MMM d, yyyy"
className="form-control form-control-sm"
placeholderText="Start date"
className="form-control form-control-sm date-picker-input"
placeholderText="Start"
/>
</div>
<div className="d-flex align-items-center gap-1">
<label className="fw-semibold mb-0">To:</label>
<div className="d-flex align-items-center gap-1 date-picker-wrapper">
<label className="fw-semibold mb-0 flex-shrink-0 small">To:</label>
<DatePicker
selected={endDate}
onChange={onEndDateChange}
@@ -40,15 +41,15 @@ function DateFilter({ startDate, endDate, minDate, maxDate, onStartDateChange, o
minDate={startDate || minDate}
maxDate={maxDate}
dateFormat="MMM d, yyyy"
className="form-control form-control-sm"
placeholderText="End date"
className="form-control form-control-sm date-picker-input"
placeholderText="End"
/>
</div>
{(startDate || endDate) && (
<button
onClick={clearDates}
className="btn btn-sm btn-outline-primary d-flex align-items-center gap-1"
className="btn btn-sm btn-outline-primary d-flex align-items-center gap-1 flex-shrink-0"
>
<svg style={{width: '0.875rem', height: '0.875rem'}} fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />