@@ -26,8 +26,7 @@ system|GNU Hurd|GNU Guix package manager|GNU Guile|Guile \
Scheme|Transactional upgrades|Functional package \
management|Reproducibility") #\|)
#:active-menu-item (C_ "website menu" "Media")
- #:css (list (theme-url "css/index.css")
- (theme-url "css/screenshots.css"))
+ #:css (list (theme-url "css/screenshots.css"))
#:content
`(main
(section
@@ -23,7 +23,7 @@ system|GNU Hurd|GNU Guix package manager|GNU Guile|Guile \
Scheme|Transactional upgrades|Functional package \
management|Reproducibility") #\|)
#:active-menu-item (C_ "website menu" "Media")
- #:css (list (theme-url "css/index.css"))
+ #:css (list (theme-url "css/screenshots.css"))
#:content
`(main
(section
@@ -228,73 +228,12 @@ h2 {
color: #E6E6E6;
}
-.screenshots-box {
- padding: 40px 0px 0px 0px;
-}
-
-.screenshot-preview {
- font-size: 0.7em;
- margin: 40px auto;
- max-width: 250px;
- text-align: center;
-}
-
-.screenshot-preview a,
-.screenshot-preview img {
- border-radius: 5px;
- display: block;
-}
-
-.screenshot-preview a:link,
-.screenshot-preview a:visited {
- border-color: transparent;
- border-style: solid;
- border-width: thin;
- box-shadow: 0 0 4px gray;
- color: white;
- position: relative;
-}
-
-.screenshot-preview a:active,
-.screenshot-preview a:focus,
-.screenshot-preview a:hover {
- border-color: black;
- box-shadow: 0 0 4px black;
-}
-
-
-
-@media screen and (min-width: 300px) {
- .screenshot-inset-shadow {
- border-radius: 5px;
- box-shadow: inset 0 0 4px black;
- display: block;
- height: 140px;
- position: absolute;
- top: 0px;
- width: 250px;
- }
-
- .screenshot-preview a:active .screenshot-inset-shadow,
- .screenshot-preview a:focus .screenshot-inset-shadow,
- .screenshot-preview a:hover .screenshot-inset-shadow {
- box-shadow: none;
- }
-}
-
-
@media screen and (min-width: 480px) {
.button-big:link,
.button-big:visited {
display: inline-block;
}
-
- .screenshot-preview {
- display: inline-block;
- margin: 15px;
- vertical-align: top;
- }
}
@@ -1,3 +1,65 @@
+.screenshots-box {
+ padding: 40px 0px 0px 0px;
+}
+
+.screenshot-preview {
+ font-size: 0.7em;
+ margin: 40px auto;
+ max-width: 250px;
+ text-align: center;
+}
+
+.screenshot-preview a,
+.screenshot-preview img {
+ border-radius: 5px;
+ display: block;
+}
+
+.screenshot-preview a:link,
+.screenshot-preview a:visited {
+ border-color: transparent;
+ border-style: solid;
+ border-width: thin;
+ box-shadow: 0 0 4px gray;
+ color: white;
+ position: relative;
+}
+
+.screenshot-preview a:active,
+.screenshot-preview a:focus,
+.screenshot-preview a:hover {
+ border-color: black;
+ box-shadow: 0 0 4px black;
+}
+
.screenshot-viewer {
background-color: black;
-}
\ No newline at end of file
+}
+
+
+
+@media screen and (min-width: 300px) {
+ .screenshot-inset-shadow {
+ border-radius: 5px;
+ box-shadow: inset 0 0 4px black;
+ display: block;
+ height: 140px;
+ position: absolute;
+ top: 0px;
+ width: 250px;
+ }
+
+ .screenshot-preview a:active .screenshot-inset-shadow,
+ .screenshot-preview a:focus .screenshot-inset-shadow,
+ .screenshot-preview a:hover .screenshot-inset-shadow {
+ box-shadow: none;
+ }
+}
+
+@media screen and (min-width: 480px) {
+ .screenshot-preview {
+ display: inline-block;
+ margin: 15px;
+ vertical-align: top;
+ }
+}
From: Luis Felipe <sirgazil@zoho.com> * website/themes/initial/css/index.css: Move screenshot rules to screenshots.css. * website/themes/initial/css/screenshots.css: Add screenshot rules from index.css. * website/apps/media/templates/screenshot.scm (screenshot-t): Don't use the index.css. * website/apps/media/templates/screenshots-overview.scm: (screenshots-overview-t): Likewise, and use screenshots.css instead. --- website/apps/media/templates/screenshot.scm | 3 +- .../media/templates/screenshots-overview.scm | 2 +- website/themes/initial/css/index.css | 61 ------------------ website/themes/initial/css/screenshots.css | 64 ++++++++++++++++++- 4 files changed, 65 insertions(+), 65 deletions(-)