Replace spaces with tabs

src/App.vue

@@ -1,24 +1,24 @@
 <template>
-  <router-view/>
+	<router-view/>
 </template>
 
 <style>
 *, *::before, *::after {
-    box-sizing: border-box;
+	box-sizing: border-box;
 }
 html, body {
-    padding: 0;
-    margin: 0;
+	padding: 0;
+	margin: 0;
 }
 html {
-    font-size: 16px;
+	font-size: 16px;
 }
 body {
-    font-size: 1rem;
+	font-size: 1rem;
 
-    font-family: 'Source Sans Pro';
+	font-family: 'Source Sans Pro';
 }
 pre, code, kbd, samp {
-    font-family: 'Source Code Pro';
+	font-family: 'Source Code Pro';
 }
 </style>

src/components/BlobSize.vue

@@ -1,5 +1,5 @@
 <template>
-    <LoadableText :text="text" />
+	<LoadableText :text="text" />
 </template>
 
 <script>

src/components/Error.vue

@@ -1,5 +1,5 @@
 <template>
-    <div v-if="message">{{ message }}</div>
+	<div v-if="message">{{ message }}</div>
 </template>
 
 <script>
@@ -12,11 +12,11 @@ export default {
 
 <style scoped>
 div {
-    text-align: center;
-    background: #fdd;
-    color: #800;
-    padding: 0.5rem 0.75rem;
-    margin: 1rem;
-    border-radius: 0.5rem;
+	text-align: center;
+	background: #fdd;
+	color: #800;
+	padding: 0.5rem 0.75rem;
+	margin: 1rem;
+	border-radius: 0.5rem;
 }
 </style>

src/components/Layout.vue

@@ -1,23 +1,23 @@
 <template>
-    <div class="wrapper">
-        <header>
-            <slot name="title" />
-            <slot name="error" />
-            <slot name="toolbar" />
-        </header>
-        <main>
-            <div class="content">
-                <slot />
-            </div>
-        </main>
-        <footer>
-            <p>
-                <a :href="source">dri</a>
-                {{ version }}
-                by <a href="https://github.com/serverwentdown">@serverwentdown</a>
-            </p>
-        </footer>
-    </div>
+	<div class="wrapper">
+		<header>
+			<slot name="title" />
+			<slot name="error" />
+			<slot name="toolbar" />
+		</header>
+		<main>
+			<div class="content">
+				<slot />
+			</div>
+		</main>
+		<footer>
+			<p>
+				<a :href="source">dri</a>
+				{{ version }}
+				by <a href="https://github.com/serverwentdown">@serverwentdown</a>
+			</p>
+		</footer>
+	</div>
 </template>
 
 <script>
@@ -35,20 +35,20 @@ export default {
 
 <style scoped>
 header, footer, main {
-    margin: 0 auto;
+	margin: 0 auto;
 }
 header, footer, .content {
-    padding: 1rem;
+	padding: 1rem;
 }
 .content {
 width: fit-content;}
 header, footer {
-    max-width: 38rem;
-    text-align: center;
+	max-width: 38rem;
+	text-align: center;
 }
 main {
-    width: fit-content;
-    max-width: 100%;
-    overflow-x: auto;
+	width: fit-content;
+	max-width: 100%;
+	overflow-x: auto;
 }
 </style>

src/components/List.vue

@@ -1,17 +1,17 @@
 <template>
-    <table>
-        <thead>
-            <slot name="header" />
-        </thead>
-        <tbody>
-            <slot />
-        </tbody>
-    </table>
+	<table>
+		<thead>
+			<slot name="header" />
+		</thead>
+		<tbody>
+			<slot />
+		</tbody>
+	</table>
 </template>
 
 <style scoped>
 table {
-    min-width: 28rem;
-    border-spacing: 0;
+	min-width: 28rem;
+	border-spacing: 0;
 }
 </style>

src/components/ListHeader.vue

@@ -1,23 +1,23 @@
 <template>
-    <tr>
-        <th class="col title"><slot name="title" /></th>
-        <th class="col detail" v-if="$slots.detail"><slot name="detail" /></th>
-        <th class="col date" v-if="$slots.date"><slot name="date" /></th>
-        <th class="col size" v-if="$slots.size"><slot name="size" /></th>
-        <th class="col buttons" v-if="$slots.buttons"><slot name="buttons" /></th>
-    </tr>
+	<tr>
+		<th class="col title"><slot name="title" /></th>
+		<th class="col detail" v-if="$slots.detail"><slot name="detail" /></th>
+		<th class="col date" v-if="$slots.date"><slot name="date" /></th>
+		<th class="col size" v-if="$slots.size"><slot name="size" /></th>
+		<th class="col buttons" v-if="$slots.buttons"><slot name="buttons" /></th>
+	</tr>
 </template>
 
 <style scoped>
 th {
-    padding: 0.5rem;
-    white-space: nowrap;
-    font-size: 0.8em;
-    text-align: left;
-    border-bottom: 1px solid #eee;
-    text-align: right;
+	padding: 0.5rem;
+	white-space: nowrap;
+	font-size: 0.8em;
+	text-align: left;
+	border-bottom: 1px solid #eee;
+	text-align: right;
 }
 .title {
-    text-align: left;
+	text-align: left;
 }
 </style>

src/components/ListItem.vue

@@ -1,11 +1,11 @@
 <template>
-    <router-link tag="tr" :to="to || {}">
-        <td class="col title"><slot name="title" /></td>
-        <td class="col detail" v-if="$slots.detail"><slot name="detail" /></td>
-        <td class="col date" v-if="$slots.date"><slot name="date" /></td>
-        <td class="col size" v-if="$slots.size"><slot name="size" /></td>
-        <td class="col buttons" v-if="$slots.buttons"><slot name="buttons" /></td>
-    </router-link>
+	<router-link tag="tr" :to="to || {}">
+		<td class="col title"><slot name="title" /></td>
+		<td class="col detail" v-if="$slots.detail"><slot name="detail" /></td>
+		<td class="col date" v-if="$slots.date"><slot name="date" /></td>
+		<td class="col size" v-if="$slots.size"><slot name="size" /></td>
+		<td class="col buttons" v-if="$slots.buttons"><slot name="buttons" /></td>
+	</router-link>
 </template>
 
 <script>
@@ -18,19 +18,19 @@ export default {
 
 <style scoped>
 tr:hover {
-    background: #f4f4f4;
+	background: #f4f4f4;
 }
 td {
-    padding: 0.5rem 0.75rem;
-    white-space: nowrap;
-    border-bottom: 1px solid #eee;
-    border-bottom-width: 0.5px;
-    text-align: right;
+	padding: 0.5rem 0.75rem;
+	white-space: nowrap;
+	border-bottom: 1px solid #eee;
+	border-bottom-width: 0.5px;
+	text-align: right;
 }
 .title {
-    text-align: left;
+	text-align: left;
 }
 .detail {
-    font-size: 0.8em;
+	font-size: 0.8em;
 }
 </style>

src/components/LoadableText.vue

@@ -1,5 +1,5 @@
 <template>
-    <span :class="{ loading: !text }">{{ text }}<span /><span /><span /></span>
+	<span :class="{ loading: !text }">{{ text }}<span /><span /><span /></span>
 </template>
 
 <script>
@@ -12,35 +12,35 @@ export default {
 
 <style scoped>
 span.loading > span {
-    display: inline-block;
-    background: #000;
-    border-radius: 0.09375em;
-    width: 0.1875em;
-    height: 0.1875em;
-    margin: 0.25em 0.075em;
-    opacity: 0.5;
+	display: inline-block;
+	background: #000;
+	border-radius: 0.09375em;
+	width: 0.1875em;
+	height: 0.1875em;
+	margin: 0.25em 0.075em;
+	opacity: 0.5;
 }
 span.loading > span:nth-child(1) {
-    animation: fade 1s ease 0s infinite;
+	animation: fade 1s ease 0s infinite;
 }
 span.loading > span:nth-child(2) {
-    animation: fade 1s ease 0.333s infinite;
+	animation: fade 1s ease 0.333s infinite;
 }
 span.loading > span:nth-child(3) {
-    animation: fade 1s ease 0.666s infinite;
+	animation: fade 1s ease 0.666s infinite;
 }
 @keyframes fade {
-    0% {
-        opacity: 1;
-    }
-    33.3% {
-        opacity: 0.25;
-    }
-    66.6% {
-        opacity: 0.25;
-    }
-    100% {
-        opacity: 1;
-    }
+	0% {
+		opacity: 1;
+	}
+	33.3% {
+		opacity: 0.25;
+	}
+	66.6% {
+		opacity: 0.25;
+	}
+	100% {
+		opacity: 1;
+	}
 }
 </style>

src/components/Paginator.vue

@@ -1,8 +1,8 @@
 <template>
-    <div>
-        <!-- <span class="prev" @click="prev">Previous</span> -->
-        <span class="next" @click="next" v-if="nextLast">Next</span>
-    </div>
+	<div>
+		<!-- <span class="prev" @click="prev">Previous</span> -->
+		<span class="next" @click="next" v-if="nextLast">Next</span>
+	</div>
 </template>
 
 <script>
@@ -23,12 +23,12 @@ export default {
 
 <style scoped>
 div {
-    display: flex;
-    justify-content: space-between;
-    padding-top: 0.75rem;
+	display: flex;
+	justify-content: space-between;
+	padding-top: 0.75rem;
 }
 div > span {
-    padding: 0.75rem;
-    color: #008;
+	padding: 0.75rem;
+	color: #008;
 }
 </style>

src/components/TagSize.vue

@@ -1,5 +1,5 @@
 <template>
-    <LoadableText :text="text" />
+	<LoadableText :text="text" />
 </template>
 
 <script>

src/components/ToolbarButton.vue

@@ -19,7 +19,7 @@ button {
 	outline: none;
 	border-radius: 0.5rem;
 	background: #66f;
-    padding: 0.5rem 0.75rem;
+	padding: 0.5rem 0.75rem;
 	color: #fff;
 	tap-highlight-color: transparent;
 }

src/views/Blob.vue

@@ -1,19 +1,19 @@
 <template>
-    <Layout>
-        <h1 slot="title">{{ $route.params.repo }}</h1>
+	<Layout>
+		<h1 slot="title">{{ $route.params.repo }}</h1>
 		<Error slot="error" :message='error' />
-        <h2>Details</h2>
-        <List>
-            <ListItem>
-                <span slot="title">Full Digest</span>
-                <span slot="detail">{{ $route.params.digest }}</span>
-            </ListItem>
-            <ListItem>
-                <span slot="title">Size</span>
-                <BlobSize slot="detail" :repo="$route.params.repo" :blob="$route.params.digest" />
-            </ListItem>
-            </List>
-    </Layout>
+		<h2>Details</h2>
+		<List>
+			<ListItem>
+				<span slot="title">Full Digest</span>
+				<span slot="detail">{{ $route.params.digest }}</span>
+			</ListItem>
+			<ListItem>
+				<span slot="title">Size</span>
+				<BlobSize slot="detail" :repo="$route.params.repo" :blob="$route.params.digest" />
+			</ListItem>
+			</List>
+	</Layout>
 </template>
 
 <script>

src/views/Repo.vue

@@ -1,35 +1,35 @@
 <template>
-    <Layout>
-        <h1 slot="title">{{ $route.params.repo }}</h1>
-        <Error slot="error" :message='error' />
+	<Layout>
+		<h1 slot="title">{{ $route.params.repo }}</h1>
+		<Error slot="error" :message='error' />
 		<Toolbar slot="toolbar">
-		<ToolbarButton v-if="repoCanDelete" @click="deleteRepo" danger>Delete</ToolbarButton>
+			<ToolbarButton v-if="repoCanDelete" @click="deleteRepo" danger>Delete</ToolbarButton>
 		</Toolbar>
-        <List>
-            <ListHeader slot="header">
-                <span slot="title">Tag</span>
-                <span slot="detail">Pull Commmand</span>
-                <span slot="date">Created</span>
-                <span slot="size">Size</span>
-            </ListHeader>
-            <ListItem
-                v-for="(tag, i) in tags"
-                :key="tag"
-                :to="{ name: 'tag', params: { tag, }}">
-                <span slot="title">
-                    {{ tag }}
-                </span>
-                <span slot="detail">
-                    <code>docker pull {{ registryHost }}/{{ $route.params.repo }}:{{ tag }}</code>
-                </span>
-                <time slot="date" :datetime="dates[i]">
+		<List>
+			<ListHeader slot="header">
+				<span slot="title">Tag</span>
+				<span slot="detail">Pull Commmand</span>
+				<span slot="date">Created</span>
+				<span slot="size">Size</span>
+			</ListHeader>
+			<ListItem
+				v-for="(tag, i) in tags"
+				:key="tag"
+				:to="{ name: 'tag', params: { tag, }}">
+				<span slot="title">
+					{{ tag }}
+				</span>
+				<span slot="detail">
+					<code>docker pull {{ registryHost }}/{{ $route.params.repo }}:{{ tag }}</code>
+				</span>
+				<time slot="date" :datetime="dates[i]">
 					{{ dates[i].toLocaleString() }}
 				</time>
-                <TagSize slot="size" :repo="$route.params.repo" :tag="tag" />
-            </ListItem>
-        </List>
-        <Paginator :nextLast="nextLast" />
-    </Layout>
+				<TagSize slot="size" :repo="$route.params.repo" :tag="tag" />
+			</ListItem>
+		</List>
+		<Paginator :nextLast="nextLast" />
+	</Layout>
 </template>
 
 <script>
@@ -74,6 +74,7 @@ export default {
 	},
 	methods: {
 		async deleteRepo() {
+			// eslint-disable-next-line no-alert
 			if (!window.confirm(`Are you sure you want to delete ${this.$route.params.repo}?`)) {
 				return;
 			}

src/views/Repos.vue

@@ -1,26 +1,26 @@
 <template>
-    <Layout>
-        <h1 slot="title">Repositories</h1>
-        <Error slot="error" :message='error' />
-        <List>
-            <ListHeader slot="header">
-                <span slot="title">Repository</span>
-                <span slot="detail">Pull Commmand</span>
-            </ListHeader>
-            <ListItem
-                v-for="repo in repos"
-                :key="repo"
-                :to="{ name: 'repo', params: { repo, }}">
-                <span slot="title">
-                    {{ repo }}
-                </span>
-                <span slot="detail">
-                    <code>docker pull {{ registryHost }}/{{ repo }}</code>
-                </span>
-            </ListItem>
-        </List>
-        <Paginator :nextLast="nextLast" />
-    </Layout>
+	<Layout>
+		<h1 slot="title">Repositories</h1>
+		<Error slot="error" :message='error' />
+		<List>
+			<ListHeader slot="header">
+				<span slot="title">Repository</span>
+				<span slot="detail">Pull Commmand</span>
+			</ListHeader>
+			<ListItem
+				v-for="repo in repos"
+				:key="repo"
+				:to="{ name: 'repo', params: { repo, }}">
+				<span slot="title">
+					{{ repo }}
+				</span>
+				<span slot="detail">
+					<code>docker pull {{ registryHost }}/{{ repo }}</code>
+				</span>
+			</ListItem>
+		</List>
+		<Paginator :nextLast="nextLast" />
+	</Layout>
 </template>
 
 <script>

src/views/Tag.vue

@@ -1,36 +1,37 @@
 <template>
-    <Layout>
-        <h1 slot="title">{{ $route.params.repo }}:{{ $route.params.tag }}</h1>
-        <Error slot="error" :message='error' />
+	<Layout>
+		<h1 slot="title">{{ $route.params.repo }}:{{ $route.params.tag }}</h1>
+		<Error slot="error" :message='error' />
 		<Toolbar slot="toolbar">
-		<ToolbarButton v-if="tagCanDelete" @click="deleteTag" danger>Delete</ToolbarButton>		</Toolbar>
-        <h2>Details</h2>
-        <List>
-            <ListItem>
-                <span slot="title">Schema Version</span>
-                <span slot="detail">{{ tag.schemaVersion }}</span>
-            </ListItem>
-            <ListItem>
+			<ToolbarButton v-if="tagCanDelete" @click="deleteTag" danger>Delete</ToolbarButton>
+		</Toolbar>
+		<h2>Details</h2>
+		<List>
+			<ListItem>
+				<span slot="title">Schema Version</span>
+				<span slot="detail">{{ tag.schemaVersion }}</span>
+			</ListItem>
+			<ListItem>
 				<span slot="title">Full Digest</span>
-                <span slot="detail">{{ tag.headers.get('Docker-Content-Digest') }}</span>
-            </ListItem>
-            <ListItem>
+				<span slot="detail">{{ tag.headers.get('Docker-Content-Digest') }}</span>
+			</ListItem>
+			<ListItem>
 				<span slot="title">Date Created</span>
-                <span slot="date">{{ new Date(config.created).toLocaleString() }}</span>
-            </ListItem>
-            <ListItem>
+				<span slot="date">{{ new Date(config.created).toLocaleString() }}</span>
+			</ListItem>
+			<ListItem>
 				<span slot="title">Platform</span>
 				<span slot="detail">{{ config.os }} {{ config.architecture }}</span>
-            </ListItem>
-            <ListItem>
+			</ListItem>
+			<ListItem>
 				<span slot="title">Entrypoint</span>
 				<span slot="detail"><code>{{ config.config.Entrypoint }}</code></span>
-            </ListItem>
-            <ListItem>
+			</ListItem>
+			<ListItem>
 				<span slot="title">Command</span>
 				<span slot="detail"><code>{{ config.config.Cmd }}</code></span>
-            </ListItem>
-            <ListItem>
+			</ListItem>
+			<ListItem>
 				<span slot="title">Labels</span>
 				<span slot="detail">
 					<ul style="text-align: left; list-style: none;">
@@ -39,35 +40,35 @@
 						</li>
 					</ul>
 				</span>
-            </ListItem>
+			</ListItem>
+			<ListItem>
+				<span slot="title">Layers</span>
+				<span slot="size">{{ tag.layers.length }}</span>
+			</ListItem>
 			<ListItem>
-                <span slot="title">Layers</span>
-                <span slot="size">{{ tag.layers.length }}</span>
-            </ListItem>
-            <ListItem>
-                <span slot="title">Size</span>
-                <span slot="size">
+				<span slot="title">Size</span>
+				<span slot="size">
 					<TagSize :repo="$route.params.repo" :tag="$route.params.tag" />
 				</span>
-            </ListItem>
-        </List>
-        <h2>Layers</h2>
-        <List>
-            <ListHeader slot="header">
-                <span slot="title">Digest</span>
-                <span slot="detail">Summary</span>
-                <span slot="size">Size</span>
-            </ListHeader>
-            <ListItem
-               v-for="(layer, i) in tag.layers"
-               :key="i"
-               :to="{ name: 'blob', params: { repo: $route.params.repo, digest: layer.digest }}">
-                <span slot="title" :title="layer.digest">{{ identifier(tag, i) }}</span>
-                <span slot="detail">{{ command(tag, i) }}</span>
-                <BlobSize slot="size" :size="layer.size" />
-            </ListItem>
-        </List>
-    </Layout>
+			</ListItem>
+		</List>
+		<h2>Layers</h2>
+		<List>
+			<ListHeader slot="header">
+				<span slot="title">Digest</span>
+				<span slot="detail">Summary</span>
+				<span slot="size">Size</span>
+			</ListHeader>
+			<ListItem
+				v-for="(layer, i) in tag.layers"
+				:key="i"
+				:to="{ name: 'blob', params: { repo: $route.params.repo, digest: layer.digest }}">
+				<span slot="title" :title="layer.digest">{{ identifier(tag, i) }}</span>
+				<span slot="detail">{{ command(tag, i) }}</span>
+				<BlobSize slot="size" :size="layer.size" />
+			</ListItem>
+		</List>
+	</Layout>
 </template>
 
 <script>
@@ -112,6 +113,7 @@ export default {
 	},
 	methods: {
 		async deleteTag() {
+			// eslint-disable-next-line no-alert
 			if (!window.confirm(`Are you sure you want to delete ${this.$route.params.repo}:${this.$route.params.tag}?`)) {
 				return;
 			}