Updates

src/components/progressbar.scss

@@ -1,4 +1,4 @@
-.tui-progress {
+.tui-progress-bar {
     display: block;
     position: relative;
     height: 20px;
@@ -6,14 +6,14 @@
     background-color: rgb(0, 168, 168);
     overflow: hidden;
 }
-.tui-progress span {
+.tui-progress {
     position: absolute;
     left: 0px;
     background-color: rgb(0, 255, 255);
-    height: 20px;
+    height: 100%;
     display: inline-block;
 }
-.tui-progress .tui-indeterminate {
+.tui-progress-bar .tui-indeterminate {
     position: absolute;
     left: 0px;
     background-color: rgb(0, 255, 255);
@@ -24,6 +24,13 @@
     animation-iteration-count: infinite;
     animation-timing-function: linear;
 }
+.tui-progress-label {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translateX(-50%) translateY(-50%);
+    z-index: 1;
+}
 @keyframes indeterminate {
     from {margin-left: -10%; }
     to {margin-left: 100%}

src/components/texture.scss

@@ -1,17 +0,0 @@
-.tui-texturized-blue-white { background-image: url('./images/bg-blue-white.png'); background-repeat: repeat; }
-.tui-texturized-blue-black { background-image: url('./images/bg-blue-black.png'); background-repeat: repeat; }
-
-.tui-texturized-green-white { background-image: url('./images/bg-green-white.png'); background-repeat: repeat; }
-.tui-texturized-green-black { background-image: url('./images/bg-green-black.png'); background-repeat: repeat; }
-
-.tui-texturized-cyan-white { background-image: url('./images/bg-cyan-white.png'); background-repeat: repeat; }
-.tui-texturized-cyan-black { background-image: url('./images/bg-cyan-black.png'); background-repeat: repeat; }
-
-.tui-texturized-red-white { background-image: url('./images/bg-red-white.png'); background-repeat: repeat; }
-.tui-texturized-red-black { background-image: url('./images/bg-red-black.png'); background-repeat: repeat; }
-
-.tui-texturized-purple-white { background-image: url('./images/bg-purple-white.png'); background-repeat: repeat; }
-.tui-texturized-purple-black { background-image: url('./images/bg-purple-black.png'); background-repeat: repeat; }
-
-.tui-texturized-yellow-white { background-image: url('./images/bg-yellow-white.png'); background-repeat: repeat; }
-.tui-texturized-yellow-black { background-image: url('./images/bg-yellow-black.png'); background-repeat: repeat; }

src/styles/util.scss

@@ -33,10 +33,23 @@
 .inline {
     display: inline!important;
 }
+.inline-block {
+    display: inline-block!important;
+}
 .block {
     display: block!important;
 }
 
+.valign-top {
+    vertical-align: top!important;
+}
+.valign-middle {
+    vertical-align: middle!important;
+}
+.valign-bottom {
+    vertical-align: bottom!important;
+}
+
 .fixed {
     position: fixed!important;
 }

src/tuicss.scss

@@ -26,7 +26,6 @@
 @import './components/date.scss';
 @import './components/shortcut.scss';
 @import './components/shadow.scss';
-@import './components/texture.scss';
 @import './components/background.scss';
 @import './components/border.scss';
 @import './components/grid.scss';