new, fixed, speaker notes layout
This commit is contained in:
		@@ -144,9 +144,14 @@ ul, ol, div, p {
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
/* Display slide speaker notes when 'showNotes' is enabled */
 | 
			
		||||
.reveal.show-notes {
 | 
			
		||||
	max-width: none;
 | 
			
		||||
	max-height: none;
 | 
			
		||||
}
 | 
			
		||||
.reveal .speaker-notes-pdf {
 | 
			
		||||
	display: block;
 | 
			
		||||
	width: 100%;
 | 
			
		||||
	height: auto;
 | 
			
		||||
	max-height: none;
 | 
			
		||||
	top: auto;
 | 
			
		||||
	right: auto;
 | 
			
		||||
 
 | 
			
		||||
@@ -269,11 +269,11 @@ body {
 | 
			
		||||
    left: 50%;
 | 
			
		||||
    -webkit-transform: translateX(-50%) rotate(-90deg);
 | 
			
		||||
            transform: translateX(-50%) rotate(-90deg); }
 | 
			
		||||
  .reveal .controls[data-controls-back-arrows="deemphasized"] .navigate-left.enabled,
 | 
			
		||||
  .reveal .controls[data-controls-back-arrows="deemphasized"] .navigate-up.enabled {
 | 
			
		||||
  .reveal .controls[data-controls-back-arrows="faded"] .navigate-left.enabled,
 | 
			
		||||
  .reveal .controls[data-controls-back-arrows="faded"] .navigate-up.enabled {
 | 
			
		||||
    opacity: 0.3; }
 | 
			
		||||
    .reveal .controls[data-controls-back-arrows="deemphasized"] .navigate-left.enabled:hover,
 | 
			
		||||
    .reveal .controls[data-controls-back-arrows="deemphasized"] .navigate-up.enabled:hover {
 | 
			
		||||
    .reveal .controls[data-controls-back-arrows="faded"] .navigate-left.enabled:hover,
 | 
			
		||||
    .reveal .controls[data-controls-back-arrows="faded"] .navigate-up.enabled:hover {
 | 
			
		||||
      opacity: 1; }
 | 
			
		||||
  .reveal .controls[data-controls-back-arrows="hidden"] .navigate-left.enabled,
 | 
			
		||||
  .reveal .controls[data-controls-back-arrows="hidden"] .navigate-up.enabled {
 | 
			
		||||
@@ -1433,36 +1433,49 @@ body {
 | 
			
		||||
.reveal aside.notes {
 | 
			
		||||
  display: none; }
 | 
			
		||||
 | 
			
		||||
.reveal.show-notes {
 | 
			
		||||
  max-width: 80vw;
 | 
			
		||||
  overflow: visible; }
 | 
			
		||||
 | 
			
		||||
.reveal .speaker-notes {
 | 
			
		||||
  display: none;
 | 
			
		||||
  display: block;
 | 
			
		||||
  position: absolute;
 | 
			
		||||
  width: 70%;
 | 
			
		||||
  max-height: 15%;
 | 
			
		||||
  left: 15%;
 | 
			
		||||
  bottom: 26px;
 | 
			
		||||
  padding: 10px;
 | 
			
		||||
  width: 20vw;
 | 
			
		||||
  height: 100%;
 | 
			
		||||
  top: 0;
 | 
			
		||||
  left: 100%;
 | 
			
		||||
  padding: 14px;
 | 
			
		||||
  z-index: 1;
 | 
			
		||||
  font-size: 18px;
 | 
			
		||||
  line-height: 1.4;
 | 
			
		||||
  color: #fff;
 | 
			
		||||
  background-color: rgba(0, 0, 0, 0.5);
 | 
			
		||||
  color: #222;
 | 
			
		||||
  background-color: #f5f5f5;
 | 
			
		||||
  overflow: auto;
 | 
			
		||||
  box-sizing: border-box;
 | 
			
		||||
  text-align: left;
 | 
			
		||||
  font-family: Helvetica, sans-serif;
 | 
			
		||||
  -webkit-overflow-scrolling: touch; }
 | 
			
		||||
 | 
			
		||||
.reveal .speaker-notes.visible:not(:empty) {
 | 
			
		||||
  display: block; }
 | 
			
		||||
.reveal .speaker-notes:before {
 | 
			
		||||
  content: 'Speaker notes';
 | 
			
		||||
  display: block;
 | 
			
		||||
  margin-bottom: 10px;
 | 
			
		||||
  opacity: 0.5; }
 | 
			
		||||
 | 
			
		||||
@media screen and (max-width: 1024px) {
 | 
			
		||||
  .reveal.show-notes {
 | 
			
		||||
    max-width: none;
 | 
			
		||||
    max-height: 70vh;
 | 
			
		||||
    overflow: visible; }
 | 
			
		||||
  .reveal .speaker-notes {
 | 
			
		||||
    font-size: 14px; } }
 | 
			
		||||
    top: 70vh;
 | 
			
		||||
    left: 0;
 | 
			
		||||
    width: 100%;
 | 
			
		||||
    height: 30vh; } }
 | 
			
		||||
 | 
			
		||||
@media screen and (max-width: 600px) {
 | 
			
		||||
  .reveal .speaker-notes {
 | 
			
		||||
    width: 90%;
 | 
			
		||||
    left: 5%; } }
 | 
			
		||||
    font-size: 14px; } }
 | 
			
		||||
 | 
			
		||||
/*********************************************
 | 
			
		||||
 * ZOOM PLUGIN
 | 
			
		||||
 
 | 
			
		||||
@@ -335,11 +335,11 @@ body {
 | 
			
		||||
		transform: translateX(-50%) rotate( -90deg );
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	// Back arrow style: "deemphasized":
 | 
			
		||||
	// Back arrow style: "faded":
 | 
			
		||||
	// Strongly deemphasizes backwards navigation in favor of drawing
 | 
			
		||||
	// attention to forwards navigation
 | 
			
		||||
	&[data-controls-back-arrows="deemphasized"] .navigate-left.enabled,
 | 
			
		||||
	&[data-controls-back-arrows="deemphasized"] .navigate-up.enabled {
 | 
			
		||||
	&[data-controls-back-arrows="faded"] .navigate-left.enabled,
 | 
			
		||||
	&[data-controls-back-arrows="faded"] .navigate-up.enabled {
 | 
			
		||||
		opacity: 0.3;
 | 
			
		||||
 | 
			
		||||
		&:hover {
 | 
			
		||||
@@ -1521,21 +1521,26 @@ body {
 | 
			
		||||
	display: none;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.reveal.show-notes {
 | 
			
		||||
	max-width: 80vw;
 | 
			
		||||
	overflow: visible;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// An interface element that can optionally be used to show the
 | 
			
		||||
// speaker notes to all viewers, on top of the presentation
 | 
			
		||||
.reveal .speaker-notes {
 | 
			
		||||
	display: none;
 | 
			
		||||
	display: block;
 | 
			
		||||
	position: absolute;
 | 
			
		||||
	width: 70%;
 | 
			
		||||
	max-height: 15%;
 | 
			
		||||
	left: 15%;
 | 
			
		||||
	bottom: 26px;
 | 
			
		||||
	padding: 10px;
 | 
			
		||||
	width: 20vw;
 | 
			
		||||
	height: 100%;
 | 
			
		||||
	top: 0;
 | 
			
		||||
	left: 100%;
 | 
			
		||||
	padding: 14px;
 | 
			
		||||
	z-index: 1;
 | 
			
		||||
	font-size: 18px;
 | 
			
		||||
	line-height: 1.4;
 | 
			
		||||
	color: #fff;
 | 
			
		||||
	background-color: rgba(0,0,0,0.5);
 | 
			
		||||
	color: #222;
 | 
			
		||||
	background-color: #f5f5f5;
 | 
			
		||||
	overflow: auto;
 | 
			
		||||
	box-sizing: border-box;
 | 
			
		||||
	text-align: left;
 | 
			
		||||
@@ -1543,20 +1548,31 @@ body {
 | 
			
		||||
	-webkit-overflow-scrolling: touch;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.reveal .speaker-notes.visible:not(:empty) {
 | 
			
		||||
.reveal .speaker-notes:before {
 | 
			
		||||
	content: 'Speaker notes';
 | 
			
		||||
	display: block;
 | 
			
		||||
	margin-bottom: 10px;
 | 
			
		||||
	opacity: 0.5;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@media screen and (max-width: 1024px) {
 | 
			
		||||
	.reveal.show-notes {
 | 
			
		||||
		max-width: none;
 | 
			
		||||
		max-height: 70vh;
 | 
			
		||||
		overflow: visible;
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	.reveal .speaker-notes {
 | 
			
		||||
		font-size: 14px;
 | 
			
		||||
		top: 70vh;
 | 
			
		||||
		left: 0;
 | 
			
		||||
		width: 100%;
 | 
			
		||||
		height: 30vh;
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@media screen and (max-width: 600px) {
 | 
			
		||||
	.reveal .speaker-notes {
 | 
			
		||||
		width: 90%;
 | 
			
		||||
		left: 5%;
 | 
			
		||||
		font-size: 14px;
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										10
									
								
								js/reveal.js
									
									
									
									
									
								
							
							
						
						
									
										10
									
								
								js/reveal.js
									
									
									
									
									
								
							@@ -56,8 +56,8 @@
 | 
			
		||||
			controlsLayout: 'bottom-right',
 | 
			
		||||
 | 
			
		||||
			// Specifies the display rules for backwards navigation arrows;
 | 
			
		||||
			// "deemphasized", "hidden" or "visible"
 | 
			
		||||
			controlsBackArrows: 'deemphasized',
 | 
			
		||||
			// "faded", "hidden" or "visible"
 | 
			
		||||
			controlsBackArrows: 'faded',
 | 
			
		||||
 | 
			
		||||
			// Display a presentation progress bar
 | 
			
		||||
			progress: true,
 | 
			
		||||
@@ -106,7 +106,7 @@
 | 
			
		||||
			// key is pressed
 | 
			
		||||
			help: true,
 | 
			
		||||
 | 
			
		||||
			// Flags if it should be possible to pause the presentation (blackout)
 | 
			
		||||
			// Flags if it should be possible to pause t.spehe presentation (blackout)
 | 
			
		||||
			pause: true,
 | 
			
		||||
 | 
			
		||||
			// Flags if speaker notes should be visible to all viewers
 | 
			
		||||
@@ -1032,11 +1032,11 @@
 | 
			
		||||
		}
 | 
			
		||||
 | 
			
		||||
		if( config.showNotes ) {
 | 
			
		||||
			dom.speakerNotes.classList.add( 'visible' );
 | 
			
		||||
			dom.wrapper.classList.add( 'show-notes' );
 | 
			
		||||
			dom.speakerNotes.setAttribute( 'data-layout', typeof config.showNotes === 'string' ? config.showNotes : 'inline' );
 | 
			
		||||
		}
 | 
			
		||||
		else {
 | 
			
		||||
			dom.speakerNotes.classList.remove( 'visible' );
 | 
			
		||||
			dom.wrapper.classList.remove( 'show-notes' );
 | 
			
		||||
		}
 | 
			
		||||
 | 
			
		||||
		if( config.mouseWheel ) {
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user