collapse control element size when corner aligned

edit
Hakim El Hattab 2016-04-29 10:26:44 +02:00
parent a9fcaa6f9e
commit 4fb8e78eb4
3 changed files with 10 additions and 2 deletions

View File

@ -195,7 +195,8 @@ body {
top: 0; top: 0;
right: 0; right: 0;
bottom: 0; bottom: 0;
left: 0; } left: 0;
z-index: 1; }
.reveal .controls button { .reveal .controls button {
position: absolute; position: absolute;
padding: 0; padding: 0;
@ -280,8 +281,10 @@ body {
.reveal .controls .enabled.fragmented:hover { .reveal .controls .enabled.fragmented:hover {
opacity: 1; } opacity: 1; }
.reveal .controls[data-controls-placement="bottom-right"] { .reveal .controls[data-controls-placement="bottom-right"] {
top: auto;
bottom: 18px; bottom: 18px;
right: 18px; right: 18px;
left: auto;
-webkit-transform: scale(0.85); -webkit-transform: scale(0.85);
transform: scale(0.85); transform: scale(0.85);
-webkit-transform-origin: 100% 100%; -webkit-transform-origin: 100% 100%;
@ -306,8 +309,10 @@ body {
bottom: 0; } bottom: 0; }
@media screen and (max-width: 500px) { @media screen and (max-width: 500px) {
.reveal .controls { .reveal .controls {
top: auto;
bottom: 18px; bottom: 18px;
right: 18px; right: 18px;
left: auto;
-webkit-transform: scale(0.85); -webkit-transform: scale(0.85);
transform: scale(0.85); transform: scale(0.85);
-webkit-transform-origin: 100% 100%; -webkit-transform-origin: 100% 100%;

View File

@ -260,6 +260,7 @@ body {
right: 0; right: 0;
bottom: 0; bottom: 0;
left: 0; left: 0;
z-index: 1;
button { button {
position: absolute; position: absolute;
@ -360,8 +361,10 @@ body {
@mixin bottom-right-controls() { @mixin bottom-right-controls() {
& { & {
top: auto;
bottom: $spacing; bottom: $spacing;
right: $spacing; right: $spacing;
left: auto;
transform: scale(0.85); transform: scale(0.85);
transform-origin: 100% 100%; transform-origin: 100% 100%;
} }

View File

@ -52,7 +52,7 @@
// Display controls in the bottom right corner // Display controls in the bottom right corner
controls: true, controls: true,
// Determines where controls appear, either "bottom-right" or "edges" // Determines where controls appear, "edges" or "bottom-right"
controlsPlacement: 'edges', controlsPlacement: 'edges',
// De-emphasizes backwards navigation controls // De-emphasizes backwards navigation controls