Changeset 6621

Timestamp:

Nov 24, 2014, 2:15:23 PM (8 years ago)

Author:

Nicklas Nordborg

Message:

References #1890: Improve skinnability of BASE

Getting rid of some more hardcoded color values.

Location:

trunk

Files:

• src/clients/web/net/sf/basedb/clients/web/taglib/Select.java (modified) (4 diffs)
• www/admin/diskusage/details/view_details.jsp (modified) (4 diffs)
• www/admin/diskusage/overview.jsp (modified) (2 diffs)
• www/admin/jobagents/edit_agent.jsp (modified) (1 diff)
• www/admin/plugindefinitions/edit_plugin.jsp (modified) (2 diffs)
• www/admin/quota/edit_quota.jsp (modified) (1 diff)
• www/admin/quota/view_quota.jsp (modified) (2 diffs)
• www/common/overview/failures.jsp (modified) (1 diff)
• www/common/plugin/parse_file.jsp (modified) (2 diffs)
• www/include/scripts/main-2.js (modified) (1 diff)
• www/include/scripts/subtypes.js (modified) (4 diffs)
• www/include/styles/calendar.css (modified) (1 diff)
• www/include/styles/main.css (modified) (4 diffs)
• www/include/styles/popup.css (modified) (1 diff)
• www/include/styles/progressbar.css (modified) (3 diffs)
• www/my_base/index.jsp (modified) (2 diffs)
• www/my_base/messages/view_message.jsp (modified) (3 diffs)
• www/plugins/net/sf/basedb/plugins/executor/external_plugin_parameters.jsp (modified) (2 diffs)
• www/views/experiments/explorer/view/view.jsp (modified) (1 diff)
• www/views/jobs/view_job.jsp (modified) (3 diffs)

trunk/src/clients/web/net/sf/basedb/clients/web/taglib/Select.java

@@ -611 +611 @@
       if (recent != null && recent.size() > 0)
       {
-        sb.append("<option value=\"0\" disabled class=\"recentheader\">- recently used -\n");
+        sb.append("<option value=\"0\" disabled class=\"recentheader\">› recently used\n");
         int i = 1;
         for (BasicItem item : recent)
         {
           String name = getName(item);
-          String clazz = "recent";
+          String clazz = "selectoptionindent recent";
           if (item instanceof Removable && ((Removable)item).isRemoved())
           {
@@ -635 +635 @@
       if (defaultItems != null && defaultItems.size() > 0)
       {
-        sb.append("<option value=\"0\" disabled class=\"defaultheader\">- project default -\n");
+        sb.append("<option value=\"0\" disabled class=\"defaultheader\">› project default\n");
         for (BasicItem defaultitem : defaultItems)
         {
@@ -641 +641 @@
           
           sb.append("<option value=\"").append(defaultitem.getId()).append("\"");
-          sb.append(" class=\"default\"");        
+          sb.append(" class=\"default selectoptionindent\"");       
           if (!hasSelected && isNewitem() && getSelectdefault())
           {         
@@ -655 +655 @@
     
     sb.append("<td>");
-    sb.append("<div class=\"").append(getButtonclass()).append(disabled ? " disabled": "").append("\"");
+    sb.append("<div class=\"interactable ").append(getButtonclass()).append(disabled ? " disabled": "").append("\"");
     sb.append(" id=\"").append(getId()).append(".select\"");
     sb.append(" data-list-name=\"").append(getId()).append("\"");

trunk/www/admin/diskusage/details/view_details.jsp

@@ -159 +159 @@
     table.special
     {
-      border-collapse: collapse;
       width: auto;
     }
@@ -165 +164 @@
     {
       text-align: right;
-      border-right: 1px dotted #A0A0A0;
+      border-right-width: 1px;
+      border-right-style: dotted;
     }
     </style>
@@ -267 +267 @@
             <th style="width: 12em;">External</td>
           </tr>
-          <tr style="border-top: 1px solid #A0A0A0;" class="highlight">
+          <tr style="border-top-width: 1px;" class="highlight">
             <th>Total</th>
             <td><%=Values.formatBytes(summary.getTotal())%></td>
@@ -369 +369 @@
           title="Description"
         />
-        <div class="panelgroup topborder leftborder rightborder">
-          <tbl:toolbar subclass="bottomborder bg-filled-50">
+        <div class="panelgroup topborder leftborder rightborder bg-filled-50">
+          <tbl:toolbar subclass="bottomborder">
             <tbl:button 
               id="btnDeleteItems"

trunk/www/admin/diskusage/overview.jsp

@@ -82 +82 @@
     {
       text-align: right;
-      border-right: 1px dotted #A0A0A0;
+      border-right-width: 1px;
+      border-right-style: dotted;
     }
     </style>
@@ -104 +105 @@
         <th style="width: 12em;">External</th>
       </tr>
-      <tr style="border-top: 1px solid #A0A0A0;" class="highlight">
+      <tr style="border-top-width: 1px;" class="highlight">
         <th>Total</th>
         <td><%=Values.formatBytes(summary.getTotal())%></td>

trunk/www/admin/jobagents/edit_agent.jsp

@@ -254 +254 @@
         </td>
       </tr>
+      <tbody class="sectionheader">
+        <tr>
+          <th colspan="2">Settings for the selected plug-in</th>
+        </tr>
+      </tbody>
       <tbody id="pluginsettings" style="display: none;">
-        <tr>
-          <th colspan="2" class="bottomborder" style="border-top: 1px solid #A0A0A0;">Settings for the selected plug-in</th>
-        </tr>
         <tr>
           <th class="subprompt">Max memory</th>

trunk/www/admin/plugindefinitions/edit_plugin.jsp

@@ -505 +505 @@
                   class="auto-init" data-auto-init="link-container"
                   data-initial-items="[<%=HTML.encodeTags(jsonAgents.toJSONString()) %>]"
-                  size="15" multiple>
+                  size="12" multiple>
                 </select>
               </td>
@@ -535 +535 @@
         </td>
       </tr>
+      <tbody class="sectionheader">
+        <tr class="sectionheader">
+          <th colspan="2">Settings for the selected job agent</th>
+        </tr>
+      </tbody>
       <tbody id="agentsettings" style="display: none;">
-        <tr>
-          <th colspan="2" class="bottomborder" style="border-top: 1px solid #A0A0A0;">Settings for the selected job agent</th>
-        </tr>
         <tr>
           <th class="subprompt">Max memory</th>

trunk/www/admin/quota/edit_quota.jsp

@@ -163 +163 @@
       </tr>
       <tr>
-        <th style="border-top: 0px; border-bottom: 1px dotted #A0A0A0;">Total quota</th>
+        <th>Total quota</th>
         <td><%=getQuotaInput(quota, total, Location.PRIMARY)%></td>
         <td><%=getQuotaInput(quota, total, Location.SECONDARY)%></td>

trunk/www/admin/quota/view_quota.jsp

@@ -126 +126 @@
     table.special th, table.special td
     {
-      border-right: 1px dotted #A0A0A0;
+      border-right-width: 1px;
+      border-right-style: dotted;
     }
     </style>
@@ -240 +241 @@
         <th></th>
         <td>
-          <table class="fullborder special" style="margin: 5px; border-collapse: collapse;">
-          <tr style="border-bottom: 1px solid #A0A0A0; background: #E8E8E8;">
+          <table class="fullborder special" style="margin: 5px;">
+          <tr class="bottomborder bg-filled-100">
             <th style="width: 10em;"></th>
             <th style="width: 12em;">Primary location</th>
             <th style="width: 12em;">Secondary location</th>
           </tr>
-          <tr style="border-bottom: 1px dotted #A0A0A0;">
+          <tr class="bottomborder">
             <th><%=Base.getLinkedName(ID, total, false, true)%></th>
             <td><%=displayQuota(quota, total, Location.PRIMARY)%></td>

trunk/www/common/overview/failures.jsp

@@ -89 +89 @@
   tr.failure
   {
-    border-top: 1px dotted #A0A0A0; 
+    border-top-width: 1px;
+    border-top-style: dotted; 
+    border-bottom-width: 1px;
+    border-bottom-style: dotted; 
     cursor: pointer;
   }
   tr.failure:first-child
   {
-    border-top: 1px dotted transparent;
+    border-top-color: transparent;
   } 
   tr.failure td 

trunk/www/common/plugin/parse_file.jsp

@@ -173 +173 @@
   %>
   <base:page type="iframe" title="Test with file">
-  <base:head scripts="tabcontrol-2.js,~parse_file.js" styles="table.css,tabcontrol.css">
-    <style>
-    table.special
-    {
-      border-collapse: collapse;
-    }
-    table.special > tbody > tr.highlight > td
-    {
-      border-top: 1px solid transparent;
-    }
-    table.special > tbody > tr.highlight:hover > td
-    {
-      background-color: #F8F8E8 !important;
-      border-top: 1px solid #2288AA !important;
-      border-bottom: 1px solid #2288AA !important;
-    }
-    </style>
-  </base:head>
+  <base:head scripts="tabcontrol-2.js,~parse_file.js" styles="table.css,tabcontrol.css" />
   <base:body>
   <div class="absolutefull bottomborder">
@@ -435 +418 @@
       %>
       <form name="mappings">
-      <div class="absolutefull" style="height: 2em;">
+      <div class="absolutefull bg-filled-100" style="height: 2em;">
         <table>
         <tr>
-          <td style="padding-left: 2px;">
+          <td style="padding-left: 4px;">
             <b>Mapping style:</b>
             <input type="radio" name="expressionStyle" id="expressionStyleSimple" value="1" checked><label for="expressionStyleSimple">Simple</label>

trunk/www/include/scripts/main-2.js

@@ -1958 +1958 @@
     controllers['ITEMSUBTYPE'] = { url:'admin/itemsubtypes/index.jsp', width:690, height:460 };
     controllers['JOB'] = { url:'views/jobs/index.jsp', width:750, height:500, popup:true, edit:false };
-    controllers['JOBAGENT'] = { url:'admin/jobagents/index.jsp', width:600, height:400 };
+    controllers['JOBAGENT'] = { url:'admin/jobagents/index.jsp', width:750, height:500 };
     controllers['MESSAGE'] = { url:'my_base/messages/index.jsp', width:600, height:400, popup:true, edit:false };
     controllers['MIMETYPE'] = { url:'admin/mimetypes/index.jsp', width:600, height:400 };

trunk/www/include/scripts/subtypes.js

@@ -254 +254 @@
     {
       // Add recently used items
-      var recentlyUsedHeader = new Option('- recently used -', 0);
+      var recentlyUsedHeader = new Option('› recently used', 0);
       recentlyUsedHeader.className = 'recentheader';
       recentlyUsedHeader.disabled = true;
@@ -262 +262 @@
       {
         var selected = reselectValue == recentItems[i].id;
-        list[list.length] = new Option((i+1) + '. ' + recentItems[i].name, recentItems[i].id, false, selected);
+        var opt = new Option((i+1) + '. ' + recentItems[i].name, recentItems[i].id, false, selected);
+        opt.className = 'selectoptionindent';
+        list[list.length] = opt;
       }
     }
@@ -269 +271 @@
     {
       // Add project default items
-      var projectDefaultHeader = new Option('- project default -', 0);
+      var projectDefaultHeader = new Option('› project default', 0);
       projectDefaultHeader.className = 'defaultheader';
       projectDefaultHeader.disabled = true;
@@ -277 +279 @@
       {
         var selected = reselectValue == projectDefaults[i].id;
-        list[list.length] = new Option( projectDefaults[i].name, projectDefaults[i].id, false, selected);
+        var opt = new Option( projectDefaults[i].name, projectDefaults[i].id, false, selected);
+        opt.className = 'selectoptionindent';
+        list[list.length] = opt;
       }
     }

trunk/www/include/styles/calendar.css

@@ -36 +36 @@
 
 .calendar > tbody > tr
-{
-  xheight: 20%;
-}
+{}
 
 .calendar > tbody > tr > td

trunk/www/include/styles/main.css

@@ -287 +287 @@
 
 
-.filled .basicbutton
-{
-  background: #F8F8F8;
-}
-
 img.helpicon, img.zoomicon
 {
@@ -319 +314 @@
   font-weight: normal !important;
   border-color: #A00000 !important;
-  filter: none !important;
 }
 
@@ -596 +590 @@
 {
   font-weight: bold;
-  background-color: #E8E8E8;
-  border-top: 1px dotted #A0A0A0;
-  border-bottom: 1px dotted #A0A0A0;
-  margin-top: 2px;
+  color: #000000;
 }
 
@@ -609 +600 @@
 .selectoptionindent 
 {
-  padding-left: 1em;
+  padding-left: 0.5em;
 }
 

trunk/www/include/styles/popup.css

@@ -77 +77 @@
 }
 
-/* Fill the content area with a background color and a bottom border */
-.popup .content.filled
-{
-  background: #E8E8E8;
-  border-bottom: 1px solid #A0A0A0;
-}
-
 /* fullcc is used for 100% width+height content that is centered vertically+horizontally */
 table.fullcc

trunk/www/include/styles/progressbar.css

@@ -33 +33 @@
 }
 
+.progressbar.failed .bar
+{
+  border-color: #A00000;
+}
+
 .progressbar .percentDone
 {
@@ -45 +50 @@
 .progressbar .percentUnknown 
 {
-  background-color: #cccccc;
   text-align: center;
   font-style: italic;
@@ -58 +62 @@
 .progressbar.failed .percentDone, .progressbar.failed .percentUnknown 
 {
-  background-color: #CC0000;
+  background-color: #C80000;
 }
 .progressbar.failed .percentRemain 

trunk/www/my_base/index.jsp

@@ -431 +431 @@
       </tr>
       <tr>
-        <td colspan="6" style="border-top: 1px dotted #A0A0A0;"></td>
+        <td colspan="6" style="border-top-width: 1px; border-top-style: dotted;"></td>
       </tr>
       <%
@@ -456 +456 @@
       %>
       <tr>
-        <td colspan="6" style="border-top: 1px dotted #A0A0A0;"></td>
+        <td colspan="6" style="border-top-width: 1px; border-top-style: dotted;"></td>
       </tr>
       </table>

trunk/www/my_base/messages/view_message.jsp

@@ -105 +105 @@
   final boolean deletePermission = message.hasPermission(Permission.DELETE);
   final boolean isRemoved = message.isRemoved();
-  final boolean isUsed = isRemoved && message.isUsed();
+  final boolean isUsed = true || isRemoved && message.isUsed();
   final boolean deletePermanentlyPermission = deletePermission && !isUsed;
   %>
@@ -121 +121 @@
         %>
         <tr>
-          <td colspan="2" style="background: #E8E8E8; border-bottom: 1px solid #A0A0A0;">
+          <th></th>
+          <td>
           <div class="itemstatus">
             <base:icon 
@@ -134 +135 @@
               image="used.png" 
               tooltip="Show the items that are using this one"
-              visible="<%=isUsed%>"> This item is used by other items and can't be permanently deleted<br></base:icon>
+              visible="<%=isUsed%>"> This item is used by other items</base:icon>
           </div>
           </td>

trunk/www/plugins/net/sf/basedb/plugins/executor/external_plugin_parameters.jsp

@@ -131 +131 @@
     <div class="content">
     
-      <div class="absolutefull filled" style="height: 4.5em;">
+      <div class="absolutefull bg-filled-100" style="height: 4.5em;">
         <table style="height: 100%; margin:auto;"><tr><td style="padding: 3px;">
         <b>
@@ -142 +142 @@
     
       <div class="absolutefull topborder bottomborder" style="top: 4.5em;">
-      <div class="absolutefull filled" style="width: 18em;">
+      <div class="absolutefull" style="width: 18em;">
 
           <tbl:toolbar subclass="bottomborder bg-filled-50">

trunk/www/views/experiments/explorer/view/view.jsp

@@ -211 +211 @@
     .special td.cell:first-of-type
     {
-      border-right: 1px solid #A0A0A0;
+      border-right-width: 1px;
     }
   </style>

trunk/www/views/jobs/view_job.jsp

@@ -212 +212 @@
         %>
         <tr>
-          <td colspan="2" style="background: #E8E8E8; border-bottom: 1px solid #A0A0A0;">
+          <th></th>
+          <td colspan="2">
           <div class="itemstatus">
             <base:icon 
@@ -233 +234 @@
       %>
       <tr>
-        <th style="border-top: 0px;">Name</th>
+        <th>Name</th>
         <td><%=HTML.encodeTags(job.getName())%></td>
       </tr>
@@ -281 +282 @@
         <th class="subprompt">- percent complete</th>
         <td>
-          <table class="progressbar">
+          <table class="progressbar" style="margin-bottom: 2px;">
           <tr>
           <td>