From f495a95be5c5ba7783011f8979a9f1fe7e2c0c52 Mon Sep 17 00:00:00 2001
From: kPherox <admin@mail.kr-kp.com>
Date: Sun, 28 Apr 2019 02:51:41 +0900
Subject: [PATCH] Add border to toot block

---
 src/components/Timeline/Toot.vue | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

diff --git a/src/components/Timeline/Toot.vue b/src/components/Timeline/Toot.vue
index 4b95beb4..11a917c1 100644
--- a/src/components/Timeline/Toot.vue
+++ b/src/components/Timeline/Toot.vue
@@ -80,16 +80,30 @@ export default class Toot extends Vue {
 
 <style scoped lang="postcss">
 .toot {
+  padding: 0.5em;
   text-align: left;
   display: grid;
-  grid-template-columns: 2.7em 2fr 1fr;
+  column-gap: 0.5em;
+  row-gap: 0.3em;
+  grid-template-columns: 2.7em 1fr 98px;
   grid-template-areas:
     "avatar user    date"
     "avatar content content"
     "avatar media   media"
     "avatar card    card"
     "vis    action  subaction";
-  .avatar {
+  border-top: solid 1px;
+  border-bottom: solid 1px;
+
+  & + .toot,
+  &:first-child {
+    border-top: none;
+  }
+  &:last-child {
+    border-bottom: none;
+  }
+
+  .toot-avatar {
     grid-area: avatar;
     height: 2.7em;
     img {