topic Re: Editing the style.css of widgets doesn't seem to have effect on the web app. in ArcGIS Web AppBuilder Questions

Editing the style.css of widgets doesn't seem to have effect on the web app.

LoutKuiper — Fri, 14 Oct 2016 09:37:09 GMT

Hey guys,

For example, I wanted to make the dart-controller-toggle go from top to bottom. So I figured it would be an easy fix. Just a matter of setting top: 0px to bottom: 0px in the /widgets/DartController/css/style.css file.

The thing is that this doesn't effect the place of the toggle.. I also see the old code (top: 0px) in the Chrome debugger instead of the bottom: 0px like it says in the CSS.

Any idea how to make changes like this?

Thanks in advance!

Lout

Re: Editing the style.css of widgets doesn't seem to have effect on the web app.

RobertScheitlin__GISP — Fri, 14 Oct 2016 11:21:09 GMT

Lout,

If you look in the dart themes code (not css) you will notice that most word happen in code and not css. What you are wanting is Not a simple css change it is a re-engineering of the themes code.

Re: Editing the style.css of widgets doesn't seem to have effect on the web app.

LoutKuiper — Fri, 14 Oct 2016 11:42:46 GMT

Hi Robert,

Thanks for your response. That is what I was afraid of.

What is the right place to make these kind of changes? I managed to change the place of the DartController widget from bottom to top by changing some values in the config,json file. Is that the place to edit these kind of things?

Re: Editing the style.css of widgets doesn't seem to have effect on the web app.

RobertScheitlin__GISP — Fri, 14 Oct 2016 11:55:10 GMT

Lout,

That might work (config changes) for top to bottom but making a change to left or right will involve CODE changes not configuration file changes. I have nvere had the desire to make the changes you are after so I can only provide general guidance. It would involve CSS, code and likely html changes to the themes\DartTheme\widgets\DartController folder.

Re: Editing the style.css of widgets doesn't seem to have effect on the web app.

LoutKuiper — Fri, 14 Oct 2016 12:23:00 GMT

Robert,

Okay, I guess that I'll have to try some things out. Do you might have an idea how to add the Toggle Controller to the config .json file? Since it is not a widget I do not know the right code.

Re: Editing the style.css of widgets doesn't seem to have effect on the web app.

RobertScheitlin__GISP — Fri, 14 Oct 2016 23:44:30 GMT

Lout,

What is the Toggle Controller?

Re: Editing the style.css of widgets doesn't seem to have effect on the web app.

LoutKuiper — Sat, 15 Oct 2016 10:42:45 GMT

Robert,

That is the triple dot "..." button to close and open de dartcontroller widget.

Re: Editing the style.css of widgets doesn't seem to have effect on the web app.

RobertScheitlin__GISP — Sat, 15 Oct 2016 12:03:19 GMT

Lout,

So you asked:

Do you might have an idea how to add the Toggle Controller to the config .json file?

The DartController already has a ... toggle to minimize the title and one to hide the zoom controls. So can you add more detail on what you are asking? In any case just adding to the config.json is not an option. Pretty much anything you want to do that is not currently configurable involves adding or manipulating JavaScript code or more.

Re: Editing the style.css of widgets doesn't seem to have effect on the web app.

LoutKuiper — Sat, 15 Oct 2016 15:25:00 GMT

Ah I see. What I would like is to move this toggle from top to bottom.