andre/30-seconds-of-code
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Travis build: 606

Browse Source
This commit is contained in:
30secondsofcode
2019-12-11 10:48:13 +00:00
parent 64e9cf3565
commit 2adc407b56
2 changed files with 133 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
snippet_data/snippetList.json
View File

@ -483,6 +483,21 @@
"hash": "e0cd9ededcfb68d085f6a1fbdc63fba65cee9adc13c08a458f73b0fbaf0f5949"
}
},
{
"id": "masonry-layout",
"type": "snippetListing",
"title": "Masonry Layout",
"attributes": {
"text": "Creates a vertical Masonry layout using pure HTML and CSS.\n\n",
"tags": [
"layout",
"advanced"
]
},
"meta": {
"hash": "5782a8e3e8295f8b5a3887450d22b30d38d49f83a4d1664de52b1fab177e830f"
}
},
{
"id": "mouse-cursor-gradient-tracking",
"type": "snippetListing",

205
snippet_data/snippets.json
View File

@ -55,8 +55,8 @@
},
"meta": {
"hash": "2934b3aa733591f4964a7c8780f3ec7b273e4bd6a38fce6e0da2a5dd2dd9959f",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -85,8 +85,8 @@
},
"meta": {
"hash": "d4e635bb76a083266e08723f25c3db981b39001ea5d513ce65570fe0099eb6b0",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -115,8 +115,8 @@
},
"meta": {
"hash": "ff6401cc784b92a9672e74968719c029de224c29fcfdc3eaeaa764274108f648",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -145,8 +145,8 @@
},
"meta": {
"hash": "8165e64d1bca7ae3bb0c990712023720dff55c2f6194b557a131901d528be4b7",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -175,8 +175,8 @@
},
"meta": {
"hash": "60ac5a7cb7e2c24c936b267ac74d649052c9aaa80810278720b5b5a14fee1562",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -205,7 +205,7 @@
},
"meta": {
"hash": "8a1beb75b1efe89f11f1bac944a836feac26604d5bc06bdb026dd0bd6650ad95",
"firstSeen": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1574366733",
"updateCount": 3,
"authorCount": 2
@ -235,8 +235,8 @@
},
"meta": {
"hash": "931815035291ba0e6de497d7296fc75e207117c9ff0607fd646f01da53793929",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -266,8 +266,8 @@
},
"meta": {
"hash": "7c572c339c0767840bd0fd6f5daab357a8da070988c621e341bc5ce78d0f798e",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -296,8 +296,8 @@
},
"meta": {
"hash": "e5544c894ee3cd4ce3352d10331e2f321c6d30b4a0a667434286c6d4951c3b0a",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -326,8 +326,8 @@
},
"meta": {
"hash": "bf835c2f1d038e6b08d221c9fef85933757a80c67de555797c6bc63ff7035ae8",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -356,8 +356,8 @@
},
"meta": {
"hash": "7a0d1c46beceb336265b2ca27a4f3cf25ad332a5cd2e8c0b692a43ce5b329fef",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -386,8 +386,8 @@
},
"meta": {
"hash": "02f6472568975f5897a84f8846d97f8561fc5334ddafac53e73adb52ccda5f29",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -416,8 +416,8 @@
},
"meta": {
"hash": "83c7806b0be2e50ca34f313912f9cb90682852790e6d0105a635f781212fa5b1",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -446,8 +446,8 @@
},
"meta": {
"hash": "4e7f5ce479955deb9830ca4a72fc8260c8863aa65d6f67f15e88a3f923c10c3a",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -507,8 +507,8 @@
},
"meta": {
"hash": "738fae9ee6d0a9fe84cdbdd632a93f651f8377ec7e9f647e1031207d99b819a5",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -537,8 +537,8 @@
},
"meta": {
"hash": "94ec3c4e6b02374b61367e8cf4edcb9532bb7297673a28acaee0ad3264adfa3d",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -567,8 +567,8 @@
},
"meta": {
"hash": "68da5c2e7399979db3aeb1022d13b0490fc71d55d068597544954706c7027bef",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -597,8 +597,8 @@
},
"meta": {
"hash": "86c8c53be49e82365f6d6f54a03b55d9a8888ccc85504fe0480499b0e68c7f5b",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -628,8 +628,8 @@
},
"meta": {
"hash": "5d09d5e54b7436f047db61223cff15dce2f17f6cffe5e71e0f9061337de3068e",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -658,8 +658,8 @@
},
"meta": {
"hash": "a2bf8cfa4de368cfb10d013b6bbb87c598e0cccacfe816972da4ac668c6abc1a",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -689,8 +689,8 @@
},
"meta": {
"hash": "a12b394af0b2df2f7fa6bae2cbbe3a8b01ba74510991dcfe3952b8bd9c0a5a41",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -719,8 +719,8 @@
},
"meta": {
"hash": "23cab923692f5e3250be38b3c970dc11f3bab34159812aaf979ea09bce441c30",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -749,8 +749,8 @@
},
"meta": {
"hash": "0515f03b1505eafa21e0d0d7377facbe4aaa9159996906dd4ed2857ee137073a",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -779,8 +779,8 @@
},
"meta": {
"hash": "9620da48fb82b48a7c6b681854707b622a18c158f2db88c816e3b9c0d9b04523",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -809,8 +809,8 @@
},
"meta": {
"hash": "f6fbb076581e63ab9187ca63d8620f88de19d7a78c46f9ded903271461a445bf",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -839,8 +839,8 @@
},
"meta": {
"hash": "cd26d0cd1831474afdc784b4459b60062243e2d390975e94cd7d51fa776c603f",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -900,8 +900,8 @@
},
"meta": {
"hash": "bff0b57d24dac06ae6a6d71a8d0d628ec0b97760be0cfda66791191957075d73",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -930,8 +930,8 @@
},
"meta": {
"hash": "4136aff34ae1b8bf6b525c08881a12c43e9ce7265e864c09ea25fa40e8d86396",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -960,8 +960,8 @@
},
"meta": {
"hash": "6e8a53b0b69ab05f54c199f42944746c0e3331712f69a8dc72709eda16428424",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -990,8 +990,8 @@
},
"meta": {
"hash": "2f925cc190a9744532de97bb4add65e53cc0b2f3833760f4e7263f5df17cfad5",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -1027,6 +1027,37 @@
"authorCount": 2
}
},
{
"id": "masonry-layout",
"title": "Masonry Layout",
"type": "snippet",
"attributes": {
"fileName": "masonry-layout.md",
"text": "Creates a vertical Masonry layout using pure HTML and CSS.\n\n",
"explanation": "\n\n- Create a masonry-style layout that consists of \"bricks\" that fall into each other with either a fidex `width` (vertical layout) or a fixed `height` (horizontal layout), forming a perfect fit. Especially useful when working with images.\n- `.masonry-container` is the container for the masonry layout. Within that container, there's a `div.masonry-columns`, which will automatically put each child element, `.masonry-brick`, into the layout. \n- `.masonry-brick` must be have `display: block` to allow the layout to flow properly, while the `:first-child` of this class should have a different `margin` to account for its positioning.\n- CSS variables are used to allow for greater flexibility for the layout, while media queries ensure that the layout flows responsively in different viewport sizes.\n\n",
"browserSupport": {
"text": "\n\n- https://www.caniuse.com/#feat=css-variables\n- https://www.caniuse.com/#feat=calc\n- https://www.caniuse.com/#feat=mdn-css_properties_column-count\n- https://www.caniuse.com/#feat=mdn-css_properties_column-width\n- https://www.caniuse.com/#feat=mdn-css_properties_column-gap_multicol_context\n",
"supportPercentage": 100
},
"codeBlocks": {
"html": "<div class=\"masonry-container\">\n <div class=\"masonry-columns\">\n <img class=\"masonry-brick\" src=\"https://picsum.photos/id/1016/384/256\" alt=\"An image\">\n <img class=\"masonry-brick\" src=\"https://picsum.photos/id/1025/495/330\" alt=\"Another image\">\n <img class=\"masonry-brick\" src=\"https://picsum.photos/id/1024/192/128\" alt=\"Another image\">\n <img class=\"masonry-brick\" src=\"https://picsum.photos/id/1028/518/345\" alt=\"One more image\">\n <img class=\"masonry-brick\" src=\"https://picsum.photos/id/1035/585/390\" alt=\"And another one\">\n <img class=\"masonry-brick\" src=\"https://picsum.photos/id/1074/384/216\" alt=\"Last one\">\n </div>\n</div>",
"css": "/* Container */\n.masonry-container {\n --column-count-small: 1;\n --column-count-medium: 2;\n --column-count-large: 3;\n --column-gap: 0.125rem;\n padding: var(--column-gap);\n}\n\n/* Columns */\n.masonry-columns {\n column-gap: var(--column-gap);\n column-count: var(--column-count-small);\n column-width: calc(1 / var(--column-count-small) * 100%);\n}\n\n@media only screen and (min-width: 640px) {\n .masonry-columns {\n column-count: var(--column-count-medium);\n column-width: calc(1 / var(--column-count-medium) * 100%);\n }\n}\n\n@media only screen and (min-width: 800px) {\n .masonry-columns {\n column-count: var(--column-count-large);\n column-width: calc(1 / var(--column-count-large) * 100%);\n }\n}\n\n/* Bricks */\n.masonry-brick {\n width: 100%;\n height: auto;\n margin: var(--column-gap) 0;\n display: block;\n}\n\n.masonry-brick:first-child {\n margin: 0 0 var(--column-gap);\n}",
"js": "",
"scopedCss": "[data-scope=\"masonry-layout\"] {\n /* Container */\n /* Columns */\n /* Bricks */ }\n [data-scope=\"masonry-layout\"] .masonry-container {\n --column-count-small: 1;\n --column-count-medium: 2;\n --column-count-large: 3;\n --column-gap: 0.125rem;\n padding: var(--column-gap); }\n [data-scope=\"masonry-layout\"] .masonry-columns {\n column-gap: var(--column-gap);\n column-count: var(--column-count-small);\n column-width: calc(1 / var(--column-count-small) * 100%); }\n @media only screen and (min-width: 640px) {\n [data-scope=\"masonry-layout\"] .masonry-columns {\n column-count: var(--column-count-medium);\n column-width: calc(1 / var(--column-count-medium) * 100%); } }\n @media only screen and (min-width: 800px) {\n [data-scope=\"masonry-layout\"] .masonry-columns {\n column-count: var(--column-count-large);\n column-width: calc(1 / var(--column-count-large) * 100%); } }\n [data-scope=\"masonry-layout\"] .masonry-brick {\n width: 100%;\n height: auto;\n margin: var(--column-gap) 0;\n display: block; }\n [data-scope=\"masonry-layout\"] .masonry-brick:first-child {\n margin: 0 0 var(--column-gap); }\n"
},
"tags": [
"layout",
"advanced"
]
},
"meta": {
"hash": "5782a8e3e8295f8b5a3887450d22b30d38d49f83a4d1664de52b1fab177e830f",
"firstSeen": "1576023545",
"lastUpdated": "1576061075",
"updateCount": 5,
"authorCount": 3
}
},
{
"id": "mouse-cursor-gradient-tracking",
"title": "Mouse cursor gradient tracking",
@ -1052,7 +1083,7 @@
},
"meta": {
"hash": "97fbac82b526cafe6e48233dda46d0bb87fde7a52027774048b90c9c14818395",
"firstSeen": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567151937",
"updateCount": 3,
"authorCount": 2
@ -1113,7 +1144,7 @@
},
"meta": {
"hash": "847dbaae8802781fa073cc92c6891ea0a0c39752f95266fcb4db7812dc78640e",
"firstSeen": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1569415890",
"updateCount": 3,
"authorCount": 3
@ -1144,7 +1175,7 @@
},
"meta": {
"hash": "a718446c91f49c73e68bc4f317911ff03f898ac8efe0e832ca1f803709107820",
"firstSeen": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1571634867",
"updateCount": 3,
"authorCount": 3
@ -1174,7 +1205,7 @@
},
"meta": {
"hash": "e25bdb353dc5da5c1c359f91769d85d0b3b0a58ff7085041603e4e685b380ef7",
"firstSeen": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567155517",
"updateCount": 3,
"authorCount": 2
@ -1204,8 +1235,8 @@
},
"meta": {
"hash": "46d1f9e1a05328d86ffda0dbea7dc60eae44c319eb430632ef384d2f3e7e6d44",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -1234,8 +1265,8 @@
},
"meta": {
"hash": "fb3a96cbbb4d59af2566f3d0729c13478a81a572b25a8dd1696e2a67dd8fff79",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -1295,8 +1326,8 @@
},
"meta": {
"hash": "f9542b2db5cd49f09e53b3af8348c58c973244bdeede87857e49660c6e713d65",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -1325,8 +1356,8 @@
},
"meta": {
"hash": "0b86c444f4d15709a99d1e32c651e9530a294258ba32784d998a56c6f14198b1",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -1355,8 +1386,8 @@
},
"meta": {
"hash": "35bfb52929dcbd21c120d555c9d3382154f47b661d31722ffb3d21281021bba3",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -1385,8 +1416,8 @@
},
"meta": {
"hash": "97b037f3f463b8cf7de0cc12a607c540ffe8a4869323a4cc17c66eebbc92d612",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -1447,8 +1478,8 @@
},
"meta": {
"hash": "e29182514bd83550705267a43d21eec8886ed011c6259f2b3efec9862541f90e",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -1477,8 +1508,8 @@
},
"meta": {
"hash": "9ee4bb8713d24b9e6f5367eb05645c6e41d205b120b4d06a9a949984c7cd73b0",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -1538,8 +1569,8 @@
},
"meta": {
"hash": "357daaf44bab240518a3c9bdd34a1e8702fab3358171e30f633b7a7f423b9884",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -1568,8 +1599,8 @@
},
"meta": {
"hash": "a30287149e833b454deea446359d51554640ad3a57cd2460d8519c376077b8b4",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -1598,8 +1629,8 @@
},
"meta": {
"hash": "4ce872446c7950c9450e56ab2251c7cfcd473a1c9b2a64baa7c9d6b029264796",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}
@ -1628,8 +1659,8 @@
},
"meta": {
"hash": "43bc0cd7776468f3b74791017349ef278921c8ded7ba0bd7788d2b01bdb68c7a",
"firstSeen": "1567144393",
"lastUpdated": "1567144393",
"firstSeen": "1567145759",
"lastUpdated": "1567145759",
"updateCount": 2,
"authorCount": 2
}