IE11 + Bootstrap vue Issue focusable elements have multiple black border when visited - bootstrap-vue

Hi #all Need help to resolve a IE11 / Edge + Bootstrap vue + b-modal issue.We are seeing multiple black lines when we focus / active on button, input boxes (Please refer to screenshot below). We were able to replicate in bootstrap vue sanbox also (https://bootstrap-vue.js.org/docs/components/modal/)Same happens in our project too which has below dependencies
"bootstrap": "^4.3.1",
"bootstrap-vue": "^2.0.2" // Able to replicate in sandbox too
Steps to replicate the issue:
hover or focus on elements
[Sanbox issue replicated 1][2]
Sanbox issue replicated 2

Do you have any addons/extensions that may be causing any issues or conflicts? I do not see the issue on IE11 (docs site is using BootstrapVue v2.1.0):

Related

Loading icon on IndicatingAjaxButton and IndicatingAjaxLink not showing

I am having issues with the loading icon on the IndicatingAjaxButton and
IndicatingAjaxLink. Previously I was on Wicket 9.0.0-M4 and the icons were working
fine. But after upgrading to Wicket 9.0.0-M5 (or later versions), I'm not
able to see the loading icon any longer.
I checked and found that the AjaxIndicatorAppender now has the
hidden attribute instead of the style=display:none. However, when I click
the IndicatingAjaxButton, it will still append the style=display:inline as
before (with the hidden attribute still present).
I've not done any changes to the dependency, only upgrade the Wicket versions. Is there anything that I would need for the upgrade for the button to work?
Please advise. Thank you.

Neos Editor - Deleted Nodes reappear after page reload

I created a new Neos Instance, using the Sandstorm Neos Kickstart. After importing the content dump via ./flow site:import my.site I got some content elements which I deleted using the editor and published my changes. After a page reload I noticed that nodes were their again.
I also noticed that the outline of the elements is orange and not blue, is this the problem? And what does it mean?
Thank you!
The orange outline means, that these nodes shine through from another dimension.
Inside the kickstart package there currently is a (german) content dimension configured. However the site export uses nodes without a specific dimension, which leads to nodes shining through from "no dimension" to your dimension.
To fix this you can run ./flow site:prune and add your content dimension to the site export by replacing the self closing <dimensions/> with:
<dimensions>
<language>de</language>
</dimensions>
(You would have to do this on every node, of course!)
Afterwards you need to import the site again, to make it all work.
(I assume that this will be fixed inside the kickstart package site export, soon)

Ion-color-secondary/primary class not applied

I've created a stencil.js application (app starter) where I would like to use ionic components.
I included Ionic using the cdn following this tutorial (https://ionicframework.com/docs/installation/cdn). I have a problem with the style of some of the components like buttons, toggle etc. The problem is that the primary/secondary/x style is not applied also if I use
color="primary"
I've searched a lot to solve this problem and I saw that the property .ion-color-primary isn't apply to the button like it should, so none of the colors are applied to the button that remains white.
If I use Ionic from cdn in a html page (with no stencil.js) the problem don't happen so I think that the problem it's stencil.
I've the latest stencil version, 4.11.7.

roundslider UI is malfunction due to ionic.bundles.js file in ionic android app

I searched alot about this topic but couldnt find any answer. I am ionic to build a android app. I used roundslider component from www.roundsliderui.com. Though whole roundslider fully works but the text input right in middle of roundslider does not work in ionic. I figured out that ionic.bundles.js script in ionic app is causing problem. If I remove this script, roundslider works fine.
Any advice why this script causing problem?
Thanks
I had the same issue. You have to disable the tap functionality.
http://ionicframework.com/docs/api/page/tap/
"In some cases, third-party libraries may also be working with touch events which can interfere with the tap system. For example, mapping libraries like Google or Leaflet Maps often implement a touch detection system which conflicts with Ionic’s tap system."
<div data-tap-disabled="true">
//Your Round Slider here...
</div>
I hope it helps.
there is a conflict between files of roundsliderui and ionic
read this article thats will help you
The problem is that the modal is not fully loaded at the time the circular-slider is rendered. This article states correctly that the offsetPosition is null if the document (in this case, the modal) is not finished loading

Items in Plones TinyMCE content browser are overlayed in album view - how to tackle this?

I do not know if this is a bug or rather stems from any customizations. I would like to know how to tackle this problem:
If I click on "add image" or "Link" in Plone's "Content Browser" the default view mode is "Album". In this mode the items are layed above each other, i.e. after 4 items the next items do not seem to be put into a new column.
See the screenshot:
Plone version is 4.3.2. How can I fix this? Pointers (relevant files, parts of code) welcome.
I have seen this happen too, depending on what I did with styling and skins. TinyMCE uses a grid system for showing these images and this needs the columns.css file from plonetheme.sunburst. I only now realize that this actually already goes wrong in the way you describe when you use standard Plone 4.3.2 and choose the classic theme as skin.
Ah, but it only fails because there is a typo in the columns.css that is shipped with plonetheme.classic, which actually includes the grid css as well. You can customize this file in portal_skins and fix the error. The problem is a line that is meant as a comment.
Change this line:
The 16-column Deco Grid System.
into this line:
/* The 16-column Deco Grid System.