pleroma-fe/src/components/user_profile/user_profile.vue

<template>
  <div class="user-profile panel panel-default base00-background">
    <user-card-content :user="user"></user-card-content>
  </div>
</template>

<script src="./user_profile.js"></script>

<style lang="scss">
 .user-profile {
   flex: 2;
   flex-basis: 500px;
 }

 .user-info {
     .user-interactions {
         display: flex;
         flex-flow: row wrap;

         div {
             flex: 1;
         }
         margin-top: 0.5em;
         margin-bottom: -1.2em;

         .following {
            font-size: 14px;
            flex: 0 0 100%;
            margin-bottom: 0.5em;
         }
     }

     .mute {
     	margin-right: 4em;
     }

     .follow {
        margin-left: 4em;
     }
     .user-screen-name {
     	margin-top: 0.4em;
     }

     button {
         width: 80%;
         height: 100%;
         border: 1px solid;
     }
 }
</style>