Kelder/feathermost
25
0
Fork 0
Code Issues 8 Pull requests Packages Projects Releases Wiki Activity

Avoid sidebar resizing based on channel contents

Browse source
This commit is contained in:
Midgard 2021-02-17 17:42:02 +01:00
parent 745af7af5d
commit 26ebbcc190
Signed by: midgard
GPG key ID: 511C112F1331BBB4
2 changed files with 28 additions and 31 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
assets/main.css
View file

@ -11,7 +11,9 @@ body {
color: #222;
line-height: 1.5;
display: flex;
display: grid;
grid-template-rows: auto 1fr;
grid-template-columns: 20vw 1fr;
}
a button {
@ -53,14 +55,10 @@ h1 img {
overflow-y: hidden;
display: grid;
}
.sidebar {
width: 300px;
overflow: hidden;
grid-template-rows: auto 1fr;
border-right: 1px solid #aaa;
}
.main-area {
flex-grow: 1;
grid-column: 2;
grid-row-start: 1;
grid-row-end: 3;
grid-template-rows: auto 1fr auto;
position: relative;
}
@ -69,6 +67,7 @@ h1 img {
background-color: #e5e5e5;
padding: 0.5em;
border-bottom: 1px solid #aaa;
border-right: 1px solid #aaa;
}
#channel_list {
@ -76,12 +75,12 @@ h1 img {
height: 100%;
overflow-x: hidden;
overflow-y: scroll;
border-right: 1px solid #aaa;
}
#channel_list a {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
width: 300px;
display: block;
padding: 2px 10px;
color: #333;

42
index.html
View file

@ -16,33 +16,31 @@
document.body.className = "yesscript";
</script>
<div class="sidebar">
<div class="sidebar-head">
<h1><img src="/assets/feathermost.svg" alt=""/> Feathermost</h1>
<div class="sidebar-head">
<h1><img src="/assets/feathermost.svg" alt=""/> Feathermost</h1>
<div id="server_selection">
<ul id="server_selection_list"></ul>
<button id="server_selection_add">Add a server</button>
</div>
<form id="login" action="#">
<h2>Add a server</h2>
<div class="login-form">
<input type="text" id="login_server" placeholder="Server URL" value="http://localhost:8080" required/>
<input type="text" id="login_login_id" placeholder="Username or email" required/>
<input type="password" id="login_password" placeholder="Password" required/>
</div>
<input type="submit" id="login_button" value="Log in"/>
<input type="button" id="login_no_button" value="Cancel"/>
<div id="login_message"></div>
</form>
<div id="server_selection">
<ul id="server_selection_list"></ul>
<button id="server_selection_add">Add a server</button>
</div>
<ul id="channel_list"></ul>
<form id="login" action="#">
<h2>Add a server</h2>
<div class="login-form">
<input type="text" id="login_server" placeholder="Server URL" value="http://localhost:8080" required/>
<input type="text" id="login_login_id" placeholder="Username or email" required/>
<input type="password" id="login_password" placeholder="Password" required/>
</div>
<input type="submit" id="login_button" value="Log in"/>
<input type="button" id="login_no_button" value="Cancel"/>
<div id="login_message"></div>
</form>
</div>
<ul id="channel_list"></ul>
<div class="main-area">
<div id="channel_header"></div>