Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
Sass - CSS wie es eigentlich sein sollte
qutic
November 24, 2012
Technology
0
25
Sass - CSS wie es eigentlich sein sollte
qutic
November 24, 2012
Tweet
Share
More Decks by qutic
See All by qutic
Server-Monitoring mit Zabbix
qutic
1
130
kivitendo REST API
qutic
0
61
Private Cloud mit SmartOS und Project FiFo
qutic
0
37
Open Source - eine Alternative zu FileMaker?
qutic
0
530
Server-Orchestration mit Rundeck
qutic
0
45
Erstellung hochverfügbarer Dienste mit Consul
qutic
0
25
KVM mit OmniOS
qutic
0
70
Radiant CMS
qutic
1
150
Capistrano
qutic
1
79
Other Decks in Technology
See All in Technology
スタートアップ入社4日目までに考えたAWSのセキュリティ向上/ Startup AWS Security
shonansurvivors
3
2.4k
AWS Control TowerとAWS Organizationsを活用した組織におけるセキュリティ設定
fu3ak1
2
610
Building smarter apps with machine learning, from magic to reality
picardparis
4
3.1k
1,000万人以上が利用する「家族アルバム みてね」のSRE組織は4年間でどのように作られてきたのか/SRE NEXT 2022
isaoshimizu
4
2.6k
目と耳を持った自然言語処理 - スタートアップにおける価値創出のために
yag_ays
PRO
0
510
一人から始めるプロダクトSRE / How to start SRE in a product team, all by yourself
vtryo
4
2.3k
Power BI Report Ops
hanaseleb
0
150
A Conditional Point Diffusion-Refinement Paradigm for 3D Point Cloud Completion
takmin
0
180
Embedded SRE at Mercari
tcnksm
0
780
Microsoft Power Automate で 始めるRPAと自動化
taikiyoshida
0
1.9k
Who owns the Service Level?
chaspy
5
710
數據的多重宇宙 @ LINE Taiwan
line_developers_tw
PRO
0
320
Featured
See All Featured
YesSQL, Process and Tooling at Scale
rocio
157
12k
Building Applications with DynamoDB
mza
83
4.6k
The Mythical Team-Month
searls
208
39k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
37
3.2k
Side Projects
sachag
449
37k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
3
430
Music & Morning Musume
bryan
35
4.1k
Scaling GitHub
holman
451
140k
Unsuck your backbone
ammeep
659
55k
Fontdeck: Realign not Redesign
paulrobertlloyd
73
4.1k
The Language of Interfaces
destraynor
148
20k
10 Git Anti Patterns You Should be Aware of
lemiorhan
638
52k
Transcript
© 2012 s.husch@qutic.com Sass CSS wie es eigentlich sein sollte
Was ist Sass? ‣ Sass - Syntactically Awesome Stylesheets ‣
Sass ist ein CSS Präprozessor, der Sass zu CSS ‚kompiliert‘ ‣ Folgt dem DRY Prinzip von Ruby On Rails - Don't repeat yourself ‣ Bestandteil der Rails 3 Asset Pipeline ‣ Fazit: Sass ist CSS wie es eigentlich sein sollte
Sass-Features ★ Nesting ★ Variablen ★ Funktionen ★ Mixins ★
Vererbung
Nesting
Variablen
Funktionen
Mixins
Vererbung
Alternative Syntax Sass vs. SCSS vs. CSS
Installation gem install sass
Präprozessor ‣ Syntax-Prüfung erkennt Schreibfehler ‣ @import - alles in
einer Datei ‣ Optimiertes CSS (minify, gruppierte Selektoren) ‣ $ sass --watch input-dir:output-dir ‣ $ sass --style compressed input.sass output.css
Sass-Tools und -Libraries github.com/search?q=sass&type=Repositories css2sass sass-twitter-bootstrap tenplate
Wo ist Sass noch drin? ‣ Typo3: Sassify ‣ Wordpress:
Sass for Wordpress ‣ PHP: PHamlP ‣ Python: python-sass ‣ RadiantMagic: Sass- & SCSS-Filter build in
?
Lesenswertes ‣ http://sass-lang.com ‣ http://compass-style.org/ ‣ http://thoughtbot.com/bourbon/ ‣ http://www.webkrauts.de/2011/12/04/sass-compas/ ‣
http://www.alistapart.com/articles/getting-started-with-sass/ ‣ http://pragprog.com/book/pg_sass/pragmatic-guide-to-sass ‣ https://github.com/seaofclouds/sass-textmate-bundle ‣ https://github.com/search?q=sass&type=Repositories ‣ http://css2sass.heroku.com/ ‣ https://radiantmagic.com/