mirror of
https://github.com/LemmyNet/joinlemmy-site.git
synced 2024-11-21 20:01:16 +00:00
parent
401d4b3ce8
commit
83ff230d1f
2 changed files with 29 additions and 61 deletions
|
@ -14,12 +14,6 @@
|
|||
webkit-box-shadow: unset;
|
||||
box-shadow: unset;
|
||||
border: 1px solid var(--color-darkGrey) !important;
|
||||
padding: 10px;
|
||||
margin: 10px 0 10px 0;
|
||||
height: 100px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
.stylized {
|
||||
font-family: "CaviarDreams", Fallback, sans-serif;
|
||||
|
@ -38,29 +32,11 @@
|
|||
p {
|
||||
font: 1.2em/1.62 sans-serif;
|
||||
}
|
||||
.join-icon {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
.join-banner {
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
object-fit: scale-down;
|
||||
}
|
||||
.join-text {
|
||||
display: inline-block;
|
||||
margin: 0 10px 0 10px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex: 1;
|
||||
}
|
||||
.join-header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.join-title {
|
||||
margin: 0px;
|
||||
flex: 1;
|
||||
}
|
||||
.join-desc {
|
||||
font-size: 0.9em;
|
||||
}
|
||||
.app-banner {
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
|
@ -89,7 +65,3 @@ img {
|
|||
margin-top: 7px;
|
||||
background-color: #333;
|
||||
}
|
||||
|
||||
.button-yellow {
|
||||
background-color: #b5932e !important;
|
||||
}
|
|
@ -62,46 +62,42 @@ export class Instances extends Component<any, any> {
|
|||
renderList(header: string, instances: any[]) {
|
||||
return (
|
||||
<div>
|
||||
<Helmet title={title}>
|
||||
<meta property={"title"} content={title} />
|
||||
</Helmet>
|
||||
<div class="container">
|
||||
<h1 class="is-marginless">{header}</h1>
|
||||
|
||||
{instances.map(instance => {
|
||||
const site = instance.site_info.site_view.site;
|
||||
const counts = instance.site_info.site_view.counts;
|
||||
return (
|
||||
<div class="card">
|
||||
<img
|
||||
class="join-icon"
|
||||
src={site.icon || "/static/assets/images/lemmy.svg"}
|
||||
/>
|
||||
<div class="join-text">
|
||||
<div class="join-header">
|
||||
<h4 class="join-title">{site.name}</h4>
|
||||
<h2>{header}</h2>
|
||||
<div class="row">
|
||||
{instances.map(i => (
|
||||
<div class="card col-6">
|
||||
<header>
|
||||
<div class="row">
|
||||
<h4 class="col">{i.domain}</h4>
|
||||
<h4 class="col text-right">
|
||||
<i>
|
||||
{numToSI(counts.users_active_month)} {i18n.t("users")} /{" "}
|
||||
{numToSI(i.users_active_month)} {i18n.t("users")} /{" "}
|
||||
{i18n.t("month")}
|
||||
</i>
|
||||
</div>
|
||||
<p class="join-desc">{site.description}</p>
|
||||
</h4>
|
||||
</div>
|
||||
{site.require_application ? (
|
||||
<a
|
||||
class="button primary button-yellow"
|
||||
href={`https://${instance.domain}`}
|
||||
>
|
||||
</header>
|
||||
<div class="is-center">
|
||||
<img
|
||||
class="join-banner"
|
||||
src={i.icon || "/static/assets/images/lemmy.svg"}
|
||||
/>
|
||||
</div>
|
||||
<br />
|
||||
<p class="join-desc">{i.description}</p>
|
||||
<footer>
|
||||
{i.require_application ? (
|
||||
<a class="button primary" href={`https://${i.domain}`}>
|
||||
{i18n.t("apply_to_join")}
|
||||
</a>
|
||||
) : (
|
||||
<a class="button primary" href={`https://${instance.domain}`}>
|
||||
<a class="button primary" href={`https://${i.domain}`}>
|
||||
{i18n.t("join")}
|
||||
</a>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</footer>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
|
Loading…
Reference in a new issue