Adding LESS!
This commit is contained in:
Gregory Koberger
Родитель
62eb03a075
Коммит
9bfc0b5b2d
|
|
@ -11,6 +11,7 @@ build.py
|
|||
*-all.css
|
||||
*-min.js
|
||||
*-all.js
|
||||
*.less.css
|
||||
locale
|
||||
vendor
|
||||
.noseids
|
||||
|
|
|
|||
|
|
@ -52,3 +52,57 @@ script included in homebrew. To let zamboni know about Redis, add this to
|
|||
|
||||
The ``REDIS_BACKEND`` is parsed like ``CACHE_BACKEND`` if you need something
|
||||
other than the default settings.
|
||||
|
||||
|
||||
--------
|
||||
LESS CSS
|
||||
--------
|
||||
|
||||
We're slowing switching over from regular CSS to LESS. You can learn more about
|
||||
LESS at http://lesscss.org.
|
||||
|
||||
If you are serving your CSS from the same domain as the page, you don't
|
||||
need to do anything. Otherwise, see "Installing LESS (alternative)" below.
|
||||
|
||||
You can make the CSS live refresh on save by adding ``#!watch`` to the URL or by
|
||||
adding the following to your ``settings_local.py``::
|
||||
|
||||
LESS_LIVE_REFRESH = True
|
||||
|
||||
If you want syntax highlighting, try:
|
||||
* vim: http://leafo.net/lessphp/vim/
|
||||
* emacs: http://jdhuntington.com/emacs/less-css-mode.el
|
||||
* TextMate: https://github.com/appden/less.tmbundle
|
||||
* Coda: http://groups.google.com/group/coda-users/browse_thread/thread/b3327b0cb893e439?pli=1
|
||||
|
||||
|
||||
Installing LESS (alternative)
|
||||
*****************************
|
||||
|
||||
You only need to do this if your CSS is being served from a separate domain, or
|
||||
if you're using zamboni in production and running the build scripts.
|
||||
|
||||
If you aren't serving your CSS from the same domain as zamboni, you'll need
|
||||
to install node so that we can compile it on the fly.
|
||||
|
||||
First, we need to install node, npm and LESS::
|
||||
|
||||
brew install node
|
||||
curl http://npmjs.org/install.sh | sh
|
||||
npm install less
|
||||
|
||||
If you type ``lessc``, it should say "lessc: no input files."
|
||||
|
||||
Next, add this to your settings_local.py::
|
||||
|
||||
LESS_PREPROCESS = True
|
||||
LESS_BIN = 'lessc'
|
||||
|
||||
Make sure ``LESS_BIN`` is correct.
|
||||
|
||||
Not working?
|
||||
* If you're having trouble installing node, try http://shapeshed.com/journal/setting-up-nodejs-and-npm-on-mac-osx/. You need brew, which we used earlier.
|
||||
* If you're having trouble with npm, check out the README on https://github.com/isaacs/npm
|
||||
* If you can't run LESS after installing, make sure it's in your PATH. You should be
|
||||
able to type "lessc", and have "lessc: no input files" returned.
|
||||
|
||||
|
|
|
|||
|
|
@ -244,5 +244,5 @@ Advanced Installation
|
|||
---------------------
|
||||
|
||||
In production we use things like memcached, rabbitmq + celery, sphinx, redis,
|
||||
and mongodb. Learn more about installing these on the
|
||||
mongodb and LESS. Learn more about installing these on the
|
||||
:doc:`./advanced-installation` page.
|
||||
|
|
|
|||
|
|
@ -1,4 +1,3 @@
|
|||
|
||||
.site-title {
|
||||
padding-top: 27px;
|
||||
max-width: 530px;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,4 @@
|
|||
if(document.getElementById('live_refresh')) {
|
||||
less.env = "development";
|
||||
less.watch();
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
var links = document.getElementsByTagName('link');
|
||||
for (var i = 0; i < links.length; i++) {
|
||||
if (links[i].href.match(/\.less$/)) {
|
||||
links[i].type = "text/x-less";
|
||||
}
|
||||
}
|
||||
Разница между файлами не показана из-за своего большого размера
Загрузить разницу
11
settings.py
11
settings.py
|
|
@ -29,6 +29,11 @@ DEBUG = True
|
|||
TEMPLATE_DEBUG = DEBUG
|
||||
DEBUG_PROPAGATE_EXCEPTIONS = True
|
||||
|
||||
# LESS CSS OPTIONS (Debug only)
|
||||
LESS_PREPROCESS = False # Compile LESS with Node, rather than client-side JS?
|
||||
LESS_LIVE_REFRESH = False # Refresh the CSS on save?
|
||||
LESS_BIN = 'lessc'
|
||||
|
||||
ADMINS = (
|
||||
# ('Your Name', 'your_email@domain.com'),
|
||||
)
|
||||
|
|
@ -486,6 +491,12 @@ MINIFY_BUNDLES = {
|
|||
'js/zamboni/truncation.js',
|
||||
'js/zamboni/mobile.js',
|
||||
),
|
||||
# This is included when DEBUG is True. Bundle in <head>.
|
||||
'debug': (
|
||||
'js/debug/less_setup.js',
|
||||
'js/lib/less-1.0.41.js',
|
||||
'js/debug/less_live.js',
|
||||
),
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -26,6 +26,14 @@
|
|||
|
||||
{% block extrahead %}{% endblock %}
|
||||
<noscript><link rel="stylesheet" href="{{ media('css/legacy/nojs.css') }}"></noscript>
|
||||
|
||||
{% if settings.DEBUG %}
|
||||
{% if settings.LESS_LIVE_REFRESH %}
|
||||
<meta id="live_refresh" name="live_refresh" value="1">
|
||||
{% endif %}
|
||||
{{ js('debug') }}
|
||||
{% endif %}
|
||||
|
||||
</head>
|
||||
<body class="html-{{ DIR }} {{ request.APP.short }} moz-header-slim {% block bodyclass %}{% endblock %}"
|
||||
data-app="{{ request.APP.short }}"
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче