Commit f3097356 authored by Daniele Venzano's avatar Daniele Venzano

Add some styling to the web pages

parent 50c5599b
......@@ -5,7 +5,7 @@
<entry url="file://$PROJECT_DIR$">
<entryData>
<resourceRoots>
<path value="file://$PROJECT_DIR$/caaas/static" />
<path value="file://$PROJECT_DIR$/caaas" />
</resourceRoots>
</entryData>
</entry>
......
This diff is collapsed.
body {
font-family: sans-serif;
max-width: 800px;
margin-left: 20px;
}
a:link {
color: rgba(79, 140, 30, 1);
text-decoration: none;
}
a:visited {
color: rgba(79, 140, 30, 1);
text-decoration: none;
}
div#activities {
padding-left: 3em;
}
a.activity {
width: 100px;
height: 80px;
border: 1px black solid;
border-radius: 15px;
float: left;
margin-right: 10px;
padding: 1em;
text-align: center;
display: block;
}
a.activity:hover {
transition: background-color 200ms linear;
background-color: khaki;
}
div.user_info {
font-size: smaller;
clear: both;
padding-top: 20px;
}
div.caaas_status_line {
float: left;
}
span#app_name {
font-family: cursive;
font-size: larger;
}
span#status {
font-size: smaller;
}
div.copyright {
float: left;
padding-left: 3em;
}
\ No newline at end of file
......@@ -8,6 +8,7 @@
<script type="application/javascript">
var api_endpoint = "/api";
</script>
<link rel="stylesheet" href="/static/caaas.css" type="text/css">
{% endblock %}
</head>
<body>
......@@ -29,8 +30,17 @@
<div id="content">{% block content %}{% endblock %}</div>
<div id="footer">
{% block footer %}
<div class="caaas_status"><p><em>CAaaS</em> status: <span id="num_nodes">N/A</span> available nodes, <span id="num_containers">N/A</span> containers running</p></div>
<h6>&copy; Copyright 2015 by <a href="http://distsysgroup.wordpress.com/">DSG</a></h6>
<div class="caaas_status_line">
<p>
<span id="app_name"><a href="{{ url_for("web_status") }}">CAaaS</a></span>
<span id="status">
[<span id="num_nodes">N/A</span> swarm nodes, <span id="num_containers">N/A</span> active containers]
</span>
</p>
</div>
<div class="copyright">
<h6>&copy; Copyright 2015 by <a href="http://distsysgroup.wordpress.com/">DSG</a></h6>
</div>
{% endblock %}
</div>
</body>
......
{% extends "base_user.html" %}
{% extends "base.html" %}
{% block title %}Home{% endblock %}
{% block content %}
<p>Start an activity:</p>
<ul>
<li><a href="{{ url_for("web_notebook", user_id=user_id) }}">Give me a Spark notebook</a></li>
<li><a href="{{ url_for("web_spark_submit", user_id=user_id) }}">Submit a Spark application</a></li>
</ul>
<p>My activities:</p>
<ul>
<li><a href="{{ url_for("web_user_apps", user_id=user_id) }}">Applications</a></li>
</ul>
<div id="activities">
<a class="activity" href="{{ url_for("web_notebook", user_id=user_id) }}">Give me a Spark notebook</a>
<p>Cluster status:</p>
<ul>
<li><a href="{{ url_for("web_status") }}">Overview</a></li>
</ul>
<a class="activity" href="{{ url_for("web_spark_submit", user_id=user_id) }}">Submit a Spark application</a>
<p>Your email address used for notifications is: {{ email }}</p>
<a class="activity" href="{{ url_for("web_user_apps", user_id=user_id) }}">History</a>
</div>
<div class="user_info">
<p>Email address used for notifications: <a href="mailto:{{ email }}">{{ email }}</a></p>
</div>
{% endblock %}
\ No newline at end of file
......@@ -11,11 +11,12 @@ function process()
</script>
<form onSubmit="return process();">
<label for="user">Type your username to start:</label>
<input id="user" autofocus required type="email" autocomplete="on" name="email">
<label for="user">Type your email address to start:</label>
<input id="user" autofocus required type="email" autocomplete="on" name="email" size="30">
<input type="submit" value="Start">
</form>
<p>To create a new user, just type a new username in the box above, only lowercase letters are accepted.</p>
<p>If you are a new user, just type your email address in the box above, it will be used to send notifications about the applications
you start.</p>
{% endblock %}
\ No newline at end of file
{% extends "base_user.html" %}
{% block title %}Spark notebook{% endblock %}
{% block content %}
<h2>Notebook</h2>
<h2>Spark Notebook</h2>
<p>You notebook is available at: <a href="{{ notebook_address }}">{{ notebook_address }}</a></p>
<p>Please note that notebooks are automatically terminated {{ max_age }} hours after the last time they are accessed.
A warning email will be sent {{ wrn_time }} hours before.</p>
<p>Please note that notebooks are <b>automatically terminated {{ max_age }} hours after the last access</b>.
A warning email will be sent {{ wrn_time }} hours before this happens.</p>
{% endblock %}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment