GIF
- The "GIF" component allows you to easily add a GIF, like those provided by Giphy, in almost any slide of - your presentation. + The "GIF" component allows you to easily add a GIF, like those provided by{' '} + + Giphy + + , in almost any slide of your presentation.
Table of contents
-
diff --git a/docs/src/app/pages/docs/deck/app-deck-pager/app-deck-pager.tsx b/docs/src/app/pages/docs/deck/app-deck-pager/app-deck-pager.tsx
index cc2ba10dd..fb63331ba 100644
--- a/docs/src/app/pages/docs/deck/app-deck-pager/app-deck-pager.tsx
+++ b/docs/src/app/pages/docs/deck/app-deck-pager/app-deck-pager.tsx
@@ -56,8 +56,12 @@ export class AppDeckPager {
This component could be added to your web application using the following methods.
Using from a CDN
- It's recommended to use unpkg to use the DeckDeckGo pager from a CDN. To - do so, add the following include script in the main HTML file of your project: + It's recommended to use{' '} + + unpkg + {' '} + to use the DeckDeckGo pager from a CDN. To do so, add the following include script in the main HTML file of + your project:
@@ -69,16 +73,38 @@ export class AppDeckPager {
Install from NPM
- Install it in your project from npm using the following command: + Install it in your project from{' '} + + npm + {' '} + using the following command:
npm install @deckdeckgo/pager
Framework integration
- The Stencil documentation provide examples of framework integration for{' '} - Angular, React,{' '} - Vue and Ember. + The{' '} + + Stencil documentation + {' '} + provide examples of framework integration for{' '} + + Angular + + ,{' '} + + React + + ,{' '} + + Vue + {' '} + and{' '} + + Ember + + .
That being said, commonly, you might either import or load it:
diff --git a/docs/src/app/pages/docs/edit/app-edit-fonts/app-edit-fonts.tsx b/docs/src/app/pages/docs/edit/app-edit-fonts/app-edit-fonts.tsx
index ea5668dbc..a01d3a15a 100644
--- a/docs/src/app/pages/docs/edit/app-edit-fonts/app-edit-fonts.tsx
+++ b/docs/src/app/pages/docs/edit/app-edit-fonts/app-edit-fonts.tsx
@@ -13,8 +13,11 @@ export class AppEditFonts {
Fonts
As any web application, the fonts of your presentation could be easily styled, but DeckDeckGo goes one step - further by downloading and installing automatically any Google Fonts you would like to use - during the setup process (if you are using the starter kit). + further by downloading and installing automatically any{' '} + + Google Fonts + {' '} + you would like to use during the setup process (if you are using the starter kit).
Using automatically any Google Fonts
diff --git a/docs/src/app/pages/docs/edit/app-edit-markdown/app-edit-markdown.tsx b/docs/src/app/pages/docs/edit/app-edit-markdown/app-edit-markdown.tsx index 850b59112..d89752c17 100644 --- a/docs/src/app/pages/docs/edit/app-edit-markdown/app-edit-markdown.tsx +++ b/docs/src/app/pages/docs/edit/app-edit-markdown/app-edit-markdown.tsx @@ -54,7 +54,10 @@ export class AppEditMarkdown {
Introduction
- When you edit your deck with Markdown, the DeckDeckGo Webpack Markdown Plugin{' '}
+ When you edit your deck with Markdown, the{' '}
+
+ DeckDeckGo Webpack Markdown Plugin
+ {' '}
will convert, at bundle time, your code to HTML and will inject the results in the index.html file. Doing so, your{' '}
DeckDeckGo presentation will remain SEO friendly even without server side rendering.
Theme
To create the theme for your deck when you are using the DeckDeckGo starter kit, use the{' '} - Ionic Color Generator to pick the colors of your choice. + + Ionic Color Generator + {' '} + to pick the colors of your choice.
Once done, copy the generated CSS variables and paste them into the src/css/variables.css file of your
diff --git a/docs/src/app/pages/docs/slides/app-slide-aspect-ratio/app-slide-aspect-ratio.tsx b/docs/src/app/pages/docs/slides/app-slide-aspect-ratio/app-slide-aspect-ratio.tsx
index 77d7620ce..b4216e2de 100644
--- a/docs/src/app/pages/docs/slides/app-slide-aspect-ratio/app-slide-aspect-ratio.tsx
+++ b/docs/src/app/pages/docs/slides/app-slide-aspect-ratio/app-slide-aspect-ratio.tsx
@@ -88,8 +88,11 @@ export class AppSlideAspectRatio {
From a CDN
- It's recommended to use unpkg if you want to use this template from a CDN. To do so, add the following include - script in the main HTML file of your project: + It's recommended to use{' '} + + unpkg + {' '} + if you want to use this template from a CDN. To do so, add the following include script in the main HTML file of your project:
@@ -101,17 +104,38 @@ export class AppSlideAspectRatio {
From NPM
- To install this template in your project from npm run the following - command: + To install this template in your project from{' '} + + npm + {' '} + run the following command:
npm install @deckdeckgo/slide-aspect-ratio
Framework integration
- The Stencil documentation provide examples of framework integration for{' '} - Angular, React,{' '} - Vue and Ember. + The{' '} + + Stencil documentation + {' '} + provide examples of framework integration for{' '} + + Angular + + ,{' '} + + React + + ,{' '} + + Vue + {' '} + and{' '} + + Ember + + .
That being said, commonly, you might either import or load it:
diff --git a/docs/src/app/pages/docs/slides/app-slide-author/app-slide-author.tsx b/docs/src/app/pages/docs/slides/app-slide-author/app-slide-author.tsx
index c7b84aa02..dee797b8b 100644
--- a/docs/src/app/pages/docs/slides/app-slide-author/app-slide-author.tsx
+++ b/docs/src/app/pages/docs/slides/app-slide-author/app-slide-author.tsx
@@ -103,8 +103,11 @@ export class AppSlideAuthor {
From a CDN
- It's recommended to use unpkg if you want to use this template from a CDN. To do so, add the following include - script in the main HTML file of your project: + It's recommended to use{' '} + + unpkg + {' '} + if you want to use this template from a CDN. To do so, add the following include script in the main HTML file of your project:
@@ -116,16 +119,38 @@ export class AppSlideAuthor {
From NPM
- To install this template in your project from npm run the following command: + To install this template in your project from{' '} + + npm + {' '} + run the following command:
npm install @deckdeckgo/slide-author
Framework integration
- The Stencil documentation provide examples of framework integration for{' '} - Angular, React,{' '} - Vue and Ember. + The{' '} + + Stencil documentation + {' '} + provide examples of framework integration for{' '} + + Angular + + ,{' '} + + React + + ,{' '} + + Vue + {' '} + and{' '} + + Ember + + .
That being said, commonly, you might either import or load it:
@@ -182,7 +207,10 @@ export class AppSlideAuthor {
Social components
The details of the component <deckgo-social/> is described in the components{' '}
- documentation.
+
+ documentation
+
+ .
Attributes
This component offers the following options which could be set using attributes:
diff --git a/docs/src/app/pages/docs/slides/app-slide-playground/app-slide-playground.tsx b/docs/src/app/pages/docs/slides/app-slide-playground/app-slide-playground.tsx index 451fab4d6..d36204c6c 100644 --- a/docs/src/app/pages/docs/slides/app-slide-playground/app-slide-playground.tsx +++ b/docs/src/app/pages/docs/slides/app-slide-playground/app-slide-playground.tsx @@ -28,8 +28,19 @@ export class AppSlidePlayground {Slide: Playground
- The "Playground" template helps embed easily playgrounds as Codepen,{' '} - JSFiddle and WebComponents.dev in your presentation. + The "Playground" template helps embed easily playgrounds as{' '} + + Codepen + + ,{' '} + + JSFiddle + {' '} + and{' '} + + WebComponents.dev + {' '} + in your presentation.
Table of contents
-
@@ -104,8 +115,11 @@ export class AppSlidePlayground {
From a CDN
- It's recommended to use unpkg if you want to use this template from a CDN. To do so, add the following include - script in the main HTML file of your project: + It's recommended to use{' '} + + unpkg + {' '} + if you want to use this template from a CDN. To do so, add the following include script in the main HTML file of your project:
@@ -117,17 +131,38 @@ export class AppSlidePlayground {
From NPM
- To install this template in your project from npm run the following - command: + To install this template in your project from{' '} + + npm + {' '} + run the following command:
npm install @deckdeckgo/slide-playground
Framework integration
- The Stencil documentation provide examples of framework integration for{' '} - Angular, React,{' '} - Vue and Ember. + The{' '} + + Stencil documentation + {' '} + provide examples of framework integration for{' '} + + Angular + + ,{' '} + + React + + ,{' '} + + Vue + {' '} + and{' '} + + Ember + + .
That being said, commonly, you might either import or load it:
diff --git a/webcomponents/inline-editor/src/index.html b/webcomponents/inline-editor/src/index.html
index 06a2a63ed..ed87f9e7a 100644
--- a/webcomponents/inline-editor/src/index.html
+++ b/webcomponents/inline-editor/src/index.html
@@ -8,7 +8,7 @@
-
Bet on the Web
Environment variables with StencilJS
@@ -29,13 +29,13 @@Credits
The following solution was inspired by the one developed in the Ionic core project. One of the entry point for me was discovering the method setupConfig - in their source code. Therefore kudos to the awesome Ionic team ❤️ + in their source code. Therefore kudos to the awesome Ionic team ❤️
-![]()
![]()