Websites
/
lektor-website
mirror of https://github.com/lektor/lektor-website.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #223 from lektor/showcase-style-fixes 

[showcase-style-fixes] and setting cropped height on tall showcase images
This commit is contained in:
Joseph Nix 2018-06-08 16:40:11 -05:00 committed by GitHub
parent 2a5abb35e4 b10d32fa51
commit 29dbf9f779
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 13 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
assets/static/styles.css
View File

File diff suppressed because one or more lines are too long

7
templates/showcase.html
View File

@ -38,8 +38,11 @@
<small>You want your own website on here? <a
href="https://github.com/lektor/lektor-website/tree/master/content/showcase">Fork
the Lektor Website Repository on GitHub</a> to add your own project.
Make sure to add screenshots (aspect ratio ~ 1.6:1) and a description
about the project. We encourage you to add a link to your source code
Make sure to add screenshots and a description about the project.
The primary screenshot is thumbnailed on this page to 415px wide, and cropped to
260px tall, and on your site's individual page the larger images are 870px wide.
We encourage you to add a link to your source code
so that others can learn from your example.
</small>
{% endblock %}

6
webpack/scss/main.scss
View File

@ -13,6 +13,7 @@ $font-size-h5: $font-size-base;
$font-size-h6: ceil(($font-size-base * 0.85));
$container-large-desktop: 900px;
$container-desktop: $container-large-desktop; // md is the same.
$border-radius-base: 0;
$border-radius-large: 0;
@ -781,6 +782,11 @@ div.showcase {
.frame {
background: white;
@media (min-width: $screen-sm-max) {
max-height: 260px; // Taller thumbnails get cropped.
overflow: hidden;
}
}
&:hover {