德克萨斯论坛报
tt_sass的Python项目详细描述
收集^ ^ a1}样式和混合函数,用于Texas Tribune。
安装和配置
您可以使用pip这样安装:
pip install tt_sass
安装后,需要将其添加到INSTALLED_APPS。你能做到的 不管您喜欢什么,也可以在^{tt1}之后复制并粘贴$ 是有定义的。
INSTALLED_APPS += ['tt_sass', ]
tt_sass依赖于django-staticfiles才能工作。你必须逃跑 项目中的collectstatic命令如下:
python manage.py collectstatic --link
记住,在添加新的静态文件时,必须重新运行此命令。
现在您可以开始使用tt_sass。
用法
您可以在您的sass中添加以下内容:
@import "tt_sass/texastribune"
一旦你做到了,你需要编译你的sass。假设你正在使用 在项目根目录中有一个static目录的默认德克萨斯论坛设置, 您应该运行以下命令:
sass --load-path=static/ --watch --poll --compass static
此命令为所有代码正确设置路径,并监视 文件更改。
使用网格
网格基于Chris Coyer’ssimple grid。语法已经 改变了一点点,它被混合了,但是这个概念是 同样的。
要创建一个网格,类似于像foundation和bootstrap这样的框架中的一行, 使用.grid类。在网格中,添加单元格并告诉它们距离 跨越。例如,您这样做是为了创建一个包含12列的网格 和两个单元格,一个是8列,一个是4列:
<div class="grid"> <div class="cell w-8"></div> <div class="cell w-4"></div> </div>
创建语义网格
todo
< H3>使用反应性混合蛋白< EH3>
^ tt3}$为您提供一个用于处理响应的^ {TT9}$MIXIN 设计。它内置以下断点:
- 移动肖像
- 默认为max-width: 320px
- 手机
- 默认为max-width: 720px
- 片剂
- 默认为min-width: 720px
- 经典型
- 默认为min-width: 960px
通过将变量的名称设置为prior,您可以覆盖这些值中的任何一个 导入tt_sass/texastribune。
<>你使用这样的混音:p +breakpoint(mobile) font-size: 1.2em +breakpoint(tablet) font-size: 1.1em +breakpoint(classic) font-size: 1.0em
也可以指定任意断点:
div +breakpoint("max-width: 500px") background-color: red
各种助手
todo
示例
所有这些都记录在example/django项目中。看那个 有关如何运行该项目的说明的目录。
贡献
这个项目的发布是希望它能帮助人们理解 构建您自己的sass框架,以便在django项目的上下文中使用。作为 德克萨斯论坛报以外的人可能不会 认可的。