creativetimofficial / ct-vue-now-ui-dashboard-pro

Vue Now UI Dashboard PRO - PREMIUM BOOTSTRAP 4 VUEJS ADMIN TEMPLATE
https://www.creative-tim.com/product/vue-now-ui-dashboard-pro
16 stars 9 forks source link

Wrong Button rendering, icons deplaced #31

Open blitze299 opened 5 years ago

blitze299 commented 5 years ago

I tried everything (eg. updating bootstrap to 4.2.1, downloading the newest template version etc) to correct the following behaviour of the text inputs and the round buttons with icons: Screenshot 2019-08-15 at 11 28 23 Screenshot 2019-08-15 at 11 27 22 Even in the docs there is the same missplacement https://demos.creative-tim.com/vue-now-ui-dashboard-pro/documentation/#/inputs Is there any solution to this?

miketierce commented 5 years ago

I had the same issue. Drove me crazy trying to track it down.

this fixed the issue for me (i'm using the large input variant)

// src/assets/sass/now-ui-dashboard/_inputs.css

// around line 358 for me
.form-control-lg {
  padding: 0;
  font-size: inherit;
  line-height: 0;
  height: 44px; // set height manually to match the icon-addon class
  border-radius: 0;

  &.has-danger {
    margin-bottom: 20px;
  }

  input.form-control {
    height: 100%;
  }
}