Fix card style

2018-01-23 16:37:23 -02:00 · 2018-01-23 16:37:23 -02:00 · 4901c542c8
parent fd1ec45281
commit 4901c542c8
5 changed files with 115 additions and 36 deletions
--- a/package-lock.json
+++ b/package-lock.json
@ -151,17 +151,88 @@
      }
    },
    "autoprefixer": {
-      "version": "6.7.7",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.7.7.tgz",
-      "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ=",
-      "dev": true,
+      "version": "7.2.5",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-7.2.5.tgz",
+      "integrity": "sha512-XqHfo8Ht0VU+T5P+eWEVoXza456KJ4l62BPewu3vpNf3LP9s2+zYXkXBznzYby4XeECXgG3N4i+hGvOhXErZmA==",
      "requires": {
-        "browserslist": "1.7.7",
-        "caniuse-db": "1.0.30000778",
+        "browserslist": "2.11.3",
+        "caniuse-lite": "1.0.30000792",
        "normalize-range": "0.1.2",
        "num2fraction": "1.2.2",
-        "postcss": "5.2.18",
+        "postcss": "6.0.16",
        "postcss-value-parser": "3.3.0"
+      },
+      "dependencies": {
+        "ansi-styles": {
+          "version": "3.2.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
+          "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug==",
+          "requires": {
+            "color-convert": "1.9.1"
+          }
+        },
+        "browserslist": {
+          "version": "2.11.3",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.11.3.tgz",
+          "integrity": "sha512-yWu5cXT7Av6mVwzWc8lMsJMHWn4xyjSuGYi4IozbVTLUOEYPSagUB8kiMDUHA1fS3zjr8nkxkn9jdvug4BBRmA==",
+          "requires": {
+            "caniuse-lite": "1.0.30000792",
+            "electron-to-chromium": "1.3.31"
+          }
+        },
+        "chalk": {
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.3.0.tgz",
+          "integrity": "sha512-Az5zJR2CBujap2rqXGaJKaPHyJ0IrUimvYNX+ncCy8PJP4ltOGTrHUIo097ZaL2zMeKYpiCdqDvS6zdrTFok3Q==",
+          "requires": {
+            "ansi-styles": "3.2.0",
+            "escape-string-regexp": "1.0.5",
+            "supports-color": "4.5.0"
+          },
+          "dependencies": {
+            "supports-color": {
+              "version": "4.5.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.5.0.tgz",
+              "integrity": "sha1-vnoN5ITexcXN34s9WRJQRJEvY1s=",
+              "requires": {
+                "has-flag": "2.0.0"
+              }
+            }
+          }
+        },
+        "electron-to-chromium": {
+          "version": "1.3.31",
+          "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.31.tgz",
+          "integrity": "sha512-XE4CLbswkZgZFn34cKFy1xaX+F5LHxeDLjY1+rsK9asDzknhbrd9g/n/01/acbU25KTsUSiLKwvlLyA+6XLUOA=="
+        },
+        "has-flag": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
+          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
+        },
+        "postcss": {
+          "version": "6.0.16",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.16.tgz",
+          "integrity": "sha512-m758RWPmSjFH/2MyyG3UOW1fgYbR9rtdzz5UNJnlm7OLtu4B2h9C6gi+bE4qFKghsBRFfZT8NzoQBs6JhLotoA==",
+          "requires": {
+            "chalk": "2.3.0",
+            "source-map": "0.6.1",
+            "supports-color": "5.1.0"
+          }
+        },
+        "source-map": {
+          "version": "0.6.1",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+          "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g=="
+        },
+        "supports-color": {
+          "version": "5.1.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.1.0.tgz",
+          "integrity": "sha512-Ry0AwkoKjDpVKK4sV4h6o3UJmNRbjYm2uXhwfj3J56lMVdvnUNqzQVRztOOMGQ++w1K/TjNDFvpJk0F/LoeBCQ==",
+          "requires": {
+            "has-flag": "2.0.0"
+          }
+        }
      }
    },
    "axios": {
@ -1151,6 +1222,11 @@
      "integrity": "sha1-Fnxg6VQqKqYFN8RG+ziB2FOjByo=",
      "dev": true
    },
+    "caniuse-lite": {
+      "version": "1.0.30000792",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000792.tgz",
+      "integrity": "sha1-0M6pgfgRjzlhRxr7tDyaHlu/AzI="
+    },
    "center-align": {
      "version": "0.1.3",
      "resolved": "https://registry.npmjs.org/center-align/-/center-align-0.1.3.tgz",
@ -1275,7 +1351,6 @@
      "version": "1.9.1",
      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.1.tgz",
      "integrity": "sha512-mjGanIiwQJskCC18rPR6OmrZ6fm2Lc7PeGFYwCmy5J34wC6F1PzdGL6xeMfmgicfYcNLGuVFA3WzXtIDCQSZxQ==",
-      "dev": true,
      "requires": {
        "color-name": "1.1.3"
      }
@ -1283,8 +1358,7 @@
    "color-name": {
      "version": "1.1.3",
      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
-      "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=",
-      "dev": true
+      "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
    },
    "color-string": {
      "version": "0.3.0",
@ -1628,6 +1702,22 @@
        "postcss-unique-selectors": "2.0.2",
        "postcss-value-parser": "3.3.0",
        "postcss-zindex": "2.2.0"
+      },
+      "dependencies": {
+        "autoprefixer": {
+          "version": "6.7.7",
+          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.7.7.tgz",
+          "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ=",
+          "dev": true,
+          "requires": {
+            "browserslist": "1.7.7",
+            "caniuse-db": "1.0.30000778",
+            "normalize-range": "0.1.2",
+            "num2fraction": "1.2.2",
+            "postcss": "5.2.18",
+            "postcss-value-parser": "3.3.0"
+          }
+        }
      }
    },
    "csso": {
@ -1864,8 +1954,7 @@
    "escape-string-regexp": {
      "version": "1.0.5",
      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
-      "dev": true
+      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ="
    },
    "esprima": {
      "version": "2.7.3",
@ -3915,8 +4004,7 @@
    "normalize-range": {
      "version": "0.1.2",
      "resolved": "https://registry.npmjs.org/normalize-range/-/normalize-range-0.1.2.tgz",
-      "integrity": "sha1-LRDAa9/TEuqXd2laTShDlFa3WUI=",
-      "dev": true
+      "integrity": "sha1-LRDAa9/TEuqXd2laTShDlFa3WUI="
    },
    "normalize-url": {
      "version": "1.9.1",
@ -3933,8 +4021,7 @@
    "num2fraction": {
      "version": "1.2.2",
      "resolved": "https://registry.npmjs.org/num2fraction/-/num2fraction-1.2.2.tgz",
-      "integrity": "sha1-b2gragJ6Tp3fpFZM0lidHU5mnt4=",
-      "dev": true
+      "integrity": "sha1-b2gragJ6Tp3fpFZM0lidHU5mnt4="
    },
    "number-is-nan": {
      "version": "1.0.1",
@ -4866,8 +4953,7 @@
    "postcss-value-parser": {
      "version": "3.3.0",
      "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.0.tgz",
-      "integrity": "sha1-h/OPnxj3dKSrTIojL1xc6IcqnRU=",
-      "dev": true
+      "integrity": "sha1-h/OPnxj3dKSrTIojL1xc6IcqnRU="
    },
    "postcss-zindex": {
      "version": "2.2.0",
--- a/package.json
+++ b/package.json
@ -15,6 +15,7 @@
    "vuex": "^3.0.1"
  },
  "devDependencies": {
+    "autoprefixer": "^7.2.5",
    "babel-core": "^6.0.0",
    "babel-loader": "^6.0.0",
    "babel-preset-es2015": "^6.0.0",
--- a/src/admin/admin.vue
+++ b/src/admin/admin.vue
@ -18,18 +18,8 @@
 </template>

 <script>
-    import { mapActions, mapGetters } from 'vuex'
-    import CollectionsList from './components/collections-list.vue'
-    import CollectionPage from './components/collection-page.vue';
-    import ItensList from './components/itens-list.vue'
-
    export default {
        name: "admin",
-        components: {
-            'collections-list': CollectionsList,
-            'collection-page': CollectionPage,
-            'itens-list': ItensList
-        }
    }
 </script>

@ -47,9 +37,7 @@
    }

    .el-main {
-        background-color: #E9EEF3;
        color: #333;
-        line-height: 160px;
    }

    body > .el-container {
--- a/src/admin/components/collection-page.vue
+++ b/src/admin/components/collection-page.vue
@ -5,10 +5,11 @@
                <img src="" class="image" :alt="collection.name">
                <div style="padding: 14px;">
                    <span>{{ collection.name }}</span>
-                    <div class="el-bottom clearfix">
+                    <div class="bottom clearfix">
                        <time class="time">{{collection.description}}</time>
-                        <el-button type="text" class="button">Lista de Itens</el-button>
+                        <el-button type="text" >Lista de Itens</el-button>
                    </div>
+
                </div>
            </el-card>     
        </el-row>
--- a/src/admin/components/collections-list.vue
+++ b/src/admin/components/collections-list.vue
@ -3,12 +3,16 @@
        <el-row>
            <el-col :span="8" v-for="(collection, index) in collections" :key="collection.id" :offset="index > 0 ? 2 : 0">
                <el-card :body-style="{ padding: '0px' }">
-                    <img src="" class="image" :alt="collection.name">
+                    <img src="http://lorempixel.com/200/200" class="image" :alt="collection.name">
                    <div style="padding: 14px;">
                        <span>{{ collection.name }}</span>
-                        <div class="el-bottom clearfix">
+                        <div class="bottom clearfix">
                            <time class="time">{{collection.description}}</time>
-                            <router-link tag="el-button" :to="`/collections/${collection.id}`" type="text" class="button">Ver Coleção</router-link>
+                            <router-link :to="`/collections/${collection.id}`">
+                                <el-button type="text">
+                                    Ver Coleção
+                                </el-button>
+                            </router-link>
                        </div>
                    </div>
                </el-card>
@ -54,7 +58,6 @@ export default {
    }

    .bottom {
-        margin-top: 13px;
        line-height: 12px;
    }