Better webdesign

[krisu5]

Enough said, in its current form it's only barely acceptable.

I maybe gonna make some concepts.

[jerone]

I'm a backend developer, but even this is too clean for me. Personally I don't like OpenUserJS.org design, so I'm eager to see what design Grease Fork is getting.

There are probably a lot skilled designers active on the site, maybe it's an idea to organize a contest where the best design is implemented.

[JasonBarnabe]

"Barely acceptable" was what I was aiming for at the start, but yes, I think it's time for some changes.

Keep in mind the design may be a bit different based on the results of https://greasyfork.org/forum/discussion/157/greasy-fork-needs-a-logo

[Makaze]

I need to stress this because I worry that the people I link my scripts to will have to ask me how to use the site most of the time. I need it to be more user friendly. Even if you don't do a full overhaul, just organizing things so that navigation is easier would be a tremendous help.

Things I would like to see:

Info / Code / Versions / Feedback: Change to buttons; maybe even a navigation bar, instead of plain links.

Headers/Sections: Add clear differences between sections that hold different kinds of info. Headers, the description box and so on should have different background colors and maybe even font colors for their designated purpose.

Streamlined search results/index page(s) (less important): Put each script on one line with the title on the left and the author's name and other info floating to the right.

Separation of search results/index items: Have each script in the list have a background color distinct from the main site background so that it's easy to tell them apart.

[JasonBarnabe]

I've made some tweaks to the individual script pages. Feedback and suggestions welcome.

[jerone]

It's a welcome improvement!
Maybe move the install button besides the script name and make it available on all tabs.
Another suggestion is to move the Moderator delete to somewhere else, because it isn't really a tab.

[JasonBarnabe]

I purposely put the install button only on the Info tab so that people could always see the main info of the script when they installed, specifically the sites affected.

Yeah, Moderator Delete looks a little odd, but since it's only 4 people seeing it...

[jerone]

Yeah, Moderator Delete looks a little odd, but since it's only 4 people seeing it...

Maybe float:right;...

[Makaze]

Definitely an improvement!

How about moving the install and the include info to the top, if it's that important? Shouldn't be too hard to fit it if that's all that's necessary.

[JasonBarnabe]

include info can be this long - https://greasyfork.org/scripts/995-adsfight

[Makaze]

Ouch. I see what you mean.

[jerone]

Small improvement (color optional) ?...

[jixunmoe]

The "Install" button doesn't look right in Code tab.

[jerone]

The "Install" button doesn't look right in Code tab.

Did you install an userscript that moves the button there, because this is not default behavior.

Edit: yes you did, this is part of Greasy Fork (Firefox or Chrome)!

[jixunmoe]

Oh, did not notice that.. Thanks ^^

Edit: After commenting out line 990~999 it looks good for me now.

[JasonBarnabe]

Small improvement (color optional) ?...

That looks good; don't suppose you actually have code to do that, do you?

[jerone]

That looks good; don't suppose you actually have code to do that, do you?

Replace the "How to install" with this HTML:

<a href="/help/installing-user-scripts" class="install-link" title="How to install">?</a>

Add float:left; to the .install-link class.

Which requires that the #script-meta needs clear:left;.

[JasonBarnabe]

I'm fairly happy with how an individual script's page shows, though I'm still open to suggestions.

Anyone have any ideas for the script list/search results?

[JasonBarnabe]

Added a logo, recolored and refonted the site, tweaked the script page some more... Feedback welcome.

[krisu5]

I like it. I made some tweaks however, styled little bit script listing, bigger search bar and small nav align. You can use it if you want.

.script-list li {
background: #EFEFEF;
border-radius: 5px;
width: 77%;
padding: 10px;
margin: 0 0 10px 0;
}

#script-search input[name="q"] {
width: 250px;
margin: 0 3px 0 0;
}

nav {
margin: 0 3px 0 0;
}

[JasonBarnabe]

Going to close this. For more specific suggestions, please create new tickets.