We tried to upgrade aurelia-dialog from beta.3.0.0 to rc.1.0.3 and found that 2 problems in all our dialog views:
The header does not have width 100% as it was before, it only shows header text, looks like "width:-webkit-fit-content" affected this.
The dialog body became transparent, so we see underlying elements.
How to we avoid this?
Since rc.1 they switched their 'ai' prefix to 'ux', so now you have to type <ux-dialog> instead of <ai-dialog>
This is probably the reason your layout isn't rendering right.
You can see the changelog here
Related
When I active AdmPanel and trying to use the edit functions like >Display edit icons< and/or >Display edit panels< the layout messes up. The Edit Icons are huge shown all over the entire page.
Back in the days there was bug that the CSS wasn't included, but that's not the case. adminpanel.css is present. But beside it looks like all the elements doesn't have any css definition at all.
I couldn't find anyone experiencing the same issue and also tried other installation, but it's everywhere the same. Does anyone have an idea what am I missing here?
I would like JS <script type="xx"> content to be colored nicely inside my HTML document.
Right now, when adding the type to a script tag, the element text becomes uniform white, as seen below.
Of course, the JS code is colored nicely within the HTML if removing the type attribute.
Is there some setting I can modify to make this work?
No setting to modify. This is a known issue. From the thread it looks like syntax highlighting was working at one point for script tags with the type attribute but was lost.
Hopefully it's fixed soon. I'm seeing the same thing on VSCode 1.13.1.
I am using Template10 with the Hamburger starting project template. I'd like to have a margin between the hamburger area on the left and all content. I tried changing the shared Shell.xaml page (by adding a margin, etc.) but couldn't figure out the best way to sort it out. Conceptually, that makes sense, but it's the specific detail of how to make it work that I'm missing.
Is there an easy way to do it without changing each content page?
Regarding the questions in the comments: I want it in the closed case of a wide view; the question doesn't make any sense in any other case. As far as what I tried, it doesn't really ultimately matter, since none of what I tried worked - I'm asking what the right way is to do it, which I never figured out.
Here's what the default looks like, without a margin:
Here's what it looks like with a margin added to the content area, which is also how the sample template contents handle this:
I don't want to have to mark up every content page with left margins to get the offset in the second picture.
1: https://i.stack.imgur.com/jUIuO.png
Okay, now I have enough information. You have a few options here. The first is just bite the bullet like the rest of the developer community and format your pages like normal. But if you simply must, you can create an implicit Page style with a setter setting Margin="16,16,16,16" but, listen, and I am not kidding, you will ultimately regret it unless your app is super-simple. The biggest problem will be the spacing will be OUTSIDE the containing ScrollViewer.
Thanks for using Template 10.
I would like to restyle the modal dialogs in REBOL2's VID, such as alert, request/ok, etc, so that they better fit with the theme of the rest of my application. The only way I've found to do this is to include my own altered version of the request function, substituting my own values into the layout in it. Is there any way to restyle these popups without having to redefine the request function?
The default popup vs an example result of what I'm looking for:
Regrettably, as far as I know there isn't. I've had this problem myself in the past. The only way to do it, is as you said. Of course, that's fairly trivial since you can simply do: source request, copy it and make your changes. Request and the other modals are wrapped in functions, which act as a black box around the internal code which generates the face and then feeds it to inform.
Learned a simpler method from another REBOLer (thanks Gregg!). If you only need to change the background color and the enter/cancel buttons, this works as well:
svv/vid-face/color: 26.150.219
stylize/master [
btn-enter: btn white
btn-cancel: btn white
]
I have this requirement where I have to change the default styles on my Ext JS application. I am not talking about changing stuff in CSS files yet. I am not that ambitious yet. Here is what I am looking for:
Suppose I need a Submit and Cancel buttons, I use xtype:button and text:Save ( or Cancel ). This will render buttons with the text on them. What should I do if I want to change the look and feel of the button? Or replace the button with a cool Save or Cancel image?
Right now I have all the texts on the application with the default font that ExtJS shows. What am I supposed to do if I want all the text on the application changed to a different font? Everything right from the data in forms/grids and the titles of each component should be changed to some other font my customer prefers. What am I supposed to do?
I understand these are very basic and a generic questions, but I am looking for a good headsup before I proceed with my task.
Thank you all in advance. Waiting for answers :)
Update: So, I found out how we deal with CSS and change the fonts. Can anyone help about the Chaning the look and feel for Submit/Cancel buttons.
I recommend you to use SASS and compass to build your own themes, or better said to change one the existing themes. In the Ext JS documentation you can find the css variables which you can set according to your needs.
If you are not ready for theming with SASS just yet take a look at this example of button configs from the sencha docs:
Stanadalone Example page: http://docs.sencha.com/extjs/4.1.3/extjs-build/examples/button/button.html
CSS that adds customized images to the buttons: http://docs.sencha.com/extjs/4.1.3/extjs-build/examples/button/button.css
JS that shows button configs: http://docs.sencha.com/extjs/4.1.3/extjs-build/examples/button/button.js
Essentially this shows how to use iconCls property on the button config along with a simple CSS class to add desired image to your button.