ryan/Notes
1
0
Fork 0
Code Issues 2 Pull Requests Packages Projects Releases Wiki Activity

change to toast style

Browse Source
This commit is contained in:
Ryan Peters 2023-01-31 09:35:24 -05:00
parent b49d4b2612
commit 0675b567e4
2 changed files with 22 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
wwwroot/css/site.css
View File

@ -35,30 +35,38 @@ textarea {
border-width: 0; border-width: 0;
} }
textarea.dark { .dark textarea {
background-color: #222; background-color: #222;
color: #ddd; color: #ddd;
} }
.toast { .toast {
position: fixed; position: fixed;
bottom: -40px; bottom: 0;
right: 20px; right: 20px;
font-size: 12px; font-size: 12px;
padding: 10px; padding: 10px;
border-radius: 10px 10px 0 0;
color: #fff; color: #fff;
transition: bottom 0.2s; transition: opacity 0.4s;
opacity: 0;
} }
.toast.show { .toast.show {
bottom: 0; opacity: 0.8;
} }
.dark #saved-indicator {
color: lawngreen;
}
#saved-indicator { #saved-indicator {
background-color: green; color: green;
}
.dark #update-indicator {
color: orange;
} }
#update-indicator { #update-indicator {
background-color: orangered; color: orangered;
} }

14
wwwroot/js/site.js
View File

@ -3,7 +3,7 @@
.withUrl("/noteHub") .withUrl("/noteHub")
.build(); .build();
let start = function () { function start() {
connection.start().then(function () { connection.start().then(function () {
console.log('Started websocket listener'); console.log('Started websocket listener');
@ -13,7 +13,7 @@ let start = function () {
}); });
} }
let showToast = function (selector) { function showToast(selector) {
const cssClass = 'show'; const cssClass = 'show';
@ -24,7 +24,7 @@ let showToast = function (selector) {
}); });
} }
let saveContent = function ($textarea) { function saveContent($textarea) {
$textarea = $textarea || $('textarea'); $textarea = $textarea || $('textarea');
var content = $textarea.val(); var content = $textarea.val();
@ -42,7 +42,7 @@ start();
$(function () { $(function () {
let $textarea = $('textarea'); const $textarea = $('textarea');
// update content upon sync save // update content upon sync save
connection.on('updateNote', function (content) { connection.on('updateNote', function (content) {
@ -52,12 +52,12 @@ $(function () {
// set dark mode // set dark mode
if (window.location.hash == '#dark') { if (window.location.hash == '#dark') {
$textarea.addClass('dark'); $('body').addClass('dark');
} }
var timer = null; let timer = null;
let ignoredKeyCodes = [17, 18, 20, 27, 37, 38, 39, 40, 91]; const ignoredKeyCodes = [17, 18, 20, 27, 37, 38, 39, 40, 91];
// save after a second delay after typing // save after a second delay after typing
$textarea.keyup(function (e) { $textarea.keyup(function (e) {