You don't need a Rails application to use Sass. Even when you're working on a static site you can generate your CSS through Sass.
sudo gem install haml
sass
in the folder, that stores your stylesheets, e.g. mkdir css/sass
sass --watch css/sass:css
. This will watch your sass files for changes and rewrite stylesheets as required.This even works on Windows.
You might want to change our [typical .gitignor...
Because they are vector, it would make sense if we could do things that other vector programs (e.g. Adobe Illustrator) can do with vector text, like draw a stroke around the individual characters. Well, we can! At least in WebKit
When Paperclip attachments should only be downloadable for selected users, there are three ways to go.
The same applies to files in Carrierwave.
The first way is to store Paperclip attachments not in the default public/system
, but in a private path like storage
inside the current release. You should prefer this method when dealing with sensitive data.
Make ...
The CSS Emoticons plugin is a simple jQuery plugin (and stylesheet) that allows you to turn any text emoticons on the page into cute little smiling faces with pure CSS3 styling (no images whatsoever).
This gem is designed to provide CSS views to Rails, and a process to concatenate and minify these files to one file for production.
Sometimes files attain executable-flags that they do not need, e.g. when your Windows VM copies them over a Samba share onto your machine.
From inside your Rails project directory call regularly:
geordi remove-executable-flags
Runs chmod -x
on Ruby, HTML, CSS, image, Rake and similar files.
This script is part of our geordi gem on github.
When you create e.g. a sidebar box that contains headlines and paragraphs, the final paragraph's margin in that box will create an undesired 'bottom padding' inside that box.
Here is a Sass mixin that you can apply to such boxes. It makes the last child's bottom margin disappear:
=hide_last_margin
>*:last-child
margin-bottom: 0
Use it like this:
.sidebar_box
p, table, ul
margin-bottom: 1em
+hide_last_margin
Does not work in versions of <IE8
Your best bet is to expli...
When deploying Rails applications you might have noticed that JS and CSS are not cached by all browsers.
In order to force Apache to add expiry dates to its response, add the attached .htaccess
to the public directory. This will add a header such as Expires: Thu, 07 Oct 2010 07:21:45 GMT
to the httpd response.
Check that you have mod_expires
enabled. You need it for the attached .htaccess
to work:
sudo a2enmod expires
You can add this:
The following Sass will do it:
hr
color: #ddd
background-color: #ddd
border: none
height: 1px
When a paperclip attachment gains a new style and you have many attachments, reprocessing can take ages. This is because all styles are being recomputed.
To create only missing images, patch Paperclip like this in your script that does the reprocessing:
Paperclip <2.3.2
class Paperclip::Attachment
private
def post_process_styles_with_extreme_lazyness
@old_styles = @styles
@styles = @styles.reject do |name, _|
exists?(name)
end
post_process_styles_without_extreme_...
To parse XML-documents, I recommend the gem nokogiri.
xml = Nokogiri::XML("<list><item>foo</item><item>bar</item></list>")
parses an xml string. You can also call Nokogiri::HTML
to be more liberal about accepting invalid XML.xml / 'list item'
returns all matching nodes; list item
is used like a CSS selectorxml / './/list/item'
also returns all matching nodes, but .//list/item
is now an XPath selector
.
...log/*
tmp/*
storage/*
db/*.sqlite3
db/schema.rb
db/structure.sql
public/system
.project
.idea/
public/javascripts/all*
public/stylesheets/all*
public/stylesheets/*.css
config/database.yml
*~
*#*
.#*
.DS_Store
webrat-*.html
capybara-*.html
rerun.txt
coverage.data
coverage/*
dump_for_download.dump
.~lock.*
.*.swp
C:\\nppdf32Log\\debuglog.txt
Web performance expert Nicole Sullivan discusses a set of best practices in the creation of supremely fast, visually impactful web sites.
Maybe I haven’t been paying close enough attention, but over the past few years an interesting variation of CSS Sprites has been getting a lot of play on large web sites that serve millions of users.
I am a huge fan of SASS (Syntactically Awesome Stylesheets) for styling Rails applications. I have been using it on all of my projects for quite a while now and have developed some great techniques that make it much easier to organize, write, and read stylesheets in an application
JSMin is a filter which removes comments and unnecessary whitespace from JavaScript files. It typically reduces filesize by half, resulting in faster downloads. It also encourages a more expressive programming style because it eliminates the download cost of clean, literate self-documentation.
Sass is a meta-language on top of CSS that‘s used to describe the style of a document cleanly and structurally, with more power than flat CSS allows. Sass both provides a simpler, more elegant syntax for CSS and implements various features that are useful for creating manageable stylesheets.