diff options
| author | sirgazil <sirgazil@zoho.com> | 2019-03-18 13:19:00 -0500 |
|---|---|---|
| committer | sirgazil <sirgazil@zoho.com> | 2019-03-18 13:19:00 -0500 |
| commit | 5135c9082f0122912dcd5206f62c555b8b62be34 (patch) | |
| tree | e7f903e913984f586ee9de3b993883c010d4207f /website/apps | |
| parent | website: Crop GDM thumbnail. (diff) | |
| download | guix-artwork-5135c9082f0122912dcd5206f62c555b8b62be34.tar.gz | |
website: screenshots: Center screenshot (see #34886).
This change centers the screenshot horizontally in the page, and adds
a black background to make narrow screenshots look a better in wider
screens. The background also helps differentiate better the space of
the screenshot from the screenshot list below it.
* website/apps/base/templates/screenshot.scm:
(screenshot-t): Apply new screenshot-viewer class.
* website/static/base/css/screenshots.css: New style sheet.
Diffstat (limited to 'website/apps')
| -rw-r--r-- | website/apps/base/templates/screenshot.scm | 13 |
1 files changed, 8 insertions, 5 deletions
diff --git a/website/apps/base/templates/screenshot.scm b/website/apps/base/templates/screenshot.scm index 3083e74..41a3a07 100644 --- a/website/apps/base/templates/screenshot.scm +++ b/website/apps/base/templates/screenshot.scm @@ -23,7 +23,8 @@ "GNU Guile" "Guile Scheme" "Transactional upgrades" "Functional package management" "Reproducibility") #:active-menu-item "Overview" - #:css (list (guix-url "static/base/css/index.css")) + #:css (list (guix-url "static/base/css/index.css") + (guix-url "static/base/css/screenshots.css")) #:content `(main (section @@ -32,10 +33,12 @@ (@ (class "a11y-offset")) ,(screenshot-title shot)) - (img - (@ (class "responsive-image") - (src ,(screenshot-image shot)) - (alt ,(screenshot-caption shot)))) + (div + (@ (class "screenshot-viewer")) + (img + (@ (class "responsive-image centered-block") + (src ,(screenshot-image shot)) + (alt ,(screenshot-caption shot))))) (div (@ (class "screenshots-box top-shadow-bg")) |