Page 1 of 1

Now making over Oldnema's "Dating" template

Posted: Sat Oct 13, 2018 4:15 pm
by Nicky
For an 'old school' website trying to make it over to a responsive version, but keeping +/- the same 'look'. Oldnema's 'Dating' template could do the trick!

I already changed some layout, fonts and color schemes, but some additional changes I want to make are hidden in css codes I can't seem to find.

Attached is the result of my updates (before), but (after) shows what the result should eventually be.. (after).

So, I want to:

- remove newsboxes on the right= OK.
- instead of 3 columns (navi - content - newsboxes) I want 2 columns: navigation buttons on the left and content on the right
- I want the content to start on the same height as the top of the navigation box (I already removed the 'locator')
- some distance between navigation boxes and content, also a space on the right side of the wrapper

In annex before and after 'ideal situation'... Hopefully not too complicated, help much appreciated in advance!

Stylesheet is here -> https://www.support-u.be/demosite/templ ... esheet.css, or feel free to login to demosite, it temporarily has the test PW www.support-u.be/demosite

Re: Now making over Oldnema's "Dating" template

Posted: Sat Oct 13, 2018 7:05 pm
by lck
stylesheet.css

Code: Select all

/* Line 33 */
.content_in {
	/* padding: 0 1em 1em; */
	padding: 0 15px 15px 30px; /* NEW */
}

/* New (add it to a new line after line 33) */
.content_in h1:first-of-type {
	margin-top: -10px;
	padding-top: 0;
}

/* Line 39 */
#boxs {
	width: 100%;
	clear: both;
	margin-top: -1.0em;
	overflow: hidden;
	display: none; /* NEW, add this */
}

/* Line 149 */
@media screen and (min-width: 1600px) {

#iconmenu {visibility:hidden;} /* added: hash # before iconmenu */
/* ... */
#content {width: 75%;} /* changed: from 50% to 75% */
/* ... */
}
Meets its purpose. For smaller viewports then adjustments are necessary, especially with the mobile menu-icon and the website-title.