Make button margins consistent, and some other fixes

This commit is contained in:
2024-04-18 20:05:54 +02:00
parent 09528929b2
commit 46058edcc8
12 changed files with 67 additions and 35 deletions

View File

@@ -18,7 +18,7 @@ export let border_top = false;
<style>
.border_top {
border-top: solid 1px var(--separator);
border-top: solid 2px var(--separator);
}
.image {
display: block;

View File

@@ -635,7 +635,6 @@ const keyboard_event = evt => {
display: flex;
flex-direction: row;
text-align: left;
padding: 2px;
align-items: center;
}
@media(max-height: 600px) {
@@ -650,7 +649,6 @@ const keyboard_event = evt => {
flex-shrink: 0;
margin-left: 4px;
margin-right: 4px;
display: inline;
}
.headerbar > .file_viewer_headerbar_title {
flex-grow: 1;
@@ -658,7 +656,7 @@ const keyboard_event = evt => {
display: flex;
flex-direction: column;
overflow: hidden;
line-height: 1.2em; /* When the page is a list there will be two lines. Dont's want to stretch the container*/
line-height: 1.2em; /* When the page is a list there will be two lines. Don't want to stretch the container */
white-space: nowrap;
text-overflow: ellipsis;
justify-content: center;

View File

@@ -1,4 +1,9 @@
<script context="module">
// Dead zone before the swipe action gets detected
const swipe_inital_offset = 25
// Amount of pixels after which the navigation triggers
const swipe_trigger_offset = 75
export const swipe_nav = (node, swipe_enabled) => {
let start_x = 0
let start_y = 0
@@ -23,8 +28,8 @@ export const swipe_nav = (node, swipe_enabled) => {
// The cursor must have moved at least 50 pixels and three times as much
// on the x axis than the y axis for it to count as a swipe
if (abs_x > 50 && abs_y < abs_x/3) {
set_offset((abs_x-50)*neg, false)
if (abs_x > swipe_inital_offset && abs_y < abs_x/3) {
set_offset((abs_x-swipe_inital_offset)*neg, false)
} else {
set_offset(0, true)
}
@@ -35,10 +40,10 @@ export const swipe_nav = (node, swipe_enabled) => {
return
}
if (render_offset > 100) {
if (render_offset > swipe_trigger_offset) {
set_offset(1000, true)
node.dispatchEvent(new CustomEvent("prev"))
} else if (render_offset < -100) {
} else if (render_offset < -swipe_trigger_offset) {
set_offset(-1000, true)
node.dispatchEvent(new CustomEvent("next"))
} else {
@@ -51,7 +56,7 @@ export const swipe_nav = (node, swipe_enabled) => {
let detail = "transform: translateX("+off+"px);"
if (animate) {
detail += "transition: transform 500ms;"
detail += "transition: transform 400ms;"
}
// Clear the transformation if the offset is zero