Skip to content
This repository has been archived by the owner on Feb 6, 2024. It is now read-only.

Add basic vertical split functionality #406

Merged

Conversation

timrodz
Copy link
Contributor

@timrodz timrodz commented Oct 13, 2019

Summary:

  • Add Prop() vertical to DeckdeckgoSlideSplit
  • Append attribute -vertical to slide classes deckgo-slide and deckgo-slide-split
  • Add and extend deckgo-slide-vertical and deckgo-slide-split-vertical styles:
    • deckgo-slide-vertical
      • flex-flow is column wrap
      • height is slide height - bottom paddings * 2: calc(var(--slide-height) - (2 * var(--slide-split-padding-bottom, var(--slide-padding-bottom-default))))
    • deckgo-slide-split-vertical
      • width is slide width - end & start paddings: calc(var(--slide-width) - (var(--slide-split-padding-end, var(--slide-padding-end-default))) - (var(--slide-split-padding-start, var(--slide-padding-start-default))));

Closes #372 🚀

Summary:

- Add Prop() `vertical` to DeckdeckgoSlideSplit
- Append attribute `-vertical` to slide classes `deckgo-slide` and `deckgo-slide-split`
- Add and extend `deckgo-slide-vertical` and `deckgo-slide-split-vertical` styles:
  - `deckgo-slide-vertical`
    - flex-flow is `column wrap`
    - height is slide height - bottom paddings * 2: `calc(var(--slide-height) - (2 * var(--slide-split-padding-bottom, var(--slide-padding-bottom-default))))`
  - `deckgo-slide-split-vertical`
    - width is slide width - end & start paddings: `calc(var(--slide-width) - (var(--slide-split-padding-end, var(--slide-padding-end-default))) - (var(--slide-split-padding-start, var(--slide-padding-start-default))));`
@peterpeterparker
Copy link
Contributor

@timrodz thx for the PR 👍

I tested it in the demo and the vertical slide I tried didn't received the correct height size.

Therefore I suggest the following improvements:

  1. Remove
div.deckgo-slide-vertical {
    height: calc(var(--slide-height) - (2 * var(--slide-split-padding-bottom, var(--slide-padding-bottom-default))));

in order to not override the default div.deckgo-slide property respectively

height: var(--slide-height);
  1. div.deckgo-slide-split-vertical should override the height calculation respectively add the following property:
height: calc((var(--slide-height) / 2) - (var(--slide-split-padding-bottom, var(--slide-padding-bottom-default))) - (var(--slide-split-padding-top, var(--slide-padding-top-default))));

If you are agree, could you plz update your PR with these?

Thx 🙏

Screenshots before these changes:

Capture d’écran 2019-10-13 à 09 59 19

Capture d’écran 2019-10-13 à 09 59 32

Screenshot after changes:

Capture d’écran 2019-10-13 à 10 17 57

@timrodz
Copy link
Contributor Author

timrodz commented Oct 13, 2019

@peterpeterparker Thanks for the suggestions, will action these!

1. Remove height override in `div.deckgo-slide-vertical`
2. Add height override to `div.deckgo-slide-split-vertical`
@peterpeterparker peterpeterparker added enhancement New feature or request templates Issue or feature regarding the templates hacktoberfest-accepted Good for Hacktoberfest labels Oct 13, 2019
@peterpeterparker peterpeterparker merged commit bef83a1 into deckgo:master Oct 13, 2019
@peterpeterparker
Copy link
Contributor

Perfect and awesome @timrodz 👍

@timrodz
Copy link
Contributor Author

timrodz commented Oct 13, 2019

Thanks for the great guidance, @peterpeterparker! This project is great.

@timrodz timrodz deleted the feature/split-template-top-bottom branch October 13, 2019 10:50
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
enhancement New feature or request hacktoberfest-accepted Good for Hacktoberfest templates Issue or feature regarding the templates
Projects
None yet
Development

Successfully merging this pull request may close these issues.

split template: add top/bottom orientation
2 participants