skorotkiewicz/yosup
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Revert "web: mobile-friendly nav"

Browse source 
This reverts commit 1b49a7029b.
This commit is contained in:
William Casarin 2022-11-12 14:31:56 -08:00
parent 3cb6a2f7b3
commit 59e25e9087
2 changed files with 32 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

28
web/css/styles.css
View file

@ -47,6 +47,9 @@ body {
}
/* Utilities */
.flex-fill {
flex: 1;
}
.hide {
display: none;
}
@ -100,18 +103,24 @@ button.nav {
}
#container {
margin: auto;
max-width: 750px;
border-right: 1px solid var(--clrBorder);
border-left: 1px solid var(--clrBorder);
display: flex;
/*
flex-direction: row;
width: 100vw;
height: 100vh;
overflow: hidden;*/
}
#nav {
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid var(--clrBorder);
flex-shrink: 1;
border-right: 1px solid var(--clrBorder);
}
#container header > label {
#content {
display: flex;
flex-direction: column;
border-right: 1px solid var(--clrBorder);
}
#content header > label {
padding: 22px 15px;
font-size: 22px;
font-weight: 800;
@ -119,6 +128,7 @@ button.nav {
}
#view {
max-width: 750px;
overflow-y: scroll;
flex: 1;
}

26
web/index.html
View file

@ -23,17 +23,15 @@
});
</script>
<div id="container">
<div class="flex-fill"></div>
<div id="nav">
<div id="app-icon-logo">
<i class="fa-regular fa-fw fa-hand-peace"></i>
</div>
<div>
<button class="nav icon">
<i class="fa fa-fw fa-home"></i><span class="hide">Home</span>
</button>
</div>
<div id="app-icon-logo">
<!--<img src="https://damus.io/img/damus.svg">-->
<i class="fa-regular fa-fw fa-hand-peace"></i>
</div>
</button></div>
<!--
<div>
@ -48,13 +46,15 @@
<div>
<button onclick="press_logout()" title="Sign Out" class="nav icon">
<i class="fa fa-fw fa-arrow-right-from-bracket"></i><span class="hide">Sign Out</span>
</button>
</div>
</button></div>
</div>
<header>
<label>Home</label>
</header>
<div id="view"></div>
<div id="content">
<header>
<label>Home</label>
</header>
<div id="view"></div>
</div>
<div class="flex-fill"></div>
</div>
<div class="modal closed" id="reply-modal">
<div id="reply-modal-content" class="modal-content">