Merge lp:~daker/ubuntu-html5-theme/fix.progressbar into lp:~ubuntu-html5-theme-devs/ubuntu-html5-theme/ambiance

[Adnane Belmadiaf]

Updated the progressbar component to match the design

[Alexandre Abreu (abreu-alexandre)]

review: Approve

[Alexandre Abreu (abreu-alexandre)]

review: Approve

[PS Jenkins bot (ps-jenkins)]

review: Approve (continuous-integration)

=== modified file '0.1/ambiance/css/progress-bars.css'
--- 0.1/ambiance/css/progress-bars.css	2013-07-17 15:27:43 +0000
+++ 0.1/ambiance/css/progress-bars.css	2013-09-28 20:21:05 +0000
@@ -5,18 +5,18 @@
  * This file is part of ubuntu-html5-theme.
  *
  * This package is free software; you can redistribute it and/or modify
- * it under the terms of the GNU Lesser General Public License as 
- * published by the Free Software Foundation; either version 3 of the 
+ * it under the terms of the GNU Lesser General Public License as
+ * published by the Free Software Foundation; either version 3 of the
  * License, or
  * (at your option) any later version.
- 
+
  * This package is distributed in the hope that it will be useful,
  * but WITHOUT ANY WARRANTY; without even the implied warranty of
  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  * GNU General Public License for more details.
- 
- * You should have received a copy of the GNU Lesser General Public 
- * License along with this program. If not, see 
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this program. If not, see
  * <http://www.gnu.org/licenses/>.
  */
 
@@ -27,7 +27,7 @@
 /* Spinner */
 progress {
     -webkit-appearance: none;
-    height: 10px;
+    height: 35px;
 }
 
 progress:not([value]) {
@@ -51,34 +51,37 @@
 progress:not([value])::-webkit-progress-bar {
     background: none;
     -webkit-box-shadow: none;
-
 }
 
 /* Progress bar */
 progress[value]::-webkit-progress-value {
     width: 100%;
-    background: #027ce0;
+    background: #dd4814;
     border: none;
+    border-radius: 6px;
     display: block;
+    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
+    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
 }
 
 progress[value]::-webkit-progress-bar {
-    background: #fff;
     padding: 1px;
-    -webkit-box-shadow: inset 0px 1px 5px rgba(0, 0, 0, 0.3);
-    -webkit-border-radius: 3px;
-    box-shadow: inset 0px 1px 5px rgba(0, 0, 0, 0.3);
-    border-radius: 3px;
+    background-color: rgba(192, 192, 192, 0.1);
+    width: 200px;
+    height: 35px;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    border-radius: 6px;
+    padding: 0;
+    -webkit-box-shadow: inset 0 2px 1px rgba(0, 0, 0, 0.1);
+    box-shadow: inset 0 2px 1px rgba(0, 0, 0, 0.1);
 }
 
-
 /* Infinite Progress bar */
 progress[value].infinite::-webkit-progress-value {
-    background-color: #027ce0;
-    background-size: 15px 15px , 100% 100%, 100% 100%;
-    background-image: -webkit-linear-gradient(135deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
-    -webkit-animation: 1.9s move infinite steps(15);
-    animation: 1.9s move infinite steps(15);
+    -webkit-appearance: none;
+    /*-webkit-animation: 1.9s move infinite steps(15);
+    animation: 1.9s move infinite steps(15);*/
 }
 
 /* Animations */
@@ -87,7 +90,7 @@
     to   { -webkit-transform: rotate(360deg); }
 }
 
-@-webkit-keyframes move {
-    0% { background-position: -100px 0px, 0 0, 0 0 }
-    100% { background-position: 0px 0px, 0 0, 0 0 }
-}
 \ No newline at end of file
+/*@-webkit-keyframes move {
+    0% { width: -100px 0, 0 0, 0 0 }
+    100% { width: 0 0, 0 0, 0 0 }
+}*/
 \ No newline at end of file
 
=== modified file '0.1/ambiance/img/[e-mail]'
 Binary files 0.1/ambiance/img/[e-mail]	2013-06-08 14:24:51 +0000 and 0.1/ambiance/img/[e-mail]	2013-09-28 20:21:05 +0000 differ
=== modified file '0.1/ambiance/img/[e-mail]'
 Binary files 0.1/ambiance/img/[e-mail]	2013-06-08 14:24:51 +0000 and 0.1/ambiance/img/[e-mail]	2013-09-28 20:21:05 +0000 differ
=== modified file '0.1/examples/widgets/ProgressBars.html'
--- 0.1/examples/widgets/ProgressBars.html	2013-07-17 15:27:43 +0000
+++ 0.1/examples/widgets/ProgressBars.html	2013-09-28 20:21:05 +0000
@@ -5,18 +5,18 @@
  This file is part of ubuntu-html5-theme.
 
  This package is free software; you can redistribute it and/or modify
- it under the terms of the GNU Lesser General Public License as 
- published by the Free Software Foundation; either version 3 of the 
+ it under the terms of the GNU Lesser General Public License as
+ published by the Free Software Foundation; either version 3 of the
  License, or
  (at your option) any later version.
- 
+
  This package is distributed in the hope that it will be useful,
  but WITHOUT ANY WARRANTY; without even the implied warranty of
  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  GNU General Public License for more details.
- 
- You should have received a copy of the GNU Lesser General Public 
- License along with this program. If not, see 
+
+ You should have received a copy of the GNU Lesser General Public
+ License along with this program. If not, see
  <http://www.gnu.org/licenses/>.
 -->
 
@@ -54,7 +54,9 @@
                 <progress></progress>
                 <progress class="bigger"></progress>
             </div>
-            <progress value="80" max="100"></progress>
+            <div class="inset">
+                <progress value="80" max="100"></progress>
+            </div>
             <div class="inset">
                 <progress class="infinite" value="100" max="100"></progress>
             </div>