schacon / showoff

moved to puppetlabs/showoff!
2.41k stars 13 forks source link

adding 'fixed-top' slide attribute #127

Closed justone closed 13 years ago

justone commented 13 years ago

This adds a fixed-top attribute which prevents a given slide from being vertically centered. It's useful for progressively revealing content.

Without: http://drop.endot.org/without_fixed-top.gif With: http://drop.endot.org/with_fixed-top.gif

dissolved commented 13 years ago

Thanks Nate! This is just what I needed. Hope the pull request is accepted!

grundprinzip commented 13 years ago

Can you paste an example of your code for the slide, if I try to reproduce your problem, everything works fine. It looks like another commit closed your problem.

justone commented 13 years ago

Here's the code for the first three slides (for brevity):

!SLIDE 
# get\_var #

    @@@ puppet
    $variable = get_var("module", "key")

!SLIDE 
# get\_var #

    @@@ puppet
    $variable = get_var("module", "key")

    module/var/main.yml in production

!SLIDE 
# get\_var #

    @@@ puppet
    $variable = get_var("module", "key")

    module/var/main.yml in production
    module/var_dev/main.yml in development

The above code jumps on each slide. If you add 'fixed-top' to the slide definition, it looks better. I suppose I could use the 'bullets' slide type, but that centers the lines.

grundprinzip commented 13 years ago

Got your point, but it looks like what you actually want is an incremental code revealing, which seems to be impossible without rewriting the whole pre section.

But anyhow, i like the fixed-top approach because sometimes center just does not do it. However, one could argue that this content class can be easily applied using the following css in your custom stylesheet.

    .fixed-top {
        margin-top: 0px !important;
    }

and then you can simply

!SLIDE fixed-top
# get\_var #

    @@@ puppet
    $variable = get_var("module", "key")

    module/var/main.yml in production
    module/var_dev/main.yml in development

which seems to be more effective, than modifying the JS source.

justone commented 13 years ago

Yeah, incremental code revealing is what I really want. I've toyed with making that modification, but this hack has placated me so far.

I didn't realize that the attributes after !SLIDE show up as classes in the rendered slides. Your CSS-only solution works great and I'll use that from now on.

Thanks.