about summary refs log tree commit diff
diff options
context:
space:
mode:
authorPatryk Niedźwiedziński <pniedzwiedzinski19@gmail.com>2021-02-04 18:05:33 +0100
committerPatryk Niedźwiedziński <pniedzwiedzinski19@gmail.com>2021-02-04 18:05:33 +0100
commit1782d93021ad6b4fcaed6ff7004ef41079398017 (patch)
tree77a488d98a381f2d114b6d73cb989002b85c0705
parent9d21606dc4e2e500a1d19de95c2e65ad26e816f5 (diff)
downloadgal-1782d93021ad6b4fcaed6ff7004ef41079398017.tar.gz
gal-1782d93021ad6b4fcaed6ff7004ef41079398017.zip
Add site title
-rwxr-xr-xgal9
-rw-r--r--style.css20
2 files changed, 22 insertions, 7 deletions
diff --git a/gal b/gal
index b395a73..29a67ed 100755
--- a/gal
+++ b/gal
@@ -3,6 +3,9 @@
 ##
 ## Usage:
 ## $ ./gal [PHOTOS DIR] [OUTPUT DIR]
+##
+## Setting custom title:
+## $ TITLE=Title ./gal [AS ABOVE]
 
 ## === Customize ===
 
@@ -13,8 +16,10 @@ RESOLUTION=1500
 ## =================
 
 
+
 PHOTOS=$1
 OUTPUT=$2
+TITLE=${TITLE:-$(basename $OUTPUT)}
 mkdir -p $2/{photos,thumbs}
 
 ## Generate index.html menu file
@@ -27,10 +32,12 @@ cat > $OUTPUT/index.html <<EOF
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width">
-    <title>Gallery</title>
+    <title>$TITLE</title>
     <link rel="stylesheet" href="style.css" type="text/css" >
   </head>
   <body>
+    <h1>$TITLE</h1>
+    <h3>Last update: $(date '+%d.%m.%Y')</h3>
     <div class="tiles">
 EOF
 
diff --git a/style.css b/style.css
index 9dc80d8..43ae13d 100644
--- a/style.css
+++ b/style.css
@@ -1,11 +1,16 @@
-
 body {
   margin: 0;
-  padding: 0;
+  padding: 6ex 16vw;
+  box-sizing: border-box;
   width: 100%;
   height: 100vh;
   font-family: sans-serif;
 }
+h1, h3 {
+  width: 58vw;
+  margin: auto;
+}
+h3 { font-weight: 400; }
 
 footer {
   text-align: center;
@@ -13,7 +18,7 @@ footer {
 }
 
 .tiles {
-  padding: 6vh 16vw;
+  padding: 6ex 0;
   display: flex;
   flex-wrap: wrap;
   flex-direction: row;
@@ -21,7 +26,7 @@ footer {
   position: relative;
 }
 .tile {
-  margin: 15px;
+  margin: 1vw;
   cursor: pointer;
   overflow: hidden;
   min-width: 120px;
@@ -42,8 +47,11 @@ footer {
 }
 
 @media only screen and (max-width: 442px) {
-  .tiles {
-    padding: 6vh 4vw;
+  body {
+    padding: 6ex 4vw;
+  }
+  h1, h3 {
+    width: 100%;
   }
 
   .tile {