Pagination index is not printing properly

[lpbryant]

Hi I am using the alphabertical_paginate gem and everything is working as expected except for the line: <%= alphabetical_paginate @alphaParams %>

This prints down the page like so: .a .b .c etc

whereas I want it to print like: .a .b .c .d .e etc

the code is: in the controller: @breeds, @alphaParams = Breed.all.alpha_paginate(params[:letter]){|breed| breed.breedName} in index.html.erb: <%= alphabetical_paginate @alphaParams %>

I am new to ruby on rails, is there anything that comes to mind that I may be doing wrong ?

Thanking you in advance Leah

[nlevchuk]

@lpbryant you need to add css styles for it.

[lpbryant]

Hi Thank you for your comment. I have been trying a variety of css styles but at this point have still not found the right one. Continuing....;

[lpbryant]

Hi again,

This is my current CSS. I have lost the bullet in front of each of the letters but it works. I know there has to be a better way. Does anyone have any comments?

INDEX.HTML.ERB:

<%= alphabetical_paginate @alphaParams %>

CSS:

flex-container li

{ display: inline; font-weight:bold; letter-spacing: 4px; }

Thanking you in advance..

[lpbryant]

More: I just deployed this to heroku and it doesn't work in production. I will appreciate any and all help on this.

[lingz]

Check the database type you are using in production. If you have db mode on, compatibility is limited. On Aug 28, 2015 6:58 AM, "lpbryant" notifications@github.com wrote:

More: I just deployed this to heroku and it doesn't work in production. I will appreciate any and all help on this.

— Reply to this email directly or view it on GitHub https://github.com/lingz/alphabetical_paginate/issues/45#issuecomment-135619809 .

[lpbryant]

Hi Lingliang,

Thank you for your response. I am really not confident that my styling is the best anyway. Could you please look at the styling that I used in the previous message repeated here and tell me if you would have done it differently? Problem is I am trying to print the alphabet horizontally.

Code:

INDEX.HTML.ERB:

<%= alphabetical_paginate @alphaParams %>

CSS:

flex-container li

{ display: inline; font-weight:bold; letter-spacing: 4px; }

Thanking you in advance..

Leah

From: Lingliang Zhang [mailto:notifications@github.com] Sent: Friday, 28 August 2015 1:11 PM To: lingz/alphabetical_paginate Cc: lpbryant Subject: Re: [alphabetical_paginate] Pagination index is not printing properly (#45)

Check the database type you are using in production. If you have db mode on, compatibility is limited. On Aug 28, 2015 6:58 AM, "lpbryant" notifications@github.com wrote:

More: I just deployed this to heroku and it doesn't work in production. I will appreciate any and all help on this.

— Reply to this email directly or view it on GitHub https://github.com/lingz/alphabetical_paginate/issues/45#issuecomment-135619809 .

— Reply to this email directly or view it on GitHub https://github.com/lingz/alphabetical_paginate/issues/45#issuecomment-135621414 .Image removed by sender.

[nlevchuk]

@lpbryant try to do like this

INDEX.HTML.ERB:

<div id= "flex-container"> 
  <%= alphabetical_paginate @alphaParams %>
</div>

CSS:

#flex-container { 
  .pagination-centered li {
      display: inline;
      font-weight:bold;
      letter-spacing: 4px;
  }
}

advice: look through html source code in browser :)

[lpbryant]

Hi Nikita,

Thanks for suggestion - and your advice. I suspect I will learn something by looking through the HTML source code.

Thanks,

Leah

From: Nikita Levchuk [mailto:notifications@github.com] Sent: Saturday, 29 August 2015 4:56 AM To: lingz/alphabetical_paginate Cc: lpbryant Subject: Re: [alphabetical_paginate] Pagination index is not printing properly (#45)

@lpbryant https://github.com/lpbryant try to do like this

INDEX.HTML.ERB:

<%= alphabetical_paginate @alphaParams %>

CSS:

flex-container {

.pagination-centered li { display: inline; font-weight:bold; letter-spacing: 4px; } }

advice: look through html source code in browser :)

— Reply to this email directly or view it on GitHub https://github.com/lingz/alphabetical_paginate/issues/45#issuecomment-135860136 .Image removed by sender.

[nlevchuk]

@lpbryant did you fix this issue?

[lpbryant]

Hi. Thanks for asking!

There was no improvement adding ".pagination-centered" as you suggested - very disappointed. I was hoping that I could take out the letter-spacing with the change (because it separates the letters All", but if it is not there, the result is ALLABCDEFGHI etc. I haven't figured it out yet - I am a novice with ruby on rails (actually a novice with the whole web building thing...), but have years and years experience in other languages - which only helps to a limited degree. I eventually can get there, but it takes me a long time and lots of research. I try to only ask the questions when I have run out of possible answers.

I had also hoped your suggestion would fix the issue on Heroku, but it didn't, so I am still working on that one as well.

Thanks,

Leah

From: Nikita Levchuk [mailto:notifications@github.com] Sent: Sunday, 30 August 2015 5:49 AM To: lingz/alphabetical_paginate Cc: lpbryant Subject: Re: [alphabetical_paginate] Pagination index is not printing properly (#45)

@lpbryant https://github.com/lpbryant did you fix this issue?

— Reply to this email directly or view it on GitHub https://github.com/lingz/alphabetical_paginate/issues/45#issuecomment-136033730 .Image removed by sender.

[lpbryant]

Hi,

If this is an ignorant question, please excuse:

I am using a database. Wouldn't I need to have db mode on?

Thanking you in advance,

Leah

From: Lingliang Zhang [mailto:notifications@github.com] Sent: Friday, 28 August 2015 1:11 PM To: lingz/alphabetical_paginate Cc: lpbryant Subject: Re: [alphabetical_paginate] Pagination index is not printing properly (#45)

Check the database type you are using in production. If you have db mode on, compatibility is limited. On Aug 28, 2015 6:58 AM, "lpbryant" notifications@github.com wrote:

More: I just deployed this to heroku and it doesn't work in production. I will appreciate any and all help on this.

— Reply to this email directly or view it on GitHub https://github.com/lingz/alphabetical_paginate/issues/45#issuecomment-135619809 .

— Reply to this email directly or view it on GitHub https://github.com/lingz/alphabetical_paginate/issues/45#issuecomment-135621414 .Image removed by sender.

[nlevchuk]

@lpbryant How do your letters look like?

[lpbryant]

on the Cloud9 site: All A B C D E....

on HEROKU:

· All

· A

· B

· C

· D

· E

...

I fixed the issue of the "All" printing "A l l" by taking out the letter spacing and putting in a border.

Thanks

From: Nikita Levchuk [mailto:notifications@github.com] Sent: Wednesday, 2 September 2015 6:24 AM To: lingz/alphabetical_paginate Cc: lpbryant Subject: Re: [alphabetical_paginate] Pagination index is not printing properly (#45)

@lpbryant https://github.com/lpbryant How do your letters look like?

— Reply to this email directly or view it on GitHub https://github.com/lingz/alphabetical_paginate/issues/45#issuecomment-136851071 .Image removed by sender.

[nlevchuk]

@lpbryant give me the heroku's url.

[lpbryant]

Hi Nikita,

Thank you for looking at this! The URL is:

http://murmuring-meadow-7299.herokuapp.com/

Thanks,

Leah

From: Nikita Levchuk [mailto:notifications@github.com] Sent: Wednesday, 2 September 2015 10:41 PM To: lingz/alphabetical_paginate Cc: lpbryant Subject: Re: [alphabetical_paginate] Pagination index is not printing properly (#45)

@lpbryant https://github.com/lpbryant give me the heroku's url.

— Reply to this email directly or view it on GitHub https://github.com/lingz/alphabetical_paginate/issues/45#issuecomment-137061382 .Image removed by sender.

[lpbryant]

Hi Nikita,

The site is competely broken at the moment. I'll let you know when it is back up. Thanks

From: Nikita Levchuk [mailto:notifications@github.com] Sent: Wednesday, 2 September 2015 10:41 PM To: lingz/alphabetical_paginate Cc: lpbryant Subject: Re: [alphabetical_paginate] Pagination index is not printing properly (#45)

@lpbryant https://github.com/lpbryant give me the heroku's url.

— Reply to this email directly or view it on GitHub https://github.com/lingz/alphabetical_paginate/issues/45#issuecomment-137061382 .Image removed by sender.

[lpbryant]

it is back up

From: Nikita Levchuk [mailto:notifications@github.com] Sent: Wednesday, 2 September 2015 10:41 PM To: lingz/alphabetical_paginate Cc: lpbryant Subject: Re: [alphabetical_paginate] Pagination index is not printing properly (#45)

@lpbryant https://github.com/lpbryant give me the heroku's url.

— Reply to this email directly or view it on GitHub https://github.com/lingz/alphabetical_paginate/issues/45#issuecomment-137061382 . https://github.com/notifications/beacon/AHTzBpWvjJ9WPP3ximJ_NO31HC1TrmbMks5otuXIgaJpZM4FzJpC.gif

[lpbryant]

Hi Nikita,

I just did a new deploy with changes and the pagination now works fine.

I ended up taking your advice and looking at the source - but I looked at one on another site that had pagination and just copied what they had in their style plus some extra ones of mine. The end result is the following, which is working. I really don't know yet which one fixed it because it is too hard to delete one and deploy just to see. The style:

flex-container {

li{

display: inline;

margin:10px 0 19px;

width:100%;

clear:left;

padding-right: 4px;

font-size:15px;

font-weight:bold;

text-decoration:none;

-moz-user-select:none;

-khtml-user-select:none;

-webkit-user-select:none;

-o-user-select:none;

}

}

Thank you again for your help!

Leah

From: Nikita Levchuk [mailto:notifications@github.com] Sent: Wednesday, 2 September 2015 10:41 PM To: lingz/alphabetical_paginate Cc: lpbryant Subject: Re: [alphabetical_paginate] Pagination index is not printing properly (#45)

@lpbryant https://github.com/lpbryant give me the heroku's url.

— Reply to this email directly or view it on GitHub https://github.com/lingz/alphabetical_paginate/issues/45#issuecomment-137061382 .Image removed by sender.

[nlevchuk]

@lpbryant show me the page on your heroku's site with alphabetical pagination

[lpbryant]

Hi Nikita,

The URL is: http://murmuring-meadow-7299.herokuapp.com/breeds

It takes a bit of time for this one to load, but that is a problem for a later time....

Thanks,

Leah

From: Nikita Levchuk [mailto:notifications@github.com] Sent: Monday, 7 September 2015 2:39 AM To: lingz/alphabetical_paginate Cc: lpbryant Subject: Re: [alphabetical_paginate] Pagination index is not printing properly (#45)

@lpbryant https://github.com/lpbryant show me the page on your heroku's site with alphabetical pagination

— Reply to this email directly or view it on GitHub https://github.com/lingz/alphabetical_paginate/issues/45#issuecomment-138098376 .Image removed by sender.

[nlevchuk]

@lpbryant Ok. A little bit fix and it should still work

[lpbryant]

Thanks very much, Nikita. I have done what you suggested and it does still work. I do have one question, though: why is the "li {" left in the style sheet when it is taken out of the index.html.erb file? I tried taking that out because it didn't make sense to me to leave it in, but it didn't work without it. Leah

[nlevchuk]

@lpbryant because the "li" tag is used for every letters and it's how CSS works.

FYI http://www.w3schools.com/cssref/sel_element_element.asp

[lpbryant]

Thanks and again thanks for your help!

From: Nikita Levchuk [mailto:notifications@github.com] Sent: Tuesday, 8 September 2015 5:57 PM To: lingz/alphabetical_paginate Cc: lpbryant Subject: Re: [alphabetical_paginate] Pagination index is not printing properly (#45)

@lpbryant https://github.com/lpbryant because the "li" tag is used for every letters and it's how CSS works.

FYI http://www.w3schools.com/cssref/sel_element_element.asp

— Reply to this email directly or view it on GitHub https://github.com/lingz/alphabetical_paginate/issues/45#issuecomment-138467315 .Image removed by sender.