From: Ciro Scognamiglio <ciro.scognamiglio@cslash.net>
Date: Thu, 20 Feb 2014 16:47:48 +0000 (+0100)
Subject: styled slice request
X-Git-Tag: myslice-1.1~330
X-Git-Url: http://git.onelab.eu/?a=commitdiff_plain;h=cf48c2a79b7bf47b10dfa1eab75e1148cac49208;p=unfold.git

styled slice request
---

diff --git a/portal/slicerequestview.py b/portal/slicerequestview.py
index cf818dc7..dbd53555 100644
--- a/portal/slicerequestview.py
+++ b/portal/slicerequestview.py
@@ -13,6 +13,8 @@ from portal.forms                import SliceRequestForm
 from unfold.loginrequired        import LoginRequiredAutoLogoutView
 from ui.topmenu                  import topmenu_items_live, the_user
 
+from theme import ThemeView
+
 import json
 
 class SliceRequestView (LoginRequiredAutoLogoutView, ThemeView):
@@ -45,7 +47,7 @@ class SliceRequestView (LoginRequiredAutoLogoutView, ThemeView):
 
         platform_query  = Query().get('local:platform').select('platform_id','platform','gateway_type','disabled')
         platform_details = execute_query(self.request, platform_query)
-
+        user_hrn = None
         # getting user_hrn from local:account
         for account_detail in account_details:
             for platform_detail in platform_details:
@@ -74,7 +76,6 @@ class SliceRequestView (LoginRequiredAutoLogoutView, ThemeView):
             number_of_nodes = request.POST.get('number_of_nodes', '')
             purpose = request.POST.get('purpose', '')
             email = self.user_email
-            user_hrn = user_hrn
             cc_myself = True
             
             if (authority_hrn is None or authority_hrn == ''):
@@ -113,8 +114,8 @@ class SliceRequestView (LoginRequiredAutoLogoutView, ThemeView):
                 send_mail("Onelab user %s requested a slice"%email , msg, email, recipients)
     
                 return render(request,'slice-request-ack-view.html') # Redirect after POST
-     
         template_env = {
+            'username': request.user.email,
           'topmenu_items': topmenu_items_live('Request a slice', page),
           'errors': self.errors,
           'slice_name': request.POST.get('slice_name', ''),
diff --git a/portal/static/css/onelab.css b/portal/static/css/onelab.css
index d5047550..59364b48 100644
--- a/portal/static/css/onelab.css
+++ b/portal/static/css/onelab.css
@@ -2,328 +2,6 @@
 
 /*-------------------------------- MARKO'S STYLES -----*/
 
-/* GENERAL */
-
-.container {
-    padding: 0 ;
-    background-color:white;
-    color: black;
-    margin: 0;
-    width: 100%;
-    max-width: 100%;
-    min-height: 600px;
-    height: 100%;
-}
-
-div.plugin-outline-complete, 
-div.plugin-outline-body {
-    border: 0px solid;
-    border-radius: 0;
-    border-color: #ccc;
-    -webkit-transition: padding 200ms ease-out;
-    -moz-transition: padding 200ms ease-out;
-    -o-transition: padding 200ms ease-out;
-    transition: padding 0.2s ease-out;
-    padding: 20px;
-    margin: 0;
-}
-/*
-div.plugin-outline-complete:hover, 
-div.plugin-outline-body:hover {
-    padding: 80px 80px 120px 80px; 
-}
-*/
-a.plugin-tooltip { 
-    font-size: 130%;
-    font-style: normal;
-    font-weight: bold;
-    padding: 5px;
-    color: #333;
-    font-family: Ubuntu, Arial, sans-serif;
-    text-transform: uppercase;
-}
-
-a.plugin-tooltip:hover { 
-    color: #fff; 
-    text-decoration: none;
-}
-
-
-
-/* LIST VIEW */
-div.well-lg {
-    background-color: rgba(168, 32, 202, 0.5) ;
-}
-div.onelab-title {
-    background-color: rgba(168, 32, 202, 0.5) ;
-}
-
-h2.well.well-lg {
-    border-radius:0;
-    border: 0;
-    font-family: Ubuntu, arial, sans-serif;
-    /* text-transform: ; */
-    font-weight: normal;
-    font-size: 40px;
-    /* color: #30196d; */
-    color: white;
-    margin-bottom: 0px;
-    margin-top: 0;
-    padding: 40px;
-    opacity: 1;
-    text-align: center;
-    background-color: #30196d;
-}
-
-#complete-resources {
-/*    background-color: #92f79e ; */
-    background-color: #B8B2FF ;
-}
-
-#complete-filters {
-/*    background-color: #4af25d; */
-    background-color: #add7ff;
-}
-
-#complete-users {
-/*    background-color: #ff7394 ; */
-    background-color: #add7ff ;
-}
-/*
-#complete-measurements {
-    background-color: ;
-}
-*/
-#complete-pending {
-/*    background-color: #add7ff ; */
-    background-color: #B8B2FF ;
-
-}
-
-#complete-customize-resources {
-    background-color: #efdfdf;
-}
-
-#complete-msgs-pre {
-    background-color: #ccc;
-}
-
-#complete-resources, 
-#complete-filters, 
-#complete-users, 
-#complete-measurements,
-#complete-pending,
-#complete-customize-resources,
-#complete-msgs-pre {
-    opacity: 1;
-    text-align: center;
-    color: #333;
-}
-
-#complete-resources:hover, 
-#complete-filters:hover, 
-#complete-users:hover, 
-#complete-measurements:hover,
-#complete-pending:hover,
-#complete-customize-resources:hover,
-#complete-msgs-pre:hover {
-    opacity: 1;
-}
-
-
-
-
-.navbar-nav li a:hover {
-    color: #572bc9 ;
-}
-
-.navbar-nav li.active a {
-    background: #eee ;
-}
-
-/* Thierry : turning this off
-ul.logged-in { 
-    padding-top: 25px; 
-}
-Thierry */
-button.logged-in { 
-    font-size: 1em;
-    font-weight: bold; 
-    margin-left: 5px;
-    margin-top: -5px;
-    background: #572bc9;
-    border: 2px solid #572bc9;
-    color: #eee;
-    padding: 5px 15px;
-    border-radius:5px;
-}
-
-button.logged-in:hover { 
-    /* background: #4af25d; */
-    background: #ff7394;
-    border: 2px solid #ff7394;
-    color: #333;
-}
-li.username {
-    margin-bottom: 10px;
-    font-size: 0.8em;
-    text-transform: none;
-    font-weight: normal; 
-    color: #999;
-}
-
-
-/* BOOTSTRAP */
-
-
-ul.pagination li a {
-    /* background: ; */
-    color: #572bc9;
-    font-family: Ubuntu, Arial, sans-serif;
-}
-
-ul.pagination li.active a {
-    background: #572bc9;
-    border: 1px solid #572bc9;
-}
-
-
-
-div.dataTables_length label, 
-div.dataTables_filter label,
-div.dataTables_info {
-    font-family: Ubuntu, Arial, sans-serif ;
-}
-
-
-
-
-/* QUERYTABLE */
-
-div.QueryTable table.dataTable th {
-    font: bold 12px/22px Ubuntu, Arial, sans-serif;
-    color: #333 ;
-    border-right: 0px solid #333 ;
-    border-bottom: 0px solid #C1DAD7 ;
-    border-top: 0px solid #C1DAD7 ;
-    letter-spacing: 1px;
-    text-transform: uppercase;
-    text-align: left;
-    padding: 8px 12px 4px 20px;
-    vertical-align:middle;
-    background: url('../img/tablesort-header.png') no-repeat ; 
-}
-
-div.QueryTable table.dataTable td, div.QueryTable table.dataTable textarea, div.QueryTable table.dataTable input [type="text"] {
-    font: normal 12px Ubuntu, Arial, Helvetica, sans-serif;
-    border-right: 0px solid #fff ;
-    border-bottom: 1px solid #fff ;
-}
-
-div.QueryTable table.dataTable thead { 
-    background: url('../img/tablesort-header.png') repeat-x ;
-    background-color: #caebea;
-}
-
-div.QueryTable table.dataTable tfoot { 
-    background: url('../img/tablesort-header.png') repeat-x ;
-    /* background-color: # ; */
-}
-
-
-/* QUERY EDITOR */
-
-table.query-editor {
-    margin: 40px auto ;
-    clear: both;
-    /* width: 80%;*/
-    width: 100% ;
-    font-family: Ubuntu;
-}
-
-.query-editor-spacer,
-.plugin.QueryUpdater,
-/* Thierry : turning this off
-.plugin.Tabs 
-Thierry */
-{
-    margin-top: 60px ;
-}
-
-table.query-editor td {
-    padding: 5px 5px ;
-    font: normal 12px Ubuntu, Arial, sans-serif ;
-}
-
-
-
-/* DASHBOARD */
-
-#ms-dashboard-profile,
-#ms-dashboard-testbeds,
-#ms-dashboard-slices {
-    -webkit-transition: all 50ms ease-out;
-    -moz-transition: all 50ms ease-out;
-    -o-transition: all 50ms ease-out;
-    transition: all 0.05s ease-out;
-    padding-top: 140px;
-    padding-bottom: 60px;
-    margin-top: 60px;
-    color: #fff;
-    font-family: Ubuntu, Arial, sans-serif;
-    text-align: center;
-	
-}
-
-#ms-dashboard-profile:hover,
-#ms-dashboard-testbeds:hover,
-#ms-dashboard-slices:hover {
-    margin-top: 65px;
-}
-
-#ms-dashboard-profile {
-    background: url("../img/icon_users_color.png") top center no-repeat;
-}
-
-#ms-dashboard-testbeds {
-    background: url("../img/icon_testbed_color.png") top center no-repeat;
-}
-
-#ms-dashboard-slices {
-    background: url("../img/icon_slices_color.png") top center no-repeat;
-}
-
-.ms-dashboard-content ul {
-    list-style-type: none ;
-    padding-left: 0;
-    text-align: center ;
-}
-
-.ms-dashboard-content {
-    padding: 0 ;
-}
-
-
-#ms-dashboard-profile>div.ms-dashboard-caption {
-    background: no-repeat url(#) ;
-    padding-left: 0 ;
-}   
-
-#ms-dashboard-testbeds>div.ms-dashboard-caption {
-    background: no-repeat url(#) ;
-    padding-left: 0 ;
-}   
-
-#ms-dashboard-slices>div.ms-dashboard-caption {
-    background: no-repeat url(#) ;
-    padding-left: 0 ;
-}   
-
-
-
-
-
-
 
 
 
@@ -338,7 +16,20 @@ body {
 a, a:active, a:focus {
     outline: 0;
 }
-
+input {
+    margin:0;
+}
+h1 {
+    color:#0B0042;
+    border-bottom:1px solid #DDDDDD;
+    padding:0 0 15px 0;
+    margin:0 0 15px 0;
+}
+h1 img {
+    vertical-align:top;
+    margin:0;
+    padding:0;
+}
 div.wrapper {
     width:980px;
     margin:0 auto;
@@ -525,4 +216,19 @@ div.well {
 
 .btn.btn-default:hover {
     font-weight: bold;
-}
\ No newline at end of file
+}
+
+
+/* SLICE REQUEST */
+div#slice-request {
+    color:black;
+    margin:25px auto;
+}
+div#slice-request div {
+
+}
+.form-hint {
+    font-size:11pt;
+    font-style:italic;
+    color:gray;
+}
diff --git a/portal/templates/slicerequest_view.html b/portal/templates/slicerequest_view.html
index fc912247..d59bd68d 100644
--- a/portal/templates/slicerequest_view.html
+++ b/portal/templates/slicerequest_view.html
@@ -7,13 +7,8 @@
 
 {% block unfold_main %}
 
-<link rel="stylesheet" type="text/css" href="{{STATIC_URL}}/css/onelab.css" />
-<!-- xxx ideally only onelab.css but ... xxx -->
-<link rel="stylesheet" type="text/css" href="{{STATIC_URL}}/css/registration.css" />
-
-<div class="onelab-title well-lg">
-  <h2>Request a Slice</h2>
-</div>
+<div class="wrapper" id="slice-request">
+<h1><img src="{{ STATIC_URL }}img/icon_slices_small.png" alt="Request a Slice" /> Request a new Slice</h1>
 
 {% if errors %}
 <ul>
@@ -23,16 +18,19 @@
 </ul>
 {% endif %}
 
-<div class='well'>
-  <form id="commentForm" class="form-horizontal" action="" method="post" role="form">{% csrf_token %}
+<div>
+  <form id="commentForm" class="form-horizontal" method="post">
+  {% csrf_token %}
   <fieldset>
 
    <div class="form-group">
      <label for="email" class="col-xs-2 control-label">Experimenter</label>
      <div class="col-xs-4">
-        <label class="col-xs-2 control-label" style="height:34px;">{{ email }}</label>
+        <label class="col-xs-2 control-label">{{ email }}</label>
+     </div>
+     <div class="col-xs-6">
+     	<p class="form-hint">Experimenter requesting a Slice</p>
      </div>
-     <div class="col-xs-6"> <p class="form-hint">Experimenter requesting a Slice</p> </div>
    </div>
 
    <div class="form-group">
@@ -67,17 +65,23 @@
      <label for="purpose" class="col-xs-2 control-label">Experiment purpose</label>
      <div class="col-xs-4">
        <div class="ui-widget">
-           <textarea id="purpose" name="purpose" class="form-control" style="height:110px;" placeholder="Purpose" required>{{ purpose }}</textarea>
+           <textarea id="purpose" name="purpose" class="form-control" style="height:110px;" placeholder="Experiment Purpose" required>{{ purpose }}</textarea>
        </div>
     </div>
-     <div class="col-xs-6"><p class="form-hint">Purpose of your experiment (informative)</p></div>
+     <div class="col-xs-6">
+     	<p class="form-hint">Purpose of your experiment (informative)</p>
+     </div>
    </div>
 
-   <button class="submit btn btn-default col-xs-12" type="submit">Request Slice</button>
+	<div class="col-xs-2">
+	</div>
+	<div class="col-xs-4">
+		<button class="submit btn btn-default" type="submit">Request Slice</button>
+	</div>
   </fieldset>
   </form>
 </div>
-
+</div>
 <script>
 jQuery(document).ready(function(){
     var availableTags = [
diff --git a/ui/static/img/icon_slices_small.png b/ui/static/img/icon_slices_small.png
new file mode 100644
index 00000000..ed5dbdca
Binary files /dev/null and b/ui/static/img/icon_slices_small.png differ