free flexbox templates built with the bulma css framework

  • By null
  • Last update: Dec 29, 2022
  • Comments: 12

Bulma Templates

Free Templates for the Bulma CSS Framework bulma version PRs welcome Open in Visual Studio Code

Versions

The original bulma templates were made with version 0.1.1 and can be found in the 0.1.1 branch. The newest templates are made with version 0.9.0 and can be found in the master branch. The templates on bulmatemplates.github.io/bulma-templates are based on the master branch.

Templates

The templates are located in the /templates directory, and you can preview them on the demo website

Contributing

  1. Fork it!
  2. Create your feature branch: git checkout -b my-new-feature
  3. Commit your changes: git commit -am 'Add some feature'
  4. Push to the branch: git push origin my-new-feature
  5. Submit a pull request :D

Licence

Code released under the MIT license.

Github

https://github.com/dansup/bulma-templates

Comments(12)

  • 1

    Added [personal/portfolio] template

    • [ ] Update template specific styles
    • [x] Add basic template
    • [ ] Review

    This is still in progress, please don't merge it yet. This PR is for review purposes.

  • 2

    Template Requests

    My original goal for this project was to create a bunch of templates that showcase what you can do with bulma.

    If you have any ideas or suggestions for a new template, post a comment in this issue and I will do my best to accommodate everyones requests.

  • 3

    New aside nav drawer

    I recreated a simpler nav drawer using bulma's panel classes for layout and styling. This template is very simple and can easily be modified to allow for more complex layouts. If a hero is wanted in the nav drawer I believe that can go in the panel-header or replace the panel header.

  • 4

    release

    Now that everything is more or less tip-top, it would be actually a very good move to create a new release, since nothing was released for over a year now, and everything is updated to 0.7.1.

    perhaps it would be also good to version it as 0.7.1. [per existing number version of bulma]

  • 5

    update bulma to 0.8.0

    looking for someone to update bulma to freshly released 0.8.0 version in all templates.

    this is ideal for new coders, so be our guest and get yourself some PR's in pocket, to win that t-shirt and help open source community.

    cheers!

  • 6

    WIP-branch?

    I recently commented on #41 asking if there's any work in progress branch I can contribute to. I don't mind sending my contributions to the gh-branch, but I have read in several issue comments that you're working in several improvements to the project and I wouldn't want to step on your toes.

  • 7

    GRID with 'panel-block' and wondering about TILES with 'ancestor-parent-child'

    Seriously AWESOME. Just found your updates and have been thinking to have... -- hero with grid-gallery underneath.

    So, starting with hero.html (NICE!) then I figured to cut the grid portion out of grid-gallery.html,

    In past months i've been trying stuff with the grid/tiles page at: http://bulma.io/documentation/grid/tiles/

    Then noticed - you're using <div class="panel-block"> for the grid stuff. Wanted to ask you if there's a reason for using that instead of the way it is in the doc at bulma.io?

    <div class="tile is-ancestor">
<div class="tile is-parent is-vertical">
<article class="tile is-child box">

    As a beginner and a hack at that,, right now I can only add that the way the tiles (ancestor-parent-child) works in the docs at http://bulma.io/documentation/grid/tiles/ might have some flexibility at some point though i don't really know yet.

    interested to know if you like, or may use the tiles (ancestor-parent-child) stuff in any template. I'm guessing that i'll need some of what i see when resizing and reading the features at http://bulma.io/documentation/grid/tiles/ .

    Sorry I haven't thought of how to explain it much yet.

    Whatever happens - KNOCKED OUT HAPPY about your work !

  • 8

    Template example showing navbar centered pages

    Hi, I wonder if you can explain or how to create a template showing a navbar where the pages are centered and spaced

    I am a noobie to bulma and being trying to play with the examples and figure out levels / flex to get a layout but struggling (based on desktop layout)

    <-Padding/Margin--> Logo <-- Pages Centred to Space Justify Page Width --><Login & Signup But><-Padding/Margin--> I Logo | Page 1 Page 2 Page 3 | Login Signup | | Left | Centered | Spaced | Right Align |

    Similar to the layout as https://getgrav.cms/ , if you see the home page there is quite a lot of good stuff that could be bulma-ised . I am looking to create something with the sticky scroll on page menu footer as well :)

    Its probably something simple that I am not just seeing :) Thank you

  • 9

    fix issue#88

    This pull request is in response to issue #88 Changes:

    • Fix accidental commenting of kanban
    • Make video in tabs.html responsive
    • make cards in kanban and kanban.js responsive
  • 10

    Update bulma to 0.7.2

    Changes:

    • update all pages to Bulma 0.7.2
    • format all code to be consistent with index.html (this does not change the code, just the indentation.)
    • find and replace 0.7.1 to 0.7.2 in readme
  • 11

    [Enhancement] Analyze and Convert (if possible) Home Page to Vue Application

    • [ ] Create a vue application
    • [ ] Add all required routes/paths
    • [ ] Setup layout
    • [ ] Add all templates examples data
    • [ ] Add lint tools for code consistency
    • [ ] Update travis script
  • 12

    Are any particular templates needed?

    Hey guys, I created the contact page template now I'm wanting to create another template. But before I make one I'm wondering if there is a particular template you guys would like?

Popular Tag

Related