Compare commits
1 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 0b5210d163 |
@@ -1,458 +0,0 @@
|
|||||||
{
|
|
||||||
"exclude": [".git/**", "node_modules/**", "bower_components/**"],
|
|
||||||
"always-semicolon": true,
|
|
||||||
"block-indent": " ",
|
|
||||||
"color-case": "upper",
|
|
||||||
"color-shorthand": false,
|
|
||||||
"element-case": "lower",
|
|
||||||
"eof-newline": true,
|
|
||||||
"leading-zero": true,
|
|
||||||
"quotes": "double",
|
|
||||||
"remove-empty-rulesets": true,
|
|
||||||
"sort-order-fallback": "abc",
|
|
||||||
"space-after-colon": " ",
|
|
||||||
"space-after-combinator": " ",
|
|
||||||
"space-after-opening-brace": "\n",
|
|
||||||
"space-after-selector-delimiter": "\n",
|
|
||||||
"space-before-closing-brace": "\n",
|
|
||||||
"space-before-combinator": " ",
|
|
||||||
"space-between-declarations": "\n",
|
|
||||||
"space-before-opening-brace": " ",
|
|
||||||
"space-before-selector-delimiter": "",
|
|
||||||
"strip-spaces": true,
|
|
||||||
"tab-size": true,
|
|
||||||
"unitless-zero": true,
|
|
||||||
"vendor-prefix-align": true,
|
|
||||||
"sort-order": [
|
|
||||||
[
|
|
||||||
"position",
|
|
||||||
"top",
|
|
||||||
"right",
|
|
||||||
"bottom",
|
|
||||||
"left",
|
|
||||||
"z-index",
|
|
||||||
"display",
|
|
||||||
"visibility",
|
|
||||||
"float",
|
|
||||||
"clear",
|
|
||||||
"overflow",
|
|
||||||
"-ms-overflow-x",
|
|
||||||
"-ms-overflow-y",
|
|
||||||
"overflow-x",
|
|
||||||
"overflow-y",
|
|
||||||
"-webkit-overflow-scrolling",
|
|
||||||
"clip",
|
|
||||||
"grid",
|
|
||||||
"grid-area",
|
|
||||||
"grid-auto-columns",
|
|
||||||
"grid-auto-flow",
|
|
||||||
"grid-auto-rows",
|
|
||||||
"grid-column",
|
|
||||||
"grid-column-end",
|
|
||||||
"grid-column-gap",
|
|
||||||
"grid-column-start",
|
|
||||||
"grid-gap",
|
|
||||||
"grid-row",
|
|
||||||
"grid-row-end",
|
|
||||||
"grid-row-gap",
|
|
||||||
"grid-row-start",
|
|
||||||
"grid-template",
|
|
||||||
"grid-template-areas",
|
|
||||||
"grid-template-columns",
|
|
||||||
"grid-template-rows",
|
|
||||||
"-webkit-align-content",
|
|
||||||
"-ms-flex-line-pack",
|
|
||||||
"align-content",
|
|
||||||
"-webkit-box-align",
|
|
||||||
"-moz-box-align",
|
|
||||||
"-webkit-align-items",
|
|
||||||
"align-items",
|
|
||||||
"-ms-flex-align",
|
|
||||||
"-webkit-align-self",
|
|
||||||
"-ms-flex-item-align",
|
|
||||||
"-ms-grid-row-align",
|
|
||||||
"align-self",
|
|
||||||
"-webkit-box-flex",
|
|
||||||
"-webkit-flex",
|
|
||||||
"-moz-box-flex",
|
|
||||||
"-ms-flex",
|
|
||||||
"flex",
|
|
||||||
"-webkit-flex-flow",
|
|
||||||
"-ms-flex-flow",
|
|
||||||
"flex-flow",
|
|
||||||
"-webkit-flex-basis",
|
|
||||||
"-ms-flex-preferred-size",
|
|
||||||
"flex-basis",
|
|
||||||
"-webkit-box-orient",
|
|
||||||
"-webkit-box-direction",
|
|
||||||
"-webkit-flex-direction",
|
|
||||||
"-moz-box-orient",
|
|
||||||
"-moz-box-direction",
|
|
||||||
"-ms-flex-direction",
|
|
||||||
"flex-direction",
|
|
||||||
"-webkit-flex-grow",
|
|
||||||
"-ms-flex-positive",
|
|
||||||
"flex-grow",
|
|
||||||
"-webkit-flex-shrink",
|
|
||||||
"-ms-flex-negative",
|
|
||||||
"flex-shrink",
|
|
||||||
"-webkit-flex-wrap",
|
|
||||||
"-ms-flex-wrap",
|
|
||||||
"flex-wrap",
|
|
||||||
"-webkit-box-pack",
|
|
||||||
"-moz-box-pack",
|
|
||||||
"-ms-flex-pack",
|
|
||||||
"-webkit-justify-content",
|
|
||||||
"justify-content",
|
|
||||||
"justify-items",
|
|
||||||
"-webkit-box-ordinal-group",
|
|
||||||
"-webkit-order",
|
|
||||||
"-moz-box-ordinal-group",
|
|
||||||
"-ms-flex-order",
|
|
||||||
"order",
|
|
||||||
"-webkit-box-sizing",
|
|
||||||
"-moz-box-sizing",
|
|
||||||
"box-sizing",
|
|
||||||
"margin",
|
|
||||||
"margin-top",
|
|
||||||
"margin-right",
|
|
||||||
"margin-bottom",
|
|
||||||
"margin-left",
|
|
||||||
"padding",
|
|
||||||
"padding-top",
|
|
||||||
"padding-right",
|
|
||||||
"padding-bottom",
|
|
||||||
"padding-left",
|
|
||||||
"min-width",
|
|
||||||
"min-height",
|
|
||||||
"max-width",
|
|
||||||
"max-height",
|
|
||||||
"width",
|
|
||||||
"height",
|
|
||||||
"outline",
|
|
||||||
"outline-width",
|
|
||||||
"outline-style",
|
|
||||||
"outline-color",
|
|
||||||
"outline-offset",
|
|
||||||
"border",
|
|
||||||
"border-spacing",
|
|
||||||
"border-collapse",
|
|
||||||
"border-width",
|
|
||||||
"border-style",
|
|
||||||
"border-color",
|
|
||||||
"border-top",
|
|
||||||
"border-top-width",
|
|
||||||
"border-top-style",
|
|
||||||
"border-top-color",
|
|
||||||
"border-right",
|
|
||||||
"border-right-width",
|
|
||||||
"border-right-style",
|
|
||||||
"border-right-color",
|
|
||||||
"border-bottom",
|
|
||||||
"border-bottom-width",
|
|
||||||
"border-bottom-style",
|
|
||||||
"border-bottom-color",
|
|
||||||
"border-left",
|
|
||||||
"border-left-width",
|
|
||||||
"border-left-style",
|
|
||||||
"border-left-color",
|
|
||||||
"-webkit-border-radius",
|
|
||||||
"-moz-border-radius",
|
|
||||||
"border-radius",
|
|
||||||
"-webkit-border-top-left-radius",
|
|
||||||
"-moz-border-radius-topleft",
|
|
||||||
"border-top-left-radius",
|
|
||||||
"-webkit-border-top-right-radius",
|
|
||||||
"-moz-border-radius-topright",
|
|
||||||
"border-top-right-radius",
|
|
||||||
"-webkit-border-bottom-right-radius",
|
|
||||||
"-moz-border-radius-bottomright",
|
|
||||||
"border-bottom-right-radius",
|
|
||||||
"-webkit-border-bottom-left-radius",
|
|
||||||
"-moz-border-radius-bottomleft",
|
|
||||||
"border-bottom-left-radius",
|
|
||||||
"-webkit-border-image",
|
|
||||||
"-moz-border-image",
|
|
||||||
"-o-border-image",
|
|
||||||
"border-image",
|
|
||||||
"-webkit-border-image-source",
|
|
||||||
"-moz-border-image-source",
|
|
||||||
"-o-border-image-source",
|
|
||||||
"border-image-source",
|
|
||||||
"-webkit-border-image-slice",
|
|
||||||
"-moz-border-image-slice",
|
|
||||||
"-o-border-image-slice",
|
|
||||||
"border-image-slice",
|
|
||||||
"-webkit-border-image-width",
|
|
||||||
"-moz-border-image-width",
|
|
||||||
"-o-border-image-width",
|
|
||||||
"border-image-width",
|
|
||||||
"-webkit-border-image-outset",
|
|
||||||
"-moz-border-image-outset",
|
|
||||||
"-o-border-image-outset",
|
|
||||||
"border-image-outset",
|
|
||||||
"-webkit-border-image-repeat",
|
|
||||||
"-moz-border-image-repeat",
|
|
||||||
"-o-border-image-repeat",
|
|
||||||
"border-image-repeat",
|
|
||||||
"-webkit-border-top-image",
|
|
||||||
"-moz-border-top-image",
|
|
||||||
"-o-border-top-image",
|
|
||||||
"border-top-image",
|
|
||||||
"-webkit-border-right-image",
|
|
||||||
"-moz-border-right-image",
|
|
||||||
"-o-border-right-image",
|
|
||||||
"border-right-image",
|
|
||||||
"-webkit-border-bottom-image",
|
|
||||||
"-moz-border-bottom-image",
|
|
||||||
"-o-border-bottom-image",
|
|
||||||
"border-bottom-image",
|
|
||||||
"-webkit-border-left-image",
|
|
||||||
"-moz-border-left-image",
|
|
||||||
"-o-border-left-image",
|
|
||||||
"border-left-image",
|
|
||||||
"-webkit-border-corner-image",
|
|
||||||
"-moz-border-corner-image",
|
|
||||||
"-o-border-corner-image",
|
|
||||||
"border-corner-image",
|
|
||||||
"-webkit-border-top-left-image",
|
|
||||||
"-moz-border-top-left-image",
|
|
||||||
"-o-border-top-left-image",
|
|
||||||
"border-top-left-image",
|
|
||||||
"-webkit-border-top-right-image",
|
|
||||||
"-moz-border-top-right-image",
|
|
||||||
"-o-border-top-right-image",
|
|
||||||
"border-top-right-image",
|
|
||||||
"-webkit-border-bottom-right-image",
|
|
||||||
"-moz-border-bottom-right-image",
|
|
||||||
"-o-border-bottom-right-image",
|
|
||||||
"border-bottom-right-image",
|
|
||||||
"-webkit-border-bottom-left-image",
|
|
||||||
"-moz-border-bottom-left-image",
|
|
||||||
"-o-border-bottom-left-image",
|
|
||||||
"border-bottom-left-image",
|
|
||||||
"background",
|
|
||||||
"filter:progid:DXImageTransform.Microsoft.AlphaImageLoader",
|
|
||||||
"background-color",
|
|
||||||
"background-image",
|
|
||||||
"background-attachment",
|
|
||||||
"background-position",
|
|
||||||
"-ms-background-position-x",
|
|
||||||
"-ms-background-position-y",
|
|
||||||
"background-position-x",
|
|
||||||
"background-position-y",
|
|
||||||
"-webkit-background-clip",
|
|
||||||
"-moz-background-clip",
|
|
||||||
"background-clip",
|
|
||||||
"background-origin",
|
|
||||||
"-webkit-background-size",
|
|
||||||
"-moz-background-size",
|
|
||||||
"-o-background-size",
|
|
||||||
"background-size",
|
|
||||||
"background-repeat",
|
|
||||||
"box-decoration-break",
|
|
||||||
"-webkit-box-shadow",
|
|
||||||
"-moz-box-shadow",
|
|
||||||
"box-shadow",
|
|
||||||
"color",
|
|
||||||
"table-layout",
|
|
||||||
"caption-side",
|
|
||||||
"empty-cells",
|
|
||||||
"list-style",
|
|
||||||
"list-style-position",
|
|
||||||
"list-style-type",
|
|
||||||
"list-style-image",
|
|
||||||
"quotes",
|
|
||||||
"content",
|
|
||||||
"counter-increment",
|
|
||||||
"counter-reset",
|
|
||||||
"-ms-writing-mode",
|
|
||||||
"vertical-align",
|
|
||||||
"text-align",
|
|
||||||
"-webkit-text-align-last",
|
|
||||||
"-moz-text-align-last",
|
|
||||||
"-ms-text-align-last",
|
|
||||||
"text-align-last",
|
|
||||||
"text-decoration",
|
|
||||||
"text-emphasis",
|
|
||||||
"text-emphasis-position",
|
|
||||||
"text-emphasis-style",
|
|
||||||
"text-emphasis-color",
|
|
||||||
"text-indent",
|
|
||||||
"-ms-text-justify",
|
|
||||||
"text-justify",
|
|
||||||
"text-outline",
|
|
||||||
"text-transform",
|
|
||||||
"text-wrap",
|
|
||||||
"-ms-text-overflow",
|
|
||||||
"text-overflow",
|
|
||||||
"text-overflow-ellipsis",
|
|
||||||
"text-overflow-mode",
|
|
||||||
"text-shadow",
|
|
||||||
"text-rendering",
|
|
||||||
"white-space",
|
|
||||||
"word-spacing",
|
|
||||||
"-ms-word-wrap",
|
|
||||||
"word-wrap",
|
|
||||||
"-ms-word-break",
|
|
||||||
"word-break",
|
|
||||||
"-moz-tab-size",
|
|
||||||
"-o-tab-size",
|
|
||||||
"tab-size",
|
|
||||||
"-webkit-hyphens",
|
|
||||||
"-moz-hyphens",
|
|
||||||
"hyphens",
|
|
||||||
"letter-spacing",
|
|
||||||
"font",
|
|
||||||
"font-weight",
|
|
||||||
"font-style",
|
|
||||||
"font-variant",
|
|
||||||
"font-size-adjust",
|
|
||||||
"font-stretch",
|
|
||||||
"font-size",
|
|
||||||
"font-family",
|
|
||||||
"font-feature-settings",
|
|
||||||
"src",
|
|
||||||
"line-height",
|
|
||||||
"opacity",
|
|
||||||
"-ms-filter:\\'progid:DXImageTransform.Microsoft.Alpha",
|
|
||||||
"filter:progid:DXImageTransform.Microsoft.Alpha(Opacity",
|
|
||||||
"-ms-interpolation-mode",
|
|
||||||
"-webkit-filter",
|
|
||||||
"-ms-filter",
|
|
||||||
"filter",
|
|
||||||
"resize",
|
|
||||||
"nav-index",
|
|
||||||
"nav-up",
|
|
||||||
"nav-right",
|
|
||||||
"nav-down",
|
|
||||||
"nav-left",
|
|
||||||
"-webkit-user-drag",
|
|
||||||
"-webkit-transition",
|
|
||||||
"-moz-transition",
|
|
||||||
"-ms-transition",
|
|
||||||
"-o-transition",
|
|
||||||
"transition",
|
|
||||||
"-webkit-transition-delay",
|
|
||||||
"-moz-transition-delay",
|
|
||||||
"-ms-transition-delay",
|
|
||||||
"-o-transition-delay",
|
|
||||||
"transition-delay",
|
|
||||||
"-webkit-transition-timing-function",
|
|
||||||
"-moz-transition-timing-function",
|
|
||||||
"-ms-transition-timing-function",
|
|
||||||
"-o-transition-timing-function",
|
|
||||||
"transition-timing-function",
|
|
||||||
"-webkit-transition-duration",
|
|
||||||
"-moz-transition-duration",
|
|
||||||
"-ms-transition-duration",
|
|
||||||
"-o-transition-duration",
|
|
||||||
"transition-duration",
|
|
||||||
"-webkit-transition-property",
|
|
||||||
"-moz-transition-property",
|
|
||||||
"-ms-transition-property",
|
|
||||||
"-o-transition-property",
|
|
||||||
"transition-property",
|
|
||||||
"-webkit-transform",
|
|
||||||
"-moz-transform",
|
|
||||||
"-ms-transform",
|
|
||||||
"-o-transform",
|
|
||||||
"transform",
|
|
||||||
"-webkit-transform-origin",
|
|
||||||
"-moz-transform-origin",
|
|
||||||
"-ms-transform-origin",
|
|
||||||
"-o-transform-origin",
|
|
||||||
"transform-origin",
|
|
||||||
"-webkit-animation",
|
|
||||||
"-moz-animation",
|
|
||||||
"-ms-animation",
|
|
||||||
"-o-animation",
|
|
||||||
"animation",
|
|
||||||
"-webkit-animation-name",
|
|
||||||
"-moz-animation-name",
|
|
||||||
"-ms-animation-name",
|
|
||||||
"-o-animation-name",
|
|
||||||
"animation-name",
|
|
||||||
"-webkit-animation-duration",
|
|
||||||
"-moz-animation-duration",
|
|
||||||
"-ms-animation-duration",
|
|
||||||
"-o-animation-duration",
|
|
||||||
"animation-duration",
|
|
||||||
"animation-fill-mode",
|
|
||||||
"-webkit-animation-play-state",
|
|
||||||
"-moz-animation-play-state",
|
|
||||||
"-ms-animation-play-state",
|
|
||||||
"-o-animation-play-state",
|
|
||||||
"animation-play-state",
|
|
||||||
"-webkit-animation-timing-function",
|
|
||||||
"-moz-animation-timing-function",
|
|
||||||
"-ms-animation-timing-function",
|
|
||||||
"-o-animation-timing-function",
|
|
||||||
"animation-timing-function",
|
|
||||||
"-webkit-animation-delay",
|
|
||||||
"-moz-animation-delay",
|
|
||||||
"-ms-animation-delay",
|
|
||||||
"-o-animation-delay",
|
|
||||||
"animation-delay",
|
|
||||||
"-webkit-animation-iteration-count",
|
|
||||||
"-moz-animation-iteration-count",
|
|
||||||
"-ms-animation-iteration-count",
|
|
||||||
"-o-animation-iteration-count",
|
|
||||||
"animation-iteration-count",
|
|
||||||
"-webkit-animation-direction",
|
|
||||||
"-moz-animation-direction",
|
|
||||||
"-ms-animation-direction",
|
|
||||||
"-o-animation-direction",
|
|
||||||
"animation-direction",
|
|
||||||
"pointer-events",
|
|
||||||
"unicode-bidi",
|
|
||||||
"direction",
|
|
||||||
"-webkit-columns",
|
|
||||||
"-moz-columns",
|
|
||||||
"columns",
|
|
||||||
"-webkit-column-span",
|
|
||||||
"-moz-column-span",
|
|
||||||
"column-span",
|
|
||||||
"-webkit-column-width",
|
|
||||||
"-moz-column-width",
|
|
||||||
"column-width",
|
|
||||||
"-webkit-column-count",
|
|
||||||
"-moz-column-count",
|
|
||||||
"column-count",
|
|
||||||
"-webkit-column-fill",
|
|
||||||
"-moz-column-fill",
|
|
||||||
"column-fill",
|
|
||||||
"-webkit-column-gap",
|
|
||||||
"-moz-column-gap",
|
|
||||||
"column-gap",
|
|
||||||
"-webkit-column-rule",
|
|
||||||
"-moz-column-rule",
|
|
||||||
"column-rule",
|
|
||||||
"-webkit-column-rule-width",
|
|
||||||
"-moz-column-rule-width",
|
|
||||||
"column-rule-width",
|
|
||||||
"-webkit-column-rule-style",
|
|
||||||
"-moz-column-rule-style",
|
|
||||||
"column-rule-style",
|
|
||||||
"-webkit-column-rule-color",
|
|
||||||
"-moz-column-rule-color",
|
|
||||||
"column-rule-color",
|
|
||||||
"break-before",
|
|
||||||
"break-inside",
|
|
||||||
"break-after",
|
|
||||||
"page-break-before",
|
|
||||||
"page-break-inside",
|
|
||||||
"page-break-after",
|
|
||||||
"orphans",
|
|
||||||
"widows",
|
|
||||||
"-ms-zoom",
|
|
||||||
"zoom",
|
|
||||||
"max-zoom",
|
|
||||||
"min-zoom",
|
|
||||||
"user-select",
|
|
||||||
"user-zoom",
|
|
||||||
"orientation",
|
|
||||||
"cursor"
|
|
||||||
]
|
|
||||||
]
|
|
||||||
}
|
|
||||||
@@ -1,13 +0,0 @@
|
|||||||
# editorconfig.org
|
|
||||||
root = true
|
|
||||||
|
|
||||||
[*]
|
|
||||||
indent_size = 2
|
|
||||||
indent_style = space
|
|
||||||
end_of_line = lf
|
|
||||||
charset = utf-8
|
|
||||||
trim_trailing_whitespace = true
|
|
||||||
insert_final_newline = true
|
|
||||||
|
|
||||||
[*.md]
|
|
||||||
trim_trailing_whitespace = false
|
|
||||||
@@ -1,19 +0,0 @@
|
|||||||
module.exports = {
|
|
||||||
root: true,
|
|
||||||
env: {
|
|
||||||
browser: true,
|
|
||||||
node: true
|
|
||||||
},
|
|
||||||
parserOptions: {
|
|
||||||
parser: "babel-eslint"
|
|
||||||
},
|
|
||||||
extends: [
|
|
||||||
// https://github.com/vuejs/eslint-plugin-vue#priority-a-essential-error-prevention
|
|
||||||
// consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules.
|
|
||||||
"plugin:vue/essential"
|
|
||||||
],
|
|
||||||
// required to lint *.vue files
|
|
||||||
plugins: ["vue"],
|
|
||||||
// add your custom rules here
|
|
||||||
rules: {}
|
|
||||||
};
|
|
||||||
@@ -1,14 +0,0 @@
|
|||||||
# System
|
|
||||||
.DS_Store
|
|
||||||
|
|
||||||
# Editor
|
|
||||||
.vscode
|
|
||||||
|
|
||||||
# Dependencies
|
|
||||||
node_modules
|
|
||||||
|
|
||||||
# Logs
|
|
||||||
npm-debug.log
|
|
||||||
|
|
||||||
# Nuxt build
|
|
||||||
.nuxt
|
|
||||||
@@ -1,22 +0,0 @@
|
|||||||
# Awesome Cheatsheets
|
|
||||||
|
|
||||||
> Awesome cheatsheets for popular programming languages, frameworks and development tools. They include everything you should know in one single file.
|
|
||||||
|
|
||||||
## Build Setup
|
|
||||||
|
|
||||||
```bash
|
|
||||||
# install dependencies
|
|
||||||
$ npm install # Or yarn install
|
|
||||||
|
|
||||||
# serve with hot reload at localhost:3000
|
|
||||||
$ npm run dev
|
|
||||||
|
|
||||||
# build for production and launch server
|
|
||||||
$ npm run build
|
|
||||||
$ npm start
|
|
||||||
|
|
||||||
# generate static project
|
|
||||||
$ npm run generate
|
|
||||||
```
|
|
||||||
|
|
||||||
For detailed explanation on how things work, checkout the [Nuxt.js docs](https://github.com/nuxt/nuxt.js).
|
|
||||||
@@ -1,302 +0,0 @@
|
|||||||
/* *************************************************************************
|
|
||||||
LIBRARIES > BALLOON
|
|
||||||
Based on https://github.com/kazzkiq/balloon.css
|
|
||||||
************************************************************************* */
|
|
||||||
|
|
||||||
/* *************************************************************************
|
|
||||||
* BALLOON > VARIABLES
|
|
||||||
* ************************************************************************* */
|
|
||||||
|
|
||||||
$balloon-bg: fade-out(#111, 0.05);
|
|
||||||
$balloon-base-size: 10px;
|
|
||||||
$balloon-arrow-height: 6px;
|
|
||||||
|
|
||||||
/* *************************************************************************
|
|
||||||
* BALLOON > MIXINS
|
|
||||||
* ************************************************************************* */
|
|
||||||
|
|
||||||
@mixin svg-arrow($color, $position: up) {
|
|
||||||
$degrees: 0;
|
|
||||||
$height: 6px;
|
|
||||||
$width: 18px;
|
|
||||||
|
|
||||||
@if ($position == down) {
|
|
||||||
$degrees: 180 18 6;
|
|
||||||
} @else if ($position == left) {
|
|
||||||
$degrees: -90 18 18;
|
|
||||||
$width: 6px;
|
|
||||||
$height: 18px;
|
|
||||||
} @else if ($position == right) {
|
|
||||||
$degrees: 90 6 6;
|
|
||||||
$width: 6px;
|
|
||||||
$height: 18px;
|
|
||||||
}
|
|
||||||
|
|
||||||
background: no-repeat
|
|
||||||
url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http://www.w3.org/2000/svg%22%20width%3D%22#{$width * 2}%22%20height%3D%22#{$height * 2}%22%3E%3Cpath%20fill%3D%22#{$color}%22%20transform%3D%22rotate(#{$degrees})%22%20d%3D%22M2.658,0.000%20C-13.615,0.000%2050.938,0.000%2034.662,0.000%20C28.662,0.000%2023.035,12.002%2018.660,12.002%20C14.285,12.002%208.594,0.000%202.658,0.000%20Z%22/%3E%3C/svg%3E");
|
|
||||||
background-size: 100% auto;
|
|
||||||
width: $width;
|
|
||||||
height: $height;
|
|
||||||
}
|
|
||||||
|
|
||||||
@mixin transition($args...) {
|
|
||||||
-webkit-transition: $args;
|
|
||||||
-moz-transition: $args;
|
|
||||||
-ms-transition: $args;
|
|
||||||
-o-transition: $args;
|
|
||||||
transition: $args;
|
|
||||||
}
|
|
||||||
|
|
||||||
@mixin transform($val) {
|
|
||||||
-webkit-transform: $val;
|
|
||||||
-moz-transform: $val;
|
|
||||||
-ms-transform: $val;
|
|
||||||
transform: $val;
|
|
||||||
}
|
|
||||||
|
|
||||||
@mixin transform-origin($val) {
|
|
||||||
-webkit-transform-origin: $val;
|
|
||||||
-moz-transform-origin: $val;
|
|
||||||
-ms-transform-origin: $val;
|
|
||||||
transform-origin: $val;
|
|
||||||
}
|
|
||||||
|
|
||||||
@mixin opacity($trans) {
|
|
||||||
filter: alpha(opactiy=($trans * 100));
|
|
||||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=#{$trans * 100})";
|
|
||||||
-moz-opacity: $trans;
|
|
||||||
-khtml-opacity: $trans;
|
|
||||||
opacity: $trans;
|
|
||||||
}
|
|
||||||
|
|
||||||
@mixin base-effects() {
|
|
||||||
@include opacity(0);
|
|
||||||
pointer-events: none;
|
|
||||||
@include transition(all 0.05 ease-out 0.05);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* *************************************************************************
|
|
||||||
* BALLOON > STYLES
|
|
||||||
* ************************************************************************* */
|
|
||||||
|
|
||||||
// IE 11 button bugfix
|
|
||||||
button[data-balloon] {
|
|
||||||
overflow: visible;
|
|
||||||
}
|
|
||||||
|
|
||||||
[data-balloon] {
|
|
||||||
position: relative; // alt. absolute or fixed
|
|
||||||
|
|
||||||
&:after {
|
|
||||||
@include base-effects();
|
|
||||||
|
|
||||||
font-size: $balloon-base-size + 2;
|
|
||||||
background: $balloon-bg;
|
|
||||||
border-radius: 4px;
|
|
||||||
color: #ffffff;
|
|
||||||
content: attr(data-balloon);
|
|
||||||
padding: 0.5em 1em;
|
|
||||||
position: absolute;
|
|
||||||
white-space: nowrap;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 500;
|
|
||||||
z-index: 5;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
@include svg-arrow($balloon-bg);
|
|
||||||
@include base-effects();
|
|
||||||
|
|
||||||
content: "";
|
|
||||||
position: absolute;
|
|
||||||
z-index: 5;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover,
|
|
||||||
&[data-balloon-visible] {
|
|
||||||
&:before,
|
|
||||||
&:after {
|
|
||||||
@include opacity(1);
|
|
||||||
|
|
||||||
pointer-events: auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.font-awesome:after {
|
|
||||||
font-family: FontAwesome;
|
|
||||||
}
|
|
||||||
|
|
||||||
&[data-balloon-break] {
|
|
||||||
&:after {
|
|
||||||
white-space: pre;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&[data-balloon-pos="up"] {
|
|
||||||
&:after {
|
|
||||||
@include transform(translate(-50%, 10px));
|
|
||||||
@include transform-origin(top);
|
|
||||||
|
|
||||||
bottom: 100%;
|
|
||||||
left: 50%;
|
|
||||||
margin-bottom: 5px + $balloon-arrow-height;
|
|
||||||
}
|
|
||||||
&:before {
|
|
||||||
@include transform(translate(-50%, 10px));
|
|
||||||
@include transform-origin(top);
|
|
||||||
|
|
||||||
bottom: 100%;
|
|
||||||
left: 50%;
|
|
||||||
margin-bottom: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover,
|
|
||||||
&[data-balloon-visible] {
|
|
||||||
&:after {
|
|
||||||
@include transform(translate(-50%, 0));
|
|
||||||
}
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
@include transform(translate(-50%, 0));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&[data-balloon-pos="down"] {
|
|
||||||
&:after {
|
|
||||||
@include transform(translate(-50%, -10px));
|
|
||||||
|
|
||||||
left: 50%;
|
|
||||||
margin-top: 5px + $balloon-arrow-height;
|
|
||||||
top: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
@include svg-arrow($balloon-bg, "down");
|
|
||||||
@include transform(translate(-50%, -10px));
|
|
||||||
|
|
||||||
left: 50%;
|
|
||||||
margin-top: 5px;
|
|
||||||
top: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover,
|
|
||||||
&[data-balloon-visible] {
|
|
||||||
&:after {
|
|
||||||
@include transform(translate(-50%, 0));
|
|
||||||
}
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
@include transform(translate(-50%, 0));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&[data-balloon-pos="left"] {
|
|
||||||
&:after {
|
|
||||||
@include transform(translate(10px, -50%));
|
|
||||||
|
|
||||||
margin-right: 5px + $balloon-arrow-height;
|
|
||||||
right: 100%;
|
|
||||||
top: 50%;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
@include svg-arrow($balloon-bg, "left");
|
|
||||||
@include transform(translate(10px, -50%));
|
|
||||||
|
|
||||||
margin-right: 5px;
|
|
||||||
right: 100%;
|
|
||||||
top: 50%;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover,
|
|
||||||
&[data-balloon-visible] {
|
|
||||||
&:after {
|
|
||||||
@include transform(translate(0, -50%));
|
|
||||||
}
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
@include transform(translate(0, -50%));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&[data-balloon-pos="right"] {
|
|
||||||
&:after {
|
|
||||||
@include transform(translate(-10px, -50%));
|
|
||||||
|
|
||||||
left: 100%;
|
|
||||||
margin-left: 5px + $balloon-arrow-height;
|
|
||||||
top: 50%;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
@include svg-arrow($balloon-bg, "right");
|
|
||||||
@include transform(translate(-10px, -50%));
|
|
||||||
|
|
||||||
left: 100%;
|
|
||||||
margin-left: 5px;
|
|
||||||
top: 50%;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover,
|
|
||||||
&[data-balloon-visible] {
|
|
||||||
&:after {
|
|
||||||
@include transform(translate(0, -50%));
|
|
||||||
}
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
@include transform(translate(0, -50%));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&[data-balloon-length="small"] {
|
|
||||||
&:after {
|
|
||||||
white-space: normal;
|
|
||||||
width: 80px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&[data-balloon-length="medium"] {
|
|
||||||
&:after {
|
|
||||||
white-space: normal;
|
|
||||||
width: 150px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&[data-balloon-length="large"] {
|
|
||||||
&:after {
|
|
||||||
white-space: normal;
|
|
||||||
width: 260px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&[data-balloon-length="xlarge"] {
|
|
||||||
&:after {
|
|
||||||
white-space: normal;
|
|
||||||
width: 380px;
|
|
||||||
|
|
||||||
@media screen and (max-width: 768px) {
|
|
||||||
white-space: normal;
|
|
||||||
width: 90vw;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&[data-balloon-length="fit"] {
|
|
||||||
&:after {
|
|
||||||
white-space: normal;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&[data-balloon-type="sidebar"] {
|
|
||||||
&:after {
|
|
||||||
font-size: $balloon-base-size + 3;
|
|
||||||
border-radius: 2px;
|
|
||||||
text-transform: capitalize;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,14 +0,0 @@
|
|||||||
/* **************************************************************************
|
|
||||||
SETTINGS > COLORS
|
|
||||||
To get the color name: http://veli.ee/colorpedia/?c=354052
|
|
||||||
************************************************************************** */
|
|
||||||
|
|
||||||
// Black
|
|
||||||
$black: #000000;
|
|
||||||
$ebony-clay: #273142;
|
|
||||||
$mirage: #1b2431;
|
|
||||||
$mirage2: #171e29;
|
|
||||||
$oxford-blue: #313d4f;
|
|
||||||
|
|
||||||
// White
|
|
||||||
$white: #ffffff;
|
|
||||||
@@ -1,282 +0,0 @@
|
|||||||
/**************************************************************************
|
|
||||||
TOOLS > SASS MQ
|
|
||||||
https://github.com/sass-mq/sass-mq/blob/master/_mq.scss
|
|
||||||
***************************************************************************/
|
|
||||||
|
|
||||||
@charset "UTF-8"; // Fixes an issue where Ruby locale is not set properly
|
|
||||||
// See https://github.com/sass-mq/sass-mq/pull/10
|
|
||||||
|
|
||||||
/// Base font size on the `<body>` element
|
|
||||||
/// @type Number (unit)
|
|
||||||
$mq-base-font-size: 16px !default;
|
|
||||||
|
|
||||||
/// Responsive mode
|
|
||||||
///
|
|
||||||
/// Set to `false` to enable support for browsers that do not support @media queries,
|
|
||||||
/// (IE <= 8, Firefox <= 3, Opera <= 9)
|
|
||||||
///
|
|
||||||
/// You could create a stylesheet served exclusively to older browsers,
|
|
||||||
/// where @media queries are rasterized
|
|
||||||
///
|
|
||||||
/// @example scss
|
|
||||||
/// // old-ie.scss
|
|
||||||
/// $mq-responsive: false;
|
|
||||||
/// @import 'main'; // @media queries in this file will be rasterized up to $mq-static-breakpoint
|
|
||||||
/// // larger breakpoints will be ignored
|
|
||||||
///
|
|
||||||
/// @type Boolean
|
|
||||||
/// @link https://github.com/sass-mq/sass-mq#responsive-mode-off Disabled responsive mode documentation
|
|
||||||
$mq-responsive: true !default;
|
|
||||||
|
|
||||||
/// Breakpoint list
|
|
||||||
///
|
|
||||||
/// Name your breakpoints in a way that creates a ubiquitous language
|
|
||||||
/// across team members. It will improve communication between
|
|
||||||
/// stakeholders, designers, developers, and testers.
|
|
||||||
///
|
|
||||||
/// @type Map
|
|
||||||
/// @link https://github.com/sass-mq/sass-mq#seeing-the-currently-active-breakpoint Full documentation and examples
|
|
||||||
$mq-breakpoints: (
|
|
||||||
mobile: 320px,
|
|
||||||
tablet: 740px,
|
|
||||||
desktop: 980px,
|
|
||||||
wide: 1300px,
|
|
||||||
superwide: 1800px
|
|
||||||
) !default;
|
|
||||||
|
|
||||||
/// Static breakpoint (for fixed-width layouts)
|
|
||||||
///
|
|
||||||
/// Define the breakpoint from $mq-breakpoints that should
|
|
||||||
/// be used as the target width for the fixed-width layout
|
|
||||||
/// (i.e. when $mq-responsive is set to 'false') in a old-ie.scss
|
|
||||||
///
|
|
||||||
/// @example scss
|
|
||||||
/// // tablet-only.scss
|
|
||||||
/// //
|
|
||||||
/// // Ignore all styles above tablet breakpoint,
|
|
||||||
/// // and fix the styles (e.g. layout) at tablet width
|
|
||||||
/// $mq-responsive: false;
|
|
||||||
/// $mq-static-breakpoint: tablet;
|
|
||||||
/// @import 'main'; // @media queries in this file will be rasterized up to tablet
|
|
||||||
/// // larger breakpoints will be ignored
|
|
||||||
///
|
|
||||||
/// @type String
|
|
||||||
/// @link https://github.com/sass-mq/sass-mq#adding-custom-breakpoints Full documentation and examples
|
|
||||||
$mq-static-breakpoint: desktop !default;
|
|
||||||
|
|
||||||
/// Show breakpoints in the top right corner
|
|
||||||
///
|
|
||||||
/// If you want to display the currently active breakpoint in the top
|
|
||||||
/// right corner of your site during development, add the breakpoints
|
|
||||||
/// to this list, ordered by width, e.g. (mobile, tablet, desktop).
|
|
||||||
///
|
|
||||||
/// @type map
|
|
||||||
$mq-show-breakpoints: () !default;
|
|
||||||
|
|
||||||
/// Customize the media type (e.g. `@media screen` or `@media print`)
|
|
||||||
/// By default sass-mq uses an "all" media type (`@media all and …`)
|
|
||||||
///
|
|
||||||
/// @type String
|
|
||||||
/// @link https://github.com/sass-mq/sass-mq#changing-media-type Full documentation and examples
|
|
||||||
$mq-media-type: all !default;
|
|
||||||
|
|
||||||
/// Convert pixels to ems
|
|
||||||
///
|
|
||||||
/// @param {Number} $px - value to convert
|
|
||||||
/// @param {Number} $base-font-size ($mq-base-font-size) - `<body>` font size
|
|
||||||
///
|
|
||||||
/// @example scss
|
|
||||||
/// $font-size-in-ems: mq-px2em(16px);
|
|
||||||
/// p { font-size: mq-px2em(16px); }
|
|
||||||
///
|
|
||||||
/// @requires $mq-base-font-size
|
|
||||||
/// @returns {Number}
|
|
||||||
@function mq-px2em($px, $base-font-size: $mq-base-font-size) {
|
|
||||||
@if unitless($px) {
|
|
||||||
@warn "Assuming #{$px} to be in pixels, attempting to convert it into pixels.";
|
|
||||||
@return mq-px2em($px * 1px, $base-font-size);
|
|
||||||
} @else if unit($px) == em {
|
|
||||||
@return $px;
|
|
||||||
}
|
|
||||||
@return ($px / $base-font-size) * 1em;
|
|
||||||
}
|
|
||||||
|
|
||||||
/// Get a breakpoint's width
|
|
||||||
///
|
|
||||||
/// @param {String} $name - Name of the breakpoint. One of $mq-breakpoints
|
|
||||||
///
|
|
||||||
/// @example scss
|
|
||||||
/// $tablet-width: mq-get-breakpoint-width(tablet);
|
|
||||||
/// @media (min-width: mq-get-breakpoint-width(desktop)) {}
|
|
||||||
///
|
|
||||||
/// @requires {Variable} $mq-breakpoints
|
|
||||||
///
|
|
||||||
/// @returns {Number} Value in pixels
|
|
||||||
@function mq-get-breakpoint-width($name, $breakpoints: $mq-breakpoints) {
|
|
||||||
@if map-has-key($breakpoints, $name) {
|
|
||||||
@return map-get($breakpoints, $name);
|
|
||||||
} @else {
|
|
||||||
@warn "Breakpoint #{$name} wasn't found in $breakpoints.";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/// Media Query mixin
|
|
||||||
///
|
|
||||||
/// @param {String | Boolean} $from (false) - One of $mq-breakpoints
|
|
||||||
/// @param {String | Boolean} $until (false) - One of $mq-breakpoints
|
|
||||||
/// @param {String | Boolean} $and (false) - Additional media query parameters
|
|
||||||
/// @param {String} $media-type ($mq-media-type) - Media type: screen, print…
|
|
||||||
///
|
|
||||||
/// @ignore Undocumented API, for advanced use only:
|
|
||||||
/// @ignore @param {Map} $breakpoints ($mq-breakpoints)
|
|
||||||
/// @ignore @param {String} $static-breakpoint ($mq-static-breakpoint)
|
|
||||||
///
|
|
||||||
/// @content styling rules, wrapped into a @media query when $responsive is true
|
|
||||||
///
|
|
||||||
/// @requires {Variable} $mq-media-type
|
|
||||||
/// @requires {Variable} $mq-breakpoints
|
|
||||||
/// @requires {Variable} $mq-static-breakpoint
|
|
||||||
/// @requires {function} mq-px2em
|
|
||||||
/// @requires {function} mq-get-breakpoint-width
|
|
||||||
///
|
|
||||||
/// @link https://github.com/sass-mq/sass-mq#responsive-mode-on-default Full documentation and examples
|
|
||||||
///
|
|
||||||
@mixin mq(
|
|
||||||
$from: false,
|
|
||||||
$until: false,
|
|
||||||
$and: false,
|
|
||||||
$media-type: $mq-media-type,
|
|
||||||
$breakpoints: $mq-breakpoints,
|
|
||||||
$responsive: $mq-responsive,
|
|
||||||
$static-breakpoint: $mq-static-breakpoint
|
|
||||||
) {
|
|
||||||
$min-width: 0;
|
|
||||||
$max-width: 0;
|
|
||||||
$media-query: "";
|
|
||||||
|
|
||||||
// From: this breakpoint (inclusive)
|
|
||||||
@if $from {
|
|
||||||
@if type-of($from) == number {
|
|
||||||
$min-width: mq-px2em($from);
|
|
||||||
} @else {
|
|
||||||
$min-width: mq-px2em(mq-get-breakpoint-width($from, $breakpoints));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Until: that breakpoint (exclusive)
|
|
||||||
@if $until {
|
|
||||||
@if type-of($until) == number {
|
|
||||||
$max-width: mq-px2em($until);
|
|
||||||
} @else {
|
|
||||||
$max-width: mq-px2em(mq-get-breakpoint-width($until, $breakpoints)) -
|
|
||||||
0.01em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Responsive support is disabled, rasterize the output outside @media blocks
|
|
||||||
// The browser will rely on the cascade itself.
|
|
||||||
@if $responsive == false {
|
|
||||||
$static-breakpoint-width: mq-get-breakpoint-width(
|
|
||||||
$static-breakpoint,
|
|
||||||
$breakpoints
|
|
||||||
);
|
|
||||||
$target-width: mq-px2em($static-breakpoint-width);
|
|
||||||
|
|
||||||
// Output only rules that start at or span our target width
|
|
||||||
@if (
|
|
||||||
$and ==
|
|
||||||
false and
|
|
||||||
$min-width <=
|
|
||||||
$target-width and
|
|
||||||
($until == false or $max-width >= $target-width)
|
|
||||||
) {
|
|
||||||
@content;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Responsive support is enabled, output rules inside @media queries
|
|
||||||
@else {
|
|
||||||
@if $min-width != 0 {
|
|
||||||
$media-query: "#{$media-query} and (min-width: #{$min-width})";
|
|
||||||
}
|
|
||||||
@if $max-width != 0 {
|
|
||||||
$media-query: "#{$media-query} and (max-width: #{$max-width})";
|
|
||||||
}
|
|
||||||
@if $and {
|
|
||||||
$media-query: "#{$media-query} and #{$and}";
|
|
||||||
}
|
|
||||||
|
|
||||||
// Remove unnecessary media query prefix 'all and '
|
|
||||||
@if ($media-type == "all" and $media-query != "") {
|
|
||||||
$media-type: "";
|
|
||||||
$media-query: str-slice(unquote($media-query), 6);
|
|
||||||
}
|
|
||||||
|
|
||||||
@media #{$media-type + $media-query} {
|
|
||||||
@content;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/// Add a breakpoint
|
|
||||||
///
|
|
||||||
/// @param {String} $name - Name of the breakpoint
|
|
||||||
/// @param {Number} $width - Width of the breakpoint
|
|
||||||
///
|
|
||||||
/// @requires {Variable} $mq-breakpoints
|
|
||||||
///
|
|
||||||
/// @example scss
|
|
||||||
/// @include mq-add-breakpoint(tvscreen, 1920px);
|
|
||||||
/// @include mq(tvscreen) {}
|
|
||||||
@mixin mq-add-breakpoint($name, $width) {
|
|
||||||
$new-breakpoint: (
|
|
||||||
$name: $width
|
|
||||||
);
|
|
||||||
$mq-breakpoints: map-merge($mq-breakpoints, $new-breakpoint) !global;
|
|
||||||
}
|
|
||||||
|
|
||||||
/// Show the active breakpoint in the top right corner of the viewport
|
|
||||||
/// @link https://github.com/sass-mq/sass-mq#seeing-the-currently-active-breakpoint
|
|
||||||
///
|
|
||||||
/// @param {List} $show-breakpoints ($mq-show-breakpoints) - List of breakpoints to show in the top right corner
|
|
||||||
/// @param {Map} $breakpoints ($mq-breakpoints) - Breakpoint names and sizes
|
|
||||||
///
|
|
||||||
/// @requires {Variable} $mq-breakpoints
|
|
||||||
/// @requires {Variable} $mq-show-breakpoints
|
|
||||||
///
|
|
||||||
/// @example scss
|
|
||||||
/// // Show breakpoints using global settings
|
|
||||||
/// @include mq-show-breakpoints;
|
|
||||||
///
|
|
||||||
/// // Show breakpoints using custom settings
|
|
||||||
/// @include mq-show-breakpoints((L, XL), (S: 300px, L: 800px, XL: 1200px));
|
|
||||||
@mixin mq-show-breakpoints(
|
|
||||||
$show-breakpoints: $mq-show-breakpoints,
|
|
||||||
$breakpoints: $mq-breakpoints
|
|
||||||
) {
|
|
||||||
body:before {
|
|
||||||
background-color: #fcf8e3;
|
|
||||||
border-bottom: 1px solid #fbeed5;
|
|
||||||
border-left: 1px solid #fbeed5;
|
|
||||||
color: #c09853;
|
|
||||||
font: small-caption;
|
|
||||||
padding: 3px 6px;
|
|
||||||
pointer-events: none;
|
|
||||||
position: fixed;
|
|
||||||
right: 0;
|
|
||||||
top: 0;
|
|
||||||
z-index: 3;
|
|
||||||
|
|
||||||
// Loop through the breakpoints that should be shown
|
|
||||||
@each $show-breakpoint in $show-breakpoints {
|
|
||||||
$width: mq-get-breakpoint-width($show-breakpoint, $breakpoints);
|
|
||||||
@include mq($show-breakpoint, $breakpoints: $breakpoints) {
|
|
||||||
content: "#{$show-breakpoint} ≥ #{$width} (#{mq-px2em($width)})";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@if length($mq-show-breakpoints) > 0 {
|
|
||||||
@include mq-show-breakpoints;
|
|
||||||
}
|
|
||||||
@@ -1,139 +0,0 @@
|
|||||||
<!-- *************************************************************************
|
|
||||||
TEMPLATE
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<template lang="pug">
|
|
||||||
.c-base-cheatsheet
|
|
||||||
a(
|
|
||||||
:href="link"
|
|
||||||
class="c-base-cheatsheet__link"
|
|
||||||
target="_blank"
|
|
||||||
)
|
|
||||||
img(
|
|
||||||
:src="baseUrl + '/images/components/BaseCheatsheet/' + thumbnail"
|
|
||||||
class="c-base-cheatsheet__thumbnail"
|
|
||||||
)
|
|
||||||
|
|
||||||
.c-base-cheatsheet__content
|
|
||||||
a(
|
|
||||||
:href="link"
|
|
||||||
class="c-base-cheatsheet__name"
|
|
||||||
target="_blank"
|
|
||||||
) The {{ name }} Cheatsheet
|
|
||||||
|
|
||||||
.c-base-cheatsheet__share
|
|
||||||
base-share(
|
|
||||||
v-for="network in networks"
|
|
||||||
@click="onShare"
|
|
||||||
:key="network"
|
|
||||||
:network="network"
|
|
||||||
class="c-base-cheatsheet__network"
|
|
||||||
)
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<!-- *************************************************************************
|
|
||||||
SCRIPT
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
props: {
|
|
||||||
link: {
|
|
||||||
type: String,
|
|
||||||
required: true
|
|
||||||
},
|
|
||||||
name: {
|
|
||||||
type: String,
|
|
||||||
required: true
|
|
||||||
},
|
|
||||||
thumbnail: {
|
|
||||||
type: String,
|
|
||||||
required: true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
// --> STATE <--
|
|
||||||
baseUrl: process.env.baseUrl,
|
|
||||||
|
|
||||||
// --> COMPONENTS <--
|
|
||||||
networks: ["Facebook", "Twitter", "LinkedIn", "Telegram"]
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
onShare(network) {
|
|
||||||
const link = this.link;
|
|
||||||
const socialNetwork = network.toLowerCase();
|
|
||||||
const technology = this.name;
|
|
||||||
let url = "";
|
|
||||||
let message = encodeURIComponent(
|
|
||||||
`Check this awesome cheatsheet about ${technology}: ${link} #${technology.toLowerCase()} #cheatsheet`
|
|
||||||
);
|
|
||||||
|
|
||||||
if (socialNetwork === "facebook") {
|
|
||||||
url = `https://www.facebook.com/sharer/sharer.php?u=${link}`;
|
|
||||||
} else if (socialNetwork === "telegram") {
|
|
||||||
url = `https://telegram.me/share/url?url=${link}&text=${message}`;
|
|
||||||
} else if (socialNetwork === "twitter") {
|
|
||||||
url = `https://twitter.com/intent/tweet?text=${message}`;
|
|
||||||
} else if (socialNetwork === "linkedin") {
|
|
||||||
url = `https://www.linkedin.com/shareArticle?mini=true&url=${link}&source=LinkedIn`;
|
|
||||||
}
|
|
||||||
|
|
||||||
window.open(url);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<!-- *************************************************************************
|
|
||||||
STYLE
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
$c: ".c-base-cheatsheet";
|
|
||||||
|
|
||||||
#{$c} {
|
|
||||||
display: block;
|
|
||||||
padding: 10px;
|
|
||||||
border: 1px solid $oxford-blue;
|
|
||||||
border-radius: 6px;
|
|
||||||
background: $ebony-clay;
|
|
||||||
|
|
||||||
#{$c}__link {
|
|
||||||
#{$c}__thumbnail {
|
|
||||||
width: 100%;
|
|
||||||
height: 160px;
|
|
||||||
border-radius: 4px;
|
|
||||||
user-select: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
#{$c}__content {
|
|
||||||
padding: 10px;
|
|
||||||
text-align: left;
|
|
||||||
|
|
||||||
#{$c}__name {
|
|
||||||
margin-bottom: 20px;
|
|
||||||
color: $white;
|
|
||||||
font-size: 18px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#{$c}__share {
|
|
||||||
margin-top: 12px;
|
|
||||||
display: flex;
|
|
||||||
user-select: none;
|
|
||||||
|
|
||||||
#{$c}__network {
|
|
||||||
margin-right: 6px;
|
|
||||||
|
|
||||||
&:last-of-type {
|
|
||||||
margin-right: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@@ -1,55 +0,0 @@
|
|||||||
<!-- *************************************************************************
|
|
||||||
TEMPLATE
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<template lang="pug">
|
|
||||||
.c-base-divider
|
|
||||||
span.c-base-divider__category {{ category }}
|
|
||||||
|
|
||||||
hr.c-base-divider__line
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<!-- *************************************************************************
|
|
||||||
SCRIPT
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
props: {
|
|
||||||
category: {
|
|
||||||
name: String,
|
|
||||||
required: true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<!-- *************************************************************************
|
|
||||||
STYLE
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
$c: ".c-base-divider";
|
|
||||||
|
|
||||||
#{$c} {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
#{$c}__category {
|
|
||||||
margin-right: 20px;
|
|
||||||
color: $white;
|
|
||||||
text-align-last: left;
|
|
||||||
text-transform: uppercase;
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: 18px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#{$c}__line {
|
|
||||||
flex: 1;
|
|
||||||
display: block;
|
|
||||||
height: 1px;
|
|
||||||
border: 0;
|
|
||||||
border-top: 1px solid $oxford-blue;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@@ -1,63 +0,0 @@
|
|||||||
<!-- *************************************************************************
|
|
||||||
TEMPLATE
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<template lang="pug">
|
|
||||||
div(
|
|
||||||
:data-balloon="'Share on ' + network"
|
|
||||||
class="c-base-share"
|
|
||||||
data-balloon-pos="up"
|
|
||||||
data-balloon-type="mini"
|
|
||||||
)
|
|
||||||
img(
|
|
||||||
@click="onClick"
|
|
||||||
:src="baseUrl + '/images/components/BaseShare/' + network.toLowerCase() + '.svg'"
|
|
||||||
class="c-base-share__image"
|
|
||||||
)
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<!-- *************************************************************************
|
|
||||||
SCRIPT
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
props: {
|
|
||||||
network: {
|
|
||||||
type: String,
|
|
||||||
required: true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
// --> STATE <--
|
|
||||||
baseUrl: process.env.baseUrl
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
onClick() {
|
|
||||||
this.$emit("click", this.network);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<!-- *************************************************************************
|
|
||||||
STYLE
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
$c: ".c-base-share";
|
|
||||||
|
|
||||||
#{$c} {
|
|
||||||
display: inline-block;
|
|
||||||
|
|
||||||
#{$c}__image {
|
|
||||||
width: 32px;
|
|
||||||
height: 32px;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@@ -1,70 +0,0 @@
|
|||||||
<!-- *************************************************************************
|
|
||||||
TEMPLATE
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<template lang="pug">
|
|
||||||
a(
|
|
||||||
class="c-the-copyright"
|
|
||||||
href="https://twitter.com/LeCoupa"
|
|
||||||
target="_blank"
|
|
||||||
)
|
|
||||||
span.c-the-copyright__name By LeCoupa
|
|
||||||
|
|
||||||
img(
|
|
||||||
:src="baseUrl + '/images/common/lecoupa.jpg'"
|
|
||||||
class="c-the-copyright__picture"
|
|
||||||
)
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<!-- *************************************************************************
|
|
||||||
SCRIPT
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
// --> STATE <--
|
|
||||||
baseUrl: process.env.baseUrl
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
onClick() {
|
|
||||||
console.log("onClick");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<!-- *************************************************************************
|
|
||||||
STYLE
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
$c: ".c-the-copyright";
|
|
||||||
|
|
||||||
#{$c} {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
padding: 5px 10px;
|
|
||||||
border-top: 1px solid $oxford-blue;
|
|
||||||
border-left: 1px solid $oxford-blue;
|
|
||||||
border-top-left-radius: 4px;
|
|
||||||
background-color: $mirage2;
|
|
||||||
|
|
||||||
#{$c}__name {
|
|
||||||
margin-right: 6px;
|
|
||||||
color: $white;
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#{$c}__picture {
|
|
||||||
display: inline-block;
|
|
||||||
width: 30px;
|
|
||||||
height: 30px;
|
|
||||||
border-radius: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@@ -1,113 +0,0 @@
|
|||||||
<!-- *************************************************************************
|
|
||||||
TEMPLATE
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<template lang="pug">
|
|
||||||
.c-the-github-buttons
|
|
||||||
span.c-the-github-buttons__wrapper
|
|
||||||
iframe(
|
|
||||||
:src="'https://ghbtns.com/github-btn.html?user=' + user + '&repo=' + repo + '&type=star&count=true'"
|
|
||||||
frameborder="0"
|
|
||||||
scrolling="0"
|
|
||||||
height="20px"
|
|
||||||
class="c-the-github-buttons__button c-the-github-buttons__button--star"
|
|
||||||
)
|
|
||||||
|
|
||||||
span.c-the-github-buttons__wrapper
|
|
||||||
iframe(
|
|
||||||
:src="'https://ghbtns.com/github-btn.html?user=' + user + '&repo=' + repo + '&type=watch&count=true&v=2'"
|
|
||||||
frameborder="0"
|
|
||||||
scrolling="0"
|
|
||||||
height="20px"
|
|
||||||
class="c-the-github-buttons__button c-the-github-buttons__button--watch"
|
|
||||||
)
|
|
||||||
|
|
||||||
span.c-the-github-buttons__wrapper
|
|
||||||
iframe(
|
|
||||||
:src="'https://ghbtns.com/github-btn.html?user=' + user + '&repo=' + repo + '&type=fork&count=true'"
|
|
||||||
frameborder="0"
|
|
||||||
scrolling="0"
|
|
||||||
height="20px"
|
|
||||||
class="c-the-github-buttons__button c-the-github-buttons__button--fork"
|
|
||||||
)
|
|
||||||
|
|
||||||
span.c-the-github-buttons__wrapper
|
|
||||||
iframe(
|
|
||||||
:src="'https://ghbtns.com/github-btn.html?user=' + user + '&type=follow&count=true'"
|
|
||||||
frameborder="0"
|
|
||||||
scrolling="0"
|
|
||||||
height="20px"
|
|
||||||
class="c-the-github-buttons__button c-the-github-buttons__button--follow"
|
|
||||||
)
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<!-- *************************************************************************
|
|
||||||
SCRIPT
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
props: {
|
|
||||||
repo: {
|
|
||||||
type: String,
|
|
||||||
required: true
|
|
||||||
},
|
|
||||||
user: {
|
|
||||||
type: String,
|
|
||||||
required: true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<!-- *************************************************************************
|
|
||||||
STYLE
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
$c: ".c-the-github-buttons";
|
|
||||||
|
|
||||||
#{$c} {
|
|
||||||
#{$c}__wrapper {
|
|
||||||
display: inline-block;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
#{$c}__button {
|
|
||||||
margin: 0 auto;
|
|
||||||
|
|
||||||
&--star {
|
|
||||||
width: 110px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&--watch {
|
|
||||||
width: 110px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&--fork {
|
|
||||||
width: 110px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&--follow {
|
|
||||||
width: 160px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:nth-last-of-type {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@include mq($from: tablet) {
|
|
||||||
#{$c} {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
#{$c}__wrapper {
|
|
||||||
margin-bottom: 0;
|
|
||||||
width: initial;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@@ -1,63 +0,0 @@
|
|||||||
<!-- *************************************************************************
|
|
||||||
TEMPLATE
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<template lang="pug">
|
|
||||||
<a :href="link" class="github-corner" aria-label="View source on Github">
|
|
||||||
<svg width="80" height="80" viewBox="0 0 250 250" style="fill:#fff; color:#1b2431; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true">
|
|
||||||
<path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path>
|
|
||||||
<path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path>
|
|
||||||
<path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path>
|
|
||||||
</svg>
|
|
||||||
</a>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<!-- *************************************************************************
|
|
||||||
SCRIPT
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
props: {
|
|
||||||
link: {
|
|
||||||
type: String,
|
|
||||||
required: true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<!-- *************************************************************************
|
|
||||||
STYLE
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
.github-corner:hover .octo-arm {
|
|
||||||
animation: octocat-wave 560ms ease-in-out;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes octocat-wave {
|
|
||||||
0%,
|
|
||||||
100% {
|
|
||||||
transform: rotate(0);
|
|
||||||
}
|
|
||||||
20%,
|
|
||||||
60% {
|
|
||||||
transform: rotate(-25deg);
|
|
||||||
}
|
|
||||||
40%,
|
|
||||||
80% {
|
|
||||||
transform: rotate(10deg);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 500px) {
|
|
||||||
.github-corner:hover .octo-arm {
|
|
||||||
animation: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.github-corner .octo-arm {
|
|
||||||
animation: octocat-wave 560ms ease-in-out;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
|
Before Width: | Height: | Size: 82 KiB After Width: | Height: | Size: 82 KiB |
|
Before Width: | Height: | Size: 18 KiB After Width: | Height: | Size: 18 KiB |
|
Before Width: | Height: | Size: 49 KiB After Width: | Height: | Size: 49 KiB |
|
Before Width: | Height: | Size: 23 KiB After Width: | Height: | Size: 23 KiB |
|
Before Width: | Height: | Size: 21 KiB After Width: | Height: | Size: 21 KiB |
|
Before Width: | Height: | Size: 18 KiB After Width: | Height: | Size: 18 KiB |
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 14 KiB |
|
Before Width: | Height: | Size: 19 KiB After Width: | Height: | Size: 19 KiB |
|
Before Width: | Height: | Size: 18 KiB After Width: | Height: | Size: 18 KiB |
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 14 KiB |
|
Before Width: | Height: | Size: 24 KiB After Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 13 KiB After Width: | Height: | Size: 13 KiB |
|
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 15 KiB |
|
Before Width: | Height: | Size: 13 KiB After Width: | Height: | Size: 13 KiB |
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 14 KiB |
|
Before Width: | Height: | Size: 32 KiB After Width: | Height: | Size: 32 KiB |
|
Before Width: | Height: | Size: 10 KiB After Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 13 KiB After Width: | Height: | Size: 13 KiB |
|
Before Width: | Height: | Size: 17 KiB After Width: | Height: | Size: 17 KiB |
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 14 KiB |
|
Before Width: | Height: | Size: 10 KiB After Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 24 KiB After Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 11 KiB |
|
Before Width: | Height: | Size: 24 KiB After Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.4 KiB |
|
Before Width: | Height: | Size: 2.0 KiB After Width: | Height: | Size: 2.0 KiB |
|
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.5 KiB |
|
Before Width: | Height: | Size: 3.9 KiB After Width: | Height: | Size: 3.9 KiB |
|
Before Width: | Height: | Size: 2.1 KiB After Width: | Height: | Size: 2.1 KiB |
|
Before Width: | Height: | Size: 2.7 KiB After Width: | Height: | Size: 2.7 KiB |
@@ -1,119 +0,0 @@
|
|||||||
<!-- *************************************************************************
|
|
||||||
TEMPLATE
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<template lang="pug">
|
|
||||||
.l-default
|
|
||||||
.l-default__inner
|
|
||||||
the-github-corner(
|
|
||||||
class="l-default__github-corner"
|
|
||||||
link="https://github.com/LeCoupa/awesome-cheatsheets"
|
|
||||||
)
|
|
||||||
nuxt
|
|
||||||
|
|
||||||
the-copyright(
|
|
||||||
class="l-default__copyright"
|
|
||||||
)
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<!-- *************************************************************************
|
|
||||||
SCRIPT
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<script>
|
|
||||||
// PROJECT
|
|
||||||
import TheGithubCorner from "@/components/TheGithubCorner";
|
|
||||||
import TheCopyright from "@/components/TheCopyright";
|
|
||||||
|
|
||||||
export default {
|
|
||||||
components: {
|
|
||||||
TheGithubCorner,
|
|
||||||
TheCopyright
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<!-- *************************************************************************
|
|
||||||
STYLE
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
$c: ".l-default";
|
|
||||||
|
|
||||||
@import "./assets/libraries/balloon";
|
|
||||||
|
|
||||||
html {
|
|
||||||
overflow-y: scroll;
|
|
||||||
box-sizing: border-box;
|
|
||||||
padding: 60px 0 80px;
|
|
||||||
min-height: 100%;
|
|
||||||
background-color: $mirage;
|
|
||||||
color: white;
|
|
||||||
text-align: center;
|
|
||||||
word-spacing: 1px;
|
|
||||||
font-size: 16px;
|
|
||||||
font-family: "Heebo Regular", "Helvetica Neue", Source Sans Pro, Helvetica,
|
|
||||||
Arial, sans-serif;
|
|
||||||
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
-moz-osx-font-smoothing: grayscale;
|
|
||||||
-webkit-text-size-adjust: 100%;
|
|
||||||
-ms-text-size-adjust: 100%;
|
|
||||||
|
|
||||||
#{$c} {
|
|
||||||
margin: 0 40px;
|
|
||||||
|
|
||||||
#{$c}__inner {
|
|
||||||
margin: 0 auto;
|
|
||||||
max-width: 1140px;
|
|
||||||
|
|
||||||
#{$c}__copyright {
|
|
||||||
position: fixed;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
text-decoration: none;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: "Heebo Thin";
|
|
||||||
src: url("/fonts/heebo/Heebo-Thin.otf");
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: "Heebo Light";
|
|
||||||
src: url("/fonts/heebo/Heebo-Light.otf");
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: "Heebo Regular";
|
|
||||||
src: url("/fonts/heebo/Heebo-Regular.otf");
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: "Heebo Medium";
|
|
||||||
src: url("/fonts/heebo/Heebo-Medium.otf");
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: "Heebo Bold";
|
|
||||||
src: url("/fonts/heebo/Heebo-Bold.otf");
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: "Heebo ExtraBold";
|
|
||||||
src: url("/fonts/heebo/Heebo-ExtraBold.otf");
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: "Heebo Black";
|
|
||||||
src: url("/fonts/heebo/Heebo-Black.otf");
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
@@ -1,80 +0,0 @@
|
|||||||
/**************************************************************************
|
|
||||||
* ENVIRONMENT CONFIGURATIONS
|
|
||||||
***************************************************************************/
|
|
||||||
|
|
||||||
const router =
|
|
||||||
process.env.NODE_ENV === "production"
|
|
||||||
? {
|
|
||||||
router: {
|
|
||||||
base: "/awesome-cheatsheets/"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
: {};
|
|
||||||
|
|
||||||
/**************************************************************************
|
|
||||||
* EXPORT
|
|
||||||
***************************************************************************/
|
|
||||||
|
|
||||||
module.exports = {
|
|
||||||
head: {
|
|
||||||
title: "Awesome Cheatsheets",
|
|
||||||
meta: [
|
|
||||||
{ charset: "utf-8" },
|
|
||||||
{ name: "viewport", content: "width=device-width, initial-scale=1" },
|
|
||||||
{
|
|
||||||
hid: "description",
|
|
||||||
name: "description",
|
|
||||||
content:
|
|
||||||
"Designed for the ones who enjoy dark interfaces as much as we do. Using the best UX practices for great conversion rates."
|
|
||||||
}
|
|
||||||
],
|
|
||||||
link: [{ rel: "icon", type: "image/x-icon", href: "/favicon.ico" }]
|
|
||||||
},
|
|
||||||
|
|
||||||
env: {
|
|
||||||
baseUrl:
|
|
||||||
process.env.NODE_ENV === "production"
|
|
||||||
? "https://lecoupa.github.io/awesome-cheatsheets/"
|
|
||||||
: "http://localhost:2018"
|
|
||||||
},
|
|
||||||
|
|
||||||
css: ["normalize.css/normalize.css"],
|
|
||||||
|
|
||||||
plugins: [{ src: "@/plugins/global.js" }],
|
|
||||||
|
|
||||||
modules: [
|
|
||||||
[
|
|
||||||
"@nuxtjs/google-analytics",
|
|
||||||
{
|
|
||||||
id: "UA-125493236-1",
|
|
||||||
debug: { sendHitTask: process.env.NODE_ENV === "production" }
|
|
||||||
}
|
|
||||||
],
|
|
||||||
[
|
|
||||||
"nuxt-sass-resources-loader",
|
|
||||||
[
|
|
||||||
// Global variables, site-wide settings, config switches, etc
|
|
||||||
"@/assets/settings/_colors.scss",
|
|
||||||
|
|
||||||
// Site-wide mixins and functions
|
|
||||||
"@/assets/tools/_mq.scss"
|
|
||||||
]
|
|
||||||
]
|
|
||||||
],
|
|
||||||
|
|
||||||
build: {
|
|
||||||
extend(config, { isDev, isClient }) {
|
|
||||||
if (isDev && isClient) {
|
|
||||||
config.module.rules.push({
|
|
||||||
enforce: "pre",
|
|
||||||
test: /\.(js|vue)$/,
|
|
||||||
loader: "eslint-loader",
|
|
||||||
exclude: /(node_modules)/
|
|
||||||
});
|
|
||||||
}
|
|
||||||
},
|
|
||||||
postcss: [require("autoprefixer")()]
|
|
||||||
},
|
|
||||||
|
|
||||||
...router
|
|
||||||
};
|
|
||||||
@@ -1,36 +0,0 @@
|
|||||||
{
|
|
||||||
"name": "awesome-cheatsheets",
|
|
||||||
"version": "1.0.0",
|
|
||||||
"description": "Awesome cheatsheets for popular programming languages, frameworks and development tools. They include everything you should know in one single file.",
|
|
||||||
"author": "Julien <julien.le.coupanec@gmail.com>",
|
|
||||||
"private": true,
|
|
||||||
"scripts": {
|
|
||||||
"dev": "PORT=2018 nuxt",
|
|
||||||
"build": "NODE_ENV=production nuxt build",
|
|
||||||
"start": "nuxt start",
|
|
||||||
"generate": "NODE_ENV=production nuxt generate",
|
|
||||||
"lint": "eslint --ext .js,.vue --ignore-path .gitignore .",
|
|
||||||
"precommit": "npm run lint",
|
|
||||||
"deploy": "push-dir --dir=dist --branch=gh-pages --cleanup"
|
|
||||||
},
|
|
||||||
"dependencies": {
|
|
||||||
"@nuxtjs/google-analytics": "^2.0.2",
|
|
||||||
"lodash": "^4.17.10",
|
|
||||||
"normalize.css": "^8.0.0",
|
|
||||||
"nuxt": "^1.0.0"
|
|
||||||
},
|
|
||||||
"devDependencies": {
|
|
||||||
"autoprefixer": "^9.1.5",
|
|
||||||
"babel-eslint": "^8.2.1",
|
|
||||||
"eslint": "^4.15.0",
|
|
||||||
"eslint-friendly-formatter": "^3.0.0",
|
|
||||||
"eslint-loader": "^1.7.1",
|
|
||||||
"eslint-plugin-vue": "^4.0.0",
|
|
||||||
"node-sass": "^4.9.3",
|
|
||||||
"nuxt-sass-resources-loader": "^2.0.5",
|
|
||||||
"pug": "^2.0.3",
|
|
||||||
"pug-plain-loader": "^1.0.0",
|
|
||||||
"push-dir": "^0.4.1",
|
|
||||||
"sass-loader": "^7.1.0"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,321 +0,0 @@
|
|||||||
<!-- *************************************************************************
|
|
||||||
TEMPLATE
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<template lang="pug">
|
|
||||||
.c-index
|
|
||||||
a(
|
|
||||||
class="c-index__link"
|
|
||||||
href="https://github.com/LeCoupa/awesome-cheatsheets"
|
|
||||||
target="_blank"
|
|
||||||
)
|
|
||||||
img(
|
|
||||||
:src="baseUrl + '/images/common/logo.png'"
|
|
||||||
:srcset="baseUrl + '/images/common/logo@2x.png'"
|
|
||||||
class="c-index__logo"
|
|
||||||
)
|
|
||||||
|
|
||||||
p.c-index__description
|
|
||||||
| Awesome cheatsheets for popular programming languages, frameworks and development tools.<br/>
|
|
||||||
| They include everything you should know in one single file. 👩💻👨💻
|
|
||||||
|
|
||||||
the-github-buttons(
|
|
||||||
repo="awesome-cheatsheets"
|
|
||||||
user="LeCoupa"
|
|
||||||
class="c-index__github-buttons"
|
|
||||||
)
|
|
||||||
section(
|
|
||||||
v-for="(category, index) in categories"
|
|
||||||
:key="category.name"
|
|
||||||
class="c-index__category"
|
|
||||||
)
|
|
||||||
base-divider(
|
|
||||||
:category="'0' + (index + 1) + '. ' + category.name"
|
|
||||||
class="c-index__divider"
|
|
||||||
)
|
|
||||||
.c-index__cheatsheets
|
|
||||||
base-cheatsheet(
|
|
||||||
v-for="cheatsheet in category.cheatsheets"
|
|
||||||
:key="cheatsheet.name"
|
|
||||||
:link="cheatsheet.link"
|
|
||||||
:name="cheatsheet.name"
|
|
||||||
:thumbnail="cheatsheet.thumbnail"
|
|
||||||
)
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<!-- *************************************************************************
|
|
||||||
SCRIPT
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<script>
|
|
||||||
// PROJECT
|
|
||||||
import TheGithubButtons from "@/components/TheGithubButtons";
|
|
||||||
|
|
||||||
export default {
|
|
||||||
components: {
|
|
||||||
TheGithubButtons
|
|
||||||
},
|
|
||||||
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
// --> STATE <--
|
|
||||||
baseUrl: process.env.baseUrl,
|
|
||||||
|
|
||||||
// --> COMPONENTS <--
|
|
||||||
categories: [
|
|
||||||
{
|
|
||||||
name: "Languages",
|
|
||||||
cheatsheets: [
|
|
||||||
{
|
|
||||||
name: "Bash",
|
|
||||||
thumbnail: "bash.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/languages/bash.sh"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "C",
|
|
||||||
thumbnail: "c.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/languages/C.txt"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "C#",
|
|
||||||
thumbnail: "c-sharp.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/languages/C%23.txt"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "JavaScript",
|
|
||||||
thumbnail: "javascript.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/languages/javascript.js"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "PHP",
|
|
||||||
thumbnail: "php.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/languages/php.php"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Backend",
|
|
||||||
cheatsheets: [
|
|
||||||
{
|
|
||||||
name: "Django",
|
|
||||||
thumbnail: "django.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/backend/django.py"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Feathers.js",
|
|
||||||
thumbnail: "feathers.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/backend/feathers.js"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Laravel",
|
|
||||||
thumbnail: "laravel.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/backend/laravel.php"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Moleculer",
|
|
||||||
thumbnail: "moleculer.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/backend/moleculer.js"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Node.js",
|
|
||||||
thumbnail: "node.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/backend/node.js"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Sails.js",
|
|
||||||
thumbnail: "sails.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/backend/sails.js"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Frontend",
|
|
||||||
cheatsheets: [
|
|
||||||
{
|
|
||||||
name: "Angular.js",
|
|
||||||
thumbnail: "angularjs.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/frontend/angularjs.js"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Angular 2+",
|
|
||||||
thumbnail: "angular.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/frontend/angular.js"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Ember.js",
|
|
||||||
thumbnail: "ember.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/frontend/ember.js"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "HTML5",
|
|
||||||
thumbnail: "html5.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/frontend/html5.html"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "React.js",
|
|
||||||
thumbnail: "react.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/frontend/react.js"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Tailwind.css",
|
|
||||||
thumbnail: "tailwind.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/frontend/tailwind.css"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Vue.js",
|
|
||||||
thumbnail: "vue.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/frontend/vue.js"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Databases",
|
|
||||||
cheatsheets: [
|
|
||||||
{
|
|
||||||
name: "Redis",
|
|
||||||
thumbnail: "redis.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/databases/redis.sh"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Tools",
|
|
||||||
cheatsheets: [
|
|
||||||
{
|
|
||||||
name: "Docker",
|
|
||||||
thumbnail: "docker.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/tools/docker.sh"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Git",
|
|
||||||
thumbnail: "git.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/tools/git.sh"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Heroku CLI",
|
|
||||||
thumbnail: "heroku.png",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/tools/heroku.sh"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Kubernetes",
|
|
||||||
thumbnail: "kubernetes.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/tools/kubernetes.md"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Puppeteer",
|
|
||||||
thumbnail: "puppeteer.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/tools/puppeteer.js"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Sublime Text",
|
|
||||||
thumbnail: "sublime_text.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/tools/sublime_text.md"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "VIM",
|
|
||||||
thumbnail: "vim.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/tools/vim.txt"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Visual Studio Code",
|
|
||||||
thumbnail: "visual_studio_code.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/tools/vscode.md"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Xcode",
|
|
||||||
thumbnail: "xcode.jpg",
|
|
||||||
link:
|
|
||||||
"https://github.com/LeCoupa/awesome-cheatsheets/blob/master/tools/xcode.txt"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
]
|
|
||||||
};
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<!-- *************************************************************************
|
|
||||||
STYLE
|
|
||||||
************************************************************************* -->
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
$c: ".c-index";
|
|
||||||
|
|
||||||
#{$c} {
|
|
||||||
#{$c}__logo {
|
|
||||||
width: 245px;
|
|
||||||
height: 165px;
|
|
||||||
user-select: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
#{$c}__description {
|
|
||||||
margin: 0;
|
|
||||||
margin: 30px 0;
|
|
||||||
font-size: 18px;
|
|
||||||
line-height: 32px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#{$c}__github-buttons {
|
|
||||||
margin-bottom: 40px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#{$c}__category {
|
|
||||||
margin-bottom: 40px;
|
|
||||||
|
|
||||||
&:last-of-type {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
#{$c}__divider {
|
|
||||||
margin-bottom: 40px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#{$c}__cheatsheets {
|
|
||||||
display: grid;
|
|
||||||
grid-gap: 20px;
|
|
||||||
grid-template-columns: repeat(auto-fill, 270px);
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@include mq($from: tablet) {
|
|
||||||
#{$c} {
|
|
||||||
#{$c}__description {
|
|
||||||
font-size: 22px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#{$c}__github-buttons {
|
|
||||||
margin-bottom: 60px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@@ -1,45 +0,0 @@
|
|||||||
/**************************************************************************
|
|
||||||
* IMPORTS
|
|
||||||
***************************************************************************/
|
|
||||||
|
|
||||||
// NPM
|
|
||||||
import Vue from "vue";
|
|
||||||
import upperFirst from "lodash/upperFirst";
|
|
||||||
import camelCase from "lodash/camelCase";
|
|
||||||
|
|
||||||
/**************************************************************************
|
|
||||||
* GLOBAL COMPONENTS
|
|
||||||
* https://vuejs.org/v2/guide/components.html#Global-Registration
|
|
||||||
***************************************************************************/
|
|
||||||
|
|
||||||
const requireComponent = require.context(
|
|
||||||
// The relative path of the components folder
|
|
||||||
// NOTE: try with ../components/base
|
|
||||||
"../components",
|
|
||||||
// Whether or not to look in subfolders
|
|
||||||
false,
|
|
||||||
// The regular expression used to match base component filenames
|
|
||||||
/Base[A-Z]\w+\.(vue|js)$/
|
|
||||||
);
|
|
||||||
|
|
||||||
requireComponent.keys().forEach(fileName => {
|
|
||||||
// Get component config
|
|
||||||
const componentConfig = requireComponent(fileName);
|
|
||||||
|
|
||||||
// Get PascalCase name of component
|
|
||||||
const componentName = upperFirst(
|
|
||||||
camelCase(
|
|
||||||
// Strip the leading `./` and extension from the filename
|
|
||||||
fileName.replace(/^\.\/(.*)\.\w+$/, "$1")
|
|
||||||
)
|
|
||||||
);
|
|
||||||
|
|
||||||
// Register component globally
|
|
||||||
Vue.component(
|
|
||||||
componentName,
|
|
||||||
// Look for the component options on `.default`, which will
|
|
||||||
// exist if the component was exported with `export default`,
|
|
||||||
// otherwise fall back to module's root.
|
|
||||||
componentConfig.default || componentConfig
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
Before Width: | Height: | Size: 1.1 KiB |
|
Before Width: | Height: | Size: 82 KiB |
|
Before Width: | Height: | Size: 18 KiB |
|
Before Width: | Height: | Size: 49 KiB |
|
Before Width: | Height: | Size: 23 KiB |
|
Before Width: | Height: | Size: 21 KiB |
|
Before Width: | Height: | Size: 18 KiB |
|
Before Width: | Height: | Size: 14 KiB |
|
Before Width: | Height: | Size: 19 KiB |
|
Before Width: | Height: | Size: 18 KiB |
|
Before Width: | Height: | Size: 14 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 13 KiB |
|
Before Width: | Height: | Size: 15 KiB |
|
Before Width: | Height: | Size: 13 KiB |
|
Before Width: | Height: | Size: 14 KiB |
|
Before Width: | Height: | Size: 32 KiB |
|
Before Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 13 KiB |
|
Before Width: | Height: | Size: 17 KiB |
|
Before Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 14 KiB |
|
Before Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 11 KiB |