Commit 94dc7a13 authored by Mattias J Duffy's avatar Mattias J Duffy
Browse files

adding scrolling to sidebar so it works with more screen resolutions

parent b4e02b97
Pipeline #1876 passed with stage
in 1 minute and 45 seconds
...@@ -47,6 +47,7 @@ const Sidebar = ({facility, isSidebarOpen, isSidebarMapOpen, toggleSidebarMap, f ...@@ -47,6 +47,7 @@ const Sidebar = ({facility, isSidebarOpen, isSidebarMapOpen, toggleSidebarMap, f
</div> </div>
</div> </div>
<Divider className={'sidebar-divider'}/> <Divider className={'sidebar-divider'}/>
<div className={'sidebar-scroll'}>
<div className={'sidebar-label-holder'}> <div className={'sidebar-label-holder'}>
<TextwTitle label="Building" content="The Johnson Center"/> <TextwTitle label="Building" content="The Johnson Center"/>
<TextwTitle label="Address" content="https://amenufromaplace.com"/> <TextwTitle label="Address" content="https://amenufromaplace.com"/>
...@@ -55,6 +56,7 @@ const Sidebar = ({facility, isSidebarOpen, isSidebarMapOpen, toggleSidebarMap, f ...@@ -55,6 +56,7 @@ const Sidebar = ({facility, isSidebarOpen, isSidebarMapOpen, toggleSidebarMap, f
<TextwTitle label="Hours" content={<WeekHours facility={facility} />}/> <TextwTitle label="Hours" content={<WeekHours facility={facility} />}/>
</div>
</div> </div>
<div className={'sidebar-row2'}> <div className={'sidebar-row2'}>
<FacilitiesMap isMapOpen={isSidebarMapOpen} facilities={facilities} facility={facility}/> <FacilitiesMap isMapOpen={isSidebarMapOpen} facilities={facilities} facility={facility}/>
......
...@@ -60,6 +60,10 @@ ...@@ -60,6 +60,10 @@
.sidebar-toggle-map-btn { .sidebar-toggle-map-btn {
width: 100%; width: 100%;
} }
.sidebar-scroll{
height:calc(100% - 220px - 116px - 32px);
overflow-y: scroll;
}
@media screen and (max-width: map-get($breakpoints, lg) - 1px) { @media screen and (max-width: map-get($breakpoints, lg) - 1px) {
.sidebar-root { .sidebar-root {
......
...@@ -295,7 +295,17 @@ const getHoursByDay = (facility, dayOfWeek) => { ...@@ -295,7 +295,17 @@ const getHoursByDay = (facility, dayOfWeek) => {
allDayOrClosed:false allDayOrClosed:false
}) })
} }
hours = [{
text: "11am - 2pm",
start:"11:00:00",
end:"14:00:00",
allDayOrClosed:false
},{
text: "4pm - 5pm",
start:"16:00:00",
end:"17:00:00",
allDayOrClosed:false
}];
return hours.sort((a,b) => { return hours.sort((a,b) => {
return parseInt(a.start) - parseInt(b.start) return parseInt(a.start) - parseInt(b.start)
}) })
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment