Skip to main content ↑ ↓
Topic: Smooth - ElkArte Theme (Read 14583 times) previous topic - next topic
0 Members and 1 Guest are viewing this topic.

Re: Smooth - ElkArte Theme

Reply #30 –

Only these two " issues ", I guess.

Re: Smooth - ElkArte Theme

Reply #31 –

Quote from: emanuele – If you can post the selector you used it would be easier.
If you have used .linklevel1, then, that's rather normal, linklevel1 and alike are meant to be generic and applicable to many things, just use .poster and .linklevel1 together as I suggested above:
Code: [Select]
.poster .linklevel1

When I use

Code: [Select]
.poster .linklevel1 {

    background: #fff;
}

I get the following ( no user name visible, but visible at hover )

Re: Smooth - ElkArte Theme

Reply #32 –

Fixed using

Code: [Select]
.poster .name {
   
   color: black;

}

Only 1 " issue " left, board icon obscuring


Re: Smooth - ElkArte Theme

Reply #33 –

I guess I found out why the board icons are obscured. It is using class

Code: [Select]
class="board_icon off_board"

it should be

Code: [Select]
class="new_none_board"


How to change it ?

Re: Smooth - ElkArte Theme

Reply #34 –

I changed the font awesome classes to default classes. Still board icons are not appearing.
Last Edit: October 09, 2015, 06:11:06 am by Wizard

Re: Smooth - ElkArte Theme

Reply #35 –

Anybody who wish to use this theme can find it attached. Just spread good things about ElkArte in return. By the way, renamed the theme as Silk.

PS : I am still to fix the board icon issue. Will update it once I find out what went wrong

Re: Smooth - ElkArte Theme

Reply #36 –

Fixed the footer green band

Re: Smooth - ElkArte Theme

Reply #37 –

This is the part I need help with @TE

Code: [Select]
/*	$BOARDICONS	*/
/* ------------------------------------------------------- */
.board_icon {
	display: block;
	float: left;
	width: 48px;
	height: 48px;
        
}
.board_key:before {
	display: block;
	float: left;
	height: 24px;
	width: 26px;
	content: "";
}
.category_boards .board_icon, .board_key:before {
	background-repeat: no-repeat;
	background-image: url(../../images/_light/board_icons.png);
}
.on_board {
	background-position: 0 0;
}
.on2_board {
	background-position: -72px 0;
}
.off_board {
	background-position: -144px 0;
}
.redirect_board {
	background-position: -216px 0;
}
.new_some_board:before {
	background-position: -300px -14px;
}
.new_none_board:before {
	background-position: -372px -14px;
}
.new_redirect_board:before {
	background-position: -444px -14px;
}

Re: Smooth - ElkArte Theme

Reply #38 –

I want to use f114 as on, f114 with another colour as off and f08E as redirect icon.

Re: Smooth - ElkArte Theme

Reply #39 –

If you are using fontawesome, you can just drop all the background-position since they refer to the images... actually, I think you can drop the entire block of css you posted there.

I see you are already using FA, so the problem is to switch the different icons on different conditions?
Bugs creator.
Features destroyer.
Template killer.

Re: Smooth - ElkArte Theme

Reply #40 –

Thanks for the suggestion @emanuele . This piece of code did the trick

Code: [Select]
.board_icon:before {
	font-family: "FontAwesome";
	content: '\f114';
	position: relative;
	top: 5px;
	font-size: 2.7em;
	opacity: 0.8;
	color: #419EE3;
	padding-right: 5px;
}

.on_board:before {
	font-family: "FontAwesome";
	content: '\f114';
	position: relative;
	top: 5px;
        font-size: 2.7em;
	opacity: 0.8;
	color: #419EE3;
}

.off_board:before {
	font-family: "FontAwesome";
	content: '\f114';
	position: relative;
	top: 5px;
        font-size: 2.7em;
	opacity: 0.8;
	color: #605E68;
}

.redirect_board:before {
	font-family: "FontAwesome";
	content: '\f08e';
	position: relative;
	top: 5px;
        font-size: 2.7em;
	opacity: 0.8;
	color: #419EE3;
}

.new_some_board:before {
	font-family: "FontAwesome";
	content: '\f114';
	position: relative;
	top: 5px;
	font-size: 2.7em;
	opacity: 0.8;
	color: #419EE3;
	padding-right: 5px;
}


.new_none_board:before {
	font-family: "FontAwesome";
	content: '\f114';
	position: relative;
	top: 5px;
	font-size: 2.7em;
	opacity: 0.8;
	color: #605E68;
	padding-right: 5px;
}

.new_redirect_board:before {
	font-family: "FontAwesome";
	content: '\f08e';
	position: relative;
	top: 5px;
	font-size: 2.7em;
	opacity: 0.8;
	color: #419EE3;
        padding-right: 5px;
	
}

Re: Smooth - ElkArte Theme

Reply #41 –

How can I remove the variant option ?

Re: Smooth - ElkArte Theme

Reply #42 –

Just noticed, the icons on top does not appear in small screen view

Re: Smooth - ElkArte Theme

Reply #43 –

Fixed the issue. data-icon in media query for small screens was not getting read. Moved to custom_light.css


Re: Smooth - ElkArte Theme

Reply #44 –

Fixed the blue background