nostr/primal-web-app
1
0
Fork 0
mirror of https://github.com/PrimalHQ/primal-web-app.git synced 2024-10-03 02:10:55 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix layout for the Messages page

Browse Source
This commit is contained in:
Bojan Mojsilovic 2024-01-08 12:45:29 +01:00
parent c51a6777e7
commit 0caa0f29bf
3 changed files with 16 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/components/Layout/Layout.module.scss
View File

@ -101,8 +101,19 @@
height: 100%; height: 100%;
border-left: 1px solid var(--devider); border-left: 1px solid var(--devider);
} }
&.messagesHeader {
>div {
border-left: none;
}
}
} }
.messagesSearch {
border-right: 1px solid var(--devider);
}
.rightHeader { .rightHeader {
width: var(--right-col-w); width: var(--right-col-w);
height: var(--header-height); height: var(--header-height);

4
src/components/Layout/Layout.tsx
View File

@ -136,10 +136,10 @@ const Layout: Component = () => {
</div> </div>
<div class={styles.rightColumn}> <div class={`${styles.rightColumn} ${location.pathname.startsWith('/messages') ? styles.messagesHeader : ''}`}>
<div> <div>
<div class={styles.rightHeader}> <div class={styles.rightHeader}>
<div id="search_section"> <div id="search_section" class={location.pathname.startsWith('/messages') ? styles.messagesSearch : ''}>
</div> </div>
</div> </div>
<div class={styles.rightContent}> <div class={styles.rightContent}>

7
src/pages/Messages.module.scss
View File

@ -232,9 +232,8 @@
top: 0; top: 0;
left: 320px; left: 320px;
background-color: var(--background-card ); background-color: var(--background-card );
width: 600px; width: 628px;
height: calc(100vh - var(--header-height)); height: calc(100vh - var(--header-height));
z-index: var(--z-index-lifted);
overflow: hidden; overflow: hidden;
display: flex; display: flex;
flex-direction: column-reverse; flex-direction: column-reverse;
@ -302,7 +301,7 @@
.textAreaBorder { .textAreaBorder {
padding: 1px; padding: 1px;
border-radius: 8px; border-radius: 8px;
width: 510px; width: 538px;
height: 34px; height: 34px;
box-sizing: border-box; box-sizing: border-box;
@ -318,7 +317,7 @@
margin: 0; margin: 0;
padding-inline: 16px; padding-inline: 16px;
padding-block: 8px; padding-block: 8px;
width: 508px; width: 536px;
max-height: none; max-height: none;
&:focus { &:focus {