Merge pull request #811 from telosnetwork/810-the-card-behind-the-con…

…tract-content-is-lost #810, #706, #802 | Several style fixes
telosnetwork · Aug 5, 2024 · d9f911a · d9f911a
2 parents 448ff73 + db2c75e
commit d9f911a
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 10 deletions.
diff --git a/src/components/ContractTab/ContractTab.vue b/src/components/ContractTab/ContractTab.vue
@@ -73,7 +73,7 @@ const selectTab = (tab: TabValue) => {
 </script>
 
 <template>
-<div class="c-contract">
+<q-card class="c-contract">
     <div v-if="abi" :key="contract.address + abi.length">
         <div class="flex justify-between items-center">
             <div class="c-contract__tab-container">
@@ -115,7 +115,7 @@ const selectTab = (tab: TabValue) => {
             :contract="contract"
         />
     </div>
-</div>
+</q-card>
 </template>
 
 <style lang='scss' scoped>

diff --git a/src/components/Transaction/InternalTxns.vue b/src/components/Transaction/InternalTxns.vue
@@ -68,7 +68,7 @@ export default {
         </div>
     </div>
     <div v-else class="row">
-        <div class="col-12 u-flex--center-y justify-between">
+        <div class="col-12 u-flex--center-y justify-between q-pa-md">
             <div>
                 <q-toggle
                     v-model="human_readable"
@@ -110,7 +110,7 @@ export default {
                 :data="itxs"
                 :deep="depth"
                 :showLine="false"
-                class="q-mb-md q-pl-md"
+                class="q-mb-md q-pa-md"
             />
         </div>
     </div>

diff --git a/src/components/Transaction/LogsViewer.vue b/src/components/Transaction/LogsViewer.vue
@@ -93,7 +93,7 @@ export default {
         </div>
     </div>
     <div v-else class="row">
-        <div class="col-12 u-flex--center-y justify-between">
+        <div class="col-12 u-flex--center-y justify-between q-pa-md">
             <div>
                 <q-toggle
                     v-model="human_readable"
@@ -135,7 +135,7 @@ export default {
                 :data="rawLogs"
                 :showLine="false"
                 :deep="depth"
-                class="q-pl-md"
+                class="q-pa-md"
             />
         </div>
     </div>

diff --git a/src/css/components/_notification.scss b/src/css/components/_notification.scss
@@ -84,13 +84,13 @@ $notify-info: #008888;
       margin-right: 0.5rem;
     }
     label {
-      color: black;
+      color: var(--text-color, black);
       @include text--paragraph;
     }
   }
   &__header {
     height: 8px;
-    background-color: var(--notify-color);
+    background-color: var(--notify-color,);
     // we need to animate the width from 100% 100% to 0% in 5s and stay there
     animation: var(--c-notify__header--animation);
   }
@@ -114,7 +114,7 @@ $notify-info: #008888;
     }
   }
   &__message {
-    color: black;
+    color: var(--text-color, black);
     padding: var(--c-notify__message--padding);
     text-align: var(--c-notify__message--align, center);
     span {
@@ -126,7 +126,7 @@ $notify-info: #008888;
     }
   }
   &__action-btn {
-    color: black;
+    color: var(--text-color, black);
     &--hide {
       color: transparent;
       background-color: transparent;