diff --git a/hosting/forms.py b/hosting/forms.py index 505ecbce..b48a52ef 100644 --- a/hosting/forms.py +++ b/hosting/forms.py @@ -58,15 +58,19 @@ class HostingUserSignupForm(forms.ModelForm): class UserHostingKeyForm(forms.ModelForm): private_key = forms.CharField(widget=forms.HiddenInput(), required=False) - public_key = forms.CharField(widget=forms.Textarea(), required=False, - help_text=_('Paste here your public key')) + public_key = forms.CharField(widget=forms.Textarea( + attrs={'class': 'form_public_key', 'placeholder': 'Paste here your public key'}), + required=False, + ) user = forms.models.ModelChoiceField(queryset=CustomUser.objects.all(), required=False, widget=forms.HiddenInput()) - name = forms.CharField(required=True) + name = forms.CharField(required=True, widget=forms.TextInput( + attrs={'class': 'form_key_name', 'placeholder': 'Give a name to your key',})) def __init__(self, *args, **kwargs): self.request = kwargs.pop("request") super(UserHostingKeyForm, self).__init__(*args, **kwargs) + self.fields['name'].label = "Key name" def clean_name(self): return self.data.get('name') diff --git a/hosting/static/hosting/css/user_keys.css b/hosting/static/hosting/css/user_keys.css index 973b45fb..416b9e44 100644 --- a/hosting/static/hosting/css/user_keys.css +++ b/hosting/static/hosting/css/user_keys.css @@ -91,4 +91,145 @@ padding-left: 0; padding-right: 0; } -} \ No newline at end of file +} +.choice-container{ + margin-top: 30px; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; +} +.choice-container div:first-of-type{ + border-right: 1px solid #c9c6c6; +} + +.choice-container div{ + padding-top: 30px; + padding-bottom: 30px; + display: flex; + align-items: center; + flex-direction: column; + width: 50%; +} +.choice-container div h3{ + margin: auto; + width: 95%; + text-align: center; +} +.choice-container div h3 img:hover{ + cursor: pointer; +} +.dashboard-container { + max-width: 930px !important; + } +.choice-button{ + width: 192px; + height: 45px; + border-radius: 0; + color: white; + margin-top: 70px; +} +.choice-button a{ + color: white; + font-size: 20px; +} +.upload-btn{ + background-color: #337ab7; +} +.form_public_key, +.form_key_name{ + border:none; + border-bottom: 1px solid grey; + box-shadow: none; + border-radius: 0; + font-family: 'Lato-Light', sans-serif; + font-size: 20px; +} + +.form_key_name::-webkit-input-placeholder{ + position: relative; + left:-10px; + font-size: 20px; + font-weight:100; + font-family: 'Lato-Light', sans-serif; + + +} +.form_key_name::-moz-input-placeholder{ + left:-10px; + font-size: 20px; + font-weight:200; + font-family: 'Lato-Light', sans-serif; + +} +.form_key_name:-moz-input-placeholder{ + left:-10px; + font-family: 'Lato-Light', sans-serif; + font-size: 20px; + font-weight:200; + +} +.form_key_name:-ms-input-placeholder { + left:-10px; + font-size: 20px; + font-family: 'Lato-Light', sans-serif; + font-weight:200; +} + +.form_public_key::-webkit-input-placeholder{ + position: relative; + top: 80%; + left:-10px; + font-size: 20px; + font-weight:200; + font-family: 'Lato-Light', sans-serif; + +} +.form_public_key::-moz-input-placeholder{ + position: relative; + top: 80%; + left:-10px; + font-size: 20px; + font-family: 'Lato-Light', sans-serif; + font-weight:200; + +} +.form_public_key:-moz-input-placeholder{ + position: relative; + top: 80%; + left:-10px; + font-size: 20px; + font-weight:200; + font-family: 'Lato-Light', sans-serif; +} +.form_public_key:-ms-input-placeholder { + position: relative; + top: 80%; + left:-10px; + font-size: 20px; + font-weight:200; + font-family: 'Lato-Light', sans-serif; +} +.underform-contaner{ + display: flex; + vertical-align: middle; + align-items: center; + justify-content: space-between; + flex-direction: row; + margin-bottom: 20px; +} +.underform-contaner h4{ + font-family: 'Lato-Light', sans-serif; +} +.underform-contaner button{ + width: 120px; + height: 35px; +} +.control-label{ + font-family: 'Lato-Light', sans-serif; + font-size: 20px; + font-weight:200; +} +.form-ssh h3{ + margin-bottom: 40px; +} diff --git a/hosting/templates/hosting/choice_ssh_keys.html b/hosting/templates/hosting/choice_ssh_keys.html new file mode 100644 index 00000000..7da48342 --- /dev/null +++ b/hosting/templates/hosting/choice_ssh_keys.html @@ -0,0 +1,70 @@ +{% extends "hosting/base_short.html" %} +{% load staticfiles bootstrap3 i18n %} +{% block content %} +
+
+
+
+
+

{% trans " SSH Key"%}

+

Choose a key option in order to access your VMs.

+ {% if messages %} +
+ {% for message in messages %} + {{ message }} + {% endfor %} +
+ {% endif %} +
+
+

I want to generate a new key pair. + +

+ +
+
+

I want to use my existing public key. + +

+ +
+ +
+ +
+
+
+ +
+
+ +
+ +{% if next_url %} + +{% endif %} + + + + + +{%endblock%} + diff --git a/hosting/templates/hosting/user_key.html b/hosting/templates/hosting/user_key.html index 061e759e..b98f4b38 100644 --- a/hosting/templates/hosting/user_key.html +++ b/hosting/templates/hosting/user_key.html @@ -1,6 +1,6 @@ {% extends "hosting/base_short.html" %} {% load staticfiles bootstrap3 i18n %} -{% block content %} +{% block content %}
@@ -8,7 +8,7 @@
{% csrf_token %} -

{% trans "Access Key"%}

+

{% trans "Add you public SSH key"%}

{% if messages %}
{% for message in messages %} @@ -20,28 +20,29 @@ {% bootstrap_field field %} {% endfor %} {% buttons %} +
+

{% trans "Use your created key to access to the machine." %}

-
-
- {% trans "Or generate a new key pair."%}
-
- +
+
+

{% trans "Or you can generate a new key pair."%}

+ +
- {% endbuttons %} + + {% endbuttons %} -
Use your created key to access to the machine. If you lost it, contact us.
{% if private_key %}
- - {% trans "Warning!"%}{% trans "You can download your SSH private key once. Don't lost your key"%} + + {% trans "Warning!"%}{% trans "You can download your SSH private key once. Don't lost your key"%}
-
{% endif %}
@@ -54,7 +55,7 @@ {% if private_key %} - {% endif %} diff --git a/hosting/templates/hosting/user_keys.html b/hosting/templates/hosting/user_keys.html index 4af8c3d0..0fe50a6f 100644 --- a/hosting/templates/hosting/user_keys.html +++ b/hosting/templates/hosting/user_keys.html @@ -16,7 +16,7 @@ {% endif %}

- + ✚ {% trans "Add Key"%}

diff --git a/hosting/urls.py b/hosting/urls.py index 495ac312..fc8198ef 100644 --- a/hosting/urls.py +++ b/hosting/urls.py @@ -6,7 +6,7 @@ from .views import DjangoHostingView, RailsHostingView, PaymentVMView,\ VirtualMachineView, OrdersHostingDeleteView, NotificationsView, \ MarkAsReadNotificationView, PasswordResetView, PasswordResetConfirmView, HostingPricingView,\ CreateVirtualMachinesView, HostingBillListView, HostingBillDetailView, \ - SSHKeyDeleteView, SSHKeyCreateView, SSHKeyListView + SSHKeyDeleteView, SSHKeyCreateView, SSHKeyListView, SSHKeyChoiceView urlpatterns = [ url(r'index/?$', IndexView.as_view(), name='index'), @@ -26,6 +26,8 @@ urlpatterns = [ name='virtual_machines'), url(r'ssh_keys/?$', SSHKeyListView.as_view(), name='ssh_keys'), + url(r'ssh_keys_choice/?$', SSHKeyChoiceView.as_view(), + name='choice_ssh_keys'), url(r'delete_ssh_key/(?P\d+)/?$', SSHKeyDeleteView.as_view(), name='delete_ssh_key'), url(r'create_ssh_key/?$', SSHKeyCreateView.as_view(), diff --git a/hosting/views.py b/hosting/views.py index a5cea6c9..184f170f 100644 --- a/hosting/views.py +++ b/hosting/views.py @@ -368,6 +368,15 @@ class SSHKeyListView(LoginRequiredMixin, ListView): return super(SSHKeyListView, self).render_to_response(context, **response_kwargs) +class SSHKeyChoiceView(LoginRequiredMixin, View): + template_name = "hosting/choice_ssh_keys.html" + login_url = reverse_lazy('hosting:login') + + def get(self, request, *args, **kwargs): + context = {} + return render(request, self.template_name, context) + + class SSHKeyCreateView(LoginRequiredMixin, FormView): form_class = UserHostingKeyForm model = UserHostingKey