← Back to team overview

yellow team mailing list archive

[Merge] lp:~bac/juju-gui/button-radii into lp:juju-gui

 

Brad Crittenden has proposed merging lp:~bac/juju-gui/button-radii into lp:juju-gui.

Requested reviews:
  Juju GUI Hackers (juju-gui)

For more details, see:
https://code.launchpad.net/~bac/juju-gui/button-radii/+merge/132954

Use two radius button borders.

* Further enhancement of CSS defined buttons.

* Expanded the README to explicitly state where the server can be
  accessed when run locally.  This was in response to a confused user
  in IRC.
-- 
https://code.launchpad.net/~bac/juju-gui/button-radii/+merge/132954
Your team Juju GUI Hackers is requested to review the proposed merge of lp:~bac/juju-gui/button-radii into lp:juju-gui.
=== modified file 'README'
--- README	2012-11-01 10:56:56 +0000
+++ README	2012-11-05 19:48:22 +0000
@@ -32,6 +32,13 @@
   $ cd trunk
   $ make server
 
+It may take a while for the server to start the first time as npm will
+need to download packages.  When ready, the server will print:
+
+Server listening on 8888
+
+You can then access the GUI at http://localhost:8888
+
 You'll also need to deploy a juju environment with REST api access.
 Currently that work resides in a pipeline of juju branches. The
 recommended branch to use as a server is ``lp:~hazmat/juju/rapi-delta``.

=== modified file 'lib/views/stylesheet.less'
--- lib/views/stylesheet.less	2012-11-02 09:04:07 +0000
+++ lib/views/stylesheet.less	2012-11-05 19:48:22 +0000
@@ -25,7 +25,7 @@
     font-family: @font-family;
 }
 
-.button-colors(@gradient-start, @gradient-end, @shadow-color, @v-pos) {
+.create-button(@gradient-start, @gradient-end, @shadow-color, @v-pos) {
     @blur: 2px;
     background-image: -ms-linear-gradient(top, @gradient-start, @gradient-end);
     background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@gradient-start), to(@gradient-end));
@@ -40,9 +40,9 @@
 	                    2px 0 3px -2px @shadow-color inset, -2px 0 3px -2px @shadow-color inset;
     box-shadow: 0 (@v-pos + 3) @blur -@blur @shadow-color inset,
 	            2px 0 3px -2px @shadow-color inset, -2px 0 3px -2px @shadow-color inset;
-    -moz-border-radius: 5px;
-    -webkit-border-radius: 5px;
-    border-radius: 5px;
+    -moz-border-radius: ~"4px / 7px";
+    -webkit-border-radius: ~"4px / 7px";
+    border-radius: ~"4px / 7px";
     border: none;
 }
 
@@ -791,10 +791,10 @@
         margin-left: 5px;
         vertical-align: middle;
         background-position: 0 0;     /* Needed to defeat bootstrap btn:hover 0 -15px*/
-        .button-colors(@charm-panel-deploy-button-color, @charm-panel-deploy-button-bottom-gradient,
+        .create-button(@charm-panel-deploy-button-color, @charm-panel-deploy-button-bottom-gradient,
 		       @charm-panel-deploy-button-shadow, 0px);
         &:active {
-            .button-colors(@charm-panel-deploy-button-color, @charm-panel-deploy-button-color,
+            .create-button(@charm-panel-deploy-button-color, @charm-panel-deploy-button-color,
 			   @charm-panel-deploy-button-shadow, 1px);
         }
     }
@@ -811,10 +811,10 @@
         vertical-align: middle;
         background-position: 0 0;     /* Needed to defeat bootstrap btn:hover 0 -15px*/
         background-image: url(/juju-ui/assets/images/cancel-button.png);
-        .button-colors(@charm-panel-cancel-button-color, @charm-panel-cancel-button-bottom-gradient,
+        .create-button(@charm-panel-cancel-button-color, @charm-panel-cancel-button-bottom-gradient,
 		       @charm-panel-cancel-button-shadow, 0px);
         &:active {
-            .button-colors(@charm-panel-cancel-button-color, @charm-panel-cancel-button-color,
+            .create-button(@charm-panel-cancel-button-color, @charm-panel-cancel-button-color,
 			   @charm-panel-cancel-button-shadow, 1px);
         }
     }


Follow ups