I've installed foundation into my Rails project using their gem and running the following 2 commands:
rails g foundation:install
rails g foundation:layout
Everything seems to be working great, the nice CSS markup and grid layout. However, my radio buttons and checkboxes don't look any different. The page that describes radio buttons and checkboxes says, "Once initialized (they're referring to jquery.foundation.forms.js which was automatically included in every Rails page) it will look for any checkbox, radio button, or select element and replace it with custom markup that Foundation provides styles for."
But my radio buttons and checkboxes look standard, not like the beautiful ones on the above example page. They suggest to set display: none; on the inputs with some custom markup to avoid the flash from normal to foundation buttons/checkboxes. That doesn't help. I even did a copy-and-paste from their example webpage to my webpage! Still no luck! Am I missing something?
I'm using Rails 3.2.8
The problem was I needed to add the class custom to the form element. Apparently all other Foundation elements work without that class, except radio buttons and checkboxes.
Related
I don't use Bootstrap, but 1 thing made me use it.
The class collapse with certain button.
I have got more than 2 thousand line of CSS and when I linked and imported BOOTSTRAP, it started remaking all my styles. In another word, Bootstrap styles and My Own CSS styles are collapsing and making unusable and ugly UI.
The question is:
Can I include only style classes that I really need?
Googled :D
I have no XP in this situation...
Within the bootstrap documentation I have found that you can download the styles separately, selecting which ones you need
https://getbootstrap.com/docs/3.4/customize/#download
https://i.stack.imgur.com/PWl7H.png
https://i.stack.imgur.com/zFCoP.png
In Bootstrap 3 you had the option to add the attribute
data-live-search="true" to enable live search.
How can I implement this feature in Bootstrap 5?
You can use what is known as a Datalist in Bootstrap5 to achieve that. It works almost exactly like the Live Search that you mentioned
Ever since I have installed JQuery mobile on my Rails 4 application, every view is now formatted by JQuery mobile. I would like to only apply JQuery mobile to one view and not the entire application. At this point Foundation is overlapping with JQuery mobile's formatting. Some textboxes are even being rendered twice. Also when validation of the textboxes fails, the page renders with another set of textboxes and Signup buttons embedded within the old ones.
I simply ended up uninstalling the jquery mobile gem and did a generic install. This seems to have worked. Still don't know exactly what happened.
Is there a way to edit your views and CSS and see the results on the fly like with a jsfiddle program? I can't seem to use jsfiddle when programming with Rails because so many of my views are Rails code.
Try the Webkit web inspector, or Firebug in Firefox. You can select any element, edit attributes, modify the css, and change the text on the page.
If you have your web running on a server (localhost works too) you can try WebPutty from Fog Creek guys to change your CSS and see the results on the fly. It's free for now.
You can read how to import your site here
I need to make a simple dropdown menu to my rails app, but all i can find is dropdown selects.
does any1 know a good guide on making dropdown menus? just a simple menus, nothing fancy
Dropdown menu is not something that is built in rails and you need a javascript plugin to achieve that.
If you are using prototype as your javascript framework in your rails app, here are some of prototype+scriptaculous based dropdown menu plugin . If you are using jQuery as your javascript framework in your rails framework, here are some of jQuery based dropdown menu plugin.
Hope that helps.