pfp sizing fix

iggy-social · Mar 6, 2024 · 409e408 · 409e408
1 parent 1e2eaab
commit 409e408
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 4 deletions.
diff --git a/components/chat/ChatPost.vue b/components/chat/ChatPost.vue
@@ -1,7 +1,7 @@
 <template>
 <div class="card mb-3 border" v-if="post">
   <div class="card-body row">
-    <div class="col-2 col-md-1">
+    <div class="col-2 col-md-1 pfp-sizing">
       <NuxtLink :to="'/profile/?id='+String(showDomainOrFullAddress)">
         <ProfileImage 
           class="img-fluid rounded-circle"
@@ -12,7 +12,7 @@
       </NuxtLink>
     </div>
 
-    <div class="col-10 col-md-11">
+    <div class="col-10 col-md-11 post-sizing">
 
       <!-- post author and timestamp -->
       <p class="card-subtitle mb-2 text-muted">

diff --git a/components/chat/ChatQuote.vue b/components/chat/ChatQuote.vue
@@ -1,7 +1,7 @@
 <template>
 <div class="card mb-3 border" v-if="post">
   <div class="card-body row">
-    <div class="col-2 col-md-1">
+    <div class="col-2 col-md-1 pfp-sizing">
       <NuxtLink :to="'/profile/?id='+String(showDomainOrFullAddress)">
         <ProfileImage 
           class="img-fluid rounded-circle"
@@ -12,7 +12,7 @@
       </NuxtLink>
     </div>
 
-    <div class="col-10 col-md-11">
+    <div class="col-10 col-md-11 post-sizing">
 
       <!-- post author and timestamp -->
       <p class="card-subtitle mb-1 text-muted">

diff --git a/public/css/custom.css b/public/css/custom.css
@@ -387,6 +387,14 @@ a:hover {
   background-color: var(--bs-nav-pills-link-active-bg);
 }
 
+.pfp-sizing {
+  padding: calc(var(--bs-gutter-x)* .1);
+}
+
+.post-sizing {
+  padding-right: calc(var(--bs-gutter-x)* .4);
+}
+
 .quote-reply-to {
   font-size: 0.725rem;
   font-weight: 400;