From 85a9bd9012e23ed65f1a84938e0e9268b5cc1bd5 Mon Sep 17 00:00:00 2001 From: Colin Okay Date: Fri, 11 Nov 2022 14:01:38 -0600 Subject: Add: about page. css tweaks --- about.lisp | 23 +++++++++++++++++++++++ home.lisp | 2 +- navigation.lisp | 7 ++++--- static/css/main.css | 13 +++++++++++++ vampire.asd | 1 + vampire.lisp | 1 + 6 files changed, 43 insertions(+), 4 deletions(-) create mode 100644 about.lisp diff --git a/about.lisp b/about.lisp new file mode 100644 index 0000000..1eb42aa --- /dev/null +++ b/about.lisp @@ -0,0 +1,23 @@ +;;;; about.lisp -- an about page. + +(in-package :vampire) + +(defun about-page (body) + (include-style body) + (with-clog-create body + (div () + (navigation-header ()) + (div (:class "centered-column") + (div ()) + (div () + (p ( :content "Vampire is a small private app shared + between friends. Its purpose is to create and share audio playlists, + and to collaborate on playlists with your friends in real time.")) + (p ( :content "The app is called vampire because it sucks + content from other sources, backed by the popular + youtube-dl tool.")) + + (p ( :content "Vampire is written in Common Lisp using the + CLOG system.")) + (p ( :content "I hope you enjoy using Vampire."))) + (div ()))))) diff --git a/home.lisp b/home.lisp index 7af5bba..4e4135a 100644 --- a/home.lisp +++ b/home.lisp @@ -52,7 +52,7 @@ (or (uses-remaining invite) "unlimited")))))) (set-on-click delbtn (thunk* (destroy-invite invite) - (destroy item)))) ) + (destroy item))))) (defun create-invite-control (parent) (let* ((user (session-user parent)) diff --git a/navigation.lisp b/navigation.lisp index f3b519e..0fe68f0 100644 --- a/navigation.lisp +++ b/navigation.lisp @@ -5,6 +5,7 @@ (defun create-navigation-header (parent) (with-clog-create parent (section (:header :class "row") - (div () (img ( :url-src "/favicon.ico"))) - (div () (a (:link "/home" :content "Home"))) - (div () (a (:link "/explore" :content "Explore")))))) + (div () (a (:link "/home") + (img ( :url-src "/favicon.ico")))) + (div () (a (:link "/explore" :content "Explore"))) + (div () (a (:link "/about" :content "About")))))) diff --git a/static/css/main.css b/static/css/main.css index 5556f99..64c90a9 100644 --- a/static/css/main.css +++ b/static/css/main.css @@ -40,6 +40,18 @@ button:hover { margin: 30px; } +.centered-column { + display: grid; + grid-template-columns: 1fr minmax(300px,500px) 1fr; + padding: 10px; + column-gap: 40px; +} + +.four-column > div { + max-width: 50%; +} + + .track-list-item:hover { cursor: pointer; background-color: #454545; @@ -58,3 +70,4 @@ button:hover { .now-playing-track { background-color: #454545; } + diff --git a/vampire.asd b/vampire.asd index a089d47..2690ca3 100644 --- a/vampire.asd +++ b/vampire.asd @@ -25,6 +25,7 @@ (:file "session") (:file "style") (:file "navigation") + (:file "about") (:file "new-account") (:file "explore") (:file "login") diff --git a/vampire.lisp b/vampire.lisp index bd1e16d..a45b853 100644 --- a/vampire.lisp +++ b/vampire.lisp @@ -52,6 +52,7 @@ :host (host config) :extended-routing t :static-root (static-directory config)) + (set-on-new-window (when-logged-in? 'about-page) :path "/about") (set-on-new-window (when-logged-in? 'user-home-page) :path "/home") (set-on-new-window (when-logged-in? 'user-listing-page) :path "/user") (set-on-new-window 'login-page :path "/login") -- cgit v1.2.3