before recipes:update

assets/js/components/projects/ProjectDetails.vue

@@ -3,7 +3,7 @@
 		v-if="isLoading"
 		class="circle"
 	>
-		<i class="fa fa-spinner fa-spin fa-3x fa-fw" />
+		<i class="fa fa-spinner fa-spin fa-3x fa-fw"/>
 		<span class="sr-only">Loading …</span>
 	</div>
 	<div
@@ -23,12 +23,14 @@
 					<h2>{{ project.name }}</h2>
 				</div>
 				<div>
-					Source: <b-link
-						:to="project.url"
+					Source:
+					<a
+						:href="project.url"
 						target="_blank"
 					>
 						{{ project.url }}
-					</b-link>&nbsp
+					</a>
+					&nbsp;
 					<i
 						class="fa fa-external-link"
 						aria-hidden="true"
@@ -36,12 +38,12 @@
 				</div>
 				<div class="row mt-5">
 					<div class="col-sm-12">
+						<!-- eslint-disable vue/no-v-html -->
 						<div
 							class="article-text"
 							v-html="readmeToHtml"
-						>
-							{{ }}
-						</div>
+						/>
+						<!-- eslint-enable -->
 					</div>
 				</div>
 			</div>
@@ -52,7 +54,7 @@
 <script>
 
 import axios from 'axios'
-import { marked } from 'marked';
+import { marked } from 'marked'
 import Author from '@/components/users/UserCard'
 
 export default {
@@ -71,6 +73,7 @@ export default {
 			if (!this.isLoading) {
 				return marked(this.readme)
 			}
+			return ''
 		}
 	},
 	mounted() {
@@ -78,15 +81,14 @@ export default {
 		console.log(id)
 		axios
 			.get(`/api/projects/${id}`)
-			.then((response) => {
-				console.log(response)
-				this.project = response.data
-				console.log(this.project);
+			.then((projectResponse) => {
+				this.project = projectResponse.data
+				console.log(this.project)
 				axios
 					.get(`${this.project.url}/raw/branch/master/README.md`)
 					.then((response) => {
 						this.readme = response.data
-						this.isLoading = false;
+						this.isLoading = false
 						console.log(response)
 					})
 					.catch((error) => {
@@ -101,5 +103,5 @@ export default {
 		getProjects() {
 		}
 	}
-};
+}
 </script>

assets/js/components/projects/index.vue

@@ -3,7 +3,7 @@
 		v-if="isLoading"
 		class="circle"
 	>
-		<i class="fa fa-spinner fa-spin fa-3x fa-fw" />
+		<i class="fa fa-spinner fa-spin fa-3x fa-fw"/>
 		<span class="sr-only">Loading …</span>
 	</div>
 	<div
@@ -16,14 +16,14 @@
 			</h2>
 			<!-- projects List -->
 			<div class="col-sm-12">
-				<b-col
+				<div
 					v-for="project in projects"
 					:key="project.id"
 				>
 					<div class="project-container bg-dark my-4">
 						<div class="row">
 							<div class="col-sm-3">
-								<b-link :to="'/projects/' + project.id">
+								<router-link :to="'/projects/' + project.id">
 									<img
 										v-if="project.teaserImage"
 										class="blog-img"
@@ -36,70 +36,78 @@
 										src="/build/images/24unix/24_logo_bg_96x96.png"
 										alt="Teaser"
 									>
-								</b-link>
+								</router-link>
 								<br>
 								<div>
-									<b-col
+									<div
 										v-for="developer in project.developer"
 										:key="developer"
+										class="col"
 									>
-										<author :author-iri="developer" />
-									</b-col>
+										<user-card :author-iri="developer"/>
+									</div>
 								</div>
 							</div>
 							<div class="col-sm-8 mt-2">
-								<b-link :to="'/projects/' + project.id">
+								<router-link :to="'/projects/' + project.id">
 									<div class="article-title d-inline-block pl-3 align-middle">
-										<h2 v-html="project.name" />
+										<h2 v-html="project.name"/>
 									</div>
-								</b-link>
+								</router-link>
 								<br>
 								<div class="blog-teaser mb-2 pb-2 text-xl-start">
-									<span v-html="project.description" />
+									<span v-html="project.description"/>
 									<br>
 									<br>
-									started: <span v-html="project.createdAt" />
+									started: <span v-html="formatDate(project.createdAt)"/>
 								</div>
 							</div>
 						</div>
 					</div>
-				</b-col>
+				</div>
 			</div>
+			<!--
 			<div class="text-xl-start">
-				<b-link to="/add">
-					<i class="fa fa-plus-circle" />
-				</b-link>
+				<router-link to="/add">
+					<i class="fa fa-plus-circle"/>
+				</router-link>
 			</div>
+			-->
 		</div>
 	</div>
 </template>
 
 <script>
 
-import axios from 'axios';
+import axios from 'axios'
 
-import Author from '@/components/users/UserCard';
+import UserCard from '@/components/users/UserCard'
 
 export default {
 	name: 'ProjectsList',
 	components: {
-		Author
+		UserCard,
 	},
 	data: () => ({
 		projects: null,
 		isLoading: true
 	}),
 	mounted() {
-		this.getProjects();
+		this.getProjects()
 	},
 	methods: {
 		getProjects() {
 			axios
 				.get('/api/projects')
-				.then((response) => (this.projects = response.data['hydra:member']));
-			this.isLoading = false;
-			console.log(this.projects);
+				.then((response) => {
+					this.projects = response.data['hydra:member']
+				})
+			this.isLoading = false
+			console.log(this.projects)
+		},
+		formatDate(date) {
+			return new Date(date).toLocaleDateString('de-DE')
 		}
 	}
-};
+}
 </script>