Skip to content

Instantly share code, notes, and snippets.

@phillbaker
Last active December 13, 2019 13:28
Show Gist options
  • Star 3 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save phillbaker/4652773 to your computer and use it in GitHub Desktop.
Save phillbaker/4652773 to your computer and use it in GitHub Desktop.
Sinatra-Assetpack + LESS (Twitter Bootstrap) demo
# app/css/app.less
.main {
border: 1 + 1px solid #eee;
border-radius: 3px;
padding: 1rem;
}
require 'rubygems'
require 'bundler/setup'
require 'sinatra/base'
require 'sinatra/assetpack'
require 'less'
class App < Sinatra::Base
set :root, File.dirname(__FILE__)
register Sinatra::AssetPack
enable :inline_templates
assets do
css_dir = 'app/css' # Same directory
serve '/css', :from => css_dir
# Add all the paths that Less should look in for @import'ed files
Less.paths << File.join(App.root, css_dir)
css :styles, '/css/styles.css', [
# '/css/bootstrap.css', # bootstrap.less
'/css/app.css'
]
css_compression :less
end
get '/' do
erb :index
end
run! if app_file == $0
end
__END__
@@ index
<html>
<head>
<%= css :styles %>
</head>
<body>
<h1>Hello!</h1>
<p class="main"><a href="#" class="btn">Link</a></p>
</body>
</html>
source :rubygems
gem 'sinatra'
gem 'sinatra-assetpack'
gem 'json'
gem 'therubyracer'
gem 'less'
@phillbaker
Copy link
Author

# Note Gist doesn't support directories, so we have to move app.less to it's place after cloning. 

git clone https://gist.github.com/4652773.git
cd 4652773
mkdir -p app/css
mv app.less app/css/
bundle install
ruby app.rb

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment