mirror of
https://github.com/Instadapp/assembly.git
synced 2024-07-29 22:37:06 +00:00
update icons
This commit is contained in:
Georges KABBOUCHI
parent
a0b295b796
commit
0bfcc75070
|
|
@ -2,17 +2,25 @@
|
|||
<div
|
||||
class="h-[68px] px-8 py-5 border border-b-[#E7E8F1] flex items-center justify-between"
|
||||
>
|
||||
<nuxt-link to="/" class="flex items-center">
|
||||
<nuxt-link to="/" class="flex items-center text-[#1874FF]">
|
||||
<svg
|
||||
width="28"
|
||||
height="28"
|
||||
viewBox="0 0 28 28"
|
||||
height="26"
|
||||
viewBox="0 0 28 26"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M14 26.6121C14 27.4159 14.6503 28.0751 15.4459 27.9931C22.4985 27.266 28 21.2786 28 14C28 6.72143 22.4985 0.734111 15.4459 0.00697811C14.6503 -0.0754852 14 0.584222 14 1.388V5.26862C14 6.0724 14.6546 6.70882 15.4391 6.86744C18.7489 7.53831 21.2414 10.4764 21.2414 14C21.2414 17.5236 18.7489 20.4618 15.4391 21.1326C14.6546 21.2913 14 21.9282 14 22.7314V26.6121ZM9.65517 2.62883C9.65517 1.63927 8.69111 0.941724 7.80814 1.37975C3.18187 3.67563 0 8.46432 0 14C0 19.5358 3.18187 24.3244 7.80814 26.6203C8.69111 27.0583 9.65517 26.3608 9.65517 25.3712V2.62883Z"
|
||||
fill="#3F75FF"
|
||||
d="M15.0779 0.655535C14.6014 -0.218507 13.3989 -0.218513 12.9224 0.655524L7.43746 10.7156C7.20102 11.1492 7.49979 11.6888 7.97635 11.6888L20.0238 11.6888C20.5004 11.6888 20.7991 11.1492 20.5627 10.7156L15.0779 0.655535Z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
<path
|
||||
d="M22.4164 14.1155C22.1793 13.6808 21.5821 13.678 21.3414 14.1105L15.2685 25.0217C15.0271 25.4554 15.3255 26 15.8046 26H26.7568C27.71 26 28.3075 24.9208 27.8346 24.0535L22.4164 14.1155Z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
<path
|
||||
d="M12.1952 26C12.6742 26 12.9727 25.4554 12.7313 25.0217L6.65864 14.1107C6.41791 13.6782 5.82069 13.6809 5.58364 14.1157L0.16539 24.0535C-0.307493 24.9208 0.290038 26 1.24316 26H12.1952Z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
</svg>
|
||||
|
||||
|
|
|
|||
|
|
@ -7,17 +7,16 @@
|
|||
v-for="app in apps"
|
||||
:key="app.id"
|
||||
:to="app.url"
|
||||
class="relative flex flex-col items-center px-4 py-12 text-center rounded-[6px] cursor-pointer bg-white hover:bg-gray-50 shadow"
|
||||
class="relative flex flex-col items-center px-4 py-12 text-center rounded-[6px] cursor-pointer bg-white border border-transparent hover:border-[#1874FF] shadow"
|
||||
>
|
||||
<div
|
||||
style="background: radial-gradient(42.15% 42.15% at 48.94% 48.94%, #D6DAE0 75.67%, #F0F3F9 100%), #C4C4C4;"
|
||||
class="w-20 h-20 rounded-full flex items-center justify-center"
|
||||
class="w-20 h-20 rounded-full flex items-center justify-center border border-[#CCDCF3]"
|
||||
>
|
||||
<div
|
||||
style="background: linear-gradient(0deg, #FFFFFF, #FFFFFF), #C4C4C4"
|
||||
class="w-16 h-16 rounded-full flex items-center justify-center"
|
||||
class="w-16 h-16 rounded-full flex items-center justify-center bg-[#1874FF]"
|
||||
>
|
||||
<component :is="app.icon" class="w-8 h-8" />
|
||||
<component :is="app.icon" class="w-10 h-10 text-white" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -33,9 +32,9 @@
|
|||
<script lang="ts">
|
||||
import { computed, defineComponent } from "@nuxtjs/composition-api";
|
||||
import { useNetwork } from "~/composables/useNetwork";
|
||||
import AaveIcon from "~/assets/icons/colored/aave.svg?inline";
|
||||
import CompoundIcon from "~/assets/icons/colored/compound.svg?inline";
|
||||
import MakerIcon from "~/assets/icons/colored/maker.svg?inline";
|
||||
import AaveIcon from "~/assets/icons/aave.svg?inline";
|
||||
import CompoundIcon from "~/assets/icons/compound.svg?inline";
|
||||
import MakerIcon from "~/assets/icons/makerdao.svg?inline";
|
||||
|
||||
const appsPerNetwork = {
|
||||
mainnet: [
|
||||
|
|
|
|||
|
|
@ -10,8 +10,18 @@
|
|||
</nuxt-link>
|
||||
</div>
|
||||
|
||||
<div class="mt-10">
|
||||
<h1 class="text-primary-black text-2xl font-semibold">Aave v2</h1>
|
||||
<div class="mt-10 flex items-center">
|
||||
<div
|
||||
style="background: radial-gradient(42.15% 42.15% at 48.94% 48.94%, #D6DAE0 75.67%, #F0F3F9 100%), #C4C4C4;"
|
||||
class="w-16 h-16 rounded-full flex items-center justify-center border border-[#CCDCF3]"
|
||||
>
|
||||
<div
|
||||
class="w-12 h-12 rounded-full flex items-center justify-center bg-[#1874FF]"
|
||||
>
|
||||
<AaveIcon class="w-10 h-10 text-white" />
|
||||
</div>
|
||||
</div>
|
||||
<h1 class="ml-4 text-primary-black text-2xl font-semibold">Aave v2</h1>
|
||||
</div>
|
||||
|
||||
<div class="mt-10" v-if="position">
|
||||
|
|
@ -155,11 +165,13 @@ import { useSearchFilter } from "~/composables/useSearchFilter";
|
|||
import { useStatus } from "~/composables/useStatus";
|
||||
import { useBigNumber } from "~/composables/useBigNumber";
|
||||
import CardAave from "~/components/protocols/CardAave.vue";
|
||||
import AaveIcon from '~/assets/icons/aave.svg?inline'
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
BackIcon,
|
||||
CardAave
|
||||
CardAave,
|
||||
AaveIcon,
|
||||
},
|
||||
setup() {
|
||||
const {
|
||||
|
|
|
|||
|
|
@ -10,8 +10,18 @@
|
|||
</nuxt-link>
|
||||
</div>
|
||||
|
||||
<div class="mt-10">
|
||||
<h1 class="text-primary-black text-2xl font-semibold">Compound</h1>
|
||||
<div class="mt-10 flex items-center">
|
||||
<div
|
||||
style="background: radial-gradient(42.15% 42.15% at 48.94% 48.94%, #D6DAE0 75.67%, #F0F3F9 100%), #C4C4C4;"
|
||||
class="w-16 h-16 rounded-full flex items-center justify-center border border-[#CCDCF3]"
|
||||
>
|
||||
<div
|
||||
class="w-12 h-12 rounded-full flex items-center justify-center bg-[#1874FF]"
|
||||
>
|
||||
<CompoundIcon class="w-10 h-10 text-white" />
|
||||
</div>
|
||||
</div>
|
||||
<h1 class="ml-4 text-primary-black text-2xl font-semibold">Compound</h1>
|
||||
</div>
|
||||
|
||||
<div class="mt-10" v-if="position">
|
||||
|
|
@ -88,15 +98,15 @@
|
|||
</h3>
|
||||
<Badge class="w-18 xxl:w-23" :color="color">{{ text }}</Badge>
|
||||
</div>
|
||||
<div class="mt-4 flex justify-between items-center text-primary-gray font-medium">
|
||||
<div
|
||||
class="flex items-center whitespace-no-wrap"
|
||||
>
|
||||
<div
|
||||
class="mt-4 flex justify-between items-center text-primary-gray font-medium"
|
||||
>
|
||||
<div class="flex items-center whitespace-no-wrap">
|
||||
<div>D/C (%)</div>
|
||||
|
||||
<div class="ml-2"><Info text="Debt/Collateral ratio" /></div>
|
||||
</div>
|
||||
<span >Max - {{ formatPercent(position.maxLiquidation) }}</span>
|
||||
<span>Max - {{ formatPercent(position.maxLiquidation) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -153,11 +163,13 @@ import { useSearchFilter } from "~/composables/useSearchFilter";
|
|||
import { useStatus } from "~/composables/useStatus";
|
||||
import { useBigNumber } from "~/composables/useBigNumber";
|
||||
import CardCompound from "~/components/protocols/CardCompound.vue";
|
||||
import CompoundIcon from '~/assets/icons/compound.svg?inline'
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
BackIcon,
|
||||
CardCompound
|
||||
CardCompound,
|
||||
CompoundIcon,
|
||||
},
|
||||
setup() {
|
||||
const {
|
||||
|
|
|
|||
|
|
@ -11,9 +11,21 @@
|
|||
</div>
|
||||
|
||||
<div class="mt-10 flex items-center">
|
||||
<h1 class="text-primary-black text-2xl font-semibold">MakerDAO</h1>
|
||||
<div class="flex items-center">
|
||||
<div
|
||||
style="background: radial-gradient(42.15% 42.15% at 48.94% 48.94%, #D6DAE0 75.67%, #F0F3F9 100%), #C4C4C4;"
|
||||
class="w-16 h-16 rounded-full flex items-center justify-center border border-[#CCDCF3]"
|
||||
>
|
||||
<div
|
||||
class="w-12 h-12 rounded-full flex items-center justify-center bg-[#1874FF]"
|
||||
>
|
||||
<MakerDAOIcon Icon class="w-10 h-10 text-white" />
|
||||
</div>
|
||||
</div>
|
||||
<h1 class="ml-4 text-primary-black text-2xl font-semibold">MakerDAO</h1>
|
||||
</div>
|
||||
|
||||
<dropdown-makerdao class="ml-auto"/>
|
||||
<dropdown-makerdao class="ml-auto" />
|
||||
</div>
|
||||
|
||||
<div class="mt-10">
|
||||
|
|
@ -151,6 +163,7 @@ import { useMakerdaoPosition } from "~/composables/protocols/useMakerdaoPosition
|
|||
import { useStatus } from "~/composables/useStatus";
|
||||
import { useNotification } from "~/composables/useNotification";
|
||||
import DropdownMakerdao from "~/components/protocols/DropdownMakerdao.vue";
|
||||
import MakerDAOIcon from '~/assets/icons/makerdao.svg?inline'
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
|
|
@ -161,7 +174,8 @@ export default defineComponent({
|
|||
SVGEarnings,
|
||||
SVGArrowRight,
|
||||
SVGPercent,
|
||||
DropdownMakerdao
|
||||
DropdownMakerdao,
|
||||
MakerDAOIcon,
|
||||
},
|
||||
setup() {
|
||||
const router = useRouter();
|
||||
|
|
|
|||
|
|
@ -10,8 +10,18 @@
|
|||
</nuxt-link>
|
||||
</div>
|
||||
|
||||
<div class="mt-10">
|
||||
<h1 class="text-primary-black text-2xl font-semibold">Aave v2</h1>
|
||||
<div class="mt-10 flex items-center">
|
||||
<div
|
||||
style="background: radial-gradient(42.15% 42.15% at 48.94% 48.94%, #D6DAE0 75.67%, #F0F3F9 100%), #C4C4C4;"
|
||||
class="w-16 h-16 rounded-full flex items-center justify-center border border-[#CCDCF3]"
|
||||
>
|
||||
<div
|
||||
class="w-12 h-12 rounded-full flex items-center justify-center bg-[#1874FF]"
|
||||
>
|
||||
<AaveIcon class="w-10 h-10 text-white" />
|
||||
</div>
|
||||
</div>
|
||||
<h1 class="ml-4 text-primary-black text-2xl font-semibold">Aave v2</h1>
|
||||
</div>
|
||||
|
||||
<div class="mt-10" v-if="position">
|
||||
|
|
@ -88,15 +98,15 @@
|
|||
</h3>
|
||||
<Badge class="w-18 xxl:w-23" :color="color">{{ text }}</Badge>
|
||||
</div>
|
||||
<div class="mt-4 flex justify-between items-center text-primary-gray font-medium">
|
||||
<div
|
||||
class="flex items-center whitespace-no-wrap"
|
||||
>
|
||||
<div
|
||||
class="mt-4 flex justify-between items-center text-primary-gray font-medium"
|
||||
>
|
||||
<div class="flex items-center whitespace-no-wrap">
|
||||
<div>D/C (%)</div>
|
||||
|
||||
<div class="ml-2"><Info text="Debt/Collateral ratio" /></div>
|
||||
</div>
|
||||
<span >Max - {{ formatPercent(position.maxLiquidation) }}</span>
|
||||
<span>Max - {{ formatPercent(position.maxLiquidation) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -155,11 +165,13 @@ import { useSearchFilter } from "~/composables/useSearchFilter";
|
|||
import { useStatus } from "~/composables/useStatus";
|
||||
import { useBigNumber } from "~/composables/useBigNumber";
|
||||
import CardAave from "~/components/protocols/CardAave.vue";
|
||||
import AaveIcon from "~/assets/icons/aave.svg?inline";
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
BackIcon,
|
||||
CardAave
|
||||
CardAave,
|
||||
AaveIcon
|
||||
},
|
||||
setup() {
|
||||
const {
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user