m/blog
1
0
Fork 0
mirror of https://github.com/kremalicious/blog.git synced 2025-02-14 21:10:25 +01:00
Code

switch to srcset, kick out picturefill

Browse Source
This commit is contained in:
Matthias Kretschmann 2017-09-09 22:36:04 +02:00
parent 8686244dfa
commit 48ec5417ac
Signed by: m
GPG Key ID: 606EEEF3C479A91F
8 changed files with 16 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
_src/_assets/styl/_kremalicious/content-featured.styl
View File

@ -15,12 +15,9 @@
padding-bottom: ($spacer*3)
.hentry__teaser
picture
margin: 0
@media $screen-xs
margin-left: 0
margin-right: 0
@media $screen-xs
margin-left: 0
margin-right: 0
.featured-link
@extend .link--nounderline

12
_src/_assets/styl/_kremalicious/content-photo.styl
View File

@ -11,7 +11,6 @@
margin-top: -($spacer * 1.5)
figure
@extend .aligncenter
position: relative
display: inline-block
@ -31,15 +30,8 @@
color: #fff
text-shadow: 0 1px 0 #000
left: -($spacer)
top: $spacer * 6
@media $screen-sm
left: -($spacer * 4)
@media $screen-lg
left: -($spacer * 4)
left: 0
top: $spacer * 4
opacity: 0
transform: translate3d(0, -20px, 0)

10
_src/_assets/styl/_kremalicious/content-related.styl
View File

@ -13,9 +13,8 @@
margin-bottom: $spacer
.related-post
picture
img
@extend .media-frame
img
@extend .media-frame
.post-title
@extend .h5, .transition, .text-dimmed
@ -31,9 +30,8 @@
&:focus
.post-title
color: $link-color
picture
img
border-color: $link-color-hover
img
border-color: $link-color-hover
&:active
.post-title

11
_src/_assets/styl/_kremalicious/content.styl
View File

@ -77,12 +77,11 @@
/////////////////////////////////////
.hentry__teaser
picture
@extend .breakoutviewport
max-width: none
display: block
margin-top: ($spacer*1.5)
margin-bottom: ($spacer*1.5)
@extend .breakoutviewport
max-width: none
display: block
margin-top: ($spacer*1.5)
margin-bottom: ($spacer*1.5)
img
@extend .media-frame

3
_src/_includes/head.html
View File

@ -79,9 +79,6 @@
})(document);
</script>
<!-- Picturefill -->
<script src="/assets/js/picturefill.min.js" async></script>
<!-- Canonical URL -->
<link rel="canonical" href="{{ site.url}}{{ page.url | replace:'index.html','' }}">

5
_src/_includes/picture.html
View File

@ -24,7 +24,4 @@
{% endif %}
{% endif %}
<picture>
<source srcset="{{ site.media_url }}/{{ pictureSizeRetina }}/media/{{ pictureSrc }}" media="(-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi)">
<img srcset="{{ site.media_url }}/{{ pictureSize }}/media/{{ pictureSrc }}" alt="">
</picture>
<img src="{{ site.media_url }}/{{ pictureSize }}/media/{{ pictureSrc }}" srcset="{{ site.media_url }}/{{ pictureSize }}/media/{{ pictureSrc }} 1x, {{ site.media_url }}/{{ pictureSizeRetina }}/media/{{ pictureSrc }} 2x" alt="{{ post.title }}">

3
gulpfile.babel.js
View File

@ -214,8 +214,7 @@ export const criticalCss = done => {
export const js = () =>
src([
SRC + '/_assets/js/*.js',
'!' + SRC + '/_assets/js/_*.js',
'node_modules/picturefill/dist/picturefill.js'
'!' + SRC + '/_assets/js/_*.js'
])
.pipe($.sourcemaps.init())
.pipe($.include({

1
package.json
View File

@ -40,7 +40,6 @@
"dependencies": {
"normalize-css": "^2.3.1",
"normalize-opentype.css": "^0.2.4",
"picturefill": "^3.0.2",
"simple-jekyll-search": "^1.4.1",
"time-elements": "^0.6.1",
"vex-js": "^4.0.0",