github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2025-02-23 15:10:58 +00:00
Code Issues Projects Releases Packages Wiki Activity

Navigation in onboarding UI.

Browse source
This commit is contained in:
Paulo Reis 2016-10-20 16:39:43 +01:00
parent e60f67dacb
commit ac07ba035b
5 changed files with 81 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
services/web/app/views/project/editor.jade
View file

@ -15,7 +15,8 @@ block content
p.text-center.text-danger(ng-if="state.error").ng-cloak
span(ng-bind-html="state.error")
include ./editor/feature-onboarding
.global-alerts(ng-cloak)
.alert.alert-danger.small(ng-if="connection.forced_disconnect")
strong #{translate("disconnected")}
@ -72,7 +73,6 @@ block content
include ./editor/chat
include ./editor/hotkeys
include ./editor/feature-onboarding
script(type="text/ng-template", id="genericMessageModalTemplate")
.modal-header

36
services/web/app/views/project/editor/feature-onboarding.jade
View file

@ -1,8 +1,34 @@
.feat-onboard
.feat-onboard(
ng-controller="FeatureOnboardingController"
ng-cloak
)
.feat-onboard-wrapper
h1.feat-onboard-title
| Introducing
| Introducing 
span.feat-onboard-title-name Code check
p.feat-onboard-description
span.feat-onboard-description-name Code check
| will highlight potential problems in your LaTeX code, allowing you to handle errors earlier and become more productive.
div(ng-if="step === 1;")
p.feat-onboard-description
span.feat-onboard-description-name Code check 
| will highlight potential problems in your LaTeX code, allowing you to handle errors earlier and become more productive.
.row.feat-onboard-adv-wrapper
.col-xs-4
h2.feat-onboard-adv-title
| Missing 
span.feat-onboard-adv-title-highlight brackets
p Lorem ipsum feature description stuff.
.col-xs-4
h2.feat-onboard-adv-title
| Missing 
span.feat-onboard-adv-title-highlight brackets
p Lorem ipsum feature description stuff.
.col-xs-4
h2.feat-onboard-adv-title
| Missing 
span.feat-onboard-adv-title-highlight brackets
p Lorem ipsum feature description stuff.
div
.btn.btn-primary(ng-click="turnCodeCheckOn();") Yes, turn Code check on
div
.btn.btn-default(ng-click="turnCodeCheckOn();") No, disable it for now
div(ng-if="step === 2;")
p Step 2, TODO.

1
services/web/public/coffee/ide.coffee
View file

@ -10,6 +10,7 @@ define [
"ide/binary-files/BinaryFilesManager"
"ide/references/ReferencesManager"
"ide/SafariScrollPatcher"
"ide/FeatureOnboardingController"
"ide/settings/index"
"ide/share/index"
"ide/chat/index"

15
services/web/public/coffee/ide/FeatureOnboardingController.coffee Normal file
View file

@ -0,0 +1,15 @@
define [
"base"
], (App) ->
App.controller "FeatureOnboardingController", ($scope, $modal, event_tracking) ->
$scope.step = 1;
$scope.turnCodeCheckOn = () ->
goToStep2()
$scope.turnCodeCheckOn = () ->
goToStep2()
goToStep2 = () ->
$scope.step = 2
$scope.ui.leftMenuShown = true

34
services/web/public/stylesheets/app/editor/feature-onboarding.less
View file

@ -4,5 +4,35 @@
right: 0;
bottom: 0;
left: 0;
background-color: rgba(0, 0, 0, .8);
}
background-color: rgba(0, 0, 0, .85);
color: #FFF;
text-align: center;
z-index: 100;
}
.feat-onboard-wrapper {
width: 600px;
margin: 130px auto 0;
}
.feat-onboard-title {
color: @brand-primary;
}
.feat-onboard-title-name {
color: #FFF;
font-weight: bold;
}
.feat-onboard-description {
}
.feat-onboard-description-name {
font-weight: bold;
}
.feat-onboard-adv-wrapper {
text-align: left;
}
.feat-onboard-adv-title {
color: #FFF;
}
.feat-onboard-adv-title-highlight {
font-weight: bold;
}