moony/Storm
1
1
Fork 0
Code Issues Pull Requests Releases Wiki Activity

build welcome screen. (#14)

Browse Source 
* build welcome screen.

* move welcome images into their own folder.

* lint.
This commit is contained in:
Justin Licata 2017-08-04 10:25:36 -05:00 committed by GitHub
parent 79bf8faba7
commit 23edf8661f
16 changed files with 88 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
app/assets/images/bolt.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

12
app/assets/images/logo.svg
View File

@ -1,12 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="12px" height="18px" viewBox="0 0 12 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 45 (43475) - http://www.bohemiancoding.com/sketch -->
<title>logo</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="logo" transform="translate(-2.000000, -1.000000)" fill-rule="nonzero" fill="#F3BF51">
<polygon id="Path-2" transform="translate(7.938758, 10.076258) rotate(-21.000000) translate(-7.938758, -10.076258) " points="7.97707944 1.24621482 13.0527833 11.4260065 8.14629944 11.4260065 8.14629944 18.9063011 2.82473313 8.1685617 7.96123404 8.1685617"></polygon>
</g>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 836 B

BIN
app/assets/images/welcome/message-four.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 64 KiB

BIN
app/assets/images/welcome/message-one.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 71 KiB

BIN
app/assets/images/welcome/message-three.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 38 KiB

BIN
app/assets/images/welcome/message-two.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 77 KiB

1
app/assets/images/wordmark.svg Normal file
View File

@ -0,0 +1 @@
<svg width="384" height="150" viewBox="0 0 384 150" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><title>Group</title><defs><path id="a" d="M0 0h383.01v150H0z"/></defs><g fill="none" fill-rule="evenodd"><mask id="b" fill="#fff"><use xlink:href="#a"/></mask><use fill="#3370EE" xlink:href="#a"/><g mask="url(#b)" fill-rule="nonzero" fill="#FFF" fill-opacity=".25"><path d="M142.156-51.58l131.04 120.071-71.57 27.473 41.884 109.114L105.76 78.246l74.926-28.761z"/></g><path d="M119.81 71.664c0 3.76 2.369 6.177 7.154 7.275l3.93.904c3.37.757 4.664 1.88 4.664 3.98 0 2.538-2.295 4.174-5.909 4.174-3.418 0-5.761-1.416-6.372-3.857h-4.223c.464 4.54 4.443 7.348 10.449 7.348 6.274 0 10.351-3.174 10.351-8.056 0-3.833-2.343-6.08-7.495-7.251l-3.735-.855c-3.32-.732-4.687-1.88-4.687-3.906 0-2.417 2.172-3.98 5.542-3.98 3.1 0 5.322 1.416 5.81 3.736h4.004c-.488-4.42-4.224-7.178-9.741-7.178-5.835 0-9.741 3.076-9.741 7.666zm36.036-14.258v7.178h-7.056v3.54h7.056v14.99c0 5.518 3.051 8.008 9.619 8.008 1.27 0 4.492-.122 5.151-.244v-3.516c-.708.074-3.369.147-4.858.147-3.736 0-5.762-1.563-5.762-4.444V68.124h10.693v-3.54h-10.742v-7.178h-4.101zm35.425 34.082c-7.007 0-11.475-4.565-11.475-11.718v-4.004c0-7.154 4.468-11.72 11.475-11.72 7.006 0 11.474 4.566 11.474 11.72v4.004c0 7.153-4.468 11.718-11.474 11.718zm0-23.779c-4.542 0-7.374 3.223-7.374 8.423v3.247c0 5.225 2.832 8.423 7.374 8.423 4.54 0 7.373-3.198 7.373-8.423v-3.247c0-5.2-2.832-8.423-7.373-8.423zm29.81 3.564v-6.762h-9.889v3.32h5.884V87.68h-5.347V91h17.603v-3.32h-8.203v-8.545c0-6.739 3.467-10.791 9.326-10.791 1.44 0 3.15.293 4.37.732v-4.663c-.879-.366-2.32-.586-3.833-.586-5.102 0-8.398 2.54-9.375 7.446h-.537zm44.774.22c0-4.907-1.928-7.47-5.615-7.47-2.66 0-4.785 1.61-5.469 4.15h-.439c-.561-2.612-2.32-4.15-4.81-4.15-2.49 0-4.394 1.562-5.053 4.223h-.44v-3.735h-3.71V91h3.735V73.129c0-3.296 1.465-5.322 3.808-5.322 2.246 0 3.418 1.684 3.418 4.882V91h3.711V73.129c0-3.296 1.416-5.322 3.736-5.322 2.221 0 3.393 1.684 3.393 4.907V91h3.735V71.493z" fill="#FFF"/></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.0 KiB

1
app/assets/stylesheets/utils/_base.scss
View File

@ -1,3 +1,4 @@
//= require utils/_background
//= require utils/_border
//= require utils/_sizing
//= require utils/_typography

15
app/assets/stylesheets/utils/_sizing.scss Normal file
View File

@ -0,0 +1,15 @@
@import "base/base";
.mh-50 {
min-height: 50vh;
}
.mh-100 {
min-height: 100vh;
}
@media (min-width: 768px) {
.mh-md-100 {
min-height: 100vh;
}
}

1
app/assets/stylesheets/views/_base.scss
View File

@ -0,0 +1 @@
//= require views/_welcome

25
app/assets/stylesheets/views/_welcome.scss Normal file
View File

@ -0,0 +1,25 @@
@import "base/base";
.welcome {
.welcome-logo {
width: 125px;
}
.welcome-title {
color: $white;
font-size: 3rem;
font-weight: 300;
}
.welcome-subtitle {
color: darken($white, 20%);
font-size: 1.25rem;
line-height: 1.5;
}
.welcome-slack-message {
display: block;
margin-bottom: 15px;
width: 400px;
}
}

2
app/views/devise/invitations/edit.html.erb
View File

@ -1,7 +1,7 @@
<div class="container">
<div class="auth">
<%= link_to(root_path) do %>
<%= image_tag("logo.svg", class: "auth-logo mx-auto d-block mb-3") %>
<%= image_tag("bolt.png", class: "auth-logo mx-auto d-block mb-3") %>
<% end %>
<h3 class="auth-title text-center mb-3">

2
app/views/devise/passwords/new.html.erb
View File

@ -1,7 +1,7 @@
<div class="container">
<div class="auth">
<%= link_to(root_path) do %>
<%= image_tag("logo.svg", class: "auth-logo mx-auto d-block mb-3") %>
<%= image_tag("bolt.png", class: "auth-logo mx-auto d-block mb-3") %>
<% end %>
<h3 class="auth-title text-center mb-3">

2
app/views/devise/registrations/new.html.erb
View File

@ -1,7 +1,7 @@
<div class="container">
<div class="auth auth-wide">
<%= link_to(root_path) do %>
<%= image_tag("logo.svg", class: "auth-logo mx-auto d-block mb-3") %>
<%= image_tag("bolt.png", class: "auth-logo mx-auto d-block mb-3") %>
<% end %>
<h3 class="auth-title text-center mb-3">

2
app/views/devise/sessions/new.html.erb
View File

@ -1,7 +1,7 @@
<div class="container">
<div class="auth">
<%= link_to(root_path) do %>
<%= image_tag("logo.svg", class: "auth-logo mx-auto d-block mb-3") %>
<%= image_tag("bolt.png", class: "auth-logo mx-auto d-block mb-3") %>
<% end %>
<h3 class="auth-title text-center mb-3">

41
app/views/welcome/index.html.erb
View File

@ -1 +1,42 @@
<%= render("shared/flash") %>
<div class="container mh-100 welcome">
<div class="row mh-100">
<div class="col-md-6 mh-md-100 mh-50">
<div class="d-flex align-items-center justify-content-center mh-md-100 mh-50">
<div class="d-block text-center">
<%= image_tag("bolt.png", class: "welcome-logo mb-3") %>
<h1 class="welcome-title">Storm</h1>
<h4 class="welcome-subtitle mb-4">
Self-hosted, open-source <br /> website monitoring
</h4>
<div class="mb-3">
<%= link_to("Source code", "https://github.com/ProctorU/storm",
class: "btn btn-secondary") %>
<a href="https://heroku.com/deploy?template=https://github.com/ProctorU/storm"
class="btn btn-primary">
Deploy to Heroku
</a>
</div>
<div>
<%= link_to("Sign in", new_user_session_path,
class: "btn btn-outline-secondary btn-block") %>
</div>
</div>
</div>
</div>
<div class="col-md-6 d-flex align-items-center justify-content-center mh-md-100 mh-50">
<div>
<%= image_tag("welcome/message-one.png", class: "welcome-slack-message") %>
<%= image_tag("welcome/message-two.png", class: "welcome-slack-message") %>
<%= image_tag("welcome/message-three.png", class: "welcome-slack-message") %>
<%= image_tag("welcome/message-four.png", class: "welcome-slack-message") %>
</div>
</div>
</div>
</div>