mirror/webslides
1
0
Fork 0
mirror of https://github.com/webslides/WebSlides.git synced 2025-08-16 10:04:45 +02:00
Code Issues Releases Wiki Activity

Fixing index responsive slide sizes

Browse Source
This commit is contained in:
Luis
2017-07-15 14:28:44 +02:00
parent c109276ef6
commit 0e0b2b4160
4 changed files with 17 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/scss/modules/_zoom.scss
View File

@@ -41,12 +41,12 @@
position: relative;
width: 25%;
@media screen and (orientation: portrait), screen and (max-width: 768px) and (orientation: landscape) {
width: 50%;
@media screen and (max-width: 567px) {
width: 100%;
}
@media (max-aspect-ratio: 2 / 3) {
width: 100%;
@media screen and (min-width: 568px) and (max-width: 1023px) {
width: 50%;
}
> .wrap-zoom {
@@ -56,12 +56,12 @@
position: relative;
transition: .3s;
@media screen and (orientation: portrait), screen and (max-width: 768px) and (orientation: landscape) {
@media screen and (max-width: 567px) {
height: 50vh;
}
@media (max-aspect-ratio: 2 / 3) {
height: 50vh;
@media screen and (min-width: 568px) and (max-width: 1023px) {
height: 33vh;
}
&:hover {

16
static/css/webslides.css
View File

@@ -1,7 +1,7 @@
/*!
* Name: WebSlides
* Version: 1.3.1
* Date: 2017-07-14
* Date: 2017-07-15
* Description: Making HTML presentations easy
* URL: https://github.com/webslides/webslides#readme
* Credits: @jlantunez, @LuisSacristan, @Belelros
@@ -2911,12 +2911,12 @@ Solution: stackoverflow.com/questions/34250282/flexbox-safari-bug-flex-wrap
order: 0;
position: relative;
width: 25%; }
@media screen and (orientation: portrait), screen and (max-width: 768px) and (orientation: landscape) {
#webslides-zoomed > .wrap > .grid > .column {
width: 50%; } }
@media (max-aspect-ratio: 2 / 3) {
@media screen and (max-width: 567px) {
#webslides-zoomed > .wrap > .grid > .column {
width: 100%; } }
@media screen and (min-width: 568px) and (max-width: 1023px) {
#webslides-zoomed > .wrap > .grid > .column {
width: 50%; } }
#webslides-zoomed > .wrap > .grid > .column > .wrap-zoom {
display: inline-block;
height: 25vh;
@@ -2924,12 +2924,12 @@ Solution: stackoverflow.com/questions/34250282/flexbox-safari-bug-flex-wrap
position: relative;
-webkit-transition: .3s;
transition: .3s; }
@media screen and (orientation: portrait), screen and (max-width: 768px) and (orientation: landscape) {
@media screen and (max-width: 567px) {
#webslides-zoomed > .wrap > .grid > .column > .wrap-zoom {
height: 50vh; } }
@media (max-aspect-ratio: 2 / 3) {
@media screen and (min-width: 568px) and (max-width: 1023px) {
#webslides-zoomed > .wrap > .grid > .column > .wrap-zoom {
height: 50vh; } }
height: 33vh; } }
#webslides-zoomed > .wrap > .grid > .column > .wrap-zoom:hover {
-webkit-transform: scale(1.02);
transform: scale(1.02);

2
static/js/webslides.js
View File

@@ -1,7 +1,7 @@
/*!
* Name: WebSlides
* Version: 1.3.1
* Date: 2017-07-14
* Date: 2017-07-15
* Description: Making HTML presentations easy
* URL: https://github.com/webslides/webslides#readme
* Credits: @jlantunez, @LuisSacristan, @Belelros

2
static/js/webslides.min.js vendored
View File

@@ -1,7 +1,7 @@
/*!
* Name: WebSlides
* Version: 1.3.1
* Date: 2017-07-14
* Date: 2017-07-15
* Description: Making HTML presentations easy
* URL: https://github.com/webslides/webslides#readme
* Credits: @jlantunez, @LuisSacristan, @Belelros