/salsa-mobilizr

CSS (and SASS) for making Salsa Labs forms mobile-friendly

Primary LanguageCSS

Salsa Mobilizr

This project aims to facilitate making key forms on Salsa Labs-powered websites mobile-friendly, by implementing responsive CSS and optionally a bit of JavaScript.

What It Does

This project contains CSS you can load into your Salsa templates so that the markup generated by Salsa will respond to different screen sizes differently, so that it fits and looks good. It also has a bit of JavaScript to make some form fields a little friendlier.

Right now the only Salsa forms supported are basic Actions and basic Donation forms.

What It Doesn't Do

This project won't make your Salsa pages fully responsive, because it doesn't contain any code for making the rest of your templates (such as the header, navigation, footer, etc) responsive. You'll need to do handle that responsive stuff yourself. Or hire someone to do it for you.

How to Use It

If you just want to get things working quickly out of the box, simply take the mobilizr.css file from this project, upload it to your Salsa instance (the same way you'd upload an image or other asset), then place a reference to the just-uploaded CSS file in your template. Ta-da! The Salsa-generated parts of your adovcacy and donation forms should now be mobile-friendlier.

If you want some control, you can edit the CSS file. But the best way is to edit the SASS.

That's right, the CSS is written in SASS and relies somewhat on the Compass library to facilitate rapid development. If you want to contribute to this project, work on the SASS files and don't bother with the generated CSS. Or, if you want to rewrite some of the CSS to suit your organization, it's probably going to be easier to edit the SASS and regenerate the CSS file, since the SASS file is more human-readable.

If you want, you can also upload and include the JavaScript file (or even better, append it to a JS file you're already loading to save an HTTP request). It won't do anything if it can't find jQuery, although by default Salsa loads (an older version of) jQuery so unless you've mucked with that, it should be fine.

Status (release history and to-dos)

This project is in its infancy. There's yet to be a tagged official release, and some SASS cleanup is needed to tease out the advocacy-specific stuff from the more general stuff. But it should be working pretty well at this stage.

For Help

This is a new project by Ben Byrne of Cornershop Creative. You can reach him at ben@cshp.co. Be patient, though, sometimes he's really busy.