Add border to toot block

This commit is contained in:
kPherox 2019-04-28 02:51:41 +09:00
parent a573d25580
commit f495a95be5
No known key found for this signature in database
GPG Key ID: C04751C2BFA2F62D

View File

@ -80,16 +80,30 @@ export default class Toot extends Vue {
<style scoped lang="postcss"> <style scoped lang="postcss">
.toot { .toot {
padding: 0.5em;
text-align: left; text-align: left;
display: grid; 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: grid-template-areas:
"avatar user date" "avatar user date"
"avatar content content" "avatar content content"
"avatar media media" "avatar media media"
"avatar card card" "avatar card card"
"vis action subaction"; "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; grid-area: avatar;
height: 2.7em; height: 2.7em;
img { img {