Susy 2 IE8 Fallback - sass

I need to add support for IE8 and possible previous versions using Susy 2 but there is very limited documentation that described how to do this.
I know in Susy 1 there was a lt-ie9 fallback tag to use against breakpoint declarations but that doesn't seem to work for Susy 2.
Is there any documentation for IE8 support or other way this can be achieved?

Susy doesn't exactly "support" specific browsers — since that would be determined feature-by-feature. I think media-queries are the only place you may need a fallback for IE8, and fallback options still exist for that. You can find all the docs inline with other information about media handling. We have some basic media-query tools built in, and additional support for the Breakpoint plugin. The built-in mixin is now called susy-breakpoint() and accepts a $no-query argument for managing your fallback.

Related

.Net Core Web App missing some Bootstrap classes at creation

So I'm trying to follow some tutorials on .Net core web apps.
I started running into issues first when I tried to use glyphicons. They never worked and I got the intellisense warning "Unknown CSS Class 'glyphicon'".
As I got further into the tutorials I would increasingly run into these types of CSS warnings. Input-Group-btn, btn-default, and panels all gave similar warnings and didn't work. But I thought I must have missed a step or something.
But now I'm looking at the default _Layout.cshtm and seeing similar warnings, and understanding that, that's probably why my pages don't look like the examples. Navbar-toggleable-sm is an unknown class.
To be clear, many of the classes work. Most, even.
I thought maybe it was just a version issue, but glyphicons and panels don't seem seem like they would be deprecated features.
I'm looking in my bootstrap distribution and it looks like I'm on version 4.3.1.
Why would these classes be missing and how could I fix this?
Ok, so the answer to this appears to be that many, MANY features have been changed between bootstrap 3 and 4, and Microsoft didn't update their templates. So by default bootstrap 4 is installed, but the pages generated use bootstrap 3 classes.
For glyphicon you can use FontAwesome.
Panels, thumbnails, and wells have all been replaced with cards.
More information can be found here.

Recommended way to add polyfills depending on a list of supported browsers

We're using webpack and I am looking for the best way to add the polyfills required for a certain list of browsers in a Multi page application.
We have a list of browsers with the minimum supported versions like:
IE 11
Chrome 65
Firefox 66
and we would like webpack to add the polyfills required for this versions based on the functionalities we are using in the code.
I.E if we are using promises then webpack will identify that and add the polyfill for promises only because of IE 11 and so on...
What is the current state of on demand polyfilling like this?
Any suggestions are welcome!
You likely are looking for browserslist and babel-preset-env - both have pretty great documentation on how they work together.

Advise on resolving pseudo-class compatibility for IE8

I have used pseudo-classes in the project, that i am currently working on, and since it is already javascript heavy I am trying to avoid using selectivizr. Is there are way making psedoclass compatible with IE8? Is it possible to use Modernizr to resolve this issue?
Any advise would be much appreciated.
You could check for css-lastchild with Modernizr (you'll find it in the Non-core detects section) and customize your styles if the browser doesn't support css-lastchild - which would mean it doesn't support any other of the CSS3 selectors either, which are:
:root
:nth-child()
:nth-last-child()
nth-of-type
nth-last-of-type()
:last-child
:first-of-type
:last-of-type
:only-child
:only-of-type
:empty
:target
:enabled
:disabled
:checked
:not().

Display #font-face Fonts in Capybara-Webkit

When I test my website using capybara-webkit and I take a screenshot, #font-face declarations in CSS are ignored.
This is especially bad because I am using FontAwesome, so there will be major differences to how the page is displayed in a real browser.
How to reproduce: https://gist.github.com/anonymous/4948827
Output: http://i.imgur.com/5lsrleY.jpg
Is there any way to fix this?
Some research shows that it is entirely possible to render custom fonts in Capybara-Webkit, the same as with PhantomJS. This PhantomJS Forum Post identifies the trouble issues. A quick summary:
SVG Fonts work best.
OTF fonts tend not to work.
It should be fixed with Qt5, so check what version of Qt you've built against.
Depending on the version of qt that capybara-webkit is built against, webkit needs non-localhost urls whitelisted. That includes meta references to external assets such as fonts.
To make that happen globally, add this to spec_helper.rb in the rspec configuration block:
config.before(:each) do
page.driver.allow_url("the-domain-name.com")
end
If you have a before :each already, just throw it in there instead. allow_url also accepts an array of strings.
I've placed a comment in your gist to this effect.

npapi - javascript doesnt load the content of a plugin

I wrote a firefox plugin using C++ and used the <EMBED> to load it to html.
In javascript I got the embedded plugin by using document.getElementByID,
but when I tried to call a plugin function, the function was undefined. Moreover,
plugins constructors did not run while loading the page.
The same html file and plugin seems to work on some computers, while it doesnt work on others.
Does anyone have an idea what might by wrong?
How can I debug such an issue?
Can you reproduce it on your computer at first? If not, then try to figure out what systems, browsers, architecture, versions, they are using.
I recall, there are many GECKOSDK's, and each one has a specific version it works for. https://developer.mozilla.org/en/gecko_sdk For example, different SDK's for Firefox 1.5-2.0, FireFox 3.0, Firefox 3.5, and Firefox 3.5
For different browers, make sure you are exposing the right DLL Exports, browsers can vary: http://git.webvm.net/?p=npsimple is a good starting point. You can use firebreath.googlecode.com too as an alternative.
My suggestion would be to use an object tag instead of <embed>. In my experience, doesn't seem to work as reliably.
If I had more information on how your plugin is structured (are you using XPCOM or npruntime?), I might be able to help more.

Resources