diff --git a/onlylegs/__init__.py b/onlylegs/__init__.py
index e15e3e1..5c5f33f 100644
--- a/onlylegs/__init__.py
+++ b/onlylegs/__init__.py
@@ -101,7 +101,7 @@ def create_app(): # pylint: disable=R0914
assets.init_app(app)
scripts = Bundle(
- "js/*.js", output="gen/js.js", depends="js/*.js"
+ "js/*.js", filters="jsmin", output="gen/js.js", depends="js/*.js"
) # filter jsmin is broken :c
styles = Bundle(
"sass/style.sass",
diff --git a/onlylegs/config.py b/onlylegs/config.py
index 58e7a80..edcd808 100644
--- a/onlylegs/config.py
+++ b/onlylegs/config.py
@@ -3,6 +3,7 @@ Gallery configuration file
"""
import os
import platformdirs
+import importlib.metadata
from dotenv import load_dotenv
from yaml import safe_load
@@ -41,3 +42,6 @@ MEDIA_FOLDER = os.path.join(user_dir, "media")
# Database
INSTANCE_DIR = instance_dir
MIGRATIONS_DIR = os.path.join(INSTANCE_DIR, "migrations")
+
+# App
+APP_VERSION = importlib.metadata.version("OnlyLegs")
\ No newline at end of file
diff --git a/onlylegs/static/js/fade.js b/onlylegs/static/js/fade.js
new file mode 100644
index 0000000..56749ba
--- /dev/null
+++ b/onlylegs/static/js/fade.js
@@ -0,0 +1,11 @@
+// fade in images
+function imgFade(obj, time = 200) {
+ setTimeout(() => {
+ obj.style.animation = `imgFadeIn ${time}ms`;
+
+ setTimeout(() => {
+ obj.style.opacity = null;
+ obj.style.animation = null;
+ }, time);
+ }, 1);
+}
diff --git a/onlylegs/static/js/index.js b/onlylegs/static/js/index.js
deleted file mode 100644
index 8817bf2..0000000
--- a/onlylegs/static/js/index.js
+++ /dev/null
@@ -1,72 +0,0 @@
-// fade in images
-function imgFade(obj, time = 200) {
- obj.style.opacity = null;
- obj.style.animation = `imgFadeIn ${time}ms`;
-
- setTimeout(() => { obj.style.animation = null; }, time);
-}
-
-window.onload = function () {
- const times = document.querySelectorAll('.time');
- for (let i = 0; i < times.length; i++) {
- // Remove milliseconds
- const raw = times[i].innerHTML.split('.')[0];
-
- // Parse YYYY-MM-DD HH:MM:SS to Date object
- const time = raw.split(' ')[1];
- const date = raw.split(' ')[0].split('-');
-
- // Format to YYYY/MM/DD HH:MM:SS and convert to UTC Date object
- const dateTime = new Date(`${date[0]}/${date[1]}/${date[2]} ${time} UTC`);
-
- // Convert to local time
- times[i].innerHTML = `${dateTime.toLocaleDateString()} ${dateTime.toLocaleTimeString()}`;
- }
-
- // Top Of Page button
- const topOfPage = document.querySelector('.top-of-page');
- if (document.body.scrollTop > 300 || document.documentElement.scrollTop > 20) {
- topOfPage.classList.add('show');
- } else {
- topOfPage.classList.remove('show');
- }
- topOfPage.onclick = function () {
- document.body.scrollTop = 0;
- document.documentElement.scrollTop = 0;
- }
-
- // Info button
- const infoButton = document.querySelector('.info-button');
- if (infoButton) {
- if (document.body.scrollTop > 300 || document.documentElement.scrollTop > 20) {
- infoButton.classList.remove('show');
- } else {
- infoButton.classList.add('show');
- }
- infoButton.onclick = function () {
- popUpShow('OnlyLegs',
- 'v0.1.4 ' +
- 'using Phosphoricons and Flask.' +
- '
Made by Fluffy and others with ❤️');
- }
- }
-};
-window.onscroll = function () {
- // Top Of Page button
- const topOfPage = document.querySelector('.top-of-page');
- if (document.body.scrollTop > 300 || document.documentElement.scrollTop > 20) {
- topOfPage.classList.add('show');
- } else {
- topOfPage.classList.remove('show');
- }
-
- // Info button
- const infoButton = document.querySelector('.info-button');
- if (infoButton) {
- if (document.body.scrollTop > 300 || document.documentElement.scrollTop > 20) {
- infoButton.classList.remove('show');
- } else {
- infoButton.classList.add('show');
- }
- }
-};
diff --git a/onlylegs/static/js/square.js b/onlylegs/static/js/square.js
new file mode 100644
index 0000000..83e0482
--- /dev/null
+++ b/onlylegs/static/js/square.js
@@ -0,0 +1,11 @@
+function keepSquare() {
+ const images = document.querySelectorAll('.gallery-item');
+ for (let i = 0; i < images.length; i++) {
+ images[i].style.height = images[i].offsetWidth + 'px';
+ }
+
+ const groups = document.querySelectorAll('.group-item');
+ for (let i = 0; i < groups.length; i++) {
+ groups[i].style.height = groups[i].offsetWidth + 'px';
+ }
+}
\ No newline at end of file
diff --git a/onlylegs/static/sass/components/gallery.sass b/onlylegs/static/sass/components/gallery.sass
index cd33fdd..05f2c66 100644
--- a/onlylegs/static/sass/components/gallery.sass
+++ b/onlylegs/static/sass/components/gallery.sass
@@ -24,8 +24,6 @@
margin: 0.35rem
padding: 0
- height: auto
-
position: relative
border-radius: $rad-inner
@@ -44,8 +42,7 @@
height: auto
position: absolute
- left: 0
- bottom: 0
+ inset: 0
display: flex
flex-direction: column
@@ -88,12 +85,6 @@
object-position: center
background-color: RGB($bg-bright)
- transition: all 0.2s cubic-bezier(.79, .14, .15, .86)
-
- &:after
- content: ""
- display: block
- padding-bottom: 100%
&:hover
box-shadow: 0 0.2rem 0.4rem 0.1rem RGBA($bg-100, 0.6)
@@ -105,8 +96,6 @@
margin: 0.35rem
padding: 0
- height: auto
-
position: relative
border-radius: $rad-inner
@@ -171,8 +160,7 @@
height: 100%
position: absolute
- top: 0
- left: 0
+ inset: 0
object-fit: cover
object-position: center
@@ -181,7 +169,7 @@
border-radius: $rad-inner
box-shadow: 0 0 0.4rem 0.25rem RGBA($bg-100, 0.1)
- transition: all 0.2s cubic-bezier(.79, .14, .15, .86)
+ transition: transform 0.2s cubic-bezier(.79, .14, .15, .86)
&.size-1
.data-1
@@ -206,11 +194,6 @@
transform: scale(0.6) rotate(-1deg) translate(-15%, -23%)
z-index: +1
- &:after
- content: ""
- display: block
- padding-bottom: 100%
-
&:hover
.images
&.size-1
diff --git a/onlylegs/templates/layout.html b/onlylegs/templates/layout.html
index f5f1a36..2cd9ecb 100644
--- a/onlylegs/templates/layout.html
+++ b/onlylegs/templates/layout.html
@@ -66,18 +66,18 @@