I'm trying to learn how to use Bootstrap with a rails application and don't understand a difference between the Bootstrap Starter Template and what I see when I load my rails app.
I copy-paste the source code of the Starter Template directly into my root view of my application. But when I run rails s, and go to localhost, the div with h1 "Bootstrap Starter Template" is displayed to the left and underneath navbar.
I've googled reasons for this, and I've seen that there's a solution to add padding to the body class.
What I don't understand:
why do I need to add the padding solution to my copy-pasted view when the same source code displays perfectly fine on the bootstrap examples page
I'm not sure if this matters, but I'm using gem bootstrap-sass version 3.3.5
Related
I am new to bootstrap and UI stuff.
Was trying implementation of grid by following this doc
https://getbootstrap.com/docs/4.1/layout/grid/
Came across this strange UI issue in my rails 5 app.
We use these gems 'bootstrap-sass'(3.3.7) and 'bootstrap_form' (2.7.0)
We have included boostrap admin.html.erb.
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet" type='text/css'>
However, in some admin pages bootstrap seems to be loading.
Whereas in some other admin pages, like the one below, bootstrap is just not loading.
Not able to figure out why.
First, Bootstrap 2.3.2 is no longer supported so I would recommend upgrading to a later version.
Second, you should really use one of the Bootstrap Gems, which comes with step-by-step instructions specific to Rails
For Bootstrap 2 and 3: Bootstrap Sass
For Bootstrap 4: Bootstrap Ruby Gem
Because you are new to Bootstrap, I would also recommend using Bootstrap 4 (unless you have a reason not to do so).
The admin part of my project is using bootstrapv2.3.2
Though my project includes 'bootstrap-sass'(3.3.7) in the Gemfile, it is rendered only in non-admin parts of my project.
The admin part renders under a different layout which uses bootstrapv2.3.2
bootstrap2.3.2 had custom styling for class name span, however it did not support col-md-*.
col-md-* was introduced in bootstrap 3 and used in higher versions as well.
That is why in pages where I have used span, bootstrap styling got applied.
When I tried using col-md bootstrap styling did not get applied.
I'm unfamiliar with how Bootstrap is implemented on a web app built on Ruby on Rails. I've been asked to create the front-end ,HTML/CSS for new pages. I strictly have been working with small, static sites so I don't know the way to go about this. I've seen that the CSS files only include the specific code that your page requires?
Does that mean that I will have to copy each component's Boostrap CSS to a separate CSS file for my page?
You can choose one of the following gems to get all the required components of bootstrap in your rails application:
Twitter Bootstrap Rails
Less Rails Bootstrap
Furthermore detailed info to implement it on pages can be get # http://www.gotealeaf.com/blog/integrating-rails-and-bootstrap-part-1
I have a brand new rails app and want to use the bootstrap-generators gem.
I have followed the instructions on their website, but if I now generate a scaffold I don't get the bootstrap styled inputs/buttons/etc.
screenshot
Notice that the button is the standard rails button, not the nice bootstrap button. As you can see, the main layout does have bootstrap theme working
I can see that the bootstrap template files are in the /lib/templates/erb/scaffold folder. If I now create a new scaffold it seems that these templates are ignored.
What am I missing, and why woudn't the bootstrap scaffold templates be used?
Spring was running in the background and therefore the new template files were not being loaded. Simply typing 'spring stop' fixed all my problems :)
I am developing an app using Ruby on Rails. In a specific view I have a textarea that uses Bootstrap Markdown.
The problem is that each time I visit that view, the textarea is rendered completely plain, without the Markdown functionality. Hitting F5 (refresh) renders the form correctly.
I tried to clear my browsers cache etc, but no luck. I always have to hit refresh to see the page correctly.
What may cause that?
Edit:
I am using this Markdown Plugin
I have also included the js files as stated in this question.
The turbolinks gem has been known to interfere with other javascript files and it's recommended that you remove it completely unless you really need it.
As Mohammad AbuShady said in his comment, you'll need to edit the part of the javascript files for your markdown that tells the page to start rendering. In your case this involves adding
$("#some-textarea").markdown({autofocus:false,savable:false})
inside page:load on the relevant pages.
In case you need turbolinks still, I found this very helpful: JQuery gets loaded only on page refresh in Rails 4 application
I had the same issue and adding jquery-turbolinks gem allowed the bootstrap-markdown editor to load perfectly for me.
I created an ASP.net MVC 4 app. Now I decided to integrate bootstrap 3.0.3 in my app. But I found out it's not easy. I searched on google and found tutorials where they explain how to integrate bootstrap with a totally new ASP.net MVC app.
Tutorial 1
Tutorial 2
My ASP.net MVC 4 app has 'Razor' as View engine and I selected the 'Internet Application' template.
Do I have to modify all the views step-by-step because I didn't chose Bootstrap at the beginning?
If I only include the bootstrap.css and bootstrap.js the pages become deformed.
You do not have to delete the Site.css file since it contains the currently defined styling for your site, if you remove it you remove your styling. If you want to include the bootstrap.css call it BEFORE your site.css file. The reason your site is deformed when you just use the bootstrap css file is because you did not design for bootstrap but your own custom Site.CSS. bootstrap can be easy or extremely hard to integrate depending on the complexity of your site. Even if you call the bootstrap css before your site css it can, and more likely will, affect how your site looks. You will just have to add it, look at the site, and the go make the needed changes to fix any issues.