小编Jer*_* S.的帖子

使用Sass变量和CSS3媒体查询

我正在尝试将Sass变量的使用与@media查询结合使用,如下所示:

$base_width:1160px;

@media screen and (max-width: 1170px) {$base_width: 960px;}
@media screen and (min-width: 1171px) {$base_width: 1160px;}
Run Code Online (Sandbox Code Playgroud)

$base_width 然后在基于样式表宽度百分比的测量中的各个点处定义,以产生流体布局.

当我这样做时,变量似乎被正确识别,但媒体查询的条件不是.例如,无论屏幕宽度如何,上面的代码都会产生1160px的布局.如果我像这样触发@media语句:

@media screen and (min-width: 1171px) {$base_width: 1160px;}
@media screen and (max-width: 1170px) {$base_width: 960px;}
Run Code Online (Sandbox Code Playgroud)

无论屏幕宽度如何,它都会产生960px的布局.另请注意,如果我删除它的第一行,$base_width: 1160px;则返回未定义变量的错误.我缺少什么想法?

sass media-queries

94
推荐指数
6
解决办法
7万
查看次数

使用Meteor-Up,SSL和NGINX将Meteor部署到生产环境

我使用meps-up以https和NGINX作为代理,将我的meteor应用程序(下面的"myApp")部署到生产中很困难.特别是,我认为我在配置正确的端口和/或路径时遇到了问题.

部署在大多数方面都有效.它运行在带有mongohq(现在的compose.io)数据库的数字海洋液滴上.我的mup setup,mup reconfig(上运行我的mup.json文件现在许多倍),mup deploy与流星的所有报告没有错误的命令.如果我在数字海洋上进入我的ubuntu环境并运行status myApp它报告myApp start/running, process 10049,当我检查我的mongohq数据库时,我可以看到myApp的预期集合已创建并播种.我认为在此基础上应用程序运行正常.

我的问题是我无法找到它访问该网站,并且没有使用NGINX服务器的经验,我无法分辨我是否正在做一些非常基本的错误设置端口和转发.

我已经在下面复制了我的NGINX配置文件和mup.json文件的相关部分.

我在下面的设置中预期的行为是,如果我的meteor应用程序在mup.json中侦听端口3000,则应该在我访问该站点时显示应用程序.事实上,如果我将mup.json的env.PORT设置为3000,那么当访问该站点时,我的浏览器会告诉我有一个重定向循环.如果我将mup的env.PORT更改为80,或者完全保留env.PORT,我会收到一条502 Bad Gateway消息 - 这部分是可以预期的,因为myApp应该在localhost:3000上侦听,我不希望在其他任何地方找到任何东西.

所有帮助都非常感谢.

MUP.JSON(相关部分,如果需要显示更多内容,则为lmk)

"env": {
  "PORT": 3000,
  "NODE_ENV": "production",
  "ROOT_URL": "http://myApp.com",
  "MONGO_URL": // working ok, not reproduced here,
  "MONGO_OPLOG_URL": // working ok I think,
  "MAIL_URL": // working ok
}
Run Code Online (Sandbox Code Playgroud)

NGINX

server_tokens off;

# according to a digital ocean guide i followed here, https://www.digitalocean.com/community/tutorials/how-to-deploy-a-meteor-js-application-on-ubuntu-14-04-with-nginx, this section is needed to proxy web-socket connections …
Run Code Online (Sandbox Code Playgroud)

nginx meteor meteor-up

7
推荐指数
2
解决办法
2737
查看次数

标签 统计

media-queries ×1

meteor ×1

meteor-up ×1

nginx ×1

sass ×1