Commit95ead80

committed

hover png -> gif in docs

1 parent61b6146 commit95ead80Copy full SHA for 95ead80

File tree

12 files changed

+36

-16

lines changed

12 files changed

+36

-16

lines changed

`‎_includes/docs/js.html`

Lines changed: 19 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -82,3 +82,22 @@`
`82`	`82`	`}(jQuery);`
`83`	`83`	`});`
`84`	`84`	`</script>`
	`85`	`+`
	`86`	`+<script>`
	`87`	`+$(function(){`
	`88`	`+$('.gif').hover(function(){`
	`89`	`+// on mouse enter`
	`90`	`+console.log($(this));`
	`91`	`+varpath=$(this).attr('src');`
	`92`	`+console.log('path',path);`
	`93`	`+vargif=path.substring(0,path.lastIndexOf('.'))+'.gif';`
	`94`	`+console.log('gif',gif);`
	`95`	`+$(this).attr('src',gif);`
	`96`	`+},function(){`
	`97`	`+// on mouse leave`
	`98`	`+varpath=$(this).attr('src');`
	`99`	`+varpng=path.substring(0,path.lastIndexOf('.'))+'.png';`
	`100`	`+$(this).attr('src',png);`
	`101`	`+});`
	`102`	`+});`
	`103`	`+</script>`

`‎_includes/docs/nav.html`

Lines changed: 1 addition & 1 deletion

Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-<linkrel="stylesheet"type="text/css"href="/css/docs.min.css"/>`
	`1`	`+<linkrel="stylesheet"type="text/css"href="/css/docs.css"/>`
`2`	`2`	`<linkrel="stylesheet"type="text/css"href="/css/dark-syntax.css"/>`
`3`	`3`
`4`	`4`	`<!-- Navigation -->`

`‎_posts/2016-01-01-installation.md`

Lines changed: 11 additions & 7 deletions

Original file line number	Diff line number	Diff line change
`@@ -11,24 +11,28 @@ But to build a tutorial, you'll also need the CodeRoad-CLI.`
`11`	`11`
`12`	`12`	`###Atom CodeRoad`
`13`	`13`
`14`		`-Use[Atom CodeRoad](https://github.com/coderoad/atom-coderoad) to view and play your tutorial`
	`14`	`+Use[Atom CodeRoad](https://github.com/coderoad/atom-coderoad) to view and play your tutorial.`
`15`	`15`
`16`		`-* Downloadthe[Atom](https://atom.io/) editor`
	`16`	`+You'll need to downloadthe[Atom](https://atom.io/) editor and installAtom Shell Commands.`
`17`	`17`
`18`		`-Install theAtom-CodeRoad* package, or use the[apm](https://github.com/atom/apm) command-line tool`
	`18`	+Install theAtom-CodeRoad package:`> apm installatom-coderoad`
`19`	`19`
`20`		-`> apm install atom-coderoad`
	`20`	`+For an example of how to do this,hover over the image below:`
`21`	`21`
`22`		`-You may also want to install[terminal-plus](https://atom.io/packages/terminal-plus).`
	`22`	`+![Install atom-coderoad](/img/gif/install-atom-coderoad.png){: .gif}`
`23`	`23`
`24`		`-* Toggle openAtom-CodeRoad inAtom using the "packages" menu or pressctrl-alt-0.`
	`24`	`+You may also want to install[terminal-plus](https://atom.io/packages/terminal-plus) used in the example above.`
	`25`	`+`
	`26`	`+Toggle openAtom-CodeRoad using thePackages menu or pressctrl-alt-0.`
`25`	`27`
`26`	`28`
`27`	`29`
`28`	`30`	`###Tutorial`
`29`	`31`
`30`	`32`	`To install a tutorial, setup apackage.json file and save the tutorial as a dependency. Make sure[NodeJS](nodejs.org) is already installed.`
`31`	`33`
	`34`	`+![Install a Tutorial](/img/gif/install-tutorial.png){: .gif}`
	`35`	`+`
`32`	`36`	You can setup a project quickly by typing`npm init --y` into the command line in your project's folder. This agrees to all of the defaults for your newly createdpackage.json file.
`33`	`37`
`34`	`38`	Now you can install a tutorial. Run`npm install --save-dev $THE-PACKAGE-NAME$` to save the tutorial as a package development dependency. If you runAtom-CodeRoad you should see the tutorial appear on the first screen.
`@@ -47,6 +51,6 @@ Install CodeRoad-CLI. Make sure [NodeJS](nodejs.org) is already installed`
`47`	`51`
`48`	`52`	`It's recommended you also enableautosave in Atom.`
`49`	`53`
`50`		`-![Enable autosave in Atom](/img/gif/autosave.gif)`
	`54`	`+![Enable autosave in Atom](/img/gif/autosave.png){: .gif}`
`51`	`55`
`52`	`56`	`Tutorials run unit tests on save,autosave can speed up the process.`

`‎_posts/2016-01-02-development.md`

Lines changed: 0 additions & 2 deletions

Original file line number	Diff line number	Diff line change
`@@ -80,8 +80,6 @@ Inside of your demo root directory, connect the link.`
`80`	`80`
`81`	`81`	`OpenAtom-Coderoad to view your tutorial. Your package should appear as a loaded package. Click on it.`
`82`	`82`
`83`		`-![CodeRoad Loaded Packages](/img/docs/loaded-packages.png)`
`84`		`-`
`85`	`83`	`ReloadAtom to view changes. You can use the Atom[command-palette](https://atom.io/docs/latest/getting-started-atom-basics#command-palette) to find "reload" or simply use the reload hot-key.`
`86`	`84`
`87`	`85`	`* Windows & Linux: alt-ctrl-r`

`‎_posts/2016-01-07-test-snippets.md`

Lines changed: 1 addition & 1 deletion

Original file line number	Diff line number	Diff line change
`@@ -12,4 +12,4 @@ Test Runners may have pre-made [Atom snippets](https://atom.io/docs/latest/using`
`12`	`12`
`13`	`13`	For example, typing the snippet`mochacr-f` will generate an entire set of tests for amocha-coderoad function. See an example:
`14`	`14`
`15`		`-![Mocha Coderoad Test Snippets](/img/gif/snippets.gif)`
	`15`	`+![Mocha Coderoad Test Snippets](/img/gif/snippets.png){: .gif}`

`‎css/docs.css`

Lines changed: 4 additions & 5 deletions

Original file line number	Diff line number	Diff line change
`@@ -7,21 +7,17 @@`
`7`	`7`	`@viewport {`
`8`	`8`	`width: device-width`
`9`	`9`	`}`
`10`		`-`
`11`	`10`	`body {`
`12`	`11`	`width:100%;`
`13`	`12`	`height:100%;`
`14`	`13`	`position: relative;`
`15`	`14`	`}`
`16`		`-`
`17`	`15`	`.navbar {`
`18`	`16`	`margin-bottom:0;`
`19`	`17`	`}`
`20`		`-`
`21`	`18`	`#content:focus {`
`22`	`19`	`outline:0`
`23`	`20`	`}`
`24`		`-`
`25`	`21`	`.bs-docs-sidebar.affix {`
`26`	`22`	`position: static`
`27`	`23`	`}`
`@@ -125,7 +121,6 @@ body {`
`125`	`121`	`.bs-docs-section:last-child {`
`126`	`122`	`margin-bottom:0`
`127`	`123`	`}`
`128`		`-`
`129`	`124`	`#docscode {`
`130`	`125`	`padding:0;`
`131`	`126`	`}`
`@@ -138,3 +133,7 @@ body {`
`138`	`133`	`#docsulli {`
`139`	`134`	`list-style-type: circle;`
`140`	`135`	`}`
	`136`	`+.gif {`
	`137`	`+display: block;`
	`138`	`+margin:20px auto;`
	`139`	`+}`