The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

[Invision] ids and classes for CSS customization

View previous topic View next topic Go down

Solved [Invision] ids and classes for CSS customization

Post by Klemen on August 16th 2015, 1:26 pm

Hello,

I recently made a new forum and decided on the Invision skin this time around. I thought it wouldn't be a big change from phpbb3, but it turns out that all the id and class names are different. I found some helpful pages so far (http://fmthemes.forumotion.com/t169-css-different-css-codes-for-invision) but it doesn't list all of them.

Also, is there a general way to distinguish between the version's class names? I'm asking because a lot of help threads don't list the forum version which is quite a hassle for a noob like me. Finding out whether the given solution works for your version is time consuming as well.

Anyway, I thought I would open up a thread where I could ask all css(and other)-related invision problems in the near future as I keep designing my forum, so that I wouldn't have to make a new thread for every little problem.

(solved) 1. For starters, what's the invision equivalent for phpbb3's "li.row"? I want to change the color of a row and make the whole row a different color on mouse hover.

(solved) 2. So, I made these banners that extend from the navigation bar and wrap around the header.

CSS:
Code:
body{
 background-image: url('http://i.imgur.com/IbsNyIX.png'),
  url('http://i.imgur.com/UA8ei1e.png'),
  url('http://i.imgur.com/VJ55nCI.png'),
  url('http://i.imgur.com/EJFeyVZ.png'),
  url('http://i.imgur.com/MeEHunC.png');
 

 background-repeat : no-repeat,
  no-repeat,
  no-repeat,
  no-repeat,
  repeat;
 

 background-position: 4% 92px,
  96% 92px,
  2% 93px,
  98% 93px,
  0%, 0%;
 
 
 position: fixed, fixed, fixed, fixed, fixed;
 
 z-index: 999, 999, 998, 998, -50;
 
 background-attachment: scroll, scroll, scroll, scroll, fixed;
}

I want the header to drop a box-shadow, but not on the banners which are in the background. I tried playing around with the z-index, but nothing works. No matter what, the shadow always drops on the background. Is there a solution to this?

3. Related to the body background code above; I can't seem to add another background image to the 5 above. If I add a 6th, everything just breaks and behaves out of control. Is there a limit of 5 background images or something?

(solved) 4. A JS script to force the desktop version on mobile works fine on my other phpbb3 forum (http://www.gr33nchip.com), but not on this one. How do I modify it to make it work?
Code:
$(function() {
 if(window._userdata && _userdata.page_desktop) window.location = _userdata.page_desktop;
});

(solved) 5. How do I remove the footer of each "#ipbtable index-box"? Those are the empty footers under each category box.

(solved) 6. The @font-face function doesn't work on Firefox, but seems to work on other browsers that I've tried. Why? Do I need other font formats for Firefox? Which?

Code:
@font-face {
 font-family: 'Roboto';
 font-style: normal;
 font-weight: 400;
 src: local('Roboto'), local('Roboto-Regular'), url(http://fonts.gstatic.com/s/roboto/v15/CWB0XYA8bzo0kSThX0UTuA.woff2) format('woff2'), url(http://fonts.gstatic.com/s/roboto/v15/2UX7WLTfW3W8TclTUvlFyQ.woff) format('woff');
}

body {
 font-family: 'Roboto', 'Roboto-Regular', 'Arial';
}

(solved) 7. How do I remove the "new posts", "no new posts", "forum is locked" and that whole box at the bottom of the home page?

(solved) 8. Can I position the "new posts" icon outside the row?


(solved) 9. I'd like to modify the tables, but I'm not sure how, Is this done through editing the templates?

Here's how the forum looks now:

And here's how I want to customize it:



I'll post more questions as I go.


Thank you


Last edited by Klemen on August 24th 2015, 2:34 am; edited 8 times in total

Klemen
Forumember

Male Posts : 292
Reputation : 32
Language : English, German, Slovene

http://www.bannedbrotherhood.com

Back to top Go down

Solved Re: [Invision] ids and classes for CSS customization

Post by SLGray on August 16th 2015, 3:58 pm

7.
Code:
.ul-icons-home {
  display: none;
}
.activeusers {
  display: none;
}

5.
Code:
table.ipbtable tfoot td {
  display: none;
}


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36639
Reputation : 2441
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: [Invision] ids and classes for CSS customization

Post by Klemen on August 17th 2015, 1:59 pm

@SLGray - thanks, the codes worked perfectly


I also added new questions.

Klemen
Forumember

Male Posts : 292
Reputation : 32
Language : English, German, Slovene

http://www.bannedbrotherhood.com

Back to top Go down

Solved Re: [Invision] ids and classes for CSS customization

Post by Klemen on August 20th 2015, 2:12 am

I managed to solve most of this myself through editing the templates and css.

However, I have no idea about JS, so I'd really like a solution to problem number 3, if possible.

Thank you

Klemen
Forumember

Male Posts : 292
Reputation : 32
Language : English, German, Slovene

http://www.bannedbrotherhood.com

Back to top Go down

Solved Re: [Invision] ids and classes for CSS customization

Post by Klemen on August 21st 2015, 7:36 pm

Bump. I need a solution to number 3; what's the javascript for automatically redirecting mobile users to the desktop page?

Klemen
Forumember

Male Posts : 292
Reputation : 32
Language : English, German, Slovene

http://www.bannedbrotherhood.com

Back to top Go down

Solved Re: [Invision] ids and classes for CSS customization

Post by Klemen on August 24th 2015, 2:33 am

Found solution for my number 3 problem here: help.forumotion.com/t140831p30-smartphone-site-seems-otherwise#966257

Thanks @Ange Tuteur huhohi


Topic solved.

Klemen
Forumember

Male Posts : 292
Reputation : 32
Language : English, German, Slovene

http://www.bannedbrotherhood.com

Back to top Go down

Solved Re: [Invision] ids and classes for CSS customization

Post by SLGray on August 24th 2015, 4:09 am

Topic solved and archived


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36639
Reputation : 2441
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum