Again a messed up layout

Hello,

Second attempt to make a nice layout for a blog. I thought it would be easier to use bulma this time instead of bootstrap. But again a very messed up layout.

Code so far : GitHub - RoelofWobben/ruby_blog

Can someone help me to figure this out ?

Show us what is looks like and why it isn’t what you want. And what you think is the relevant code.

it looks now like this

and it should look like this : Blog - Free Bulma template

not sure what the relavant parts are but I added bulma by a the gem bulma-rails

added it here : application.css

/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *
 *= require_tree .
 *= require_self
 */

 @import "bulma";
 @import "style"; 

and on application.html.erb I have this

   <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
    <%= stylesheet_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
    <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>

It does not look like you’re getting any of there styling? Is that correct, could use the cdn link just to confirm

    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css">

Found it out. I had to rename application.css to application.scss and that costed me some days and a lot of frustation.

1 Like

Yea that’s a bummer. The default is to use sprockets requires as not everyone uses SASS.

Many people require a root .scss file from application.css and then do all their SASS @imports from there.