Clean & Modern style

Frink

Razor Thanks for this! I tried adjusting the width on the header and css but it didn't seem to do anything. I will give it a try now that the line breaks are imposed. Thanks!

Razor

@Frink
Go to custom header find a .customlinks class under <style> and edit left: 130px;; to left:125px or 127px, which will resolve issue with admin panel.
As u are running a little modified version of code, i will suggest u to add next code under custom header <style>
@media screen and (min-width: 768px) and (max-width: 1030px) {
.customlinks{
top:300px;
left:10px;
}
}
Which will ensure that style is looking properly on lower screen resolutions.
As well, add:
var xy = $('nav.sideNav.UserPage-nav').css("left");
if (xy=="10px"){
$('nav.sideNav.UserPage-nav').css("left", "35px");
}
else{
$('nav.sideNav.UserPage-nav').css("left", "10px");
}
In custom header under
<script>
$(document).ready(function(){
$(".hideb").click(function(){
.
.
.
});
And two last classes in css.
Thats update in code.

Frink

Razor Thanks again for your help! Here is a shot of the frontend:

Still, the backend is a bit off

Also, would you be able to move the flags and notification up underneath the search bar, then the username under those?

Thanks again for your help!

Razor

Well it can be done, but that's not how i wanted and planned style to look. U are free to customize it to match your taste.
Go to inspect element, and than target buttons, and in custom css change values for them.
U can move .customlinks for -1px or -2px more, than it will not overlap in admin panel.
No problem, if u, or somebody else, need help with any of styles created by me, feel free to ask.

Frink

Razor OK, I will give this a try and tell you how I make out!

Frink

Razor I have tweaked the theme, and am seeking your opinion. Would you mind having a look and telling me what you think? (link can be found above)

Razor

Frink
A took a look today. I hope it wasn't been hard for u to find what u wanted to change.
Keep in mind, to look at @media in css, that will tell you for which resolutions code apply. So if it is @media and (min-width:768px), code won't affect mobile version of site. Because, on mobile view, content is moved to right, as it is not how it was, and how it is supposed to look. Be aware, that changes in style affect all screen resolutions so @media is necessary in most cases.
As for changes u made, they are looking nice, i am looking forward to see how it will look when u are finished with customization of style. If u need help with anything, feel free to ask.

Frink

Razor OK, thanks for this. When I click on my username to open the user modal, it is going behind the customlinks module.... any idea why this might be happening?

Razor

Can u provide a ss?

Frink

Razor

Thats because of z-index attribute for customlinks. It was necessary to add, for links to be visible in sidebar. There was a reason why menu was appearing right to links. U can either move menu to right or links bellow button.

Frink

Razor Is there a way to adjust that attribute so it doesn't over-power the menu?

Razor

Sadly not, i couldn't think of way for menu to appear on top of links.

Frink

Razor Ok, thanks! I will keep looking!

s4m111h

nice, I was looking for the same idea

arda

@Razor Can we take this style and improve it under Extum?

(Credit included obviously)

I have some ideas (fixes and enhancements) that will make this theme more stable and better looking.

I will also convert it to an extension for easier installing and because of longer CSS.

Razor

arda
Yes, u can. You are free to modify style however you want.

arda

Razor Okay, thank you.

After I make it stable, I'll open a new topic with a different name, if you can help in any way, you're always welcomed at it's GitHub repository (I'll open it soon).

Riad

thank you Razor

Razor

Riad Looks really nice. I like changes u made.
arda
Looking forward to see what u will make.

« Previous Page Next Page »