mirrors/mue
1
0
Fork 0
mirror of https://github.com/mue/mue.git synced 2026-07-20 15:34:10 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat: collection news alt

Browse Source
This commit is contained in:
alexsparkes
2022-08-08 15:21:35 +01:00
parent a819ee9d36
commit 18a8c714ad
2 changed files with 20 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/modals/main/marketplace/Items.jsx
View File

@@ -1,6 +1,6 @@
import variables from 'modules/variables';
import React, { useState } from 'react';
import { MdAutoFixHigh, MdOutlineArrowForward, MdExpandMore } from 'react-icons/md';
import { MdAutoFixHigh, MdOutlineArrowForward, MdExpandMore, MdOutlineOpenInNew } from 'react-icons/md';
export default function Items({
type,
@@ -30,17 +30,21 @@ export default function Items({
<>
<div
className="collection"
style={{
backgroundImage: `linear-gradient(to left, #000, transparent, #000), url('${collection.img}')`,
}}
style={collection.news ? {backgroundColor: collection.background_colour} : {backgroundImage: `linear-gradient(to left, #000, transparent, #000), url('${collection.img}')`}}
>
<div className="content">
<span className="title">{collection.display_name}</span>
<span className="subtitle">{collection.description}</span>
</div>
<button className="nice-button" onClick={() => collectionFunction(collection.name)}>
<MdOutlineArrowForward /> {getMessage('modals.main.marketplace.explore_collection')}
</button>
{collection.news === true ? (
<a className="nice-button" href={collection.news_link}>
Learn More <MdOutlineOpenInNew />
</a>
) : (
<button className="nice-button" onClick={() => collectionFunction(collection.name)}>
<MdOutlineArrowForward /> {getMessage('modals.main.marketplace.explore_collection')}
</button>
)}
</div>
</>
) : null}

11
src/components/modals/main/scss/marketplace/_main.scss
View File

@@ -381,7 +381,6 @@ p.author {
background-size: cover;
background-position: center;
background-repeat: no-repeat;
background-image: linear-gradient(to left, transparent, #000);
align-items: center;
@include themed() {
@@ -408,7 +407,7 @@ p.author {
justify-content: center;
}
button.nice-button {
button.nice-button, a.nice-button{
display: flex;
align-items: center;
gap: 15px;
@@ -427,6 +426,14 @@ p.author {
}
}
a.nice-button {
height: 40px;
text-decoration: none;
@include themed() {
border-radius: t($borderRadius);
}
}
.smallBanner {
button {
padding: 0 15px 0 15px;