Counterparts section design update, touch dnd support, marks scrolling #182

Merged
enes merged 9 commits from 174-add-users-updates into staging 2024-09-06 10:22:56 +00:00
2 changed files with 41 additions and 24 deletions
Showing only changes of commit 5caa7f2282 - Show all commits

View File

@ -932,24 +932,25 @@ export const CreatePage = () => {
moveSigner={moveSigner}
/>
</div>
<div className={styles.inputWrapper}>
<TextField
placeholder="Add counterpart"
value={userInput}
onChange={(e) => setUserInput(e.target.value)}
onKeyDown={handleInputKeyDown}
error={!!error}
fullWidth
sx={{
fontSize: '16px',
'& .MuiInputBase-input': {
padding: '7px 14px'
},
'& .MuiOutlinedInput-notchedOutline': {
display: 'none'
}
}}
/>
<div className={styles.addCounterpart}>
<div className={styles.inputWrapper}>
<TextField
placeholder="Add counterpart"
value={userInput}
onChange={(e) => setUserInput(e.target.value)}
onKeyDown={handleInputKeyDown}
error={!!error}
sx={{
fontSize: '16px',
'& .MuiInputBase-input': {
padding: '7px 14px'
},
'& .MuiOutlinedInput-notchedOutline': {
display: 'none'
}
}}
/>
</div>
<Button
onClick={() =>
setUserRole(
@ -962,8 +963,7 @@ export const CreatePage = () => {
aria-label="Toggle User Role"
sx={{
minWidth: '44px',
padding: '11.5px 12px',
borderRadius: 0
padding: '11px 12px'
}}
>
<FontAwesomeIcon
@ -977,9 +977,7 @@ export const CreatePage = () => {
aria-label="Add"
sx={{
minWidth: '44px',
padding: '11.5px 12px',
borderTopLeftRadius: 0,
borderBottomLeftRadius: 0
padding: '11px 12px'
}}
>
<FontAwesomeIcon icon={faPlus} />

View File

@ -78,7 +78,7 @@
align-items: center;
flex-shrink: 0;
height: 34px;
height: 36px;
overflow: hidden;
border-radius: 4px;
outline: solid 1px #dddddd;
@ -91,9 +91,28 @@
}
}
.addCounterpart {
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: start;
gap: 10px;
background: white;
border-radius: 0 0 4px 4px;
padding: 15px;
> .inputWrapper {
flex-shrink: 1;
}
}
.users {
flex-shrink: 0;
max-height: 33vh;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
margin-bottom: '-15px';
}
.user {