Ionic slidebox inside tabs - ionic-framework

I'm having trouble getting a slidebox to work with the ionic framework.
I used the tabs seed project, changed some code and just inserted the demo code from the documentation for a slide-box.
Here is a plunker of the app:
http://plnkr.co/edit/FxRyJ62sCtSiJdGUPzAz?p=preview
The slide-box is in the data tab (tab-data.html).
It looks like everything works right: The directive is recognized etc. but the slide-box does not work?

It's perfectly fine. Just that the slide-box is very small.
Add a
style="margin:100px 0px;text-align:center;"
to the <h1> and you'll see, it works.

Related

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.

Bootstrap-vue file-form looks like plain text

I'm trying to use b-file-form from bootstrap-vue docs.
I've used vue-cli to create bootstrap-vue template project. And I
've tried to create file-form in my component. But file-form looks like plain text without css. Meanwhile file-form works as it should.
BootstrapVue has registered in vue app.
What can be wrong? And what I can to do to fix that?
Problem was decided after update bootstrap-vue to 2.0.0-rc.1

Rename in Ionic select button cancel and ok

I am working with the Ionic Framework.
In all of my forms i am using the ionic select do display some options.
It works perfectly. But its showing 2 buttons in english: cancel and okay.
I would like to rename this buttons in another names due to the language.
Where can i do this? I looked and searched the whole directory but could not find anything. It looks like the ionic is building them somehow. Or do i need some more js to rename this?
From the manual at https://ionicframework.com/docs/api/components/select/Select/
By default, the two buttons read Cancel and OK. Each button's text can be customized using the cancelText and okText attributes:
<ion-select okText="Okay" cancelText="Dismiss">
...
</ion-select>
okText actually didn't work with my Ionic 5.4.4 version. I used doneText instead and worked just fine.

using breakpoints for the first time

Hi all I am using breakpoints for the first time and I had them working fine, but now my site adapts to the mobile layout but not the screen-size for mobile! I can't see any unclosed tags or css erros, any clue what could be causing this?
http://bennyfit.co.uk/
best,
Try putting your css through a validator. This usually shows up errors that are hard to spot normally:
http://jigsaw.w3.org/css-validator/

Asciimath plugin for TinyMCE not creating images

I'm using the Asciimath plugin for TinyMCE (http://www.imathas.com/editordemo/demo.html)
It was working fine until a few moments ago. Now I can see the math notation just fine in the editor, but on submitting the form, it's contents do not change to an image replacing the <span class="AM"> tag that the plugin creates.
Hence the HTML that the editor produces retains the Math-syntax I typed with the span tag and not show the Math notation properly in an image.
If anybody knows how to fix this, please help me. I'm really confused as to why it suddenly stopped working. A server-side text-replacement solution would be great as well.
I have tried this:
preg_replace('/\<span class="AM"\>`(.+)`\<\/span\>/', '<img src="http://www.imathas.com/cgi-bin/mimetex.cgi?$1" />', $str)
But that results in broken display of the Math fragment since some of the additional parameters like displaystyle that the script adds are lost.
NOTE I recently switched from regular-TinyMCE to the jQuery plugin TinyMCE. Could this be the reason the plugin is not working? I'm not sure if it broke functionality right after I made this change.