Skip to content

Instantly share code, notes, and snippets.

Emmet
DocBlocker: a good way to write comment
Todo review
Git Gutter
Git
color highlighter
@litopia
litopia / gist:a1453cfde925408b31a9
Created February 3, 2016 21:35
Fix scrolling performance with CSS will-change property (background-attachment: css)
.fixed-background-container
background: transparent
color: $white
&:before
content: ''
position: fixed
height: 100%
width: 100%
top: 0
webkit only
```css
.text-gradient
background: linear-gradient(145deg, #CFE02F, #F7901E)
-webkit-background-clip: text
-webkit-text-fill-color: transparent
```
cross browser using svg
``` html
@litopia
litopia / cssGradientAnimation.css
Last active August 29, 2015 14:12 — forked from anonymous/my.css
CSS Gradient Animation
/* link: http://www.gradient-animator.com/ */
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%}
@litopia
litopia / _jshint.md
Last active August 29, 2015 14:04
JShint

##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
litopia / clone_all_branches_with_git.md
Created June 24, 2014 18:45
Clone all branches with Git
@litopia
litopia / Install_sass_and_bower_packagesin_node.md
Created June 18, 2014 20:31
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
litopia / My_Experience_with_Style _Tiles.md
Last active August 29, 2015 14:01
My Experience with Style Tiles

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.