The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

pagination style

3 posters

Go down

Solved pagination style

Post by xiaomah01 December 30th 2011, 11:45 pm

how to use this pagination style into forums?

demo:
http://johor.forumn.org/h39-page#?page=2

css:

Code:


.manu {
   PADDING-RIGHT: 3px; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; MARGIN: 3px; PADDING-TOP: 3px; TEXT-ALIGN: center
}
.manu A {
   BORDER-RIGHT: #eee 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #eee 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #eee 1px solid; COLOR: #036cb4; PADDING-TOP: 2px; BORDER-BOTTOM: #eee 1px solid; TEXT-DECORATION: none
}
.manu A:hover {
   BORDER-RIGHT: #999 1px solid; BORDER-TOP: #999 1px solid; BORDER-LEFT: #999 1px solid; COLOR: #666; BORDER-BOTTOM: #999 1px solid
}
.manu A:active {
   BORDER-RIGHT: #999 1px solid; BORDER-TOP: #999 1px solid; BORDER-LEFT: #999 1px solid; COLOR: #666; BORDER-BOTTOM: #999 1px solid
}
.manu .current {
   BORDER-RIGHT: #036cb4 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #036cb4 1px solid; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #036cb4 1px solid; COLOR: #fff; PADDING-TOP: 2px; BORDER-BOTTOM: #036cb4 1px solid; BACKGROUND-COLOR: #036cb4
}
.manu .disabled {
   BORDER-RIGHT: #eee 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #eee 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #eee 1px solid; COLOR: #ddd; PADDING-TOP: 2px; BORDER-BOTTOM: #eee 1px solid
}


Last edited by xiaomah01 on December 31st 2011, 3:03 pm; edited 1 time in total
xiaomah01
xiaomah01
Forumember

Male Posts : 206
Reputation : 7
Language : English|Chinese|malay
Location : malaysia

http://johor.forumn.org/

Back to top Go down

Solved Re: pagination style

Post by Guest December 31st 2011, 10:48 am

Post a link to your forum that tave multiple pages.
avatar
Guest
Guest


Back to top Go down

Solved Re: pagination style

Post by xiaomah01 December 31st 2011, 11:33 am

Gassy wrote:Post a link to your forum that tave multiple pages.

no ,i mean Replaced default that

Spoiler:

change new one
pagination style NhTFx
xiaomah01
xiaomah01
Forumember

Male Posts : 206
Reputation : 7
Language : English|Chinese|malay
Location : malaysia

http://johor.forumn.org/

Back to top Go down

Solved Re: pagination style

Post by Guest December 31st 2011, 12:39 pm

I understanded first, just give the topic link form that image
avatar
Guest
Guest


Back to top Go down

Solved Re: pagination style

Post by Omu December 31st 2011, 1:04 pm

Search in vinewtopic_body :
Code:
 {PAGINATION}
And replace with:
Code:
<div class="pagination-edited">{PAGINATION}</div>
Now go to CSS Stylesheet and put this:

Code:
.pagination-edited {
margin: 1px;
color:#fff;
float:left;
text-transform: uppercase;
margin-left: 5px;
font-size:10px;
font-weight: bold!important;}

.pagination-edited a,.pagination-edited b {
padding: 4px;
color: #0061b0;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
border: 1px solid #DCDCDC;
background: #f1f1f1;}

pagination-edited a:last-child,.pagination-edited a:first-child {
padding:2px!important;}

.pagination-edited b {
padding: 4px;
color: #0061b0;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
border: 1px solid #DCDCDC;
background: #f1f1f1;}
Omu
Omu
Active Poster

Male Posts : 1021
Reputation : 87
Language : Romanian, English

http://techtitans.forumer.ro/

TonnyKamper likes this post

Back to top Go down

Solved Re: pagination style

Post by xiaomah01 December 31st 2011, 2:53 pm

Gyzmo wrote:Search in vinewtopic_body :
Code:
 {PAGINATION}
And replace with:
Code:
<div class="pagination-edited">{PAGINATION}</div>
Now go to CSS Stylesheet and put this:

Code:
.pagination-edited {
margin: 1px;
color:#fff;
float:left;
text-transform: uppercase;
margin-left: 5px;
font-size:10px;
font-weight: bold!important;}

.pagination-edited a,.pagination-edited b {
padding: 4px;
color: #0061b0;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
border: 1px solid #DCDCDC;
background: #f1f1f1;}

pagination-edited a:last-child,.pagination-edited a:first-child {
padding:2px!important;}

.pagination-edited b {
padding: 4px;
color: #0061b0;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
border: 1px solid #DCDCDC;
background: #f1f1f1;}

is work cheers

thanks u so many thumleft salut thumleft


Last edited by xiaomah01 on December 31st 2011, 3:03 pm; edited 1 time in total
xiaomah01
xiaomah01
Forumember

Male Posts : 206
Reputation : 7
Language : English|Chinese|malay
Location : malaysia

http://johor.forumn.org/

Back to top Go down

Solved Re: pagination style

Post by xiaomah01 December 31st 2011, 2:54 pm

Gassy wrote:I understanded first, just give the topic link form that image

sorry maybe i misunderstanding salut salut
xiaomah01
xiaomah01
Forumember

Male Posts : 206
Reputation : 7
Language : English|Chinese|malay
Location : malaysia

http://johor.forumn.org/

Back to top Go down

Solved Re: pagination style

Post by xiaomah01 January 1st 2012, 7:22 am

Solved¡£¡£¡£thanks move it salut
xiaomah01
xiaomah01
Forumember

Male Posts : 206
Reputation : 7
Language : English|Chinese|malay
Location : malaysia

http://johor.forumn.org/

Back to top Go down

Solved Re: pagination style

Post by Sanket January 1st 2012, 9:56 am

Topic Solved & Locked
Sanket
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

Back to top

- Similar topics

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