Skip to content

Commit b8584fb

Browse files
anotherKyleFrom1994anotherKyleFrom1994
committed
Upgraded dependencies, renamed some components to avoid conflict
1 parent 75a6fd0 commit b8584fb

File tree

21 files changed

+3587
-3274
lines changed

21 files changed

+3587
-3274
lines changed

‎src/components/activity/articles/Articles.ts‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import { Vue, Component, Prop } from 'vue-property-decorator';
2+
3+
@Component({})
4+
export default class Articles extends Vue {
5+
6+
}

‎src/components/activity/articles/Articles.vue‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<template>
2+
<v-container class="pa-0">
3+
<h1 class="display-3 font-weight-light">
4+
Article Title
5+
</h1>
6+
<v-row align="center"
7+
class="mb-2">
8+
<v-col sm="12"
9+
class="d-flex">
10+
<!-- <v-img :src="require(`@/assets/articles/${article.hero}`)"
11+
class="mr-3"
12+
height="36"
13+
max-width="36" /> -->
14+
<div>
15+
<base-subheading fontWeight="light" font-size="1"> Subheading </base-subheading>
16+
<div class="caption">
17+
Date
18+
</div>
19+
</div>
20+
</v-col>
21+
</v-row>
22+
</v-container>
23+
</template>
24+
25+
<script lang="ts"
26+
src="./Articles.ts" />>

‎src/components/activity/feed/Feed.ts‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,17 +9,17 @@ export default class Feed extends Vue {
99
private layout: number[] = [2, 2, 2, 2, 2, 2, 2];
1010
private page: number = 1;
1111

12-
@namespace('activity').State('articles') articles!: IArticle[];
12+
@namespace('activity').State('photos') photos!: IArticle[];
1313

1414
get pages() {
15-
return Math.ceil(this.articles.length / 11);
15+
return Math.ceil(this.photos.length / 11);
1616
}
1717

18-
get paginatedArticles() {
18+
get paginatedPhotos() {
1919
const start = (this.page - 1) * 4;
2020
const stop = this.page * 4;
2121

22-
return this.articles.slice(start, stop);
22+
return this.photos.slice(start, stop);
2323
}
2424

2525
@Watch('page') onPageChanged(value: number, oldValue: number) {

‎src/components/activity/feed/Feed.vue‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,20 +4,20 @@
44
dense>
55
<v-col sm="6">
66
<v-row dense>
7-
<feed-card :key="paginatedArticles[0].title"
7+
<feed-card :key="paginatedPhotos[0].title"
88
:size="1"
99
:height="'100%'"
10-
:value="paginatedArticles[0]">
10+
:value="paginatedPhotos[0]">
1111
</feed-card>
1212
</v-row>
1313
</v-col>
1414
<v-col sm="6">
1515
<v-row dense>
16-
<feed-card v-for="(article, i) in paginatedArticles"
17-
:key="article.title"
16+
<feed-card v-for="(photo, i) in paginatedPhotos"
17+
:key="photo.title"
1818
:height="'100%'"
1919
:size="layout[i]"
20-
:value="article">
20+
:value="photo">
2121

2222
</feed-card>
2323
</v-row>

‎src/components/activity/sponsor/Sponsor.vue‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
11
<template>
2-
<v-col>
3-
4-
111111111111
5-
</v-col>
2+
<base-portrait>
3+
</base-portrait>
64
</template>
75

86
<script lang="ts"

‎src/components/base/carousel/Carousel.ts‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,14 @@ import { Component, Vue, Prop, Watch, Emit } from 'vue-property-decorator';
33
export interface Item {
44
src: string;
55
title ? : string;
6-
displayWording ? : string;
6+
subheading ? : string;
77
button ? : button;
8+
href ? : string;
89
}
910

1011
export interface button {
11-
displayWording: string;
12-
color: 'primary' | 'secondary';
12+
title: string;
13+
color ? : 'primary' | 'secondary';
1314
}
1415

1516
@Component({ inheritAttrs: false })

‎src/components/base/carousel/Carousel.vue‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,10 @@
33
hide-delimiter-background>
44
<v-carousel-item v-for="(item,i) in items"
55
:key="i"
6+
:src="createDisplayImage(item)"
7+
:to="item.href"
68
height="400"
79
width="100%"
8-
:src="createDisplayImage(item)"
910
reverse-transition="fade-transition"
1011
transition="fade-transition">
1112
<v-row align="center"
@@ -15,18 +16,18 @@
1516
md="7"
1617
offset-md="5">
1718
<h1 v-if="item.title"
18-
class="display-3 font-weight-light">
19+
class="display-3 font-weight-light white--text">
1920
{{ item.title }}
2021
</h1>
21-
<div v-if="item.displayWording"
22-
class="subheading text-uppercase pl-2 mb-4">
23-
{{ item.displayWording }}
22+
<div v-if="item.subheading"
23+
class="subheading text-uppercase pl-2 mb-4 white--text">
24+
{{ item.subheading }}
2425
</div>
2526
<v-btn v-if="item.button"
26-
:color="item.button.color"
27+
:color="item.button.color ? item.button.color : 'primary'"
2728
depressed
2829
rounded>
29-
{{ item.button.displayWording }}
30+
{{ item.button.title }}
3031
</v-btn>
3132
</v-col>
3233
</v-row>

‎src/components/base/portrait/Portrait.ts‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import { Vue, Component, Prop } from 'vue-property-decorator'
2+
3+
@Component({})
4+
export default class BasePortrait extends Vue {
5+
6+
}

‎src/components/base/portrait/Portrait.vue‎

Lines changed: 87 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,87 @@
1+
<template>
2+
<v-card class="portrait">
3+
<!-- <v-card-title class="cyan darken-1">
4+
<span class="headline white--text">Sarah Mcbeal</span>
5+
6+
<v-spacer></v-spacer>
7+
8+
<v-btn dark
9+
icon>
10+
<v-icon>mdi-chevron-left</v-icon>
11+
</v-btn>
12+
13+
<v-btn dark
14+
icon>
15+
<v-icon>mdi-pencil</v-icon>
16+
</v-btn>
17+
18+
<v-btn dark
19+
icon>
20+
<v-icon>mdi-dots-vertical</v-icon>
21+
</v-btn>
22+
</v-card-title> -->
23+
24+
<v-img src="https://picsum.photos/700?image=996"
25+
height="200px"></v-img>
26+
27+
<v-list>
28+
<v-list-item>
29+
<v-list-item-action>
30+
<v-icon>mdi-phone</v-icon>
31+
</v-list-item-action>
32+
33+
<v-list-item-content>
34+
<v-list-item-title>(650) 555-1234</v-list-item-title>
35+
</v-list-item-content>
36+
<v-list-item-action>
37+
38+
<v-icon>mdi-message-text</v-icon>
39+
</v-list-item-action>
40+
</v-list-item>
41+
42+
<v-divider inset></v-divider>
43+
44+
<v-list-item>
45+
<v-list-item-action>
46+
<v-icon>mdi-phone</v-icon>
47+
</v-list-item-action>
48+
49+
<v-list-item-content>
50+
<v-list-item-title>(323) 555-6789</v-list-item-title>
51+
</v-list-item-content>
52+
53+
<v-list-item-action>
54+
<v-icon>mdi-message-text</v-icon>
55+
</v-list-item-action>
56+
</v-list-item>
57+
58+
<v-divider inset></v-divider>
59+
60+
<v-list-item>
61+
<v-list-item-action>
62+
<v-icon>mdi-email</v-icon>
63+
</v-list-item-action>
64+
65+
<v-list-item-content>
66+
<v-list-item-title>mcbeal@example.com</v-list-item-title>
67+
</v-list-item-content>
68+
</v-list-item>
69+
70+
<v-divider inset></v-divider>
71+
72+
<v-list-item>
73+
<v-list-item-action>
74+
<v-icon>mdi-map-marker</v-icon>
75+
</v-list-item-action>
76+
77+
<v-list-item-content>
78+
<v-list-item-title>Orlando, FL 79938</v-list-item-title>
79+
</v-list-item-content>
80+
</v-list-item>
81+
</v-list>
82+
83+
</v-card>
84+
</template>
85+
86+
<script lang="ts"
87+
src="./Portrait.ts">

‎src/components/base/subheading/Subheading.ts‎

Lines changed: 26 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,29 @@
11
import { Component, Vue, Prop, Watch, Emit } from 'vue-property-decorator';
22

33
@Component({ inheritAttrs: false })
4-
export default class BaseSubheading extends Vue {};
4+
export default class BaseSubheading extends Vue {
5+
@Prop({ default: 'medium' }) fontWeight!: 'light' | 'medium';
6+
@Prop() fontSize!: number;
7+
8+
private classes() {
9+
let base: string = 'subheading text-uppercase mb-3';
10+
11+
switch (this.fontWeight) {
12+
case 'light': {
13+
base += '\u0020font-weight-light';
14+
break;
15+
}
16+
case 'medium': {
17+
base += '\u0020font-weight-medium';
18+
break;
19+
}
20+
}
21+
22+
if (this.fontSize) {
23+
base += ('\u0020display-' + (6 - this.fontSize));
24+
}
25+
26+
return base;
27+
}
28+
29+
};

0 commit comments

Comments
 (0)