Skip to content

Commit

Permalink
Merge pull request #205 from Vincit/release/summer-2024
Browse files Browse the repository at this point in the history
Release/summer 2024
  • Loading branch information
villepynttari authored Sep 19, 2024
2 parents 3139e84 + 9fc50b2 commit 9f99300
Show file tree
Hide file tree
Showing 8 changed files with 202 additions and 170 deletions.
6 changes: 4 additions & 2 deletions frontend/src/components/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,10 @@ import GETAROOM_ENV from '../util/getARoomEnv';

export const GarApp = styled(Divider)(() => ({
width: '100%',
height: '100%'
height: '100%',
'.MuiDivider-wrapperVertical': {
padding: 0
}
}));

const App = () => {
Expand All @@ -34,7 +37,6 @@ const App = () => {
<SnackbarProvider
maxSnack={1}
dense
style={{ marginBottom: '8vh' }}
anchorOrigin={{
horizontal: 'center',
vertical: 'bottom'
Expand Down
97 changes: 48 additions & 49 deletions frontend/src/components/BookingDrawer/DurationPicker.tsx
Original file line number Diff line number Diff line change
@@ -1,12 +1,13 @@
import * as React from 'react';
import ToggleButton from '@mui/material/ToggleButton';
import ToggleButtonGroup from '@mui/material/ToggleButtonGroup';
import { styled, Typography } from '@mui/material';
import { styled } from '@mui/material';

const DurationButton = styled(ToggleButton)(() => ({}));

const DurationButtonGroup = styled(ToggleButtonGroup)(() => ({
minWidth: '100%'
overflow: 'auto',
width: '100%'
}));

type DurationPickerProps = {
Expand Down Expand Up @@ -78,54 +79,52 @@ const DurationPicker = (props: DurationPickerProps) => {
}

return (
<div>
<DurationButtonGroup
data-testid="DurationPicker"
color="primary"
value={quickDuration}
exclusive
onChange={handleChange}
aria-label="duration picker"
fullWidth
<DurationButtonGroup
data-testid="DurationPicker"
color="primary"
value={quickDuration}
exclusive
onChange={handleChange}
aria-label="duration picker"
fullWidth
>
<DurationButton
data-testid="DurationPicker15"
value={'15'}
aria-label="15 minutes"
>
<DurationButton
data-testid="DurationPicker15"
value={'15'}
aria-label="15 minutes"
>
15 min
</DurationButton>
<DurationButton
data-testid="DurationPicker30"
value={'30'}
aria-label="30 minutes"
>
30 min
</DurationButton>
<DurationButton
data-testid="DurationPicker60"
value={'60'}
aria-label="1 hour"
>
60 min
</DurationButton>
<DurationButton
data-testid="DurationPicker120"
value={'120'}
aria-label="2 hours"
>
120 min
</DurationButton>
{CustomDurationValueButton()}
<DurationButton
data-testid="DurationPickerCustom"
value={'Custom'}
aria-label="Custom duration"
>
Custom
</DurationButton>
</DurationButtonGroup>
</div>
15 min
</DurationButton>
<DurationButton
data-testid="DurationPicker30"
value={'30'}
aria-label="30 minutes"
>
30 min
</DurationButton>
<DurationButton
data-testid="DurationPicker60"
value={'60'}
aria-label="1 hour"
>
60 min
</DurationButton>
<DurationButton
data-testid="DurationPicker120"
value={'120'}
aria-label="2 hours"
>
120 min
</DurationButton>
{CustomDurationValueButton()}
<DurationButton
data-testid="DurationPickerCustom"
value={'Custom'}
aria-label="Custom duration"
>
Custom
</DurationButton>
</DurationButtonGroup>
);
};

Expand Down
2 changes: 1 addition & 1 deletion frontend/src/components/BookingView/FilteringDrawer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -85,7 +85,7 @@ function CustomFilterTextField(props: {
</InputAdornment>
),
sx: {
fontFamily: 'Studio Feixen Sans',
fontFamily: 'StudioFeixenSans-Regular',
fontSize: '16px',
fontStyle: 'normal',
fontWeight: 2,
Expand Down
5 changes: 1 addition & 4 deletions frontend/src/components/BottomDrawer/BottomDrawer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -19,10 +19,7 @@ export const drawerBleeding = 88;

const Root = styled('div')(({ theme }) => ({
height: '100%',
backgroundColor:
theme.palette.mode === 'light'
? grey[100]
: theme.palette.background.default
backgroundColor: '#fff'
}));

const DrawerHeader = styled(Box)(({ theme }) => ({
Expand Down
193 changes: 98 additions & 95 deletions frontend/src/components/BuildingList/BuildingList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -97,8 +97,10 @@ const BuildingList = (props: BuildingSelectProps) => {
key={building.name}
sx={{
borderRadius: '10px',
marginTop: '16px',
marginBottom: '16px'
marginTop: '8px',
marginBottom: '8px',
boxShadow:
'-2px -2px 4px rgba(255, 255, 255, 0.6), 4px 4px 4px rgba(205, 197, 197, 0.25)'
}}
>
<CardActionArea onClick={() => clickFunction(building.id)}>
Expand Down Expand Up @@ -142,106 +144,107 @@ const BuildingList = (props: BuildingSelectProps) => {

return (
<BuildingListContent>
<Stack
id="preferences-view"
height="100%"
justifyContent="space-around"
alignItems="left"
>
<Box
sx={{
height: '100%',
width: '100%',
padding: '24px 16px'
}}
<Box sx={{ margin: '0 16px' }}>
<Stack
id="preferences-view"
height="100%"
justifyContent="space-around"
alignItems="left"
>
<FormGroup sx={{ alignItems: 'left' }}>
<Typography textAlign="left" variant="h5">
Welcome, {name}!
</Typography>

<PageHeaderWithUserIcon
title={'OFFICES'}
isOpen={showUserSettingsMenu}
onClick={() => setShowUserSettingsMenu(true)}
/>
<Typography
textAlign="left"
variant="subtitle1"
paddingTop="24px"
paddingBottom="8px"
>
SORT BASED ON
</Typography>
</FormGroup>
</Box>

<ToggleButtonGroup
className="ToggleButtonGroupStyle"
color="primary"
value={alignment}
exclusive
onChange={handleChange}
style={{
overflow: 'auto',
display: 'flex',
padding: '0px',
width: '100%'
}}
>
<ToggleButton
style={{
minWidth: '150px',
maxWidth: '250px',
width: '50%'
<Box
sx={{
height: '100%',
width: '100%',
padding: '24px 0'
}}
value="proximity"
>
<GpsFixed style={{ minWidth: '40px' }}></GpsFixed>
Proximity
</ToggleButton>

<ToggleButton
<FormGroup sx={{ alignItems: 'left' }}>
<Typography textAlign="left" variant="h5">
Welcome, {name}!
</Typography>

<PageHeaderWithUserIcon
title={'OFFICES'}
isOpen={showUserSettingsMenu}
onClick={() => setShowUserSettingsMenu(true)}
/>
<Typography
textAlign="left"
variant="subtitle1"
paddingTop="16px"
>
SORT BASED ON
</Typography>
</FormGroup>
</Box>

<ToggleButtonGroup
className="ToggleButtonGroupStyle"
color="primary"
value={alignment}
exclusive
onChange={handleChange}
style={{
minWidth: '150px',
maxWidth: '250px',
width: '50%'
overflow: 'auto',
display: 'flex',
padding: '0px',
width: '100%'
}}
value="names"
>
<SortByAlphaIcon
style={{ minWidth: '40px' }}
></SortByAlphaIcon>
Names
</ToggleButton>
</ToggleButtonGroup>
<div
style={{
height: '100%',
width: '100%',
padding: '0px 16px'
}}
>
<Typography
textAlign="left"
variant="subtitle1"
paddingTop="24px"
marginBottom="-8px"
<ToggleButton
style={{
minWidth: '150px',
maxWidth: '250px',
width: '50%'
}}
value="proximity"
>
<GpsFixed style={{ minWidth: '40px' }}></GpsFixed>
<Typography>Proximity</Typography>
</ToggleButton>

<ToggleButton
style={{
minWidth: '150px',
maxWidth: '250px',
width: '50%'
}}
value="names"
>
<SortByAlphaIcon
style={{ minWidth: '40px' }}
></SortByAlphaIcon>
<Typography>Names</Typography>
</ToggleButton>
</ToggleButtonGroup>
<div
style={{
height: '100%',
width: '100%'
}}
>
OFFICES
</Typography>
</div>
</Stack>

{renderBuildingList()}

<UserDrawer
open={showUserSettingsMenu}
toggle={() => setShowUserSettingsMenu(!showUserSettingsMenu)}
name={name}
expandedFeaturesAll={expandedFeaturesAll}
setExpandedFeaturesAll={setExpandedFeaturesAll}
/>
<Typography
textAlign="left"
variant="subtitle1"
paddingTop="24px"
marginBottom="-8px"
>
OFFICES
</Typography>
</div>
{renderBuildingList()}
</Stack>

<UserDrawer
open={showUserSettingsMenu}
toggle={() =>
setShowUserSettingsMenu(!showUserSettingsMenu)
}
name={name}
expandedFeaturesAll={expandedFeaturesAll}
setExpandedFeaturesAll={setExpandedFeaturesAll}
/>
</Box>
</BuildingListContent>
);
};
Expand Down
Loading

0 comments on commit 9f99300

Please sign in to comment.