Skip to content

Instantly share code, notes, and snippets.


Lili litopia

  • Seattle
View GitHub Profile
View Good Sublime Text Plugin
DocBlocker: a good way to write comment
Todo review
Git Gutter
color highlighter
litopia / gist:a1453cfde925408b31a9
Created Feb 3, 2016
Fix scrolling performance with CSS will-change property (background-attachment: css)
View gist:a1453cfde925408b31a9
background: transparent
color: $white
content: ''
position: fixed
height: 100%
width: 100%
top: 0
View gist:25db9d237092b59284fc
webkit only
background: linear-gradient(145deg, #CFE02F, #F7901E)
-webkit-background-clip: text
-webkit-text-fill-color: transparent
cross browser using svg
``` html
litopia / cssGradientAnimation.css
Last active Aug 29, 2015 — forked from anonymous/my.css
CSS Gradient Animation
View cssGradientAnimation.css
/* link: */
background: linear-gradient(254deg, #342466, #665024, #2a6624);
background-size: 600% 600%;
-webkit-animation: AnimationName 54s ease infinite;
-moz-animation: AnimationName 54s ease infinite;
-o-animation: AnimationName 54s ease infinite;
animation: AnimationName 54s ease infinite;
@-webkit-keyframes AnimationName {
    0%{background-position:0% 71%}
    50%{background-position:100% 30%}

##JShint JSHint is a static code analysis tool used in software development for checking if JavaScript source code complies with coding rules. It was forked from Douglas Crockford's JSLint project, as it was felt that the original did not allow enough customization options.

Github page for install and usage of jshint

###JShint vs. JSlint

If you're looking for a very high standard for yourself or team, JSLint. But its not necessarily THE standard, just A standard, some of which comes to us dogmatically from a javascript god named Doug Crockford. If you want to be a bit more flexible, or have some old pros on your team that don't buy into JSLint's opinions, or are going back and forth between JS and other C-family languages on a regular basis, try JSHint

JShint vs. JSlint

litopia /
Created Jun 24, 2014
Clone all branches with Git
litopia /
Created Jun 18, 2014
Install sass and bower packages in node
  • Install Lib SASS
  • Install task runner Grunt
  • Automate Task runner Grunt-watch
  • Install bourbon library via npm
  • install bower packages
  • process css taking advantages of the above

How to write a bower readme.

litopia / My_Experience_with_Style
Last active Aug 29, 2015
My Experience with Style Tiles
View My_Experience_with_Style

Why Style Tiles?

In the artical of Style Tiles: An Alternative to Full Design Comp, it illustrate the reason of using style tiles is becaue that you can present clients with interface choices without making the investment in multiple photoshop mockups.

###Issues with Photoshop Mockups The issue with full-designed Photoshop Mockups is that they are not scable at all. It takes at least 2 months to fully impletment the site from the concensent of the mockups with stakeholders. And during that 2 months, a lot of things can hanppen.

I worked with a web agency to resigned our company website before. And during the design phrase, they presented us with some really beautiful Photoshop Mockups. They were really great, very pretty. And we were so happy about those.

But the issue came after the whole website was implemented. We wanted more features. We wanted more robust features because of business growth.

You can’t perform that action at this time.