question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

$input-height isn't pulled with new defined values while transpilling to css

See original GitHub issue

This is how my theme.scss looks:

// required Bootstrap files
@import "bootstrap/scss/variables";

//overwrite Bootstrap settings
@import "my-variables";

When setting $input-btn-padding-y in _my-variables.scss this value is ignored in calculation of $input-height (https://github.com/twbs/bootstrap/blob/v4.1.3/scss/_variables.scss#L446). To make it generate the right output, also the complete line from $input-height-inner and $input-height has to be placed in _my-variables.scss.

It’s maybe more a scss problem with not lazy loading variables and the escaped values in calc(#{}).

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:5 (3 by maintainers)

github_iconTop GitHub Comments

1reaction
MartijnCuppenscommented, Oct 29, 2018

@createdwithlove, you need to include your variables before including bootstrap. See docs: http://getbootstrap.com/docs/4.1/getting-started/theming/#variable-defaults

0reactions
createdwithlovecommented, Oct 30, 2018

😢 I want {Less} back – okay, maps wouldn’t then be a problem anyway…

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to set the height of an input (text) field in CSS?
I have CSS code that should set the height of my text box. I am using VS2010 Express for Windows phone, coding in...
Read more >
What's behind the hype about Blazor? - Stack Overflow Blog
Blazor is a new client-side UI framework from the ASP.NET team. Its big selling point is the ability to write rich web UI...
Read more >
react-phone-number-input - npm
Start using react-phone-number-input in your project by running `npm ... with a CSS autoprefixer or postcss-custom-properties transpiler for ...
Read more >
48 answers on StackOverflow to the most popular Angular ...
Can't bind to 'ngModel' since it isn't a known property of 'input' ... know when those params will stop changing (emitting new values)....
Read more >
rollup.js
Load the module code, but don't make any new objects available. import './module.js';. This is useful for polyfills, or when the primary purpose...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found