SSH key change design init

This commit is contained in:
Siarhei Puhach 2017-07-04 15:00:08 +03:00
parent 1f0bb9f72a
commit de0bada84a
3 changed files with 75 additions and 58 deletions

View file

@ -0,0 +1,5 @@
.ssh-key-header {
line-height: 35px;
}
.ssh-container{
}

View file

@ -18,6 +18,7 @@
<!-- Custom CSS --> <!-- Custom CSS -->
<link href="{% static 'hosting/css/landing-page.css' %}" rel="stylesheet"> <link href="{% static 'hosting/css/landing-page.css' %}" rel="stylesheet">
<link href="{% static 'hosting/css/user_keys.css' %}" rel="stylesheet">
<link href="{% static 'hosting/css/payment.css' %}" rel="stylesheet"> <link href="{% static 'hosting/css/payment.css' %}" rel="stylesheet">
<link href="{% static 'hosting/css/order.css' %}" rel="stylesheet"> <link href="{% static 'hosting/css/order.css' %}" rel="stylesheet">
<link href="{% static 'hosting/css/orders.css' %}" rel="stylesheet"> <link href="{% static 'hosting/css/orders.css' %}" rel="stylesheet">
@ -46,7 +47,7 @@
<!-- Navigation --> <!-- Navigation -->
<nav class="navbar navbar-default navbar-fixed-top topnav" role="navigation"> <nav class="navbar navbar-default navbar-fixed-top topnav" role="navigation">
<div class="container topnav"> <div class="container topnav">
<!-- Brand and toggle get grouped for better mobile display --> <!-- Brand and toggle get grouped for better mobile display -->
@ -90,7 +91,7 @@
<li><a href="{% url 'hosting:logout' %}"><i class="glyphicon glyphicon-lock"></i>{% trans "Logout"%} </a></li> <li><a href="{% url 'hosting:logout' %}"><i class="glyphicon glyphicon-lock"></i>{% trans "Logout"%} </a></li>
</ul> </ul>
</li> </li>
<!-- <!--
<li> <li>
<a href="{{ request.session.hosting_url}}#how">{% trans "How it works"%}</a> <a href="{{ request.session.hosting_url}}#how">{% trans "How it works"%}</a>
</li> </li>
@ -105,7 +106,7 @@
</li> </li>
<li> <li>
<a href="{{ request.session.hosting_url }}#contact">{% trans "Contact"%}</a> <a href="{{ request.session.hosting_url }}#contact">{% trans "Contact"%}</a>
</li> </li>
<li> <li>
<a href="{% url 'hosting:login' %}?next={{request.current_path}}">{% trans "Login"%}</a> <a href="{% url 'hosting:login' %}?next={{request.current_path}}">{% trans "Login"%}</a>
</li> --> </li> -->

View file

@ -1,12 +1,12 @@
{% extends "hosting/base_short.html" %} {% extends "hosting/base_short.html" %}
{% load staticfiles bootstrap3 i18n %} {% load staticfiles bootstrap3 i18n %}
{% block content %} {% block content %}
<div> <div>
<div class="container virtual-machine-container dashboard-container "> <div class="container virtual-machine-container dashboard-container ">
<div class="row"> <div class="row">
<div class="col-md-9 col-md-offset-2"> <div class="col-md-12">
<div class="col-sm-12"> <div class="col-sm-12">
<h3><i class="fa fa-key" aria-hidden="true"></i>{% trans "Access Key"%} </h3> <h2><i class="fa fa-key" aria-hidden="true"></i>{% trans "Your SSH Key"%} </h2>
{% if messages %} {% if messages %}
<div class="alert alert-warning"> <div class="alert alert-warning">
{% for message in messages %} {% for message in messages %}
@ -14,66 +14,77 @@
{% endfor %} {% endfor %}
</div> </div>
{% endif %} {% endif %}
<p class="pull-right"> <div class="ssh-container">
<a class="btn btn-success" href="{% url 'hosting:create_ssh_key' %}" >{% trans "Add Key"%} </a> <p class="pull-right">
</p> <a class="btn btn-primary" href="{% url 'hosting:create_ssh_key' %}" >
<h5> Use your created key to access to the machine. If you lost it, contact us. </h5> <b>+</b> {% trans "Add Key"%}
<table class="table borderless table-hover"> </a>
</p>
<h5 class="ssh-key-header">To generate a new key pair or to upload your existing key, click "Add Key"</h5>
</div>
<table class="table borderless table-hover">
<br/> <br/>
<thead> <thead>
<tr> <tr>
<th>{% trans "Name"%}</th> <th>{% trans "Name"%}</th>
<th>{% trans "Created at"%} </th> <th>{% trans "Delete Key"%}</th>
<th>{% trans "Status"%} </th> <th>{% trans "Public Key"%}</th>
<th></th> <th>{% trans "Private Key"%}</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
{% for user_key in keys %} {% for user_key in keys %}
<tr> <tr>
<td scope="row">{{user_key.name}}</td> <td scope="row">{{user_key.name}}</td>
<td><span id="ssh-created_at-{{user_key.id}}">{{user_key.created_at|date:'Y-m-d H:i' }}</span></td>
<td> <td>
<span class="h3 label label-success"><strong>Active</strong></span> <button type="button" class="btn btn-default" data-toggle="modal"
</td> data-target="#Modal{{ user_key.id }}">
<td> <a href="#">
<button type="button" class="btn btn-default" data-toggle="modal" {% trans "Delete"%}</a>
data-target="#Modal{{ user_key.id }}"><a </button>
href="#">{% trans "Delete Key"%}</a>
</button>
<div class="modal fade" id="Modal{{user_key.id }}" tabindex="-1" role="dialog"> <div class="modal fade" id="Modal{{user_key.id }}" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document"> <div class="modal-dialog" role="document">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<button type="button" class="close" data-dismiss="modal" <button type="button" class="close" data-dismiss="modal"
aria-label="Confirm"><span aria-label="Confirm"><span
aria-hidden="true">&times;</span> aria-hidden="true">&times;</span>
</button> </button>
</div> </div>
<div class="modal-body"> <div class="modal-body">
<h4 class="modal-title" id="ModalLabel">{% trans "Do You want to delete this key?"%}</h4> <h4 class="modal-title" id="ModalLabel">{% trans "Do You want to delete this key?"%}</h4>
<form method="post" action="{% url 'hosting:delete_ssh_key' user_key.id %}"> <form method="post" action="{% url 'hosting:delete_ssh_key' user_key.id %}">
{% csrf_token %} {% csrf_token %}
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-default" <button type="button" class="btn btn-default"
data-dismiss="modal"> data-dismiss="modal">
{% trans "Close"%} {% trans "Close"%}
</button> </button>
<button type="submit" class="btn btn-primary">{% trans "Delete"%} <button type="submit" class="btn btn-primary">{% trans "Delete"%}
</button> </button>
</div> </div>
</form> </form>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</td> </td>
<td>
<span class="h3">Show</span>
</td>
<td>
<button type="button" class="btn btn-default" data-toggle="modal"
><a
href="#">{% trans "Download"%}</a>
</button>
</td>
</tr> </tr>
{% endfor %} {% endfor %}
</tbody> </tbody>
</table> </table>
@ -84,17 +95,17 @@
</div> </div>
</div> </div>
</div> </div>
{% if next_url %} {% if next_url %}
<script type="text/javascript"> <script type="text/javascript">
window.location.href = '{{next_url}}'; window.location.href = '{{next_url}}';
</script> </script>
{% endif %} {% endif %}
<script type="text/javascript"> <script type="text/javascript">
window.onload = function () { window.onload = function () {
{% for user_key in keys %} {% for user_key in keys %}