https://github.com/coderberry/ember-meetup-slides

Template for creating slides for the Ember Meetup
https://github.com/coderberry/ember-meetup-slides

Last synced: 12 days ago
JSON representation

Template for creating slides for the Ember Meetup

• Host: GitHub
• URL: https://github.com/coderberry/ember-meetup-slides
• Owner: coderberry
• Created: 2014-01-16T15:35:58.000Z (about 11 years ago)
• Default Branch: master
• Last Pushed: 2014-01-22T20:34:27.000Z (almost 11 years ago)
• Last Synced: 2025-01-02T16:19:30.969Z (20 days ago)
• Language: JavaScript
• Size: 587 KB
• Stars: 2
• Watchers: 2
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# EmberJS Meetup Slides

## Configuring the slides

Much of the deck is customized by changing the settings in [`slide_config.js`](slide_config.js).

Some of the customizations include the title, Analytics tracking ID, speaker

information (name, social urls, blog), web fonts to load, themes, and other

general behavior.

### Customizing the `#emberjs` hash

The bottom of the slides include `#emberjs` by default. If you'd like to change

this, please update the variable `$social-tags: '#emberjs';` in

[`/theme/scss/default.scss`](theme/scss/default.scss).

See the next section on "Editing CSS" before you go editing things.

## Editing CSS

[Compass](http://compass-style.org/install/) is a CSS preprocessor used to compile

SCSS/SASS into CSS. We chose SCSS for the new slide deck for maintainability,

easier browser compatibility, and because...it's the future!

That said, if not comfortable working with SCSS or don't want to learn something

new, not a problem. The generated .css files can already be found in

(see [`/theme/css`](theme/css)). You can just edit those and bypass SCSS altogether.

However, our recommendation is to use Compass. It's super easy to install and use.

### Installing Compass and making changes

First, install compass:

    sudo gem update --system

    sudo gem install compass

Next, you'll want to watch for changes to the exiting .scss files in [`/theme/scss`](theme/scss)

and any new one you add:

    $ cd ember-meetup-slides

    $ compass watch

This command automatically recompiles the .scss file when you make a change.

Its corresponding .css file is output to [`/theme/css`](theme/css). Slick.

By default, [`config.rb`](config.rb) in the main project folder outputs minified

.css. It's a best practice after all! However, if you want unminified files,

run watch with the style output flag:

    compass watch -s expanded

*Note:* You should not need to edit [`_base.scss`](theme/scss/_base.scss).

## Building the slides

The slides are all in a single markdown file [`slides.md`](scripts/md/slides). To build the slides, you need to run the monitor script:

    $ ./monitor.sh

## Running the slides

The slides can be run locally from `file://` making development easy :)

### Running from a web server

If at some point you should need a web server, use [`serve.sh`](serve.sh). It will

launch a simple one and point your default browser to [`http://localhost:8000/template.html`](http://localhost:8000/template.html):

    $ cd ember-meetup-slides

    $ ./serve.sh

You can also specify a custom port:

    $ ./serve.sh 8080

### Presenter mode

The slides contain a presenter mode feature (beta) to view + control the slides

from a popup window.

To enable presenter mode, add `presentme=true` to the URL: [http://localhost:8000/template.html?presentme=true](http://localhost:8000/template.html?presentme=true)

To disable presenter mode, hit [http://localhost:8000/template.html?presentme=false](http://localhost:8000/template.html?presentme=false)

Presenter mode is sticky, so refreshing the page will persist your settings.

---

That's all she wrote!