diff --git a/public/js/snippetedit.js b/public/js/snippetedit.js
index 3e0fc0b..896d44b 100644
--- a/public/js/snippetedit.js
+++ b/public/js/snippetedit.js
@@ -204,15 +204,15 @@ function makeSnippetEdit(ownerName, ownerAvatar, ownerUrl, date, text, attachmen
if (el) {
snippetEdit.uploadBox.style.display = "none";
snippetEdit.previewBox.style.display = "block";
- snippetEdit.uploadResetLink.style.display = "none";
+ snippetEdit.uploadResetBox.style.display = "none";
snippetEdit.previewContent = emptyElement(snippetEdit.previewContent);
snippetEdit.previewContent.appendChild(el);
snippetEdit.resetLink.style.display = (!originalAttachment || el == originalAttachment) ? "none" : "inline-block";
} else {
- snippetEdit.uploadBox.style.display = "flex";
+ snippetEdit.uploadBox.style.display = "block";
snippetEdit.previewBox.style.display = "none";
if (originalAttachment) {
- snippetEdit.uploadResetLink.style.display = "block";
+ snippetEdit.uploadResetBox.style.display = "block";
}
}
}
@@ -222,7 +222,7 @@ function makeSnippetEdit(ownerName, ownerAvatar, ownerUrl, date, text, attachmen
if (snippetEdit.file.files.length > 0 && snippetEdit.file.files[0].size > maxFilesize) {
// NOTE(asaf): Writing this out in bytes to make the limit exactly clear to the user.
let readableSize = new Intl.NumberFormat([], { useGrouping: "always" }).format(maxFilesize);
- snippetEdit.errors.textContent = "File is too big! Max filesize is " + readableSize + " bytes";
+ snippetEdit.errors.textContent = "File is too big! Max filesize is " + readableSize + " bytes.";
sizeGood = false;
} else {
snippetEdit.errors.textContent = "";
@@ -279,7 +279,10 @@ function makeSnippetEdit(ownerName, ownerAvatar, ownerUrl, date, text, attachmen
snippetEdit.root.addEventListener("dragenter", function(ev) {
enterCounter++;
- if (ev.dataTransfer && ev.dataTransfer.files && ev.dataTransfer.files.length > 0) {
+ let droppable = Array.from(ev.dataTransfer.items).some(
+ item => item.kind.toLowerCase() === "file"
+ );
+ if (droppable) {
snippetEdit.root.classList.add("drop");
}
});
@@ -348,6 +351,11 @@ function makeSnippetEdit(ownerName, ownerAvatar, ownerUrl, date, text, attachmen
});
snippetEdit.deleteButton.addEventListener("click", function(ev) {
+ if (!window.confirm("Are you sure you want to delete this snippet?")) {
+ ev.preventDefault();
+ return;
+ }
+
snippetEdit.file.value = "";
});
diff --git a/public/style.css b/public/style.css
index f91620b..0c432fb 100644
--- a/public/style.css
+++ b/public/style.css
@@ -4703,15 +4703,19 @@ code, .code {
.optionbar .options button,
.optionbar .options .button,
.optionbar .options input[type=button],
-.optionbar .options input[type=submit], .post-content th, .post-content td {
+.optionbar .options input[type=submit], .post-content th, .post-content td,
+button.button-small,
+.button.button-small,
+input.button-small[type=button],
+input.button-small[type=submit] {
padding-top: 0.25rem;
padding-bottom: 0.25rem; }
.pv2, .tab-bar .tab-button,
-button,
-.button,
-input[type=button],
-input[type=submit], .notice {
+button:not(.button-small),
+.button:not(.button-small),
+input[type=button]:not(.button-small),
+input[type=submit]:not(.button-small), .notice {
padding-top: 0.5rem;
padding-bottom: 0.5rem; }
@@ -4747,15 +4751,19 @@ input[type=submit], .notice {
.optionbar .options button,
.optionbar .options .button,
.optionbar .options input[type=button],
-.optionbar .options input[type=submit], .pagination .button, .post-content th, .post-content td {
+.optionbar .options input[type=submit], .pagination .button, .post-content th, .post-content td,
+button.button-small,
+.button.button-small,
+input.button-small[type=button],
+input.button-small[type=submit] {
padding-left: 0.5rem;
padding-right: 0.5rem; }
.ph3, .tab-bar .tab-button,
-button,
-.button,
-input[type=button],
-input[type=submit], .notice {
+button:not(.button-small),
+.button:not(.button-small),
+input[type=button]:not(.button-small),
+input[type=submit]:not(.button-small), .notice {
padding-left: 1rem;
padding-right: 1rem; }
@@ -7521,6 +7529,9 @@ article code {
.g5 {
gap: 4rem; }
+.hide-if-empty:empty {
+ display: none !important; }
+
@media screen and (min-width: 30em) {
.bi-avoid-ns {
break-inside: avoid; }
diff --git a/src/rawdata/scss/_core.scss b/src/rawdata/scss/_core.scss
index f449527..d486bde 100644
--- a/src/rawdata/scss/_core.scss
+++ b/src/rawdata/scss/_core.scss
@@ -364,6 +364,10 @@ article code {
.g4 { gap: $spacing-large; }
.g5 { gap: $spacing-extra-large; }
+.hide-if-empty:empty {
+ display: none !important;
+}
+
@media #{$breakpoint-not-small} {
.bi-avoid-ns { break-inside: avoid; }
.cc-auto-ns { column-count: auto; }
diff --git a/src/rawdata/scss/_forms.scss b/src/rawdata/scss/_forms.scss
index 555e670..c699a2c 100644
--- a/src/rawdata/scss/_forms.scss
+++ b/src/rawdata/scss/_forms.scss
@@ -139,8 +139,15 @@ input, select, textarea {
}
#{$buttons} {
- @extend .ph3;
- @extend .pv2;
+ &:not(.button-small) {
+ @extend .ph3;
+ @extend .pv2;
+ }
+
+ &.button-small {
+ @extend .ph2;
+ @extend .pv1;
+ }
@include usevar('color', 'form-button-color');
@include usevar('background-color', 'form-button-background');
diff --git a/src/rawdata/scss/themes/dark/_variables.scss b/src/rawdata/scss/themes/dark/_variables.scss
index 16044de..f90fac1 100644
--- a/src/rawdata/scss/themes/dark/_variables.scss
+++ b/src/rawdata/scss/themes/dark/_variables.scss
@@ -3,7 +3,7 @@ $fg-font-color: #eee;
$vars: (
fg-font-color: $fg-font-color,
- // Default theme colors in case the assets.css is busted
+ // Default theme colors in case the project.css is busted
theme-color: #666,
theme-color-dim: #444,
theme-color-dimmer: #383838,
diff --git a/src/templates/src/include/snippet_edit.html b/src/templates/src/include/snippet_edit.html
index 78822b5..1292af1 100644
--- a/src/templates/src/include/snippet_edit.html
+++ b/src/templates/src/include/snippet_edit.html
@@ -1,5 +1,15 @@
+
+
-