diff options
| author | Patryk Niedźwiedziński <pniedzwiedzinski19@gmail.com> | 2021-02-04 18:05:33 +0100 |
|---|---|---|
| committer | Patryk Niedźwiedziński <pniedzwiedzinski19@gmail.com> | 2021-02-04 18:05:33 +0100 |
| commit | 1782d93021ad6b4fcaed6ff7004ef41079398017 (patch) | |
| tree | 77a488d98a381f2d114b6d73cb989002b85c0705 | |
| parent | 9d21606dc4e2e500a1d19de95c2e65ad26e816f5 (diff) | |
| download | galier-1782d93021ad6b4fcaed6ff7004ef41079398017.tar.gz galier-1782d93021ad6b4fcaed6ff7004ef41079398017.zip | |
Add site title
| -rwxr-xr-x | gal | 9 | ||||
| -rw-r--r-- | style.css | 20 |
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 { |