Protogalaxy

Planet #0

Hybrid前端框架开发日志#3-颜色管理模块以及信息提示工具

去实习了_(:3 」∠)_,在放置play(all the time…)的时间里完成了颜色管理模块和信息提示工具的编写,虽然看起来名字比较高大上,颜色管理,信息提示之类的,其实就是标准化了一下颜色,参考了google出来的色卡,命名了一堆颜色变量,信息提示工具其实就是四个角和head与dock的message box,改善了一下编写的语法,使得代码简洁了不少,不过很纠结输出之后的简洁度,依然在现有代码整洁度与输出代码整洁度之间徘徊,这问题还是留到以后再解决吧╮(╯_╰)╭,message box相关代码片段如下

.message-box-container-top {
  @include layer-6;
  position : fixed;
  top      : 10px;
  left     : 0;
  right    : 0;
  margin   : 0 auto;
  @media (max-width : 767px) {
    top   : 0;
    width : 100%;
  }
  @media (min-width : 768px) {
    width : 300px;
  }
  @media (min-width : 992px) {
    width : 350px;
  }
  @media (min-width : 1200px) {
    width : 350px;
  }
  @media (min-width : 2500px) {
    width : 370px;
  }
  .force-full-width {
    width : 100%;
  }
}
...

由于在纠结是否与后端相结合来生成UI效果,所以并没有做出相关的UI交互动画,预计等到表单控件之类的完成,确定整体的设计风格之后才会着手这一工作,以上。

发表评论