improve background color

umee-network · Jun 15, 2023 · e9b4afd · e9b4afd
1 parent 4fdafa3
commit e9b4afd
Show file tree

Hide file tree

Showing 4 changed files with 23 additions and 22 deletions.
diff --git a/src/modules/[chain]/statesync/index.vue b/src/modules/[chain]/statesync/index.vue
@@ -70,16 +70,16 @@ onMounted(() => {
         We can configure Tendermint to use state sync in
         $DAEMON_HOME/config/config.toml.
         <br /><br />
-        <div class="mockup-code my-2">
-            <pre data-prefix=">"><code class="text-gray-400">[state-sync]</code></pre>
-            <pre data-prefix=">"><code class="text-gray-400">enable = true</code></pre>
-            <pre data-prefix=">"><code class="text-gray-400"></code></pre>
-            <pre data-prefix=">"><code class="text-gray-400">rpc_servers = "{{ rpcs }}"</code></pre>
-            <pre data-prefix=">"><code class="text-gray-400">trust_height = {{ height }} </code></pre>
-            <pre data-prefix=">"><code class="text-gray-400">trust_hash = "{{hash}}"</code></pre>
-            <pre data-prefix=">"><code class="text-gray-400"></code></pre>
+        <div class="mockup-code bg-base-200 my-2">
+            <pre data-prefix=">"><code class="text-gray-800 dark:invert">[state-sync]</code></pre>
+            <pre data-prefix=">"><code class="text-gray-800 dark:invert">enable = true</code></pre>
+            <pre data-prefix=">"><code class="text-gray-800"></code></pre>
+            <pre data-prefix=">"><code class="text-gray-800 dark:invert">rpc_servers = "{{ rpcs }}"</code></pre>
+            <pre data-prefix=">"><code class="text-gray-800 dark:invert">trust_height = {{ height }} </code></pre>
+            <pre data-prefix=">"><code class="text-gray-800 dark:invert">trust_hash = "{{hash}}"</code></pre>
+            <pre data-prefix=">"><code class="text-gray-800 dark:invert"></code></pre>
             <pre data-prefix=">"><code class="text-green-400"># 2/3 of unbonding time</code></pre>
-            <pre data-prefix=">"><code class="text-gray-400">trust_period = "168h"</code></pre>
+            <pre data-prefix=">"><code class="text-gray-800 dark:invert">trust_period = "168h"</code></pre>
         </div>
         <br />
         3. Start the daemon: <code class="bg-base-200 text-gray-600 px-2 py-px mx-1 rounded shadow">{{ appName }} start</code>
@@ -97,14 +97,14 @@ onMounted(() => {
         To make state sync works, we can enable snapshot in
         $DAEMON_HOME/config/app.toml
         <br /><br />
-        <div class="mockup-code my-2">
-            <pre data-prefix=">"><code class="text-gray-400">[state-sync]</code></pre>
+        <div class="mockup-code bg-base-200 my-2">
+            <pre data-prefix=">"><code class="text-gray-800 dark:invert">[state-sync]</code></pre>
             <pre data-prefix=">"><code class="text-green-400"># snapshot-interval specifies the block interval at which local state sync snapshots are</code></pre>
             <pre data-prefix=">"><code class="text-green-400"># taken (0 to disable). Must be a multiple of pruning-keep-every.</code></pre>
-            <pre data-prefix=">"><code class="text-gray-400">snapshot-interval = 1000</code></pre>
-            <pre data-prefix=">"><code class="text-gray-400"></code></pre>
+            <pre data-prefix=">"><code class="text-gray-800 dark:invert">snapshot-interval = 1000</code></pre>
+            <pre data-prefix=">"><code class="text-gray-800 dark:invert"></code></pre>
             <pre data-prefix=">"><code class="text-green-400"># snapshot-keep-recent specifies the number of recent snapshots to keep and serve (0 to keep all). Each snapshot is about 500MiB</code></pre>
-            <pre data-prefix=">"><code class="text-gray-400">snapshot-keep-recent = 2</code></pre>
+            <pre data-prefix=">"><code class="text-gray-800 dark:invert">snapshot-keep-recent = 2</code></pre>
         </div>
       </div>
     </div>

diff --git a/src/modules/[chain]/widget/index.vue b/src/modules/[chain]/widget/index.vue
@@ -32,22 +32,22 @@ const hdPath = computed(() => {
         </div>
       </div>
       <span class="text-base">Import global script </span>
-        <div class="mockup-code my-2">
-            <pre data-prefix="1"><code class="text-gray-400">&lt;script type="module" src="https://unpkg.com/ping-widget@latest/dist/ping-widget.js"&gt;</code></pre>
+        <div class="mockup-code bg-base-200 my-2">
+            <pre data-prefix="1"><code class="text-gray-800 dark:invert">&lt;script type="module" src="https://unpkg.com/ping-widget@latest/dist/ping-widget.js"&gt;</code></pre>
         </div>
     </div>
     <div class="bg-base-100 my-5 px-4 pt-3 pb-4 rounded shadow">
       <h2 class="card-title">Widgets</h2>
       <div class="mt-4">
         <span class="text-base"> 1. Connect Wallet </span>
-        <div class="mockup-code my-2">
-            <pre data-prefix=">"><code  class="text-gray-400">&lt;ping-connect-wallet chain-id="{{ chainId }}" hd-path="{{ hdPath }}"/&gt;</code></pre>
+        <div class="mockup-code bg-base-200 my-2">
+            <pre data-prefix=">"><code  class="text-gray-800 dark:invert">&lt;ping-connect-wallet chain-id="{{ chainId }}" hd-path="{{ hdPath }}"/&gt;</code></pre>
         </div>
 
         <span class="text-base"> 2. Osmosis Convert </span>
-        <div class="mockup-code my-2">
-            <pre data-prefix=">"><code class="text-gray-400">&lt;ping-token-convert chain-name="{{ chainName }}" endpoint="{{endpoint}}" hd-path="{{hdPath}}"/&gt;</code></pre>
-            <pre data-prefix=">"><code class="text-gray-400">&lt;label for="PingTokenConvert" class="btn btn-sm"&gt;Buy {{chainName.toUpperCase()}}&lt;/label&gt;</code></pre>
+        <div class="mockup-code bg-base-200 my-2">
+            <pre data-prefix=">"><code class=" text-gray-800 dark:invert">&lt;ping-token-convert chain-name="{{ chainName }}" endpoint="{{endpoint}}" hd-path="{{hdPath}}"/&gt;</code></pre>
+            <pre data-prefix=">"><code class="text-gray-800 dark:invert">&lt;label for="PingTokenConvert" class="btn btn-sm"&gt;Buy {{chainName.toUpperCase()}}&lt;/label&gt;</code></pre>
         </div>
       </div>
     </div>

diff --git a/src/modules/wallet/accounts.vue b/src/modules/wallet/accounts.vue
@@ -287,7 +287,7 @@ async function loadBalances(endpoint: string, address: string) {
             </svg>
           </div>
           <div>
-            <div class=" font-bold">{{ key }}</div>
+            <div class=" font-bold overflow-hidden">{{ key }}</div>
             <div class="dropdown">
               <label tabindex="0" class="">{{ subaccounts.length }} addresses</label>
               <ul tabindex="0" class="dropdown-content menu p-2 shadow bg-base-200 rounded-box z-50">

diff --git a/tailwind.config.js b/tailwind.config.js
@@ -28,6 +28,7 @@ module.exports = {
           ...require('daisyui/src/theming/themes')['[data-theme=dark]'],
           primary: '#666cff',
           'base-100': '#2a334c',
+          'base-200': '#252d37'
         },
       },
     ],