Skip to content

Commit

Permalink
redesign of all pages that are rendered by backend code
Browse files Browse the repository at this point in the history
  • Loading branch information
kravets-levko committed Feb 15, 2018
1 parent d6cc748 commit f1aad25
Show file tree
Hide file tree
Showing 11 changed files with 281 additions and 200 deletions.
Binary file removed client/app/assets/images/google_login.png
Binary file not shown.
1 change: 1 addition & 0 deletions client/app/assets/images/google_logo.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
90 changes: 90 additions & 0 deletions client/app/assets/less/server.less
Original file line number Diff line number Diff line change
@@ -0,0 +1,90 @@
/** LESS Plugins **/
@import 'inc/less-plugins/for';

/** Load Main Bootstrap LESS files **/
@import '~bootstrap/less/bootstrap';
@import '~material-design-iconic-font/dist/css/material-design-iconic-font.css';

@import 'inc/variables';
@import 'inc/mixins';
@import 'inc/font';
@import 'inc/print';

@import 'inc/bootstrap-overrides';
@import 'inc/base';
@import 'inc/generics';
@import 'inc/form';
@import 'inc/button';
@import 'inc/404';
@import 'inc/ie-warning';
@import 'inc/flex';

@import 'redash/redash-newstyle';

@default-spacing: 26px;

html, body {
height: 100%;
margin: 0;
padding: 0;
background: #F6F8F9;
}

.m-t-default {
margin-top: @default-spacing !important;
}
.m-b-default {
margin-bottom: @default-spacing !important;
}
.m-l-default {
margin-left: @default-spacing !important;
}
.m-r-default {
margin-right: @default-spacing !important;
}

hr {
border-top-width: 2px;
margin: @default-spacing 0;
}

.tiled {
padding: @default-spacing;
}

.header {
margin-top: -100px;

img {
height: 40px;
}
}

.fixed-width-page {
width: 500px;
}

.login-button {
display: flex;
align-items: center;
justify-content: center;
margin: 20px 0;

&:first-of-type {
margin-top: 0;
}
&:last-of-type {
margin-bottom: 0;
}

img {
height: 25px;
margin-right: 5px;
}

&:before {
content: "";
display: inline-block;
height: 25px;
}
}
16 changes: 12 additions & 4 deletions redash/templates/error.html
Original file line number Diff line number Diff line change
@@ -1,8 +1,16 @@
{% extends "layouts/signed_out.html" %}

{% block title %}Error :-({% endblock %}

{% block content %}
<h2>Error :-(</h2>
<p class="lead">
{{ error_message }}
</p>
<div class="fixed-width-page">
<div class="bg-white tiled error-state m-t-0">
<div class="error-state__icon">
<i class="zmdi zmdi-alert-circle-o"></i>
</div>
<div class="error-state__details">
<h4>{{ error_message }}</h4>
</div>
</div>
</div>
{% endblock %}
34 changes: 17 additions & 17 deletions redash/templates/forgot.html
Original file line number Diff line number Diff line change
@@ -1,21 +1,21 @@
{% extends "layouts/signed_out.html" %}
{% block title %}Password Reset{% endblock %}
{% block content %}
{% if submitted %}
<h2>Password Reset</h2>
<hr>
<p class="lead">
If we found an account associated with that email address, you will find an email from us in your inbox shortly.
</p>
{% else %}
<h2>Password Reset</h2>
<hr>
<form role="form" method="post">
<div class="form-group ">
<label for="email">Enter the email address you used for this account:</label>
<input type="email" class="form-control" name="email" value="{{email}}">
</div>
<button type="submit" class="btn btn-primary">Reset my password</button>
</form>
{% endif %}
<div class="fixed-width-page">
<div class="bg-white tiled">
{% if submitted %}
<div>
If we found an account associated with that email address, you will find an email from us in your inbox shortly.
</div>
{% else %}
<form role="form" method="post">
<div class="form-group">
<label for="email">Enter the email address you used for this account:</label>
<input type="email" class="form-control" name="email" value="{{email}}">
</div>
<button type="submit" class="btn btn-primary btn-block m-t-default">Reset my password</button>
</form>
{% endif %}
</div>
</div>
{% endblock %}
57 changes: 30 additions & 27 deletions redash/templates/invite.html
Original file line number Diff line number Diff line change
@@ -1,36 +1,39 @@
{% extends "layouts/signed_out.html" %}

{% block title %}Welcome to Redash!{% endblock %}

{% block content %}
<div class="fixed-width-page">
<div class="bg-white tiled">
<div class="m-b-default">
{% if google_auth_url %}
To create your account, please choose a password or login with your Google account ({{ user.email }}).
{% else %}
To create your account, please choose a password.
{% endif %}
</div>
{% with messages = get_flashed_messages() %}
{% if messages %}
{% for message in messages %}
<div class="alert alert-danger" role="alert">{{ message }}</div>
{% endfor %}
{% endif %}
{% endwith %}

<h2>Welcome to Redash!</h2>
<p class="lead">
{% if google_auth_url %}
To create your account, please choose a password or login with your Google account ({{ user.email }}).
{% else %}
To create your account, please choose a password.
<a href="{{ google_auth_url }}" class="login-button btn btn-default btn-block">
<img src="/static/images/google_logo.svg">
Login with Google
</a>
<hr>
{% endif %}
</p>
{% with messages = get_flashed_messages() %}
{% if messages %}
{% for message in messages %}
<div class="alert alert-danger" role="alert">{{ message }}</div>
{% endfor %}
{% endif %}
{% endwith %}
{% if google_auth_url %}
<div class="row">
<a href="{{ google_auth_url }}"><img src="/static/images/google_login.png" class="login-button"/></a>
</div>
<div class="login-or">
<hr class="hr-or">
<span class="span-or">or</span>
</div>
{% endif %}
<form role="form" method="post" name="invite">
<div class="form-group">
<form role="form" method="post" name="invite">
<div class="form-group">
<label for="password">Password</label>
<input type="password" class="form-control" id="password" name="password">
</div>
<button type="submit" class="btn btn btn-primary">Set Password</button>
</form>
</div>
<button type="submit" class="btn btn-primary btn-block m-t-default">Set Password</button>
</form>
</div>
</div>
{% endblock %}
45 changes: 17 additions & 28 deletions redash/templates/layouts/signed_out.html
Original file line number Diff line number Diff line change
@@ -1,42 +1,31 @@
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<html class="no-js">
<head>
<title>{% block title %}{% endblock %}</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>{% block title %}{% endblock %}</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">

<link rel="stylesheet" href="{{ asset_url('app.css') }}">
<link rel="stylesheet" href="/static/styles/login.css">
<link rel="stylesheet" href="{{ asset_url('server.css') }}">

<link rel="icon" type="image/png" sizes="32x32" href="/static/images/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="/static/images/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="/static/images/favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="/static/images/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="/static/images/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="/static/images/favicon-16x16.png">
</head>
<body>
<body class="d-flex flex-column justify-content-center align-items-center">

<div style="position: absolute; width: 100%; height: 100%;">
<div class="logo-container">
<div style="display:table-cell; vertical-align:middle;" class="text-center">
<img src="/static/images/logo_white.png" style="width: 184px; height: 96px;">
</div>
</div>

<div class="content-container">
<div class="" style="display:table-cell;vertical-align:middle;">
<div style="max-width:500px; margin: auto;">
{% block content %}
{% endblock %}
</div>
<div class="d-flex flex-column justify-content-center align-items-center">
<div class="header">
<div class="text-center">
<a href="/"><img src="/static/images/redash_icon_small.png"></a>
</div>
<h3 class="text-center m-b-default">{{ self.title() }}</h3>
</div>
{% block content %}{% endblock %}
</div>

<script src="/static/js/jquery.min.js"></script>
{% block scripts %}
{% endblock %}

{% block scripts %}{% endblock %}

{% include '_includes/signed_out_tail.html' %}

Expand Down
Loading

0 comments on commit f1aad25

Please sign in to comment.