Skip to content

Commit

Permalink
add support for auto-sized big text via r-fit-text
Browse files Browse the repository at this point in the history
  • Loading branch information
hakimel committed Jun 5, 2020
1 parent 66cbd66 commit 1b6a3b1
Show file tree
Hide file tree
Showing 18 changed files with 144 additions and 3 deletions.
10 changes: 10 additions & 0 deletions css/theme/template/theme.scss
Original file line number Diff line number Diff line change
Expand Up @@ -79,6 +79,16 @@
line-height: 1.3;
}

/* Remove trailing margins after titles */
.reveal h1:last-child,
.reveal h2:last-child,
.reveal h3:last-child,
.reveal h4:last-child,
.reveal h5:last-child,
.reveal h6:last-child {
margin-bottom: 0;
}

/* Ensure certain elements are never larger than the slide itself */
.reveal img,
.reveal video,
Expand Down
2 changes: 1 addition & 1 deletion dist/reveal.esm.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dist/reveal.js

Large diffs are not rendered by default.

9 changes: 9 additions & 0 deletions dist/theme/beige.css
Original file line number Diff line number Diff line change
Expand Up @@ -108,6 +108,15 @@ section.has-dark-background, section.has-dark-background h1, section.has-dark-ba
margin: 20px 0;
line-height: 1.3; }

/* Remove trailing margins after titles */
.reveal h1:last-child,
.reveal h2:last-child,
.reveal h3:last-child,
.reveal h4:last-child,
.reveal h5:last-child,
.reveal h6:last-child {
margin-bottom: 0; }

/* Ensure certain elements are never larger than the slide itself */
.reveal img,
.reveal video,
Expand Down
9 changes: 9 additions & 0 deletions dist/theme/black.css
Original file line number Diff line number Diff line change
Expand Up @@ -101,6 +101,15 @@ section.has-light-background, section.has-light-background h1, section.has-light
margin: 20px 0;
line-height: 1.3; }

/* Remove trailing margins after titles */
.reveal h1:last-child,
.reveal h2:last-child,
.reveal h3:last-child,
.reveal h4:last-child,
.reveal h5:last-child,
.reveal h6:last-child {
margin-bottom: 0; }

/* Ensure certain elements are never larger than the slide itself */
.reveal img,
.reveal video,
Expand Down
9 changes: 9 additions & 0 deletions dist/theme/blood.css
Original file line number Diff line number Diff line change
Expand Up @@ -107,6 +107,15 @@ section.has-light-background, section.has-light-background h1, section.has-light
margin: 20px 0;
line-height: 1.3; }

/* Remove trailing margins after titles */
.reveal h1:last-child,
.reveal h2:last-child,
.reveal h3:last-child,
.reveal h4:last-child,
.reveal h5:last-child,
.reveal h6:last-child {
margin-bottom: 0; }

/* Ensure certain elements are never larger than the slide itself */
.reveal img,
.reveal video,
Expand Down
9 changes: 9 additions & 0 deletions dist/theme/league.css
Original file line number Diff line number Diff line change
Expand Up @@ -110,6 +110,15 @@ section.has-light-background, section.has-light-background h1, section.has-light
margin: 20px 0;
line-height: 1.3; }

/* Remove trailing margins after titles */
.reveal h1:last-child,
.reveal h2:last-child,
.reveal h3:last-child,
.reveal h4:last-child,
.reveal h5:last-child,
.reveal h6:last-child {
margin-bottom: 0; }

/* Ensure certain elements are never larger than the slide itself */
.reveal img,
.reveal video,
Expand Down
9 changes: 9 additions & 0 deletions dist/theme/moon.css
Original file line number Diff line number Diff line change
Expand Up @@ -108,6 +108,15 @@ section.has-light-background, section.has-light-background h1, section.has-light
margin: 20px 0;
line-height: 1.3; }

/* Remove trailing margins after titles */
.reveal h1:last-child,
.reveal h2:last-child,
.reveal h3:last-child,
.reveal h4:last-child,
.reveal h5:last-child,
.reveal h6:last-child {
margin-bottom: 0; }

/* Ensure certain elements are never larger than the slide itself */
.reveal img,
.reveal video,
Expand Down
9 changes: 9 additions & 0 deletions dist/theme/night.css
Original file line number Diff line number Diff line change
Expand Up @@ -102,6 +102,15 @@ section.has-light-background, section.has-light-background h1, section.has-light
margin: 20px 0;
line-height: 1.3; }

/* Remove trailing margins after titles */
.reveal h1:last-child,
.reveal h2:last-child,
.reveal h3:last-child,
.reveal h4:last-child,
.reveal h5:last-child,
.reveal h6:last-child {
margin-bottom: 0; }

/* Ensure certain elements are never larger than the slide itself */
.reveal img,
.reveal video,
Expand Down
9 changes: 9 additions & 0 deletions dist/theme/serif.css
Original file line number Diff line number Diff line change
Expand Up @@ -104,6 +104,15 @@ section.has-dark-background, section.has-dark-background h1, section.has-dark-ba
margin: 20px 0;
line-height: 1.3; }

/* Remove trailing margins after titles */
.reveal h1:last-child,
.reveal h2:last-child,
.reveal h3:last-child,
.reveal h4:last-child,
.reveal h5:last-child,
.reveal h6:last-child {
margin-bottom: 0; }

/* Ensure certain elements are never larger than the slide itself */
.reveal img,
.reveal video,
Expand Down
9 changes: 9 additions & 0 deletions dist/theme/simple.css
Original file line number Diff line number Diff line change
Expand Up @@ -104,6 +104,15 @@ section.has-dark-background, section.has-dark-background h1, section.has-dark-ba
margin: 20px 0;
line-height: 1.3; }

/* Remove trailing margins after titles */
.reveal h1:last-child,
.reveal h2:last-child,
.reveal h3:last-child,
.reveal h4:last-child,
.reveal h5:last-child,
.reveal h6:last-child {
margin-bottom: 0; }

/* Ensure certain elements are never larger than the slide itself */
.reveal img,
.reveal video,
Expand Down
9 changes: 9 additions & 0 deletions dist/theme/sky.css
Original file line number Diff line number Diff line change
Expand Up @@ -111,6 +111,15 @@ section.has-dark-background, section.has-dark-background h1, section.has-dark-ba
margin: 20px 0;
line-height: 1.3; }

/* Remove trailing margins after titles */
.reveal h1:last-child,
.reveal h2:last-child,
.reveal h3:last-child,
.reveal h4:last-child,
.reveal h5:last-child,
.reveal h6:last-child {
margin-bottom: 0; }

/* Ensure certain elements are never larger than the slide itself */
.reveal img,
.reveal video,
Expand Down
9 changes: 9 additions & 0 deletions dist/theme/solarized.css
Original file line number Diff line number Diff line change
Expand Up @@ -105,6 +105,15 @@ html * {
margin: 20px 0;
line-height: 1.3; }

/* Remove trailing margins after titles */
.reveal h1:last-child,
.reveal h2:last-child,
.reveal h3:last-child,
.reveal h4:last-child,
.reveal h5:last-child,
.reveal h6:last-child {
margin-bottom: 0; }

/* Ensure certain elements are never larger than the slide itself */
.reveal img,
.reveal video,
Expand Down
9 changes: 9 additions & 0 deletions dist/theme/white.css
Original file line number Diff line number Diff line change
Expand Up @@ -101,6 +101,15 @@ section.has-dark-background, section.has-dark-background h1, section.has-dark-ba
margin: 20px 0;
line-height: 1.3; }

/* Remove trailing margins after titles */
.reveal h1:last-child,
.reveal h2:last-child,
.reveal h3:last-child,
.reveal h4:last-child,
.reveal h5:last-child,
.reveal h6:last-child {
margin-bottom: 0; }

/* Ensure certain elements are never larger than the slide itself */
.reveal img,
.reveal video,
Expand Down
14 changes: 14 additions & 0 deletions examples/layout-helpers.html
Original file line number Diff line number Diff line change
Expand Up @@ -22,13 +22,27 @@
<section>
<h2>Layout Helper Examples</h2>
<ul>
<li><a href="#/fit-text">Big Text</a></li>
<li><a href="#/stretch">Stretch</a></li>
<li><a href="#/stack">Stack</a></li>
<li><a href="#/hstack">HStack</a></li>
<li><a href="#/vstack">VStack</a></li>
</ul>
</section>

<section id="fit-text">
<h2>Fit Text</h2>
<p>Resizes text to be as large as possible within its container.</p>
<pre><code class="html" data-trim data-line-numbers>
<h2 class="r-fit-text">FIT-TEXT</h2>
</code></pre>
</section>

<section>
<h2 class="r-fit-text">HELLO WORLD</h2>
<h2 class="r-fit-text">BOTH THESE TITLES USE FIT-TEXT</h2>
</section>

<section id="stretch">
<h2>Stretch</h2>
<p>Makes an element as tall as possible while remaining within the slide bounds.</p>
Expand Down
11 changes: 11 additions & 0 deletions js/reveal.js
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,8 @@ import {
POST_MESSAGE_METHOD_BLACKLIST
} from './utils/constants.js'

import fitty from 'fitty';

// The reveal.js version
export const VERSION = '4.0.2';

Expand Down Expand Up @@ -281,6 +283,15 @@ export default function( revealElement, options ) {
dom.statusElement = createStatusElement();

dom.wrapper.setAttribute( 'role', 'application' );

// The r-fit-text helper resizes text to be as large as
// possible within its given container
fitty( '.r-fit-text', {
minSize: 24,
maxSize: config.height * 0.8,
observeMutations: false,
observeWindow: false
} );
}

/**
Expand Down
8 changes: 7 additions & 1 deletion package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,7 @@
"babel-plugin-transform-html-import-to-string": "0.0.1",
"colors": "^1.4.0",
"core-js": "^3.6.5",
"fitty": "^2.3.0",
"glob": "^7.1.6",
"gulp": "^4.0.2",
"gulp-autoprefixer": "^7.0.1",
Expand Down

0 comments on commit 1b6a3b1

Please sign in to comment.