solved Skin design

Where I have to modify the skin design to hight, left, margin to get a proper layout.

I want to change vertically the widget headers (see attached picture 1) and to reduce the left and right the unused edge (see attached picture 2) in the center of a page.


--
Christian Bernert
www.sogln.de
updated by @soglnc: 12/11/17 10:42:59PM

Hi - Welcome to Jamroom.
The tabs shouldn't be obscured like that. What skin is it on? Let me know and I'll check it out this end.
Thanks
Paul


--
Paul Asher - JR Developer and System Import Specialist

Paul skin Elastic 2.
Thanks


--
Christian Bernert
www.sogln.de

I'm not seeing this on the default Elastic2 skin.
I see from the screen shot that you have already made some CSS changes. I wonder if any of those have affected the tab hieght?


--
Paul Asher - JR Developer and System Import Specialist

Yes, I have made a copy of the Elastic 2 skin and I have reduced the hight of the header. Because I want to have always more room for the content. And also I want a various adaptation for differ sizes of screens/LCD monitors ...
That ist my actual approach http://s.sogln.de


--
Christian Bernert
www.sogln.de

You'll want to change the top padding height for the wrapper id:

skins/YOURSKIN/css/site.css file:

Hope this helps!


--

Douglas Hackney
Jamroom Team - Designer/Developer/Support
FAQ-Docs-Help Videos

Douglas, thank you for your hint.
But the proposed changes in the skins/Elstic 2/css/site.css file had non effect.

I am looking strait forward to find also a hint to set the frame width between header and footer dynamic to expand width always based by the monitor screen sizes. Hints are welcome ...


--
Christian Bernert
www.sogln.de

After making changes to the .css files and re-uploading them, make sure you clear the caches to see the effect:
ACP -> MODULES -> CORE -> SYSTEM CORE -> TOOLS -> RESET CACHE

Alternatively you can run with the caches off, but turning on developer mode:
ACP -> MODULES -> DEVELOPER -> DEVELOPER TOOLS -> GLOBAL CONFIG -> run in developer mode

Michael, I have already done, but non effect.
The only effect regarding colors appears, if I modify direkt in the ACP-Skin Setting-Skin Style-Style Selection header.css; footer.css.
But if I want to change the width from 77% to 100% for the text area in the form_element.css nothing happens.


--
Christian Bernert
www.sogln.de

Im not sure about the code in relation to the question, just trying to make sure steps to edit the .css file are appearing in your site after you upload them, so..

What you have there are 2 separate systems, the STYLE tab in the ACP and the upload the .css file. If possible I would recommend using just one or the other rather than mixing them. My preference is for the .css files because you have more control.

The way the STYLE tab works is it stores extra CSS in the database that is applied after all the .css files have been processed, so it gets the final word. It also uses the !important tag a lot so if its defined as a rule there, then no changes to the .css files are going to make any difference while there is a STYLE tab rule defined for the same thing.

Michael, your described two possibilities I have understood, also the reasons therefore. But my problem ist still open.
Please find in the two attachments my problem. In my personal page and on creating a new page using the widgets I want to expand the left edge/border as explained in my both examples (the red arrows). But I cannot find the relevant css or tpl file (code line) therefore.
Could you give me a hint.


--
Christian Bernert
www.sogln.de

That's the #content div.

The structure of your page will be something like:

and the content will have a max-width on it.

OR.....
it could be the .row class.

One of those will have a max-width of about 1280px on it. change it to max-width of 100% should fix it.

Hard to know without looking at the exact page what the right element is.

In the site.css file I have had changed yesterday the to max-width to 100%, but nothing happens.
The .row class I couldn't find yet.

My web site: s.sogln.de
I have created a short time profile login
Login: _Michael
Password: _Michael1
for you and please find attached the valid Skin site.css file.
I hope that's easier for you to identify the problem.


--
Christian Bernert
www.sogln.de

This CSS is why the tabs are behind the title section here:
http://s.sogln.de/news


This is found in the SiteBuilder modules CSS file, but can be added to any one of your skins CSS files to override it. So add this to any one of your skins CSS files and it should fix that:


As for the width, change the #content width from
to

Be sure to reset your cache after making the changes.

ACP > Core > System Core > Tools > Reset Cache
http://s.sogln.de/core/cache_reset

Hope this helps!


--

Douglas Hackney
Jamroom Team - Designer/Developer/Support
FAQ-Docs-Help Videos
updated by @douglas: 09/11/17 06:51:55AM

Douglas, thanks a lot. Now that fits all my pronounced problems.

Only one further issue is open and I have to find out a solution.
If I prepare a WEBSHOTS the following message appears (see attachment) and doesn't disappear.


--
Christian Bernert
www.sogln.de
updated by @soglnc: 09/11/17 11:00:50AM

Sorry, I don't know what webshot is?

Is that a custom module?


--

Douglas Hackney
Jamroom Team - Designer/Developer/Support
FAQ-Docs-Help Videos

No, that is the Profile Modul, it opens if I select my user id on the header menu beside the ACP.


--
Christian Bernert
www.sogln.de

Did you rename the Gallery module to webshots?

Are you using the Profile Tweaks module?


--

Douglas Hackney
Jamroom Team - Designer/Developer/Support
FAQ-Docs-Help Videos

I am using the Profile Tweaks module?


--
Christian Bernert
www.sogln.de

Webshots is one of my modules in the Marketplace.

@myjamroom, would you start a thread for that here please:
https://www.jamroom.net/ultrajam/forum/webshot

Thanks


--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)

Done


--
Christian Bernert
www.sogln.de