Skip to content

Commit 3ca581c

Browse files
SpEcHiDeSpEcHiDe
committed
create two files
1 parent 8ead0ca commit 3ca581c

File tree

2 files changed

+381
-1
lines changed

2 files changed

+381
-1
lines changed

‎Slide/filesystem.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@
4242
<div class="slides">
4343
<section>
4444
<h1>Linux filesystem</h1>
45-
<h6>by Shrimadhav U K</h6>
45+
<p><small>by Shrimadhav U K</small></p>
4646
</section>
4747

4848
<section>

‎Slide/intro.html

Lines changed: 380 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,380 @@
1+
<!doctype html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="utf-8">
6+
7+
<title>reveal.js - The HTML Presentation Framework</title>
8+
9+
<meta name="description" content="A framework for easily creating beautiful presentations using HTML">
10+
<meta name="author" content="Hakim El Hattab">
11+
12+
<meta name="apple-mobile-web-app-capable" content="yes" />
13+
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
14+
15+
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui">
16+
17+
<link rel="stylesheet" href="css/reveal.css">
18+
<link rel="stylesheet" href="css/theme/black.css" id="theme">
19+
20+
<!-- Code syntax highlighting -->
21+
<link rel="stylesheet" href="lib/css/zenburn.css">
22+
23+
<!-- Printing and PDF exports -->
24+
<script>
25+
var link = document.createElement( 'link' );
26+
link.rel = 'stylesheet';
27+
link.type = 'text/css';
28+
link.href = window.location.search.match( /print-pdf/gi ) ? 'css/print/pdf.css' : 'css/print/paper.css';
29+
document.getElementsByTagName( 'head' )[0].appendChild( link );
30+
</script>
31+
32+
<!--[if lt IE 9]>
33+
<script src="lib/js/html5shiv.js"></script>
34+
<![endif]-->
35+
</head>
36+
37+
<body>
38+
39+
<div class="reveal">
40+
41+
<!-- Any section element inside of this container is displayed as a slide -->
42+
<div class="slides">
43+
<section>
44+
<h1>Reveal.js</h1>
45+
<h3>The HTML Presentation Framework</h3>
46+
<p>
47+
<small>Created by <a href="http://hakim.se">Hakim El Hattab</a> / <a href="http://twitter.com/hakimel">@hakimel</a></small>
48+
</p>
49+
</section>
50+
51+
<section>
52+
<h2>Hello There</h2>
53+
<p>
54+
reveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do.
55+
</p>
56+
</section>
57+
58+
<!-- Example of nested vertical slides -->
59+
<section>
60+
<section>
61+
<h2>Vertical Slides</h2>
62+
<p>Slides can be nested inside of each other.</p>
63+
<p>Use the <em>Space</em> key to navigate through all slides.</p>
64+
<br>
65+
<a href="#" class="navigate-down">
66+
<img width="178" height="238" data-src="https://s3.amazonaws.com/hakim-static/reveal-js/arrow.png" alt="Down arrow">
67+
</a>
68+
</section>
69+
<section>
70+
<h2>Basement Level 1</h2>
71+
<p>Nested slides are useful for adding additional detail underneath a high level horizontal slide.</p>
72+
</section>
73+
<section>
74+
<h2>Basement Level 2</h2>
75+
<p>That's it, time to go back up.</p>
76+
<br>
77+
<a href="#/2">
78+
<img width="178" height="238" data-src="https://s3.amazonaws.com/hakim-static/reveal-js/arrow.png" alt="Up arrow" style="transform: rotate(180deg); -webkit-transform: rotate(180deg);">
79+
</a>
80+
</section>
81+
</section>
82+
83+
<section>
84+
<h2>Slides</h2>
85+
<p>
86+
Not a coder? Not a problem. There's a fully-featured visual editor for authoring these, try it out at <a href="http://slides.com" target="_blank">http://slides.com</a>.
87+
</p>
88+
</section>
89+
90+
<section>
91+
<h2>Point of View</h2>
92+
<p>
93+
Press <strong>ESC</strong> to enter the slide overview.
94+
</p>
95+
<p>
96+
Hold down alt and click on any element to zoom in on it using <a href="http://lab.hakim.se/zoom-js">zoom.js</a>. Alt + click anywhere to zoom back out.
97+
</p>
98+
</section>
99+
100+
<section>
101+
<h2>Touch Optimized</h2>
102+
<p>
103+
Presentations look great on touch devices, like mobile phones and tablets. Simply swipe through your slides.
104+
</p>
105+
</section>
106+
107+
<section data-markdown>
108+
<script type="text/template">
109+
## Markdown support
110+
111+
Write content using inline or external Markdown.
112+
Instructions and more info available in the [readme](https://github.com/hakimel/reveal.js#markdown).
113+
114+
```
115+
<section data-markdown>
116+
## Markdown support
117+
118+
Write content using inline or external Markdown.
119+
Instructions and more info available in the [readme](https://github.com/hakimel/reveal.js#markdown).
120+
</section>
121+
```
122+
</script>
123+
</section>
124+
125+
<section>
126+
<section id="fragments">
127+
<h2>Fragments</h2>
128+
<p>Hit the next arrow...</p>
129+
<p class="fragment">... to step through ...</p>
130+
<p><span class="fragment">... a</span> <span class="fragment">fragmented</span> <span class="fragment">slide.</span></p>
131+
132+
<aside class="notes">
133+
This slide has fragments which are also stepped through in the notes window.
134+
</aside>
135+
</section>
136+
<section>
137+
<h2>Fragment Styles</h2>
138+
<p>There's different types of fragments, like:</p>
139+
<p class="fragment grow">grow</p>
140+
<p class="fragment shrink">shrink</p>
141+
<p class="fragment fade-out">fade-out</p>
142+
<p class="fragment current-visible">current-visible</p>
143+
<p class="fragment highlight-red">highlight-red</p>
144+
<p class="fragment highlight-blue">highlight-blue</p>
145+
</section>
146+
</section>
147+
148+
<section id="transitions">
149+
<h2>Transition Styles</h2>
150+
<p>
151+
You can select from different transitions, like: <br>
152+
<a href="?transition=none#/transitions">None</a> -
153+
<a href="?transition=fade#/transitions">Fade</a> -
154+
<a href="?transition=slide#/transitions">Slide</a> -
155+
<a href="?transition=convex#/transitions">Convex</a> -
156+
<a href="?transition=concave#/transitions">Concave</a> -
157+
<a href="?transition=zoom#/transitions">Zoom</a>
158+
</p>
159+
</section>
160+
161+
<section id="themes">
162+
<h2>Themes</h2>
163+
<p>
164+
reveal.js comes with a few themes built in: <br>
165+
<!-- Hacks to swap themes after the page has loaded. Not flexible and only intended for the reveal.js demo deck. -->
166+
<a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/black.css'); return false;">Black (default)</a> -
167+
<a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/white.css'); return false;">White</a> -
168+
<a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/league.css'); return false;">League</a> -
169+
<a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/sky.css'); return false;">Sky</a> -
170+
<a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/beige.css'); return false;">Beige</a> -
171+
<a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/simple.css'); return false;">Simple</a> <br>
172+
<a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/serif.css'); return false;">Serif</a> -
173+
<a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/blood.css'); return false;">Blood</a> -
174+
<a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/night.css'); return false;">Night</a> -
175+
<a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/moon.css'); return false;">Moon</a> -
176+
<a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/solarized.css'); return false;">Solarized</a>
177+
</p>
178+
</section>
179+
180+
<section>
181+
<section data-background="#dddddd">
182+
<h2>Slide Backgrounds</h2>
183+
<p>
184+
Set <code>data-background="#dddddd"</code> on a slide to change the background color. All CSS color formats are supported.
185+
</p>
186+
<a href="#" class="navigate-down">
187+
<img width="178" height="238" data-src="https://s3.amazonaws.com/hakim-static/reveal-js/arrow.png" alt="Down arrow">
188+
</a>
189+
</section>
190+
<section data-background="https://s3.amazonaws.com/hakim-static/reveal-js/image-placeholder.png">
191+
<h2>Image Backgrounds</h2>
192+
<pre><code>&lt;section data-background="image.png"&gt;</code></pre>
193+
</section>
194+
<section data-background="https://s3.amazonaws.com/hakim-static/reveal-js/image-placeholder.png" data-background-repeat="repeat" data-background-size="100px">
195+
<h2>Tiled Backgrounds</h2>
196+
<pre><code style="word-wrap: break-word;">&lt;section data-background="image.png" data-background-repeat="repeat" data-background-size="100px"&gt;</code></pre>
197+
</section>
198+
<section data-background-video="https://s3.amazonaws.com/static.slid.es/site/homepage/v1/homepage-video-editor.mp4,https://s3.amazonaws.com/static.slid.es/site/homepage/v1/homepage-video-editor.webm" data-background-color="#000000">
199+
<div style="background-color: rgba(0, 0, 0, 0.9); color: #fff; padding: 20px;">
200+
<h2>Video Backgrounds</h2>
201+
<pre><code style="word-wrap: break-word;">&lt;section data-background-video="video.mp4,video.webm"&gt;</code></pre>
202+
</div>
203+
</section>
204+
<section data-background="http://i.giphy.com/90F8aUepslB84.gif">
205+
<h2>... and GIFs!</h2>
206+
</section>
207+
</section>
208+
209+
<section data-transition="slide" data-background="#4d7e65" data-background-transition="zoom">
210+
<h2>Background Transitions</h2>
211+
<p>
212+
Different background transitions are available via the backgroundTransition option. This one's called "zoom".
213+
</p>
214+
<pre><code>Reveal.configure({ backgroundTransition: 'zoom' })</code></pre>
215+
</section>
216+
217+
<section data-transition="slide" data-background="#b5533c" data-background-transition="zoom">
218+
<h2>Background Transitions</h2>
219+
<p>
220+
You can override background transitions per-slide.
221+
</p>
222+
<pre><code style="word-wrap: break-word;">&lt;section data-background-transition="zoom"&gt;</code></pre>
223+
</section>
224+
225+
<section>
226+
<h2>Pretty Code</h2>
227+
<pre><code data-trim contenteditable>
228+
function linkify( selector ) {
229+
if( supports3DTransforms ) {
230+
231+
var nodes = document.querySelectorAll( selector );
232+
233+
for( var i = 0, len = nodes.length; i &lt; len; i++ ) {
234+
var node = nodes[i];
235+
236+
if( !node.className ) {
237+
node.className += ' roll';
238+
}
239+
}
240+
}
241+
}
242+
</code></pre>
243+
<p>Code syntax highlighting courtesy of <a href="http://softwaremaniacs.org/soft/highlight/en/description/">highlight.js</a>.</p>
244+
</section>
245+
246+
<section>
247+
<h2>Marvelous List</h2>
248+
<ul>
249+
<li>No order here</li>
250+
<li>Or here</li>
251+
<li>Or here</li>
252+
<li>Or here</li>
253+
</ul>
254+
</section>
255+
256+
<section>
257+
<h2>Fantastic Ordered List</h2>
258+
<ol>
259+
<li>One is smaller than...</li>
260+
<li>Two is smaller than...</li>
261+
<li>Three!</li>
262+
</ol>
263+
</section>
264+
265+
<section>
266+
<h2>Tabular Tables</h2>
267+
<table>
268+
<thead>
269+
<tr>
270+
<th>Item</th>
271+
<th>Value</th>
272+
<th>Quantity</th>
273+
</tr>
274+
</thead>
275+
<tbody>
276+
<tr>
277+
<td>Apples</td>
278+
<td>$1</td>
279+
<td>7</td>
280+
</tr>
281+
<tr>
282+
<td>Lemonade</td>
283+
<td>$2</td>
284+
<td>18</td>
285+
</tr>
286+
<tr>
287+
<td>Bread</td>
288+
<td>$3</td>
289+
<td>2</td>
290+
</tr>
291+
</tbody>
292+
</table>
293+
</section>
294+
295+
<section>
296+
<h2>Clever Quotes</h2>
297+
<p>
298+
These guys come in two forms, inline: <q cite="http://searchservervirtualization.techtarget.com/definition/Our-Favorite-Technology-Quotations">
299+
&ldquo;The nice thing about standards is that there are so many to choose from&rdquo;</q> and block:
300+
</p>
301+
<blockquote cite="http://searchservervirtualization.techtarget.com/definition/Our-Favorite-Technology-Quotations">
302+
&ldquo;For years there has been a theory that millions of monkeys typing at random on millions of typewriters would
303+
reproduce the entire works of Shakespeare. The Internet has proven this theory to be untrue.&rdquo;
304+
</blockquote>
305+
</section>
306+
307+
<section>
308+
<h2>Intergalactic Interconnections</h2>
309+
<p>
310+
You can link between slides internally,
311+
<a href="#/2/3">like this</a>.
312+
</p>
313+
</section>
314+
315+
<section>
316+
<h2>Speaker View</h2>
317+
<p>There's a <a href="https://github.com/hakimel/reveal.js#speaker-notes">speaker view</a>. It includes a timer, preview of the upcoming slide as well as your speaker notes.</p>
318+
<p>Press the <em>S</em> key to try it out.</p>
319+
320+
<aside class="notes">
321+
Oh hey, these are some notes. They'll be hidden in your presentation, but you can see them if you open the speaker notes window (hit 's' on your keyboard).
322+
</aside>
323+
</section>
324+
325+
<section>
326+
<h2>Export to PDF</h2>
327+
<p>Presentations can be <a href="https://github.com/hakimel/reveal.js#pdf-export">exported to PDF</a>, here's an example:</p>
328+
<iframe src="//www.slideshare.net/slideshow/embed_code/42840540" width="445" height="355" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" style="border:3px solid #666; margin-bottom:5px; max-width: 100%;" allowfullscreen> </iframe>
329+
</section>
330+
331+
332+
<section style="text-align: left;">
333+
<h1>THE END</h1>
334+
335+
<h3>Have a look at this.</h3>
336+
<p>
337+
- <a href="http://assoc.cse.nitc.ac.in/">CSEA webpage</a> <br>
338+
- <a href="https://www.facebook.com/CSEA.NITC">CSEA facebook page</a> <br>
339+
- <a href="http://icfoss.in/">ICFOSS</a> <br>
340+
</p>
341+
<h3>Reference Book</h3>
342+
<p>
343+
- <a href="http://linuxcommand.org/tlcl.php">The Linux Command Line</a> <br>
344+
</p>
345+
</section>
346+
347+
</div>
348+
349+
</div>
350+
351+
<script src="lib/js/head.min.js"></script>
352+
<script src="js/reveal.js"></script>
353+
354+
<script>
355+
356+
// Full list of configuration options available at:
357+
// https://github.com/hakimel/reveal.js#configuration
358+
Reveal.initialize({
359+
controls: true,
360+
progress: true,
361+
history: true,
362+
center: true,
363+
364+
transition: 'slide', // none/fade/slide/convex/concave/zoom
365+
366+
// Optional reveal.js plugins
367+
dependencies: [
368+
{ src: 'lib/js/classList.js', condition: function() { return !document.body.classList; } },
369+
{ src: 'plugin/markdown/marked.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
370+
{ src: 'plugin/markdown/markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
371+
{ src: 'plugin/highlight/highlight.js', async: true, condition: function() { return !!document.querySelector( 'pre code' ); }, callback: function() { hljs.initHighlightingOnLoad(); } },
372+
{ src: 'plugin/zoom-js/zoom.js', async: true },
373+
{ src: 'plugin/notes/notes.js', async: true }
374+
]
375+
});
376+
377+
</script>
378+
379+
</body>
380+
</html>

0 commit comments

Comments
 (0)