Skip to content

Commit

Permalink
Resizesthe bounding box of all Layout and Table card svgs to 100x100
Browse files Browse the repository at this point in the history
  • Loading branch information
roblevintennis committed Sep 25, 2020
1 parent 7582a4d commit c2ea2ac
Show file tree
Hide file tree
Showing 10 changed files with 71 additions and 131 deletions.
6 changes: 6 additions & 0 deletions showcase/src/assets/card.svg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
8 changes: 8 additions & 0 deletions showcase/src/assets/filters.svg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 4 additions & 0 deletions showcase/src/assets/header.svg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
5 changes: 5 additions & 0 deletions showcase/src/assets/pagination.svg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 6 additions & 0 deletions showcase/src/assets/sorting.svg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 6 additions & 0 deletions showcase/src/assets/stepper.svg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 6 additions & 0 deletions showcase/src/assets/table.svg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 6 additions & 0 deletions showcase/src/assets/tabs.svg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
74 changes: 12 additions & 62 deletions showcase/src/views/LayoutCards.vue
Expand Up @@ -12,28 +12,7 @@
<h6>Tabs</h6>
</header>
<a href="#color" :class="$style.cardbody">
<svg
width="88"
height="80"
viewBox="0 0 88 80"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<rect x="0.5" y="0.5" width="87" height="79" rx="2.5" stroke="#D8D8D8" />
<path
d="M0.5 3C0.5 1.61929 1.61929 0.5 3 0.5H29.5V15.5H0.5V3Z"
fill="#CCCCCC"
stroke="#D8D8D8"
/>
<path
d="M29.5 1C29.5 0.723858 29.7239 0.5 30 0.5H58.5V15.5H29.5V1Z"
stroke="#D8D8D8"
/>
<path
d="M58.5 0.5H85C86.3807 0.5 87.5 1.61929 87.5 3V15.5H58.5V0.5Z"
stroke="#D8D8D8"
/>
</svg>
<TabsSVG />
</a>
</Card>
</FlexCol>
Expand All @@ -43,21 +22,7 @@
<h6>Card</h6>
</header>
<a href="#color" :class="$style.cardbody">
<svg
width="88"
height="80"
viewBox="0 0 88 80"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<rect x="0.5" y="0.5" width="87" height="79" rx="2.5" stroke="#D8D8D8" />
<path
d="M0.5 3C0.5 1.61929 1.61929 0.5 3 0.5H85C86.3807 0.5 87.5 1.61929 87.5 3V15.5H0.5V3Z"
stroke="#D8D8D8"
/>
<line x1="16" y1="39.5" x2="72" y2="39.5" stroke="#D8D8D8" />
<line x1="16" y1="51.5" x2="72" y2="51.5" stroke="#D8D8D8" />
</svg>
<CardSVG />
</a>
</Card>
</FlexCol>
Expand All @@ -67,19 +32,7 @@
<h6>Header</h6>
</header>
<a href="#color" :class="$style.cardbody">
<svg
width="88"
height="80"
viewBox="0 0 88 80"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<rect x="0.5" y="0.5" width="87" height="79" rx="2.5" stroke="#D8D8D8" />
<path
d="M0 3C0 1.34315 1.34315 0 3 0H85C86.6569 0 88 1.34315 88 3V16H0V3Z"
fill="#D8D8D8"
/>
</svg>
<HeaderSVG />
</a>
</Card>
</FlexCol>
Expand All @@ -89,18 +42,7 @@
<h6>Stepper</h6>
</header>
<a href="#color" :class="$style.cardbody">
<svg
width="10"
height="54"
viewBox="0 0 10 54"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<circle cx="5" cy="5" r="4.5" stroke="#D8D8D8" />
<circle cx="5" cy="49" r="4.5" stroke="#D8D8D8" />
<line x1="5" y1="9" x2="5" y2="44" stroke="#D8D8D8" stroke-width="2" />
<circle cx="5" cy="27" r="4.5" fill="#D8D8D8" stroke="#CCCCCC" />
</svg>
<StepperSVG />
</a>
</Card>
</FlexCol>
Expand All @@ -113,6 +55,10 @@ import Card from "agnosticui/Card.vue";
import FlexGrid from "agnosticui/FlexGrid/FlexGrid";
import FlexRow from "agnosticui/FlexGrid/FlexRow";
import FlexCol from "agnosticui/FlexGrid/FlexCol";
import TabsSVG from "../assets/tabs.svg";
import CardSVG from "../assets/card.svg";
import HeaderSVG from "../assets/header.svg";
import StepperSVG from "../assets/stepper.svg";
export default {
name: "LayoutCards",
Expand All @@ -121,6 +67,10 @@ export default {
FlexCol,
FlexGrid,
FlexRow,
TabsSVG,
CardSVG,
HeaderSVG,
StepperSVG,
},
};
</script>
Expand Down
81 changes: 12 additions & 69 deletions showcase/src/views/TableCards.vue
Expand Up @@ -12,18 +12,7 @@
<h6>Table TBD</h6>
</header>
<a href="#table" :class="$style.cardbody">
<svg
width="90"
height="61"
viewBox="0 0 90 61"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<rect x="0.5" y="0.5" width="89" height="8.80357" stroke="#E0E0E0" />
<rect y="23.9644" width="90" height="2.17857" fill="#E8E8E8" />
<rect y="41.3931" width="90" height="2.17857" fill="#E8E8E8" />
<rect y="58.8213" width="90" height="2.17857" fill="#E8E8E8" />
</svg>
<TableSVG />
</a>
</Card>
</FlexCol>
Expand All @@ -33,28 +22,7 @@
<h6>Sorting tbd</h6>
</header>
<a href="#sorting" :class="$style.cardbody">
<svg
width="69"
height="90"
viewBox="0 0 69 90"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path d="M12.5 0L23.3253 12.5H1.67468L12.5 0Z" fill="#E9E9E9" />
<path
d="M57.3251 90.0005L46.4998 77.5005L68.1504 77.5005L57.3251 90.0005Z"
fill="#E9E9E9"
/>
<line x1="12.5" y1="11.667" x2="12.5" y2="90.0003" stroke="#E9E9E9" stroke-width="3" />
<line
x1="57.166"
y1="78.3335"
x2="57.166"
y2="0.000167912"
stroke="#E9E9E9"
stroke-width="3"
/>
</svg>
<SortingSVG />
</a>
</Card>
</FlexCol>
Expand All @@ -64,20 +32,7 @@
<h6>Filters tbd</h6>
</header>
<a href="#filters" :class="$style.cardbody">
<svg
width="87"
height="69"
viewBox="0 0 87 69"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<rect y="7" width="87" height="4" fill="#E9E9E9" />
<rect y="32" width="87" height="4" fill="#E9E9E9" />
<rect y="57" width="87" height="4" fill="#E9E9E9" />
<circle cx="25.5" cy="9.5" r="8" fill="white" stroke="#E9E9E9" stroke-width="3" />
<circle cx="61.5" cy="34.5" r="8" fill="white" stroke="#E9E9E9" stroke-width="3" />
<circle cx="44.5" cy="59.5" r="8" fill="white" stroke="#E9E9E9" stroke-width="3" />
</svg>
<FiltersSVG />
</a>
</Card>
</FlexCol>
Expand All @@ -87,27 +42,7 @@
<h6>Pagination TBD</h6>
</header>
<a href="#pagination" :class="$style.cardbody">
<svg
width="92"
height="16"
viewBox="0 0 92 16"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M3 0.5H30.8636V15.5H3C1.61929 15.5 0.5 14.3807 0.5 13V3C0.5 1.61929 1.61929 0.5 3 0.5Z"
fill="#CCCCCC"
stroke="#D8D8D8"
/>
<path
d="M31.3184 0.5H61.182V15.5H30.8184V1C30.8184 0.723858 31.0422 0.5 31.3184 0.5Z"
stroke="#D8D8D8"
/>
<path
d="M61.1367 0.5H89.0004C90.3811 0.5 91.5004 1.61929 91.5004 3V13C91.5004 14.3807 90.3811 15.5 89.0004 15.5H61.1367V0.5Z"
stroke="#D8D8D8"
/>
</svg>
<PaginationSVG />
</a>
</Card>
</FlexCol>
Expand All @@ -120,6 +55,10 @@ import Card from "agnosticui/Card.vue";
import FlexGrid from "agnosticui/FlexGrid/FlexGrid";
import FlexRow from "agnosticui/FlexGrid/FlexRow";
import FlexCol from "agnosticui/FlexGrid/FlexCol";
import TableSVG from "../assets/table.svg";
import SortingSVG from "../assets/sorting.svg";
import FiltersSVG from "../assets/filters.svg";
import PaginationSVG from "../assets/pagination.svg";
export default {
name: "InputCards",
Expand All @@ -128,6 +67,10 @@ export default {
FlexCol,
FlexGrid,
FlexRow,
TableSVG,
SortingSVG,
FiltersSVG,
PaginationSVG,
},
};
</script>
Expand Down

0 comments on commit c2ea2ac

Please sign in to comment.