styling sidebar

This commit is contained in:
Roland Osborne 2022-03-27 17:02:05 -07:00
parent 3e8ecdf0d8
commit b16e2ff784
8 changed files with 16 additions and 11 deletions

View File

@ -7,6 +7,7 @@ export const CreateWrapper = styled.div`
align-items: center; align-items: center;
justify-content: center; justify-content: center;
width: 100%; width: 100%;
height: 100%;
.container { .container {
background-color: #ffffff; background-color: #ffffff;

View File

@ -7,7 +7,8 @@ export const LoginWrapper = styled.div`
align-items: center; align-items: center;
justify-content: center; justify-content: center;
width: 100%; width: 100%;
height: 100%;
\
.container { .container {
background-color: #ffffff; background-color: #ffffff;
display: flex; display: flex;

View File

@ -43,7 +43,7 @@ export const ProfileWrapper = styled.div`
flex-direction: row; flex-direction: row;
padding: 32px; padding: 32px;
width: 100%; width: 100%;
overflow: scroll overflow: auto;
} }
.profile { .profile {

View File

@ -11,19 +11,19 @@ export function Cards({ showRegistry }) {
return ( return (
<CardsWrapper> <CardsWrapper>
<div>
<Drawer <Drawer
placement="right" placement="right"
closable={false} closable={false}
visible={showRegistry} visible={showRegistry}
getContainer={false} getContainer={false}
contentWrapperStyle={{ width: '100%' }} contentWrapperStyle={{ width: '100%' }}
bodyStyle={{ padding: 0, backgroundColor: '#f6f5ed' }} bodyStyle={{ backgroundColor: '#f6f5ed', padding: 16 }}
style={{ position: 'absolute' }} style={{ position: 'absolute' }}
> >
<Registry /> <Registry />
</Drawer> </Drawer>
</div>
</CardsWrapper> </CardsWrapper>
) )
} }

View File

@ -3,10 +3,11 @@ import styled from 'styled-components';
export const CardsWrapper = styled.div` export const CardsWrapper = styled.div`
position: relative; position: relative;
height: calc(100vh - 143px); height: calc(100vh - 127px);
width: 100%; width: 100%;
overflow: hidden; overflow-y: auto;
overflow-x: hidden;;
text-align: center; text-align: center;
border-radius: 2px; padding-top: 16px;
`; `;

View File

@ -5,8 +5,10 @@ export const RegistryWrapper = styled.div`
padding-left: 8px; padding-left: 8px;
padding-right: 8px; padding-right: 8px;
text-align: center; text-align: center;
height: calc(100vh - 143px);
display: flex; display: flex;
height: 100%;
overflow-y: auto;
overflow-x: hidden;
flex-direction: column; flex-direction: column;
.contacts { .contacts {

View File

@ -2,7 +2,7 @@ import styled from 'styled-components';
export const ChannelsWrapper = styled.div` export const ChannelsWrapper = styled.div`
position: relative; position: relative;
height: calc(100vh - 143px); height: calc(100vh - 127px);
width: 100%; width: 100%;
overflow: hidden; overflow: hidden;
text-align: center; text-align: center;

View File

@ -50,7 +50,7 @@ export function Contacts() {
return ( return (
<ContactsWrapper> <ContactsWrapper>
<Tabs onChange={onTab} tabBarStyle={{ paddingLeft: 16, paddingRight: 16 }} tabBarExtraContent={addButton}>> <Tabs onChange={onTab} tabBarStyle={{ marginBottom: 0, paddingLeft: 16, paddingRight: 16 }} tabBarExtraContent={addButton}>>
<TabPane tab="Contacts" key="contact"> <TabPane tab="Contacts" key="contact">
<Cards showRegistry={showRegistry} /> <Cards showRegistry={showRegistry} />
</TabPane> </TabPane>