web: cap the size of reply boxes

also add a nice divider line before the input box
This commit is contained in:
William Casarin 2022-11-12 14:15:46 -08:00
parent 1b49a7029b
commit 8b68c76951
3 changed files with 15 additions and 4 deletions

View file

@ -163,6 +163,17 @@ button.nav {
.chatroom-name {
font-weight: bold;
}
#replying-to {
max-height: 200px;
overflow-y: scroll;
}
#replybox {
margin-top: 10px;
border-top: 1px solid var(--clrBorder);
}
.timestamp, .replying-to, .boosted-by {
font-size: var(--fsSmall);
color: var(--clrTextLight);

View file

@ -4,7 +4,7 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Damus</title>
<link rel="stylesheet" href="css/styles.css?v=112">
<link rel="stylesheet" href="css/styles.css?v=113">
<link rel="stylesheet" href="css/damus.css?v=211">
<link rel="stylesheet" href="css/fontawesome.css?v=2">
<script defer src="js/ui/util.js?v=1"></script>
@ -12,7 +12,7 @@
<script defer src="js/noble-secp256k1.js?v=1"></script>
<script defer src="js/bech32.js?v=1"></script>
<script defer src="js/nostr.js?v=6"></script>
<script defer src="js/damus.js?v=67"></script>
<script defer src="js/damus.js?v=68"></script>
</head>
<body>
<script>
@ -66,7 +66,7 @@
</button>
</header>
<div id="replying-to"></div>
<div>
<div id="replybox">
<textarea id="reply-content" class="post-input"
placeholder="Write your reply here..."></textarea>
<div class="post-tools">

View file

@ -201,7 +201,7 @@ function render_event(model, ev, opts={}) {
}
const has_top_line = replied_events !== ""
const border_bottom = has_bot_line ? "" : "bottom-border";
const border_bottom = opts.is_composing || has_bot_line ? "" : "bottom-border";
return `
${replied_events}
<div id="ev${ev.id}" class="event ${border_bottom}">