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.

Changing CSS Code from phpBB3 to Punbb

View previous topic View next topic Go down

In progress Changing CSS Code from phpBB3 to Punbb

Post by ,dArkRay on September 14th 2013, 6:56 pm

Hey Guys! I always worked with phpBB3 since I was 10 years old, now I'm 16 and I'm considering creating a forum in Pubb so I can have more possibilities but there can be some issues, for example there are different css codes for the different platforms, right? This is my forum: http://ugrapp.forumeiros.com/


Last edited by ,dArkRay on September 14th 2013, 9:39 pm; edited 1 time in total

,dArkRay
Forumember

Posts : 98
Reputation : 1
Language : English | Portuguese

Back to top Go down

In progress Re: Changing CSS Code from phpBB3 to Punbb

Post by SLGray on September 14th 2013, 8:37 pm

When you change versions and themes, all your customized CSS is erased. Some JavaScripts which are specific to a certain version will not work. Each version also have different CSS selectors.


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


SLGray
Administrator
Administrator

Male Posts : 36697
Reputation : 2445
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

In progress Re: Changing CSS Code from phpBB3 to Punbb

Post by ,dArkRay on September 14th 2013, 9:07 pm

@SLGray wrote:When you change versions and themes, all your customized CSS is erased.  Some JavaScripts which are specific to a certain version will not work.  Each version also have different CSS selectors.
You are right, I think I will give it a try, this is my CSS (phpBB3):


Code:
@import url('http://fonts.googleapis.com/css?family=Open+Sans');
@import url('http://fonts.googleapis.com/css?family=Cousine');

/*===== Sobre o Tema =====*/

/* Nome do Tema: Ugrapp
/* Autor: Malik
/* Site do Autor: http://www.phi.pt/
/* Descripção: Um tema moderno, criado de acordo com as tendencias de 13-14, entre elas uma barra de navegação.

/*===== Barra de Navegação =====*/

ul.navlinks {
border-bottom: 1px solid transparent;
box-shadow: 0 3px 3px rgba(0,0,0,0.25),inset 0 -1px 0 rgba(0,0,0,0.1);
font-weight: 700;
height: 50px;
left: 0;
position: fixed;
right: 0;
text-align: center;
top: 0;
z-index: 99;
background-image: url(http://i72.servimg.com/u/f72/18/52/07/56/header11.png);
}

ul.linklist li {
line-height: 50px;
}

ul.linklist.navlinks li a:hover{background: rgba(255, 255, 255, 0.05);color: #ffffff;}

ul.linklist.navlinks li a{
padding: 15px 10px 15px 10px;color: #999999;
}
Do you know who to make it work in Punbb?

,dArkRay
Forumember

Posts : 98
Reputation : 1
Language : English | Portuguese

Back to top Go down

In progress Re: Changing CSS Code from phpBB3 to Punbb

Post by SLGray on September 14th 2013, 9:15 pm

punBB CSS selectors

#pun-navlinks li

#pun-navlinks li a

#pun-navlinks li a:focus

#pun-navlinks li a:hover

#pun-navlinks li a:active


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


SLGray
Administrator
Administrator

Male Posts : 36697
Reputation : 2445
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

In progress Re: Changing CSS Code from phpBB3 to Punbb

Post by ,dArkRay on September 14th 2013, 9:40 pm

@SLGray wrote:punBB CSS selectors

#pun-navlinks li

#pun-navlinks li a

#pun-navlinks li a:focus

#pun-navlinks li a:hover

#pun-navlinks li a:active
Hey, thanks! I updated my CSS code but it's not working:

Code:
@import url('http://fonts.googleapis.com/css?family=Open+Sans');
@import url('http://fonts.googleapis.com/css?family=Cousine');

/*===== Sobre o Tema =====*/

/* Nome do Tema: Ugrapp
/* Autor: Malik
/* Site do Autor: http://www.phi.pt/
/* Descripção: Um tema moderno, criado de acordo com as tendencias de 13-14, entre elas uma barra de navegação.

/*===== Barra de Navegação =====*/

pun-navlinks li {
border-bottom: 1px solid transparent;
box-shadow: 0 3px 3px rgba(0,0,0,0.25),inset 0 -1px 0 rgba(0,0,0,0.1);
font-weight: 700;
height: 50px;
left: 0;
position: fixed;
right: 0;
text-align: center;
top: 0;
z-index: 99;
background-image: url(http://i72.servimg.com/u/f72/18/52/07/56/header11.png);
}

pun-navlinks li a {
line-height: 50px;
}

pun-navlinks li a:hover{background: rgba(255, 255, 255, 0.05);color: #ffffff;}

pun-navlinks li a {
padding: 15px 10px 15px 10px;color: #999999;
}
This is my forum: http://ugrapp.forumeiros.com/

,dArkRay
Forumember

Posts : 98
Reputation : 1
Language : English | Portuguese

Back to top Go down

In progress Re: Changing CSS Code from phpBB3 to Punbb

Post by SLGray on September 14th 2013, 9:43 pm

I believe Chrome has this like Firefox, right click the area you want to change and press the link called inspect element.


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


SLGray
Administrator
Administrator

Male Posts : 36697
Reputation : 2445
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

In progress Re: Changing CSS Code from phpBB3 to Punbb

Post by ,dArkRay on September 14th 2013, 10:01 pm

@SLGray wrote:I believe Chrome has this like Firefox, right click the area you want to change and press the link called inspect element.  
I don't really understand that since I'm very new at CSS, :/

,dArkRay
Forumember

Posts : 98
Reputation : 1
Language : English | Portuguese

Back to top Go down

In progress Re: Changing CSS Code from phpBB3 to Punbb

Post by SLGray on September 14th 2013, 10:03 pm

Ok. You will need to explain what you want to do to the navigation menu.


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


SLGray
Administrator
Administrator

Male Posts : 36697
Reputation : 2445
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

In progress Re: Changing CSS Code from phpBB3 to Punbb

Post by ,dArkRay on September 14th 2013, 10:15 pm

@SLGray wrote:Ok.  You will need to explain what you want to do to the navigation menu.
This was my CSS in phpBB3:

Code:
@import url('http://fonts.googleapis.com/css?family=Open+Sans');[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
@import url('http://fonts.googleapis.com/css?family=Cousine');[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
/*===== Sobre o Tema =====*/[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
/* Nome do Tema: Ugrapp[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
/* Autor: Malik[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
/* Site do Autor: http://www.phi.pt/[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
/* Descripção: Um tema moderno, criado de acordo com as tendencias de 13-14, entre elas uma barra de navegação.[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
/*===== Barra de Navegação =====*/[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
ul.navlinks {[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
border-bottom: 1px solid transparent;[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
box-shadow: 0 3px 3px rgba(0,0,0,0.25),inset 0 -1px 0 rgba(0,0,0,0.1);[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
font-weight: 700;[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
height: 50px;[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
left: 0;[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
position: fixed;[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
right: 0;[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
text-align: center;[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
top: 0;[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
z-index: 99;[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
background-image: url(http://i72.servimg.com/u/f72/18/52/07/56/header11.png);[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
}[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
ul.linklist li {[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
line-height: 50px;[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
}[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
ul.linklist.navlinks li a:hover{background: rgba(255, 255, 255, 0.05);color: #ffffff;}[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
ul.linklist.navlinks li a{[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
padding: 15px 10px 15px 10px;color: #999999;[color=#2e8b57][font=Courier, CourierNew, sans-serif][/font][/color]
}
Basically, I want to create a fixed navigation bar, I used that code above in this link: http://mewtwoproject.motionforum.net/ so you can see what I'm talking about.

Sorry to bother you

,dArkRay
Forumember

Posts : 98
Reputation : 1
Language : English | Portuguese

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