Browse Source

Update reaction buttons

Daniel Supernault 6 years ago
parent
commit
c8b0b3fe79

+ 4 - 4
resources/assets/js/components/PostComponent.vue

@@ -125,10 +125,10 @@
             </div>
             <div class="card-body flex-grow-0 py-1">
               <div class="reactions my-1">
-                <button v-bind:class="[reactions.liked ? 'fas fa-heart btn btn-link text-danger px-0 mr-2 m-0' : 'far fa-heart px-0 mr-2 m-0 like-btn btn btn-link text-dark']" title="Like" v-on:click="likeStatus"></button>
-                <button class="far fa-comment px-0 mr-2 m-0 btn btn-link text-dark" title="Comment" v-on:click="commentFocus"></button>
-                <button v-bind:class="[reactions.shared ? 'far fa-share-square px-0 mr-2 m-0 btn btn-link text-primary' : 'far fa-share-square px-0 mr-2 m-0 share-btn btn btn-link text-dark']" title="Share" v-on:click="shareStatus"></button>
-                <button v-bind:class="[reactions.bookmarked ? 'fas fa-bookmark btn btn-link text-warning px-0 m-0 float-right' : 'far fa-bookmark btn btn-link text-dark px-0 m-0 float-right']" title="Bookmark" v-on:click="bookmarkStatus"></button>
+                <button v-bind:class="[reactions.liked ? 'fas fa-heart btn btn-link text-decoration-none text-danger px-0 mr-2 m-0' : 'far fa-heart px-0 mr-2 m-0 like-btn btn btn-link text-decoration-none text-dark']" title="Like" v-on:click="likeStatus"></button>
+                <button class="far fa-comment px-0 mr-2 m-0 btn btn-link text-decoration-none text-dark" title="Comment" v-on:click="commentFocus"></button>
+                <button v-bind:class="[reactions.shared ? 'far fa-share-square px-0 mr-2 m-0 btn btn-link text-decoration-none text-primary' : 'far fa-share-square px-0 mr-2 m-0 share-btn btn btn-link text-decoration-none text-dark']" title="Share" v-on:click="shareStatus"></button>
+                <button v-bind:class="[reactions.bookmarked ? 'fas fa-bookmark btn btn-link text-warning px-0 m-0 text-decoration-none float-right' : 'far fa-bookmark btn btn-link text-dark px-0 m-0 text-decoration-none float-right']" title="Bookmark" v-on:click="bookmarkStatus"></button>
               </div>
               <div class="reaction-counts font-weight-bold mb-0">
                 <span style="cursor:pointer;" v-on:click="likesModal">

+ 3 - 3
resources/assets/js/components/Timeline.vue

@@ -84,9 +84,9 @@
 
 				<div class="card-body">
 					<div class="reactions my-1">
-						<button v-bind:class="[status.favourited ? 'fas fa-heart btn btn-link text-danger px-0 mr-2 m-0 cursor-pointer' : 'far fa-heart px-0 mr-2 m-0 like-btn btn btn-link text-dark cursor-pointer']" title="Like" v-on:click="likeStatus(status, $event)"></button>
-						<button class="far fa-comment px-0 mr-2 m-0 btn btn-link text-dark cursor-pointer" title="Comment" v-on:click="commentFocus(status, $event)"></button>
-						<button v-bind:class="[status.reblogged ? 'far fa-share-square px-0 mr-2 m-0 btn btn-link text-primary cursor-pointer' : 'far fa-share-square px-0 mr-2 m-0 share-btn btn btn-link text-dark cursor-pointer']" title="Share" v-on:click="shareStatus(status, $event)"></button>
+						<button v-bind:class="[status.favourited ? 'btn-lg h3 fas fa-heart btn btn-link text-decoration-none text-danger px-0 mr-2 m-0' : 'btn-lg h3 far fa-heart px-0 mr-2 m-0 text-decoration-none like-btn btn btn-link text-dark']" title="Like" v-on:click="likeStatus(status, $event)"></button>
+						<button class="far fa-comment px-0 mr-2 m-0 btn btn-link text-dark text-decoration-none" title="Comment" v-on:click="commentFocus(status, $event)"></button>
+						<button v-bind:class="[status.reblogged ? 'far fa-share-square px-0 mr-2 m-0 btn btn-link text-decoration-none text-primary' : 'far fa-share-square px-0 mr-2 m-0 share-btn btn btn-link text-decoration-none text-dark']" title="Share" v-on:click="shareStatus(status, $event)"></button>
 					</div>
 
 					<div class="likes font-weight-bold">

+ 0 - 4
resources/assets/sass/custom.scss

@@ -321,10 +321,6 @@ body, button, input, textarea {
       line-height: 1;
   }
   
-  .reactions button:hover {
-      text-decoration: none
-  }
-  
 }
 
 .touch .card {