Restyle the welcome modal a little

This commit is contained in:
James Brooks
2015-02-17 08:48:18 +00:00
parent 7fffe6eddf
commit a7027d607a
3 changed files with 65 additions and 56 deletions

View File

@@ -1,55 +1,64 @@
#welcome-modal .modal-dialog {
margin-top: 65px;
}
#welcome-modal {
.modal-dialog {
margin-top: 65px;
}
#welcome-modal .modal-content .modal-header {
border-bottom: 0;
}
.modal-content {
.modal-header {
border-bottom: 0;
}
#welcome-modal .modal-content .modal-body {
padding-bottom: 50px;
}
.modal-body {
padding-bottom: 50px;
#welcome-modal .modal-content .modal-body header {
text-align: center;
font-weight: 600;
font-size: 22px;
color: #444;
margin-bottom: 23px;
}
header {
text-align: center;
font-weight: 600;
font-size: 22px;
color: #444;
margin-bottom: 23px;
}
#welcome-modal .modal-content .modal-body p {
font-size: 13px;
color: #555;
margin: 0 auto;
width: 80%;
text-align: center;
line-height: 20px;
}
p {
font-size: 13px;
color: #555;
margin: 0 auto;
width: 80%;
text-align: center;
line-height: 20px;
}
#welcome-modal .modal-content .modal-body .get-started {
margin-top: 40px;
}
.go-dashboard {
text-align: center;
display: block;
margin-top: 10px;
}
#welcome-modal .modal-content .modal-body .get-started .col-md-4 {
text-align: center;
padding-bottom: 50px;
}
.get-started {
margin-top: 40px;
#welcome-modal .modal-content .modal-body .get-started .col-md-4 i {
font-size: 38px;
color: $cachet-gray-darker;
}
.col-md-4 {
text-align: center;
padding-bottom: 50px;
a {
i {
font-size: 38px;
color: $cachet-secondary;
display: block;
}
#welcome-modal .modal-content .modal-body .get-started .col-md-4 a {
color: $cachet-gray-darker;
display: block;
margin-top: 12px;
font-size: 13px;
}
color: $cachet-gray-darker;
display: block;
margin-top: 12px;
font-size: 13px;
#welcome-modal .modal-content .modal-body .go-dashboard {
text-align: center;
display: block;
margin-top: 10px;
&:hover {
text-decoration: none;
color: $cachet-gray;
}
}
}
}
}
}
}

View File

@@ -143,10 +143,10 @@ return [
'steps' => [
'component' => 'Create components',
'incident' => 'Create incidents',
'customize' => 'Customize your Cachet Status Page.',
'team' => 'Add users to your team.',
'api' => 'Generate API token.',
'two-factor' => 'Enable Two Factor Authetication.',
'customize' => 'Customize',
'team' => 'Add users',
'api' => 'Generate API token',
'two-factor' => 'Two Factor Authetication',
],
],

View File

@@ -17,47 +17,47 @@
<div class="get-started">
<div class="row">
<div class="col-md-4 animated fadeInDown">
<i class="icon ion-outlet"></i>
<a href="{{ route('dashboard.components.add') }}">
<i class="icon ion-outlet"></i>
{{ trans('dashboard.welcome.steps.component') }}
</a>
</div>
<div class="col-md-4 animated fadeInDown two">
<i class="icon ion-android-alert"></i>
<a href="{{ route('dashboard.incidents.add') }}">
<i class="icon ion-android-alert"></i>
{{ trans('dashboard.welcome.steps.incident') }}
</a>
</div>
<div class="col-md-4 animated fadeInDown three">
<i class="icon ion-ios-paper-outline"></i>
<a href="{{ route('dashboard.settings.theme') }}">
<i class="icon ion-ios-paper-outline"></i>
{{ trans('dashboard.welcome.steps.customize') }}
</a>
</div>
</div>
<div class="row">
<div class="col-md-4 animated fadeInDown">
<i class="icons ion-ios-people"></i>
<a href="{{ route('dashboard.team.add') }}">
<i class="icons ion-ios-people"></i>
{{ trans('dashboard.welcome.steps.team') }}
</a>
</div>
<div class="col-md-4 animated fadeInDown two">
<i class="icon ion-code-working"></i>
<a href="{{ route('dashboard.user') }}">
<i class="icon ion-code-working"></i>
{{ trans('dashboard.welcome.steps.api') }}
</a>
</div>
<div class="col-md-4 animated fadeInDown three">
<i class="icon ion-unlocked"></i>
<a href="{{ route('dashboard.user') }}">
<i class="icon ion-unlocked"></i>
{{ trans('dashboard.welcome.steps.two-factor') }}
</a>
</div>
</div>
</div>
<a href="#" data-dismiss="modal" class="go-dashboard">
<a href="#" data-dismiss="modal" class="btn btn-success go-dashboard">
{{ trans('dashboard.welcome.close') }}
<i class="fa fa-angle-double-right"></i>
</a>