center help overlay with flexbox
This commit is contained in:
		| @@ -111,24 +111,40 @@ html:-moz-full-screen-ancestor { | |||||||
|     text-decoration: line-through; } |     text-decoration: line-through; } | ||||||
|  |  | ||||||
| .reveal .slides section .fragment.fade-up { | .reveal .slides section .fragment.fade-up { | ||||||
|   transform: translate(0, 20%); } |   -webkit-transform: translate(0, 20%); | ||||||
|  |       -ms-transform: translate(0, 20%); | ||||||
|  |           transform: translate(0, 20%); } | ||||||
|   .reveal .slides section .fragment.fade-up.visible { |   .reveal .slides section .fragment.fade-up.visible { | ||||||
|     transform: translate(0, 0); } |     -webkit-transform: translate(0, 0); | ||||||
|  |         -ms-transform: translate(0, 0); | ||||||
|  |             transform: translate(0, 0); } | ||||||
|  |  | ||||||
| .reveal .slides section .fragment.fade-down { | .reveal .slides section .fragment.fade-down { | ||||||
|   transform: translate(0, -20%); } |   -webkit-transform: translate(0, -20%); | ||||||
|  |       -ms-transform: translate(0, -20%); | ||||||
|  |           transform: translate(0, -20%); } | ||||||
|   .reveal .slides section .fragment.fade-down.visible { |   .reveal .slides section .fragment.fade-down.visible { | ||||||
|     transform: translate(0, 0); } |     -webkit-transform: translate(0, 0); | ||||||
|  |         -ms-transform: translate(0, 0); | ||||||
|  |             transform: translate(0, 0); } | ||||||
|  |  | ||||||
| .reveal .slides section .fragment.fade-right { | .reveal .slides section .fragment.fade-right { | ||||||
|   transform: translate(-20%, 0); } |   -webkit-transform: translate(-20%, 0); | ||||||
|  |       -ms-transform: translate(-20%, 0); | ||||||
|  |           transform: translate(-20%, 0); } | ||||||
|   .reveal .slides section .fragment.fade-right.visible { |   .reveal .slides section .fragment.fade-right.visible { | ||||||
|     transform: translate(0, 0); } |     -webkit-transform: translate(0, 0); | ||||||
|  |         -ms-transform: translate(0, 0); | ||||||
|  |             transform: translate(0, 0); } | ||||||
|  |  | ||||||
| .reveal .slides section .fragment.fade-left { | .reveal .slides section .fragment.fade-left { | ||||||
|   transform: translate(20%, 0); } |   -webkit-transform: translate(20%, 0); | ||||||
|  |       -ms-transform: translate(20%, 0); | ||||||
|  |           transform: translate(20%, 0); } | ||||||
|   .reveal .slides section .fragment.fade-left.visible { |   .reveal .slides section .fragment.fade-left.visible { | ||||||
|     transform: translate(0, 0); } |     -webkit-transform: translate(0, 0); | ||||||
|  |         -ms-transform: translate(0, 0); | ||||||
|  |             transform: translate(0, 0); } | ||||||
|  |  | ||||||
| .reveal .slides section .fragment.current-visible { | .reveal .slides section .fragment.current-visible { | ||||||
|   opacity: 0; |   opacity: 0; | ||||||
| @@ -1176,6 +1192,10 @@ html:-moz-full-screen-ancestor { | |||||||
|  |  | ||||||
| .reveal .overlay .viewport { | .reveal .overlay .viewport { | ||||||
|   position: absolute; |   position: absolute; | ||||||
|  |   display: -webkit-box; | ||||||
|  |   display: -webkit-flex; | ||||||
|  |   display: -ms-flexbox; | ||||||
|  |   display: flex; | ||||||
|   top: 40px; |   top: 40px; | ||||||
|   right: 0; |   right: 0; | ||||||
|   bottom: 0; |   bottom: 0; | ||||||
| @@ -1209,8 +1229,8 @@ html:-moz-full-screen-ancestor { | |||||||
|  |  | ||||||
| .reveal .overlay.overlay-help .viewport .viewport-inner { | .reveal .overlay.overlay-help .viewport .viewport-inner { | ||||||
|   width: 600px; |   width: 600px; | ||||||
|   margin: 0 auto; |   margin: auto; | ||||||
|   padding: 60px; |   padding: 20px 20px 80px 20px; | ||||||
|   text-align: center; |   text-align: center; | ||||||
|   letter-spacing: normal; } |   letter-spacing: normal; } | ||||||
|  |  | ||||||
| @@ -1220,12 +1240,12 @@ html:-moz-full-screen-ancestor { | |||||||
| .reveal .overlay.overlay-help .viewport .viewport-inner table { | .reveal .overlay.overlay-help .viewport .viewport-inner table { | ||||||
|   border: 1px solid #fff; |   border: 1px solid #fff; | ||||||
|   border-collapse: collapse; |   border-collapse: collapse; | ||||||
|   font-size: 14px; } |   font-size: 16px; } | ||||||
|  |  | ||||||
| .reveal .overlay.overlay-help .viewport .viewport-inner table th, | .reveal .overlay.overlay-help .viewport .viewport-inner table th, | ||||||
| .reveal .overlay.overlay-help .viewport .viewport-inner table td { | .reveal .overlay.overlay-help .viewport .viewport-inner table td { | ||||||
|   width: 200px; |   width: 200px; | ||||||
|   padding: 10px; |   padding: 14px; | ||||||
|   border: 1px solid #fff; |   border: 1px solid #fff; | ||||||
|   vertical-align: middle; } |   vertical-align: middle; } | ||||||
|  |  | ||||||
|   | |||||||
| @@ -1204,6 +1204,7 @@ html:-moz-full-screen-ancestor { | |||||||
|  |  | ||||||
| 	.reveal .overlay .viewport { | 	.reveal .overlay .viewport { | ||||||
| 		position: absolute; | 		position: absolute; | ||||||
|  | 		display: flex; | ||||||
| 		top: 40px; | 		top: 40px; | ||||||
| 		right: 0; | 		right: 0; | ||||||
| 		bottom: 0; | 		bottom: 0; | ||||||
| @@ -1240,8 +1241,8 @@ html:-moz-full-screen-ancestor { | |||||||
|  |  | ||||||
| 	.reveal .overlay.overlay-help .viewport .viewport-inner { | 	.reveal .overlay.overlay-help .viewport .viewport-inner { | ||||||
| 		width: 600px; | 		width: 600px; | ||||||
| 		margin: 0 auto; | 		margin: auto; | ||||||
| 		padding: 60px; | 		padding: 20px 20px 80px 20px; | ||||||
| 		text-align: center; | 		text-align: center; | ||||||
| 		letter-spacing: normal; | 		letter-spacing: normal; | ||||||
| 	} | 	} | ||||||
| @@ -1253,13 +1254,13 @@ html:-moz-full-screen-ancestor { | |||||||
| 	.reveal .overlay.overlay-help .viewport .viewport-inner table { | 	.reveal .overlay.overlay-help .viewport .viewport-inner table { | ||||||
| 		border: 1px solid #fff; | 		border: 1px solid #fff; | ||||||
| 		border-collapse: collapse; | 		border-collapse: collapse; | ||||||
| 		font-size: 14px; | 		font-size: 16px; | ||||||
| 	} | 	} | ||||||
|  |  | ||||||
| 	.reveal .overlay.overlay-help .viewport .viewport-inner table th, | 	.reveal .overlay.overlay-help .viewport .viewport-inner table th, | ||||||
| 	.reveal .overlay.overlay-help .viewport .viewport-inner table td { | 	.reveal .overlay.overlay-help .viewport .viewport-inner table td { | ||||||
| 		width: 200px; | 		width: 200px; | ||||||
| 		padding: 10px; | 		padding: 14px; | ||||||
| 		border: 1px solid #fff; | 		border: 1px solid #fff; | ||||||
| 		vertical-align: middle; | 		vertical-align: middle; | ||||||
| 	} | 	} | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user