GithubHelp home page GithubHelp logo

Material design compatibility about pagy HOT 12 CLOSED

ddnexus avatar ddnexus commented on May 21, 2024
Material design compatibility

from pagy.

Comments (12)

mattboldt avatar mattboldt commented on May 21, 2024 1

Right, materialize has pagination built in. MDL does not. The former will be easy to add, so I’ll do that for now.

from pagy.

ddnexus avatar ddnexus commented on May 21, 2024

Yes! Your contribution is very welcome!

It would be nice if you could add some more details about what and how you plan to add, in order to match the overall policy about extras.

Please let me know if you need any help. Thank you!

from pagy.

mattboldt avatar mattboldt commented on May 21, 2024

I was thinking of implementing these:

https://getmdl.io/
https://materializecss.com/

I personally use mdl, but I bet people would like to have a few out of the box to make a transition to pagy easier.

I noticed you've got helper methods for bootstrap as well as partials. Any reason for not using one or the other?

from pagy.

ddnexus avatar ddnexus commented on May 21, 2024

Helpers are just concatenating strings with a simple logic in pure ruby with no framework dependencies. They are really fast, but less easy to read and write.

Templates use a template engine, hence they have an overhead that makes them 40-80% slower than helpers. That means that they are still a lot faster than using the other gems, but they are slower and use more memory than helpers. They are easier to read and write, which makes them useful for unskilled users that need some quick and easy customization.

For that reason you might want to provide both in your extra, although helpers are a mandatory component for an extra, while templates are just a nice addition.

from pagy.

ddnexus avatar ddnexus commented on May 21, 2024

@mattboldt Any progress? Please, let me know if I can help. Thanks.

from pagy.

mattboldt avatar mattboldt commented on May 21, 2024

Sorry; I'm stumbling a little bit on the code. Our styles are very different and it's been difficult to try and match the existing extras. On top of that, the MDL library does not already have a pagination component. I might start with Materializecss instead.

from pagy.

ddnexus avatar ddnexus commented on May 21, 2024

Unless I am missing something, that looks quite easy.

According to the materializecss pagination doc, you should just duplicate and rename the bootstrap extra like materializecss extra, then rename the pagy_nav_bootstrap to pagy_nav_materializecss and edit its strings as indicated in the materializecss pagination doc.

Replace the bootstrap-specific classes (like page-link and page-item) with the materializecss classes and leave all the rest as it is, wrapped in the nav tag.

Please, let me know if you need any help. Thanks.

from pagy.

ddnexus avatar ddnexus commented on May 21, 2024

Great! Thanks!

from pagy.

ddnexus avatar ddnexus commented on May 21, 2024

@mattboldt News?

from pagy.

ddnexus avatar ddnexus commented on May 21, 2024

After no activity for so long I decided to write it myself.

from pagy.

mattboldt avatar mattboldt commented on May 21, 2024

Really sorry, I just haven't had time for dev work outside of my day job. Sorry for holding this up, and thank you for adding the feature!

from pagy.

ddnexus avatar ddnexus commented on May 21, 2024

Implemented in dev. No optional templates though... it would be a nice addition when someone will have time.

from pagy.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.