perbaikn

Author: teguhzundi

dist/it-framework.all.js

@@ -468,7 +468,7 @@ var IT = (function () {
 
  if (!el.noRow) {
  div = $("<div/>", {
- class: 'row form-row'
+ class: 'row form-row align-items-center'
  });
  el.renderTo(div);
  wrapper.append(div);
@@ -753,7 +753,7 @@ var IT = (function () {
  items: []
  }, settings);
  me.id = me.settings.id || Utils.id();
- me.content = $("\n\t\t\t<div id=\"".concat(me.id, "\" class=\"it-toolbar toolbar-").concat(me.settings.position, " clearfix\">\n\t\t\t\t<ul class=\"it-toolbar-left\"></ul>\n\t\t\t\t<ul class=\"it-toolbar-right\"></ul>\n\t\t\t</div>\n\t\t"));
+ me.content = $("\n\t\t\t<div id=\"".concat(me.id, "\" class=\"it-toolbar toolbar-").concat(me.settings.position, "\">\n\t\t\t\t<ul class=\"it-toolbar-left\"></ul>\n\t\t\t\t<ul class=\"it-toolbar-right\"></ul>\n\t\t\t</div>\n\t\t"));
  me.ids = [];
  me.items = {};
  $.each(me.settings.items, function (k, el) {

dist/it-framework.min.css

@@ -40,7 +40,7 @@ export default class Form extends Component {
 if (!el.isClass)
 el = Utils.createObject(el);
 if (!el.noRow) {
-div = $("<div/>", { class: 'row form-row' });
+div = $("<div/>", { class: 'row form-row align-items-center' });
 el.renderTo(div);
 wrapper.append(div);
 } else {

src/js/lib/Form.js

@@ -12,7 +12,7 @@ export default class Toolbar extends Component{
 },settings);
 me.id = me.settings.id||Utils.id();
 me.content = $(`
-<div id="${me.id}" class="it-toolbar toolbar-${me.settings.position} clearfix">
+<div id="${me.id}" class="it-toolbar toolbar-${me.settings.position}">
 <ul class="it-toolbar-left"></ul>
 <ul class="it-toolbar-right"></ul>
 </div>

src/js/lib/ToolBar.js

@@ -23,11 +23,12 @@ $label_width_default: 100px;
 $input_border_invalid_color: red;
 $input_info_bg_color: #eee;
 $input_info_text_color: #666666;
-$input_readonly_bg_color: #FFFADB;
-$input_readonly_border_color: #F7FC71;
+$input_readonly_bg_color: #F7FC71;
+$input_readonly_border_color: darken($input_readonly_bg_color, 20);
 $input_width_default: 200px;
 $input_height_default: 30px;
 $input_padding: 0 10px;
+$input_font_size: 12px;
 
 // Select 
 $select_height_default: 30px;

src/sass/_variable.scss

@@ -32,10 +32,6 @@
 visibility: visible;
 @include prefix(transform, scale(1));
 }
-
->.it-title {
-@include prefix(border-radius, 0 0 0 0);
-}
 }
 
 &-header {
@@ -44,8 +40,8 @@
 background: #f4f4f4;
 
 .it-title {
-background: transparent;
-border-top: 1px solid #eee;
+background: #fff;
+border-bottom: 1px solid #eee;
 }
 }
 
@@ -58,7 +54,7 @@
 }
 
 &-footer {
-background: #f4f4f4;
+border-top: 1px solid #eee;
 @include size(100%, '');
 @include align-self(flex-end);
 padding: 0 6px;

src/sass/components/_dialog.scss

@@ -1,7 +1,6 @@
 .it {
 &-edit {
-width: 100%;
-@include flexbox();
+//@include flexbox();
 
 &.for-option {
 .it-input-label {
@@ -49,9 +48,13 @@
 &-input {
 box-shadow: inset 0 2px 3px rgba($color: #ccc, $alpha: .2);
 font-family: Roboto;
+font-size: $input_font_size;
 line-height: $input_height_default;
 height: $input_height_default;
 @include flex(1);
+width: 100%;
+box-sizing: border-box;
+border-radius: 2px;
 
 &.noflex {
 @include flex(0);
@@ -61,7 +64,7 @@
 &:focus {
 border-color: $input_border_focus_color;
 }
-
+
 // Invalid
 &.invalid {
 border-color: $input_border_invalid_color;

src/sass/components/_edit.scss

@@ -2,8 +2,8 @@
 &-toolbar {
 position: relative;
 background: #fff;
-@include flexbox();
-@include align-items(center);
+align-items: center;
+display: flex;
 padding: $toolbar_padding;
 
 &-left, 
@@ -41,18 +41,12 @@
 height: $toolbar_input_height;
 line-height: $toolbar_input_height;
 }
-.selectize-input {
- line-height: $toolbar_select_height;
- @include size(100%, $toolbar_select_height);
-}
 }
 
 // Button Component
 .it-btn {
 height: $toolbar_button_height;
 line-height: $toolbar_button_height;
-
-
 }
 }
 }