Integrate playback state directive in tutorial videos; style adjustments.

This commit is contained in:
Paulo Reis 2017-02-09 15:44:38 +00:00
parent 1263532271
commit dd15cc06a0
2 changed files with 34 additions and 33 deletions

View file

@ -22,35 +22,38 @@
ng-click="gotoPrevStep();"
ng-disabled="onboarding.innerStep === 1;")
i.fa.fa-arrow-left
.feat-onboard-video-container(ng-switch="onboarding.innerStep")
div(ng-switch-when="1")
video.feat-onboard-video(
autoplay
loop
)
source(src="/img/onboarding/review-panel/open-review.mp4", type="video/mp4")
img(src="/img/onboarding/review-panel/open-review.gif")
div(ng-switch-when="2")
video.feat-onboard-video(
autoplay
loop
)
source(src="/img/onboarding/review-panel/commenting.mp4", type="video/mp4")
img(src="/img/onboarding/review-panel/commenting.gif")
div(ng-switch-when="3")
video.feat-onboard-video(
autoplay
loop
)
source(src="/img/onboarding/review-panel/add-changes.mp4", type="video/mp4")
img(src="/img/onboarding/review-panel/add-changes.gif")
div(ng-switch-when="4")
video.feat-onboard-video(
autoplay
loop
)
source(src="/img/onboarding/review-panel/accept-changes.mp4", type="video/mp4")
img(src="/img/onboarding/review-panel/accept-changes.gif")
div(ng-show="onboarding.innerStep === 1;")
video.feat-onboard-video(
video-play-state="onboarding.innerStep === 1;"
autoplay
loop
)
source(src="/img/onboarding/review-panel/open-review.mp4", type="video/mp4")
img(src="/img/onboarding/review-panel/open-review.gif")
div(ng-show="onboarding.innerStep === 2;")
video.feat-onboard-video(
video-play-state="onboarding.innerStep === 2;"
autoplay
loop
)
source(src="/img/onboarding/review-panel/commenting.mp4", type="video/mp4")
img(src="/img/onboarding/review-panel/commenting.gif")
div(ng-show="onboarding.innerStep === 3;")
video.feat-onboard-video(
video-play-state="onboarding.innerStep === 3;"
autoplay
loop
)
source(src="/img/onboarding/review-panel/add-changes.mp4", type="video/mp4")
img(src="/img/onboarding/review-panel/add-changes.gif")
div(ng-show="onboarding.innerStep === 4;")
video.feat-onboard-video(
video-play-state="onboarding.innerStep === 4;"
autoplay
loop
)
source(src="/img/onboarding/review-panel/accept-changes.mp4", type="video/mp4")
img(src="/img/onboarding/review-panel/accept-changes.gif")
button.btn.btn-primary.feat-onboard-nav-btn(
ng-click="gotoNextStep();"
ng-disabled="onboarding.innerStep === onboarding.nSteps;")

View file

@ -66,11 +66,9 @@
align-items: center;
padding: 30px 0;
}
.feat-onboard-video-container {
width: 618px;
margin: 0 30px;
}
.feat-onboard-video {
width: 616px;
margin: 0 30px;
box-shadow: 0 0 70px 0 rgba(255, 255, 255, 0.3);
}