Last active
November 30, 2019 22:50
-
-
Save juliomerisio/0d69100a1b8677c8deab1d5a046715ed to your computer and use it in GitHub Desktop.
CSS Snippets that improve my productivity
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"align-items": { | |
"prefix": "ai", | |
"body": "align-items: ${1|flex-start,flex-end,center,baseline,stretch,start,end,self-start,self-end|};$0", | |
"description": "initial value: stretch" | |
}, | |
"align-items: baseline": { | |
"prefix": "aib", | |
"body": "align-items: baseline;$0" | |
}, | |
"align-items: center": { | |
"prefix": "aic", | |
"body": "align-items: center;$0" | |
}, | |
"align-items: flex-start": { | |
"prefix": "aifs", | |
"body": "align-items: flex-start;$0" | |
}, | |
"align-items: flex-end": { | |
"prefix": "aife", | |
"body": "align-items: flex-end;$0" | |
}, | |
"align-items: stretch": { | |
"prefix": "ais", | |
"body": "align-items: stretch;$0" | |
}, | |
"align-self": { | |
"prefix": "as", | |
"body": "align-items: ${1|flex-start,flex-end,center,baseline,stretch,auto|};$0", | |
"description": "initial value: auto" | |
}, | |
"animation": { | |
"prefix": "ani", | |
"body": "animation: ${1:name} ${2:1s} ${3|linear,ease-in-out,ease,ease-in,ease-out,step-start,step-end,steps,cubic-bezier|};$0", | |
"description": "animation: name duration timing-function delay direction count fill-mode play-state" | |
}, | |
"animation-delay": { | |
"prefix": "anide", | |
"body": "animation-delay: ${1:1s};$0" | |
}, | |
"animation-direction": { | |
"prefix": "anidi", | |
"body": "animation-direction: ${1|alternate,alternate-reverse,reverse,normal|};$0", | |
"description": "initial value: normal" | |
}, | |
"animation-duratuion": { | |
"prefix": "anidu", | |
"body": "animation-duration: ${1:1s};$0" | |
}, | |
"animation-fill-mode": { | |
"prefix": "anifm", | |
"body": "animation-fill-mode: ${1|forwards,backwards,both,none|};$0", | |
"description": "initial value: none" | |
}, | |
"animation-iteration-count": { | |
"prefix": "aniic", | |
"body": "animation-iteration-count: ${1:infinite};$0", | |
"description": "initial value: 1" | |
}, | |
"animation-name": { | |
"prefix": "anin", | |
"body": "animation-name: ${1:name};$0" | |
}, | |
"animation-play-state": { | |
"prefix": "anips", | |
"body": "animation-play-state: ${1|paused,running|};$0", | |
"description": "initial value: running" | |
}, | |
"animation-timing-function": { | |
"prefix": "anitf", | |
"body": "animation-timing-function: ${1|linear,ease,ease-in-out,ease-in,ease-out,step-start,step-end,steps,cubic-bezier|};$0", | |
"description": "initial value: ease" | |
}, | |
"background": { | |
"prefix": "bg", | |
"body": "background: ${1};$0", | |
"description": "background: image position/size repeat attachment box box" | |
}, | |
"background-attachment": { | |
"prefix": "bga", | |
"body": "background-attachment: ${1|fixed,scroll,local|};$0", | |
"description": "initial value: scroll" | |
}, | |
"background-color": { | |
"prefix": "bgc", | |
"body": "background-color: ${1};$0" | |
}, | |
"background-clip": { | |
"prefix": "bgcl", | |
"body": "background-clip: ${1|border-box,padding-box,content-box,text|};$0", | |
"description": "initial value: border-box" | |
}, | |
"background-image": { | |
"prefix": "bgi", | |
"body": "background-image: url('${1:background.jpg}');$0" | |
}, | |
"background-origin": { | |
"prefix": "bgo", | |
"body": "background-origin: ${1|border-box,padding-box,content-box|};$0", | |
"description": "initial value: padding-box" | |
}, | |
"background-position": { | |
"prefix": "bgp", | |
"body": "background-position: ${1:left} ${2:top};$0" | |
}, | |
"background-repeat": { | |
"prefix": "bgr", | |
"body": "background-repeat: ${1|no-repeat,repeat-x,repeat-y,repeat,space,round|};$0", | |
"description": "initial value: repeat" | |
}, | |
"background-repeat: repeat": { | |
"prefix": "bgrr", | |
"body": "background-repeat: repeat;$0" | |
}, | |
"background-repeat: repeat-x": { | |
"prefix": "bgrx", | |
"body": "background-repeat: repeat-x;$0" | |
}, | |
"background-repeat: repeat-y": { | |
"prefix": "bgry", | |
"body": "background-repeat: repeat-y;$0" | |
}, | |
"background-repeat: no-repeat": { | |
"prefix": "bgrn", | |
"body": "background-repeat: no-repeat;$0" | |
}, | |
"background-size": { | |
"prefix": "bgs", | |
"body": "background-size: ${0:cover};$0" | |
}, | |
"border": { | |
"prefix": "bor", | |
"body": "border: ${1:1px} ${2|solid,dashed,dotted,double,groove,ridge,inset,outset,none,hidden|} ${0:#000};$0" | |
}, | |
"border: none": { | |
"prefix": "born", | |
"body": "border: none;$0" | |
}, | |
"border-color": { | |
"prefix": "borc", | |
"body": "border-color: ${1};$0" | |
}, | |
"border-style": { | |
"prefix": "bors", | |
"body": "border-style: ${1|solid,dashed,dotted,double,groove,ridge,inset,outset,none,hidden|};$0" | |
}, | |
"border-width": { | |
"prefix": "borw", | |
"body": "border-width: ${1};$0" | |
}, | |
"border-bottom": { | |
"prefix": "borb", | |
"body": "border-bottom: ${1} ${2|solid,dashed,dotted,double,groove,ridge,inset,outset,none,hidden|} ${0:#000};$0" | |
}, | |
"border-left": { | |
"prefix": "borl", | |
"body": "border-left: ${1} ${2|solid,dashed,dotted,double,groove,ridge,inset,outset,none,hidden|} ${0:#000};$0" | |
}, | |
"border-right": { | |
"prefix": "borr", | |
"body": "border-right: ${1} ${2|solid,dashed,dotted,double,groove,ridge,inset,outset,none,hidden|} ${0:#000};$0" | |
}, | |
"border-top": { | |
"prefix": "bort", | |
"body": "border-top: ${1} ${2|solid,dashed,dotted,double,groove,ridge,inset,outset,none,hidden|} ${0:#000};$0" | |
}, | |
"border-radius": { | |
"prefix": "br", | |
"body": "border-radius: ${1:4px};$0" | |
}, | |
"bottom": { | |
"prefix": "bot", | |
"body": "bottom: ${1:0};$0" | |
}, | |
"box-shadow": { | |
"prefix": "bos", | |
"body": "box-shadow: ${1:1px} ${2:1px} ${3:1px} ${4:1px} ${0:rgba(0, 0, 0, .5)};$0", | |
"description": "box-shadow: x-offset y-offset blur spread color" | |
}, | |
"box-sizing": { | |
"prefix": "boz", | |
"body": "box-sizing: ${1|border-box,content-box|};$0", | |
"description": "initial value: content-box" | |
}, | |
"clear": { | |
"prefix": "clr", | |
"body": "clear: ${1|both,left,right,none|};$0" | |
}, | |
"color": { | |
"prefix": "col", | |
"body": "color: ${1};$0" | |
}, | |
"content": { | |
"prefix": "con", | |
"body": "content: '$1';$0" | |
}, | |
"cursor": { | |
"prefix": "cur", | |
"body": "cursor: ${1|auto,default,alias,cell,copy,crosshair,context-menu,help,grab,grabbing,move,none,no-drop,not-allowed,pointer,progress,e-resize,all-scroll,text,wait,vertical-text,zoom-in,zoom-out|};$0", | |
"description": "initial value: auto" | |
}, | |
"cursor: pointer": { | |
"prefix": "curp", | |
"body": "cursor: pointer;$0" | |
}, | |
"cursor: default": { | |
"prefix": "curd", | |
"body": "cursor: default;$0" | |
}, | |
"display": { | |
"prefix": "dis", | |
"body": "display: ${1|none,block,inline,inline-block,flex,inline-flex,list-item,table,inline-table,table-caption,table-cell,table-row,table-row-group,table-column|};$0" | |
}, | |
"display: block": { | |
"prefix": "disb", | |
"body": "display: block;$0" | |
}, | |
"display: inline-block": { | |
"prefix": "disi", | |
"body": "display: inline-block;$0" | |
}, | |
"display: none": { | |
"prefix": "disn", | |
"body": "display: none;$0" | |
}, | |
"display: flex": { | |
"prefix": "disf", | |
"body": "display: flex;$0" | |
}, | |
"flex": { | |
"prefix": "flex", | |
"body": "flex: ${1:1} ${2:1} ${3:auto};$0", | |
"description": "flex: grow shrink basis" | |
}, | |
"flex (alt)": { | |
"prefix": "fle", | |
"body": "flex: ${1:1} ${2:1} ${3:auto};$0" | |
}, | |
"flex-direction": { | |
"prefix": "fld", | |
"body": "flex-direction: ${1|row,row-reverse,column,column-reverse|};$0", | |
"description": "initial value: row" | |
}, | |
"flex-direction: row": { | |
"prefix": "fldr", | |
"body": "flex-direction: row;$0" | |
}, | |
"flex-direction: column": { | |
"prefix": "fldc", | |
"body": "flex-direction: column;$0" | |
}, | |
"flex-flow": { | |
"prefix": "flf", | |
"body": "flex-flow: ${1|row,row-reverse,column,column-reverse|} ${2|wrap,wrap-reverse,nowrap|};$0" | |
}, | |
"flex-wrap": { | |
"prefix": "flw", | |
"body": "flex-wrap: ${1|wrap,wrap-reverse,nowrap|};$0", | |
"description": "initial value: nowrap" | |
}, | |
"float": { | |
"prefix": "fl", | |
"body": "float: ${1|left,right,none|};$0" | |
}, | |
"float: left": { | |
"prefix": "fll", | |
"body": "float: left;$0" | |
}, | |
"float: right": { | |
"prefix": "flr", | |
"body": "float: right;$0" | |
}, | |
"float: none": { | |
"prefix": "fln", | |
"body": "float: none;$0" | |
}, | |
"font-family": { | |
"prefix": "ff", | |
"body": "font-family: ${1:arial};$0" | |
}, | |
"font-size": { | |
"prefix": "fz", | |
"body": "font-size: ${1:12px};$0" | |
}, | |
"font-style": { | |
"prefix": "fst", | |
"body": "font-style: ${1|italic,oblique,normal|};$0" | |
}, | |
"font-style: italic": { | |
"prefix": "fsti", | |
"body": "font-style: italic;$0" | |
}, | |
"font-style: normal": { | |
"prefix": "fstn", | |
"body": "font-style: normal;$0" | |
}, | |
"font-style: oblique": { | |
"prefix": "fsto", | |
"body": "font-style: oblique;$0" | |
}, | |
"font-weight": { | |
"prefix": "fw", | |
"body": "font-weight: ${1:bold};$0" | |
}, | |
"font-weight: bold": { | |
"prefix": "fwb", | |
"body": "font-weight: bold;$0" | |
}, | |
"font-weight: light": { | |
"prefix": "fwl", | |
"body": "font-weight: light;$0" | |
}, | |
"font-weight: normal": { | |
"prefix": "fwn", | |
"body": "font-weight: normal;$0" | |
}, | |
"font": { | |
"prefix": "ft", | |
"body": "font: ${0:12px/1.5};$0", | |
"description": "font: [weight style variant stretch] size/line-height family" | |
}, | |
"height": { | |
"prefix": "hei", | |
"body": "height: ${0:1px};$0" | |
}, | |
"justify-content": { | |
"prefix": "jc", | |
"body": "justify-content: ${1|flex-start,flex-end,center,space-between,space-around|};$0", | |
"description": "initial value: flex-start" | |
}, | |
"justify-content: flex-start": { | |
"prefix": "jcfs", | |
"body": "justify-content: flex-start;$0" | |
}, | |
"justify-content: flex-end": { | |
"prefix": "jcfe", | |
"body": "justify-content: flex-end;$0" | |
}, | |
"justify-content: center": { | |
"prefix": "jcc", | |
"body": "justify-content: center;$0" | |
}, | |
"justify-content: space-around": { | |
"prefix": "jcsa", | |
"body": "justify-content: space-around;$0" | |
}, | |
"justify-content: space-between": { | |
"prefix": "jcsb", | |
"body": "justify-content: space-between;$0" | |
}, | |
"list-style": { | |
"prefix": "lis", | |
"body": "list-style: ${1|disc,circle,square,decimal,lower-roman,upper-roman,lower-alpha,upper-alpha,none,armenian,cjk-ideographic,georgian,lower-greek,hebrew,hiragana,hiragana-iroha,katakana,katakana-iroha,lower-latin,upper-latin|} ${2|outside,inside|};$0", | |
"description": "list-style: type position image" | |
}, | |
"list-style-position": { | |
"prefix": "lisp", | |
"body": "${1|outside,inside|}", | |
"description": "initial value: outside" | |
}, | |
"list-style-type": { | |
"prefix": "list", | |
"body": "list-style-type: ${1|disc,circle,square,decimal,lower-roman,upper-roman,lower-alpha,upper-alpha,none,armenian,cjk-ideographic,georgian,lower-greek,hebrew,hiragana,hiragana-iroha,katakana,katakana-iroha,lower-latin,upper-latin|};$0", | |
"description": "initial value: disc" | |
}, | |
"list-style-type: circle": { | |
"prefix": "listc", | |
"body": "list-style-type: circle;$0" | |
}, | |
"list-style-type: disc": { | |
"prefix": "listd", | |
"body": "list-style-type: disc;$0" | |
}, | |
"list-style-type: none": { | |
"prefix": "listn", | |
"body": "list-style-type: none;$0" | |
}, | |
"list-style-type: square": { | |
"prefix": "lists", | |
"body": "list-style-type: square;$0" | |
}, | |
"list-style-type: lower-roman": { | |
"prefix": "listlr", | |
"body": "list-style-type: lower-roman;$0" | |
}, | |
"list-style-type: upper-roman": { | |
"prefix": "listur", | |
"body": "list-style-type: upper-roman;$0" | |
}, | |
"left": { | |
"prefix": "lef", | |
"body": "left: ${1:0};$0" | |
}, | |
"line-height": { | |
"prefix": "lh", | |
"body": "line-height: ${1:1.5};$0" | |
}, | |
"letter-spacing": { | |
"prefix": "ls", | |
"body": "letter-spacing: ${1:2px};$0" | |
}, | |
"letter-spacing: normal": { | |
"prefix": "lsn", | |
"body": "letter-spacing: normal;$0" | |
}, | |
"margin": { | |
"prefix": "mar", | |
"body": "margin: ${1:0};$0" | |
}, | |
"margin-bottom": { | |
"prefix": "marb", | |
"body": "margin-bottom: ${1};$0" | |
}, | |
"margin-left": { | |
"prefix": "marl", | |
"body": "margin-left: ${1};$0" | |
}, | |
"margin-right": { | |
"prefix": "marr", | |
"body": "margin-right: ${1};$0" | |
}, | |
"margin-top": { | |
"prefix": "mart", | |
"body": "margin-top: ${1};$0" | |
}, | |
"margin: 0 auto": { | |
"prefix": "mara", | |
"body": "margin: 0 auto;$0" | |
}, | |
"min-height": { | |
"prefix": "mih", | |
"body": "min-height: ${1};$0" | |
}, | |
"min-width": { | |
"prefix": "miw", | |
"body": "min-width: ${1};$0" | |
}, | |
"max-height": { | |
"prefix": "mah", | |
"body": "max-height: ${1};$0" | |
}, | |
"max-width": { | |
"prefix": "maw", | |
"body": "max-width: ${1};$0" | |
}, | |
"opacity": { | |
"prefix": "opa", | |
"body": "opacity: ${1};$0" | |
}, | |
"overflow": { | |
"prefix": "ov", | |
"body": "overflow: ${1|visible,hidden,scroll,auto,clip|};$0" | |
}, | |
"overflow: auto": { | |
"prefix": "ova", | |
"body": "overflow: auto;$0" | |
}, | |
"overflow: hidden": { | |
"prefix": "ovh", | |
"body": "overflow: hidden;$0" | |
}, | |
"overflow: scroll": { | |
"prefix": "ovs", | |
"body": "overflow: scroll;$0" | |
}, | |
"overflow: visible": { | |
"prefix": "ovv", | |
"body": "overflow: visible;$0" | |
}, | |
"padding": { | |
"prefix": "pad", | |
"body": "padding: ${1};$0" | |
}, | |
"padding-bottom": { | |
"prefix": "padb", | |
"body": "padding-bottom: ${1};$0" | |
}, | |
"padding-left": { | |
"prefix": "padl", | |
"body": "padding-left: ${1};$0" | |
}, | |
"padding-right": { | |
"prefix": "padr", | |
"body": "padding-right: ${1};$0" | |
}, | |
"padding-top": { | |
"prefix": "padt", | |
"body": "padding-top: ${1};$0" | |
}, | |
"position": { | |
"prefix": "pos", | |
"body": "position: ${1|relative,absolute,fixed,sticky,static|};$0" | |
}, | |
"position absolute": { | |
"prefix": "posa", | |
"body": "position: absolute;$0" | |
}, | |
"position fixed": { | |
"prefix": "posf", | |
"body": "position: fixed;$0" | |
}, | |
"position relative": { | |
"prefix": "posr", | |
"body": "position: relative;$0" | |
}, | |
"position sticky": { | |
"prefix": "poss", | |
"body": "position: sticky;$0" | |
}, | |
"right": { | |
"prefix": "rig", | |
"body": "right: ${1};$0" | |
}, | |
"text-align": { | |
"prefix": "ta", | |
"body": "text-align: ${1|center,left,right,justify,start,end|};$0" | |
}, | |
"text-decoration": { | |
"prefix": "td", | |
"body": "text-decoration: ${1|none,underline,overline,line-through|};$0" | |
}, | |
"text-decoration: underline": { | |
"prefix": "tdu", | |
"body": "text-decoration: underline;$0" | |
}, | |
"text-decoration: none": { | |
"prefix": "tdn", | |
"body": "text-decoration: none;$0" | |
}, | |
"text-decoration: line-through": { | |
"prefix": "tdl", | |
"body": "text-decoration: line-through;$0" | |
}, | |
"text-indent": { | |
"prefix": "ti", | |
"body": "text-indent: ${0:2em};$0" | |
}, | |
"text-shadow": { | |
"prefix": "ts", | |
"body": "text-shadow: ${1:1px} ${2:1px} ${3:1px} ${4:1px} ${0:rgba(0, 0, 0, .5)};$0", | |
"description": "text-shadow: x-offset y-offset blur spread color" | |
}, | |
"text-transform": { | |
"prefix": "tt", | |
"body": "text-transform: ${1|capitalize,uppercase,lowercase,full-width,none|};$0" | |
}, | |
"top": { | |
"prefix": "top", | |
"body": "top: ${0:0};$0" | |
}, | |
"vertical-align": { | |
"prefix": "va", | |
"body": "vertical-align: ${1|baseline,middle,top,bottom,sub,super,text-top,text-bottom|};$0" | |
}, | |
"vertical-align: bottom": { | |
"prefix": "vab", | |
"body": "vertical-align: bottom;$0" | |
}, | |
"vertical-align: middle": { | |
"prefix": "vam", | |
"body": "vertical-align: middle;$0" | |
}, | |
"vertical-align: top": { | |
"prefix": "vat", | |
"body": "vertical-align: top;$0" | |
}, | |
"visibility": { | |
"prefix": "vis", | |
"body": "visibility: ${1|visible,hidden,collapse|};$0" | |
}, | |
"visibility: visible": { | |
"prefix": "visv", | |
"body": "visibility: visible;$0" | |
}, | |
"visibility: hidden": { | |
"prefix": "vish", | |
"body": "visibility: hidden;$0" | |
}, | |
"word-break": { | |
"prefix": "wb", | |
"body": "word-break: ${1|break-all,keep-all,break-word,normal|};$0" | |
}, | |
"width": { | |
"prefix": "wid", | |
"body": "width: ${1:100%};$0" | |
}, | |
"width: auto": { | |
"prefix": "wida", | |
"body": "width: auto;$0" | |
}, | |
"white-space": { | |
"prefix": "ws", | |
"body": "white-space: ${1|nowrap,pre,pre-wrap,pre-line,normal|};$0" | |
}, | |
"white-space: nowrap": { | |
"prefix": "wsn", | |
"body": "white-space: nowrap;$0" | |
}, | |
"white-space: pre": { | |
"prefix": "wsp", | |
"body": "white-space: pre;$0" | |
}, | |
"word-wrap": { | |
"prefix": "ww", | |
"body": "word-wrap: ${1|break-word,break-spaces,normal|};$0" | |
}, | |
"z-index": { | |
"prefix": "zi", | |
"body": "z-index: ${1:-1};$0" | |
}, | |
"@keyframes": { | |
"prefix": "key", | |
"body": "@keyframes ${1:name} {\n $0\n}" | |
}, | |
"@media": { | |
"prefix": "med", | |
"body": "@media screen and (${1:max-width: 300px}) {\n $0\n}" | |
}, | |
"!important (alt)": { | |
"prefix": "i", | |
"body": "!important $0" | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment