I’m trying to create my own website and I’m using Nanoc. I’m also writing my files in HAML and SASS.
When I’m writing into my SASS file, I always have the error
Haml::SyntaxError: Illegal nesting: nesting within plain text is illegal
when I compile (nanoc compile).
My sass files are in /content/css and I would like they go in /output/css
The thing I don’t understand is that if I put spaces or if I put a tab, it doesn’t compile. The only thing which works is when I don’t put any spaces or tabs. It compiles but the CSS in output doesn’t work.
I looked here before : https://groups.google.com/forum/#!topic/nanoc/UI4VccZCDD4 but it doesn't correct my compilation error.
I let my style.sass file and my Rules file below.
What is causing this issue and how can I resolve it?
div.title
width: 80%
background-color: #b7b8b2
If I put no spaces before width and background, it compiles but doesn't work.
#!/usr/bin/env ruby
require 'compass'
Compass.add_project_configuration 'config.rb' # when using Compass 0.10
### Compile rules
compile '/content/css/*' do
filter :sass, Compass.sass_engine_options # add the second parameter for Compass
end
compile '*' do
if item.binary?
# don’t filter binary items
else
filter :haml
layout 'default'
end
end
### Route rules
route '/content/css/*' do
#'/style.css'
# item.identifier.chop + '.css' #so that the /content/stylesheet.sass item is compiled in sass
unless item.identifier.start_with?('/content/css/_') # for partials
item.identifier.gsub(/\/$/, '') + '.css'
end
end
route '*' do
if item.binary?
# Write item with identifier /foo/ to /foo.ext
item.identifier.chop + '.' + item[:extension]
else
# Write item with identifier /foo/ to /foo/index.html
item.identifier + 'index.html'
end
end
### Layout rules
layout '*', :haml
The CSS compilation rule has an error. It should say
compile '/css/*'
instead of
compile '/content/css/*'
Item identifiers do not start with /content.
Related
I don't understand what this compile error is describing because I do define the SASS variable:
Dart Sass failed with this error: Undefined variable.
╷
64 │ color: $sc-blue-light;
│ ^^^^^^^^^^^^^^
╵
_partials/navigation/_search.scss 64:12 #use
style.scss 65:1 root stylesheet
_utilities.scss
$sc-blue-light: #5BC2E7;
_search.scss
.search {
color: $sc-blue-light;
}
_style.scss (the main stylesheet)
#use '_partials/base/_utilities';
#use '_partials/navigation/_search';
The utilities are being loaded first, which is what I've read in other answers but it's not applying here. The file paths are correct.
All my other styles compile okay. It's just when I started using variables that this error comes up.
Any thoughts?
TL;DR
Add #use rule at top of the file in _search.scss too.
With namespace
#use '_partials/base/_utilities';
.search {
color: utilities.$sc-blue-light;
}
or without namespace
#use '_partials/base/_utilities' as *;
.search {
color: $sc-blue-light;
}
Quote from official sass
Members (variables, functions, and mixins) loaded with #use are only
visible in the stylesheet that loads them. Other stylesheets will need
to write their own #use rules if they also want to access them.
and
The simplest #use rule is written #use "", which loads the module
at the given URL. Any styles loaded this way will be included exactly
once in the compiled CSS output, no matter how many times those styles
are loaded.
Read about sass #use members
Read about sass #use namespace
I have a similar issue;
I copied and edited filetype_extensions.conf in my ~/.config/geany adding:
CALIBRE=*.rul;*.svrf;*.SVRF;*.cal;
Then under ~/.config/geany/filedefs I created following files:
filetypes.CALIBRE.conf ==> my custom filetypes
filetypes.commmon ==> I wanted specific colored named_styles
# For complete documentation of this file, please see Geany's main documentation
[styling]
comment=svrf_comment
key=svrf_keyword_comment,bold
[settings]
# default extension used when saving files
extension=svrf
lexer_filetype=NONE
[keywords]
# all items must be in one line
svrf=EXT ENC INT EXPAND
# the following characters are these which a "word" can contains, see documentation
#wordchars=_abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789
# single comments, like / in this file
comment_single=//
# multiline comments
#comment_open=/*
#comment_close=*/
# set to false if a comment character/string should start at column 0 of a line, true uses any
# indentation of the line, e.g. setting to true causes the following on pressing CTRL+d
#command_example();
# setting to false would generate this
# command_example();
# This setting works only for single line comments
comment_use_indent=true
# context action command (please see Geany's main documentation for details)
context_action_cmd=
[indentation]
#width=4
# 0 is spaces, 1 is tabs, 2 is tab & spaces
#type=1
[build-menu]
# %f will be replaced by the complete filename
# %e will be replaced by the filename without extension
# (use only one of it at one time)
#FT_02_LB=_Lint
#FT_02_CM=jshint "%f"
#FT_02_WD=
#error_regex=([^:]+): line ([0-9]+), col ([0-9]+)
However when I open an svrf file type my custom filetypes is not recognized (no specific color while I chose some styling).
If I choose [styling=C] and lexer_filetype=C I am getting color for "C" code...
I also tried [styling] and lexer_filtype=NONE, but once again my custom highlight is not recognized.
I alread ready geany manual, as well as looked as some post but none of them is completely answering this subject (on the 2nd overflow link user has mapped to existing filetype hence he's not getting behavior he had wished).
geany custom filetype .sass for syntax highlighting
Geany: Syntax highlighting for custom filetype for SOME words
Do you have any idea on how to solve this issue?
I want to extend sprockets, and I think I want to do post-processing.
When in development, after application.css is created, I want to use css-flip https://github.com/twitter/css-flip to make a rtl copy of application.css, eg application.rtl.css bidi support.
Right now, I'm just trying to get something working.
I created config/initializers/sprockets.rb
require "hello_world_processor"
Sprockets.register_preprocessor('application/javascript', HelloWorldProcessor.new)
Then lib/hello_world_processor.rb
class HelloWorldProcessor
def call(input)
puts "hello world"
return { data: input[:data] + "\n'hello world'" }
end
end
I was hoping to at least see a "hello world" in the server logs, but no luck.
Anything jumping out to you as totally wrong?
I am trying to localize an existing Ruby on Rails project, and I have decided to use fast_gettext. I have tried to set things up as described on the github page (https://github.com/grosser/fast_gettext) and in this small tutorial (http://blog.lingohub.com/developers/2013/08/ruby-gettext-internationalization-tutorial-fest-gettext-gem/). However, when I do
rake gettext:find
it appears that only my .rb files are being searched and not my other files (importantly, the .erb files are not being checked).
In addition to updating my bundle to include the necessary gems, this is what I've done so far:
Added config/initializers/fast_gettext.rb. Here it is:
# config/initializers/fast_gettext.rb
FastGettext.add_text_domain 'app', :path => 'config/locales', :type => :yaml
FastGettext.default_available_locales = ['en','es']
FastGettext.default_text_domain = 'app'
I have also created lib/tasks/gettext.rake
namespace :gettext do
def files_to_translate
Dir.glob("{app,lib,config,locale}/**/*.{rb,erb,haml,slim,rhtml}")
end
end
This is index.html.erb
<div class="home_title"><%= t(:xyz) %></div>
I am setting the locale in application_controller.rb, and if I manually modify the locale file (e.g. config/locales/es.yml), the text gets translated when I open the page. However, when I run gettext, it does not create an entry for this item. I end up with an empty app.pot:
# File headers....
# Copyright, my name, etc.
#
#, fuzzy
msgid ""
msgstr ""
"Project-Id-Version: app 1.0.0\n"
"Report-Msgid-Bugs-To: \n"
"POT-Creation-Date: 2014-03-19 16:52-0700\n"
"PO-Revision-Date: 2014-03-19 16:52-0700\n"
"Last-Translator: FULL NAME <EMAIL#ADDRESS>\n"
"Language-Team: LANGUAGE <LL#li.org>\n"
"Language: \n"
"MIME-Version: 1.0\n"
"Content-Type: text/plain; charset=UTF-8\n"
"Content-Transfer-Encoding: 8bit\n"
"Plural-Forms: nplurals=INTEGER; plural=EXPRESSION;\n"
As I said above, I believe that gettext is only checking .rb files (based on some hacked logs that I placed inside the gettext code). It could also be that I need to do something extra to configure gettext to recognize this is a string to be localized:
<%= t(:xyz) %>
Thanks in advance for your suggestions.
I'm working on a site builder in rails and I would like to render the sites css using Sprockets SCSS processors. Since the user can change colors and logos, I can't use Sprockets precompilation so I've started working on a Rails SCSS template handler to handle dynamic views.
The goal is to compile 'app/views/sites/show.css.scss' any time /sites/43543.css is requested. Here's what I have so far. You'll notice I first run the template through the ERB processor and then attempt to run it through Sprockets.
https://gist.github.com/3870095
Manuel Meurer came up with an alternative solution that writes the ERB output to a path and then triggers the Asset Pipeline to compile it. I was able to get his solution to work locally but it wont work on heroku because the asset path is not writable. Files can only be written to the tmp directory and those files are only guaranteed for a single request.
http://www.krautcomputing.com/blog/2012/03/27/how-to-compile-custom-sass-stylesheets-dynamically-during-runtime/
After a long day I was able to solve my problem thanks to John Feminella and his post on google. The challenging part for me was figuring out how to create a new Sprockets::Context. Luckily John's solution doesn't require a Context.
Updated gist here
Attempt #1
This code does not allow importing css files from the asset pipeline.
#import "foundation"; works because foundation is loaded as a compass module
#import "custom_css"; results in an error message saying the file could not be found
def call(template)
erb = ActionView::Template.registered_template_handler(:erb).call(template)
%{
options = Compass.configuration.to_sass_engine_options.merge(
:syntax => :scss,
:custom => {:resolver => ::Sass::Rails::Resolver.new(CompassRails.context)},
)
Sass::Engine.new((begin;#{erb};end), options).render
}
end
Attempt #2
This code fails to embed base64 urls using asset-data-url
def call(template)
erb = ActionView::Template.registered_template_handler(:erb).call(template)
%{
compiler = Compass::Compiler.new *Compass.configuration.to_compiler_arguments
options = compiler.options.merge({
:syntax => :scss,
:custom => {:resolver => ::Sass::Rails::Resolver.new(CompassRails.context)},
})
Sass::Engine.new((begin;#{erb};end), options).render
}
end
Attempt 3
Turns out you can use empty values while creating the context. Code below works in development but throws an error in production.
ActionView::Template::Error (can't modify immutable index)
It appears the error occurs in Sprockets::Index which is used instead of Sprockets::Environment in production. Switching to Sprockets::Environment doesn't solve the problem either.
def call(template)
erb = ActionView::Template.registered_template_handler(:erb).call(template)
%{
context = CompassRails.context.new(::Rails.application.assets, '', Pathname.new(''))
resolver = ::Sass::Rails::Resolver.new(context)
compiler = Compass::Compiler.new *Compass.configuration.to_compiler_arguments
options = compiler.options.merge({
:syntax => :scss,
:custom => {:resolver => resolver}
})
Sass::Engine.new((begin;#{erb};end), options).render
}
end