Skip to content

Commit

Permalink
Merge branch 'main' into chore/bulma/container.is-fluid
Browse files Browse the repository at this point in the history
  • Loading branch information
roiLeo authored Feb 24, 2025
2 parents b43a339 + a87a950 commit c3a24cd
Show file tree
Hide file tree
Showing 18 changed files with 149 additions and 307 deletions.
14 changes: 0 additions & 14 deletions assets/styles/abstracts/_theme.scss
Original file line number Diff line number Diff line change
Expand Up @@ -100,17 +100,3 @@ $themes: (
'separator-line-color': #6b6b6b,
),
);

@mixin ktheme() {
@each $theme, $map in $themes {
$theme-map: $map !global;
.#{$theme} & {
@content;
}
}
$theme-map: null !global;
}

@function theme($key) {
@return map-get($theme-map, $key);
}
73 changes: 28 additions & 45 deletions assets/styles/components/_connect-wallet.scss
Original file line number Diff line number Diff line change
@@ -1,5 +1,3 @@
@import '@/assets/styles/abstracts/variables';

@keyframes rotate {
0% {
transform: rotate(0deg);
Expand All @@ -24,39 +22,28 @@
position: fixed;
top: 0;
right: 0;
height: calc(100% - $navbar-desktop-min-height) ;
margin-top: $navbar-desktop-min-height;
@apply h-[calc(100%-theme(spacing.navbar-desktop))] mt-[theme(spacing.navbar-desktop)];
max-width: 360px;
width: 100%;

@include mobile {
inset: 0;
border-left: none !important;
max-width: 100vw;
height: calc(100% - $navbar-mobile-min-height) ;
margin-top: $navbar-mobile-min-height;
}
@include ktheme() {
background: theme('background-color');
border-left: 1px solid theme('border-color');
}
@apply bulma-mobile:inset-0 bulma-mobile:border-l-0 bulma-mobile:max-w-full
bulma-mobile:h-[calc(100%-theme(spacing.navbar-mobile))] bulma-mobile:mt-[theme(spacing.navbar-mobile)];

background: var(--background-color);
border-left: 1px solid var(--border-color);

.modal-card-body {
padding: 0;
display: block;
@include ktheme() {
background-color: theme('background-color');
}
background-color: var(--background-color);

hr {
@apply bg-k-shade2 #{!important};
}
}

footer {
@include ktheme() {
border-top: 1px solid theme('border-color');
}
border-top: 1px solid var(--border-color);
}

.confirm-button {
Expand All @@ -77,35 +64,32 @@
.icon {
margin-right: 0 !important;
}
@include ktheme() {
color: theme('text-color');
&:hover {
background-color: theme('k-accentlight2') !important;
}

color: rgb(var(--text-color));
&:hover {
background-color: var(--k-accent-light-2) !important;
}
}

.auth-tip {
margin: 0 2rem;
@include ktheme() {
color: theme('text-color');
border-left: 1px solid theme('k-shade');
}
color: rgb(var(--text-color));
border-left: 1px solid rgb(var(--k-shade));
i {
animation: rotate 1s linear infinite;
}
}

.account-list {
.account-item {
padding: 10px 0;
margin: 0 2rem;
a {
@include ktheme() {
color: theme('text-color');
border-left: 1px solid theme('k-shade');
color: rgb(var(--text-color));
border-left: 1px solid rgb(var(--k-shade));

&:hover {
color: theme('text-color');
}
&:hover {
color: rgb(var(--text-color));
}

.account-name {
Expand All @@ -116,9 +100,7 @@
}
}
&:hover {
@include ktheme() {
background-color: theme('k-accentlight2') !important;
}
background-color: var(--k-accent-light-2) !important;
}
}
}
Expand All @@ -128,6 +110,11 @@
height: 100%;
overflow-y: auto;
}

.identity-address a {
font-weight: normal !important;
color: var(--k-blue) !important;
}
}

.wallet-asset {
Expand All @@ -139,15 +126,11 @@

.identity-address a {
font-weight: normal !important;
@include ktheme() {
color: theme('k-blue') !important;
}
color: var(--k-blue) !important;
}
}
}

.modal-card-title {
@include ktheme() {
color: theme('text-color');
}
color: rgb(var(--text-color));
}
40 changes: 14 additions & 26 deletions assets/styles/components/_gallery-item.scss
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,8 @@
align-items: center;
}

@include ktheme() {
box-shadow: theme('primary-shadow');
border: 1px solid theme('border-color');
}
box-shadow: var(--primary-shadow);
border: 1px solid var(--border-color);
}
}

Expand All @@ -27,10 +25,8 @@

.gallery-item {
.media-object {
@include ktheme() {
box-shadow: theme('primary-shadow');
border: 1px solid theme('border-color');
}
box-shadow: var(--primary-shadow);
border: 1px solid var(--border-color);
}
}

Expand All @@ -39,18 +35,14 @@
background-color: transparent;
margin: 1rem 0;
white-space: pre-wrap;
@include ktheme() {
border: 1px solid theme('k-shade');
color: theme('k-shade');
}
border: 1px solid rgb(var(--k-shade));
color: rgb(var(--k-shade));
}

a {
@include ktheme() {
color: theme('k-blue') !important;
&:hover {
color: theme('k-blue-hover') !important;
}
color: var(--k-blue) !important;
&:hover {
color: var(--k-blue-hover) !important;
}
}

Expand All @@ -69,20 +61,16 @@
}
a {
@apply cursor-pointer;
@include ktheme() {
color: theme('k-blue') !important;
&:hover {
color: theme('k-blue-hover') !important;
}
color: var(--k-blue) !important;
&:hover {
color: var(--k-blue-hover) !important;
}
}
}

.gallery-item-disabled {
@include ktheme() {
box-shadow: 4px 4px theme('k-grey');
width: 10rem;
}
box-shadow: 4px 4px var(--k-grey);
width: 10rem;

.o-tip,
.is-neo {
Expand Down
54 changes: 23 additions & 31 deletions assets/styles/components/_nft-card.scss
Original file line number Diff line number Diff line change
@@ -1,30 +1,25 @@
@function hex-to-rgba($hex, $alpha: 1) {
@return rgba(red($hex), green($hex), blue($hex), $alpha);
}

.nft-card {
@apply relative h-full bg-background-color border border-card-border-color;

@include ktheme() {
.border-stacked {
border-color: theme('card-border-color-light') !important;
}
.border-stacked {
border-color: var(--card-border-color-light) !important;
}

&:not(.loading):hover {
border: 1px solid theme('border-color');
&:not(.loading):hover {
border: 1px solid var(--border-color);

.nft-media::after {
content: '';
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: hex-to-rgba(theme('background-color'), 0.2);
}
.nft-media::after {
content: '';
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: rgba(var(--background-color), 0.2);
}
}

.show-on-hover {
display: none !important;
}
Expand All @@ -50,29 +45,26 @@
}

.stacked-shadow {
@include ktheme() {
box-shadow: 5px 5px theme('card-border-color-light');
bottom: 10px;
right: 10px;
}
box-shadow: 5px 5px var(--card-border-color-light);
bottom: 10px;
right: 10px;
}

.theme-background {
@include ktheme() {
background: theme('background-color');
}
background: var(--background-color);
}
}

.card-icon {
@apply absolute z-[1] right-4 top-4;
}

.nft-media {
box-shadow: none;
}

.nft-media-info {
@include ktheme() {
border-top: 1px solid theme('card-border-color');
}
border-top: 1px solid var(--card-border-color);
padding: 13px;
min-height: 102px;

Expand Down
Loading

0 comments on commit c3a24cd

Please sign in to comment.