From f5c9e1256f12f86fdc64637d2dcc36bc3f7aa9c2 Mon Sep 17 00:00:00 2001 From: Aaron Markus Date: Mon, 29 Jul 2024 16:07:10 +0200 Subject: [PATCH] completed --- index.html | 253 +---------------------------------------------------- 1 file changed, 2 insertions(+), 251 deletions(-) diff --git a/index.html b/index.html index 218f860..5bc5fe3 100644 --- a/index.html +++ b/index.html @@ -93,7 +93,7 @@

Why is it important?

-

Imagine working on a large project with multiple team members. How do you keep track of everyone's changes without overwriting each other's work?

+

Imagine working on a large project with multiple team members. How do you keep track of everyone's changes without overwriting each other's work?

This is where Git comes in....

@@ -234,258 +234,9 @@

How do I get started with Open Source?

-
-

Add the r-fit-text class to auto-size text

-

FIT TEXT

-
- -
-
-

Fragments

-

Hit the next arrow...

-

... to step through ...

-

... a fragmented slide.

- - -
-
-

Fragment Styles

-

There's different types of fragments, like:

-

grow

-

shrink

-

fade-out

-

- fade-right, - up, - down, - left -

-

fade-in-then-out

-

fade-in-then-semi-out

-

Highlight red blue green

-
-
- -
-

Transition Styles

-

- You can select from different transitions, like:
- None - - Fade - - Slide - - Convex - - Concave - - Zoom -

-
- -
-

Themes

-

- reveal.js comes with a few themes built in:
- - Black (default) - - White - - League - - Sky - - Beige - - Simple
- Serif - - Blood - - Night - - Moon - - Solarized -

-
- -
-
-

Slide Backgrounds

-

- Set data-background="#dddddd" on a slide to change the background color. All CSS color formats are supported. -

- - Down arrow - -
-
-

Gradient Backgrounds

- 
<section data-background-gradient=
-							"linear-gradient(to bottom, #ddd, #191919)">
-
-
-

Image Backgrounds

- 
<section data-background="image.png">
-
-
-

Tiled Backgrounds

- 
<section data-background="image.png" data-background-repeat="repeat" data-background-size="100px">
-
-
-
-

Video Backgrounds

- 
<section data-background-video="video.mp4,video.webm">
-
-
-
-

... and GIFs!

-
-
- -
-

Background Transitions

-

- Different background transitions are available via the backgroundTransition option. This one's called "zoom". -

- 
Reveal.configure({ backgroundTransition: 'zoom' })
-
- -
-

Background Transitions

-

- You can override background transitions per-slide. -

- 
<section data-background-transition="zoom">
-
- -
-
-

Iframe Backgrounds

-

Since reveal.js runs on the web, you can easily embed other web content. Try interacting with the page in the background.

-
-
- -
-

Marvelous List

-
    -
  • No order here
    • -
  • Or here
    • -
  • Or here
    • -
  • Or here
    • -
-
- -
-

Fantastic Ordered List

-
    -
  1. One is smaller than...
    2. -
  2. Two is smaller than...
    3. -
  3. Three!
    4. -
-
- -
-

Tabular Tables

- - - - - - - - - - - - - - - - - - - - - - - - - -
ItemValueQuantity
Apples$17
Lemonade$218
Bread$32
-
- -
-

Clever Quotes

-

- These guys come in two forms, inline: The nice thing about standards is that there are so many to choose from and block: -

-
- “For years there has been a theory that millions of monkeys typing at random on millions of typewriters would - reproduce the entire works of Shakespeare. The Internet has proven this theory to be untrue.” -
-
- -
-

Intergalactic Interconnections

-

- You can link between slides internally, - like this. -

-
- -
-

Speaker View

-

There's a speaker view. It includes a timer, preview of the upcoming slide as well as your speaker notes.

-

Press the S key to try it out.

- - -
- -
-

Export to PDF

-

Presentations can be exported to PDF, here's an example:

- -
- -
-

Global State

-

- Set data-state="something" on a slide and "something" - will be added as a class to the document element when the slide is open. This lets you - apply broader style changes, like switching the page background. -

-
- -
-

State Events

-

- Additionally custom events can be triggered on a per slide basis by binding to the data-state name. -

- 

-Reveal.on( 'customevent', function() {
-	console.log( '"customevent" has fired' );
-} );
-
-
- -
-

Take a Moment

-

- Press B or . on your keyboard to pause the presentation. This is helpful when you're on stage and want to take distracting slides off the screen. -

-
- -
-

Much more

- -
-

THE END

-

- - Try the online editor
- - Source code & documentation -

+

The End