refactor: move individual css into global css for sharing use

frontend/src/views/Collection.vue

@@ -194,7 +194,7 @@ const deleteSharingItem = async (username: string) => {
 <template>
   <div class="container" style="display: flex; flex-flow: column; margin-top: 1.25rem;">
     <h1 class="title">Owned</h1>
-    <div class="control-list">
+    <div class="button-list">
       <div class="field has-addons">
         <div class="control">
           <input v-model="pendingOwnedItemName" class="input" type="text">
@@ -225,7 +225,7 @@ const deleteSharingItem = async (username: string) => {
       <span>{{ isSharingItem ? ownedItems.get(sharingItemUuid!)![1] : "" }}</span>
     </label>
 
-    <div class="control-list">
+    <div class="button-list">
       <div class="field has-addons">
         <div class="control">
           <input v-model="pendingSharingItemUsername" class="input" type="text">
@@ -251,16 +251,4 @@ const deleteSharingItem = async (username: string) => {
   <MessageBox ref="messagebox" />
 </template>
 
-<style scoped>
-div.control-list {
-  display: flex; 
-  flex-flow: row;
-  flex-wrap: wrap;
-}
-
-div.control-list > * {
-  margin-right: 0.75rem;
-  margin-bottom: 0.75rem;
-  margin-left: 0 !important;
-}
-</style>
+<style scoped></style>