Ailur-Archives
/
burgernotes-web
Archived
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 3 Wiki Activity

Revert "A few more design changesg" 

This reverts commit 4893836149.

mrrp
This commit is contained in:
maaa 2024-06-22 23:07:06 +02:00
parent f2dd0baa9a
commit 62fe897114
2 changed files with 40 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

65
app/index.html
View File

@ -1,64 +1,66 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"><head> <html lang="en">
<head>
<title>Burgernotes</title> <title>Burgernotes</title>
<meta charset="UTF-8"> <meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" type="text/css" href="/static/css/style.css" media=""> <link rel="stylesheet" type="text/css" href="/static/css/style.css" />
<script type="text/javascript" src="/static/js/crypto-js.js"></script> <script type="text/javascript" src="/static/js/crypto-js.js"></script>
<script type="text/javascript" src="/static/js/marked.js"></script> <script type="text/javascript" src="/static/js/marked.js"></script>
<link rel="icon" href="/static/svg/favicon.svg"> <link rel="icon" href="/static/svg/favicon.svg">
</head> </head>
<body><noscript> <noscript>
<head> <head>
<meta http-equiv="refresh" content="0; url=/login"/> <meta http-equiv="refresh" content="0; url=/login"/>
</head> </head>
</noscript> </noscript>
<body>
<div class="topBar"> <div class="topBar">
<p tabindex="0" class="logo" id="burgerButton"></p> <p tabindex="0" class="logo" id="burgerButton"></p>
<button tabindex="0" class="logo hidden" style="font-size: 17px;margin-left: 0;" onclick="handleGesture()" id="backButton"><img src="/static/svg/arrow-back.svg"></button> <button tabindex="0" class="logo hidden" style="font-size: 17px;margin-left: 0;" onclick="handleGesture()" id="backButton"><img src="/static/svg/arrow-back.svg"></button>
<div class="modernToolbar"> <div class="modernToolbar">
<button class="count" id="wordCountBox">6 words</button> <button class="count" id="wordCountBox">0 words</button>
<button onclick="toggleMarkdown()" class="usernameBox"><div class="vcenter"><img src="/static/svg/markdown.svg"></div></button> <button onclick="toggleMarkdown()" class="usernameBox"><div class="vcenter"><img src="/static/svg/markdown.svg"></div></button>
<button id="usernameBox" class="usernameBox settings"><div class="vcenter"><img src="/static/svg/acct-settings.svg"></div></button> <button id="usernameBox" class="usernameBox"><div class="vcenter"><img src="/static/svg/acct-settings.svg"></div></button>
</div> </div>
</div> </div>
<div id="notesBar" class="notesBar"> <div id="notesBar" class="notesBar">
<div class="toolBar"> <button id="newNote" class="newNote" style="margin-left: 5px;">
<button id="newNote" class="newNote" style="">
<div class="vcenter"><img id="newNoteImage" draggable="false" alt="" src="/static/svg/add.svg"></div> <div class="vcenter"><img id="newNoteImage" draggable="false" alt="" src="/static/svg/add.svg"></div>
</button> </button>
<button id="removeBox" class="newNote deleteNote <button class="newNote" style="margin-left: 37.5px; background-color: var(--bar) !important;">
">
</button>
<button id="removeBox" class="newNote">
<div class="vcenter"><img id="newNoteImage" draggable="false" alt="" src="/static/svg/delete.svg"></div> <div class="vcenter"><img id="newNoteImage" draggable="false" alt="" src="/static/svg/delete.svg"></div>
</button> </button>
</div>
<div id="notesDiv" class="notesDiv"> <div id="notesDiv" class="notesDiv">
<button class="loadingStuff" id="loadingStuff"></button>
<button class="noteButton selected" id="273">The bloody mass..</button><button class="noteButton" id="275">Deadline June 2..</button><button class="noteButton" id="274">Making a point</button><button class="noteButton" id="229">&lt;link rel="styl..</button><button class="noteButton" id="271">Results</button><button class="noteButton" id="22">SSH Keys</button><button class="noteButton" id="249">import os</button><button class="noteButton" id="268">Reminders </button><button class="noteButton" id="224"># Hello</button><button class="noteButton" id="243">Script:</button><button class="noteButton" id="239">; Zonefile for ..</button><button class="noteButton" id="234">Element thing</button><button class="noteButton" id="228">Hoi!!!</button><button class="noteButton" id="217">monero key</button><button class="noteButton" id="203">hi</button><button class="noteButton" id="199">Mirrorbot</button><button class="noteButton" id="183">SuperList</button><button class="noteButton" id="126">NewLine</button><button class="noteButton" id="13">Bank details</button></div> </div>
</div> </div>
<div id="optionsCoverDiv" class="optionsCoverDiv"> <div id="optionsCoverDiv" class="optionsCoverDiv hidden">
<div id="optionsDiv" class="optionsDiv"> <div id="optionsDiv" class="optionsDiv hidden">
<button class="exit" id="exitThing">X</button> <button class="exit" id="exitThing">X</button>
<h3 class="w300">Your account</h3> <h3 class="w300">Your account</h3>
<p id="usernameThing">Username: arzumify</p> <p id="usernameThing">Cannot connect to the server</p>
<div class="section"></div> <div class="section"></div>
<p>Device settings</p> <p>Device settings</p>
<div class="fontManipulator"> <div class="fontManipulator">
<div class="vAlign"><text>Font size</text></div> <span>Font size</span>
<div class="vAlign textMinusBox"><button id="textMinusBox">-</button></div> <button class="textMinusBox" id="textMinusBox">-</button>
<div class="vAlign"><text class="textSizeBox" style="" id="textSizeBox">16px</text></div> <button class="textSizeBox" style="background-color: var(--nonimporant-theme-color) !important;" id="textSizeBox">16px</button>
<div class="vAlign"><button class="textPlusBox" id="textPlusBox">+</button></div> <button class="textPlusBox" id="textPlusBox">+</button>
</div> </div>
<div class="section"></div> <div class="section"></div>
<p>Storage</p> <p>Storage</p>
<progress id="storageProgressThing" value="44652" max="25000000"></progress><br> <progress id="storageProgressThing" value="0" max="100"></progress><br>
<p id="storageThing">You've used 44.65 KB out of 25 MB</p> <p id="storageThing">Cannot connect to the server</p>
<div class="section"></div> <div class="section"></div>
<p>Account managment</p> <p>Account managment</p>
<button id="deleteMyAccountButton"><img src="/static/svg/delete_forever.svg" alt="">Delete account</button> <button id="deleteMyAccountButton"><img src="/static/svg/delete_forever.svg" alt="">Delete account</button>
@ -83,11 +85,7 @@
<form><input type="file" id="importFile" style="border: 0;"></form> <form><input type="file" id="importFile" style="border: 0;"></form>
</div> </div>
<div id="errorDiv" class="optionsDiv hidden"> <div id="errorDiv" class="optionsDiv hidden">
<p id="errorMessageThing">What's new in Burgernotes 2.0? <p id="errorMessageThing"></p>
Restyled client
Added changing passwords
Migrated to OAuth2
Added importing notes</p>
<input class="hidden" id="errorInput" type="text" placeholder=""><br> <input class="hidden" id="errorInput" type="text" placeholder=""><br>
<button class="normalButton" id="closeErrorButton">Ok</button> <button class="normalButton" id="closeErrorButton">Ok</button>
<button class="normalButton hidden" id="cancelErrorButton">Cancel</button> <button class="normalButton hidden" id="cancelErrorButton">Cancel</button>
@ -95,8 +93,8 @@ Added importing notes</p>
</div> </div>
<div class="noteBox" id="noteBoxDiv"> <div class="noteBox" id="noteBoxDiv">
<textarea id="noteBox" class="noteBoxText" style="font-size: 16px;" placeholder="Type something!"></textarea> <textarea id="noteBox" class="noteBoxText"></textarea>
<iframe id="markdown" style="display: none;" sandbox="allow-scripts" srcdoc="<!DOCTYPE html><html lang='en'><style>html { height: 100% } pre { white-space: pre-wrap; overflow-wrap: break-word; } body { white-space: pre-wrap; overflow-wrap: break-word; font-family: 'Inter', sans-serif; height: 100%; color: #000000; font-size: 16px; }</style></html>"></iframe> <iframe id="markdown" style="display: none;" sandbox="allow-scripts"></iframe>
</div> </div>
<script type="text/javascript" src="/static/js/main.js"></script> <script type="text/javascript" src="/static/js/main.js"></script>
@ -106,7 +104,6 @@ Added importing notes</p>
} }
loadingStuff.remove() loadingStuff.remove()
</script> </script>
</body>
</html>
</body><style type="text/css"></style><style type="text/css"></style></html>

42
static/css/style.css
View File

@ -221,8 +221,8 @@ body {
} }
.topBar .modernToolbar { .topBar .modernToolbar {
display: flex; margin-left: auto;
width: 100% margin-right: 5px;
} }
.topBar .modernToolbar .count { .topBar .modernToolbar .count {
@ -230,10 +230,7 @@ body {
background-color: rgba(0, 0, 0, 0); background-color: rgba(0, 0, 0, 0);
border: none; border: none;
font-size: 15px; font-size: 15px;
} transform: translateY(-5px);
.topBar .modernToolbar .settings {
margin-left: auto;
} }
.topBar .modernToolbar .textmod { .topBar .modernToolbar .textmod {
@ -294,12 +291,10 @@ body {
border-color: var(--border-color); border-color: var(--border-color);
border-width: 0; border-width: 0;
border-right-width: 1px; border-right-width: 1px;
display: flex;
flex-direction: column-reverse;
} }
.notesDiv { .notesDiv {
height: 100%; height: calc(100% - 50px);
overflow-y: auto; overflow-y: auto;
} }
@ -314,7 +309,7 @@ body {
color: var(--unselected-note-button-text-color); color: var(--unselected-note-button-text-color);
border-radius: 8px; border-radius: 8px;
border: dashed; border: none;
border-color: var(--border-color); border-color: var(--border-color);
border-width: 1px; border-width: 1px;
font-size: 15px; font-size: 15px;
@ -352,7 +347,7 @@ body {
.notesBar .selected { .notesBar .selected {
background-color: var(--note-theme-color) !important; background-color: var(--note-theme-color) !important;
border-style: solid; border: none;
color: var(--note-button-text-color); color: var(--note-button-text-color);
} }
@ -360,11 +355,6 @@ body {
background-color: var(--note-theme-color) !important; background-color: var(--note-theme-color) !important;
} }
.notesBar .toolBar {
display: flex;
border-top: 1px var(--border-color) solid;
}
.notesBar .newNote { .notesBar .newNote {
height: 41px; height: 41px;
width: 41px; width: 41px;
@ -372,16 +362,13 @@ body {
text-align: left; text-align: left;
font-size: 16px; font-size: 16px;
cursor: pointer; cursor: pointer;
margin-top: 5px;
background-color: var(--bar); background-color: var(--bar);
border-radius: 8px; border-radius: 8px;
border: none; border: none;
transition: 0.125s; transition: 0.125s;
} }
.notesBar .deleteNote {
margin-left: auto;
}
.notesBar .newNote:hover { .notesBar .newNote:hover {
background-color: var(--icon-button-hover); background-color: var(--icon-button-hover);
} }
@ -400,7 +387,7 @@ body {
color: var(--text-color); color: var(--text-color);
background-color: rgba(0, 0, 0, 0); background-color: rgba(0, 0, 0, 0);
width: calc(100% - 200px); width: calc(100% - 200px);
height: calc(100% - 50px); height: calc(100% - 50px - 30px);
font-family: "Inter", sans-serif; font-family: "Inter", sans-serif;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@ -568,17 +555,11 @@ iframe#markdown {
margin-bottom: 10px; margin-bottom: 10px;
} }
.optionsDiv .fontManipulator {
display: flex;
}
.optionsDiv .fontManipulator button { .optionsDiv .fontManipulator button {
width: 43.5px; width: 43.5px;
height: 43.5px;
background-color: var(--nonimporant-theme-color); background-color: var(--nonimporant-theme-color);
color: var(--nonimportant-text-color); color: var(--nonimportant-text-color);
transition: 0.125s; transition: 0.125s;
margin: 0;
} }
.optionsDiv .fontManipulator button:hover { .optionsDiv .fontManipulator button:hover {
@ -586,12 +567,7 @@ iframe#markdown {
} }
.optionsDiv .fontManipulator .textMinusBox { .optionsDiv .fontManipulator .textMinusBox {
margin-left: auto; margin-left: 83.5px
}
.optionsDiv .fontManipulator .textSizeBox {
margin-left: 5px;
margin-right: 5px;
} }
.sessionDiv { .sessionDiv {