Skip to content
Commits on Source (2)
Hide whitespace changes
Inline Side-by-side
src/app/common/components/marketing/footer.component.html
View file @ f392c2b3
<div class="m-marketing__footer">
<div class="m-grid m-marketingFooter__columns">
<div
class="m-grid__column-3 m-grid__column-12--mobile m-marketingFooter__column"
class="m-grid__column-4 m-grid__column-12--mobile m-marketingFooter__column m-marketingFooter__brandColumn"
>
<div class="m-marketingFooter__mindsLogo">
<img [src]="cdnAssetsUrl + 'assets/logos/bulb.svg'" />
</div>
<h4 class="m-marketingFooter__sloganText" i18n>
Take back control of your social media
</h4>
<div class="m-marketingFooter__text">&copy; {{ year }} Minds, Inc.</div>
</div>
<div
class="m-grid__column-2 m-grid__column-12--mobile m-marketingFooter__column"
>
<h4 i18n>About</h4>
<ul>
<li hidden>
<a href="#" i18n>
Company
</a>
</li>
<li hidden>
<a href="#" i18n>
Mission
</a>
</li>
<li hidden>
<a href="#" i18n>
Features
</a>
</li>
<li>
<a routerLink="/mobile" i18n>
Mobile
......@@ -32,7 +34,7 @@
<li>
<a routerLink="/jobs" i18n>
Jobs
Careers
</a>
</li>
......@@ -67,7 +69,7 @@
</div>
<div
class="m-grid__column-3 m-grid__column-12--mobile m-marketingFooter__column"
class="m-grid__column-2 m-grid__column-12--mobile m-marketingFooter__column"
>
<h4 i18n>Business</h4>
......@@ -114,6 +116,12 @@
</a>
</li>
<li>
<a routerLink="/rewards" i18n>
Rewards
</a>
</li>
<li>
<a href="https://teespring.com/stores/minds" i18n>
Store
......@@ -123,7 +131,7 @@
</div>
<div
class="m-grid__column-3 m-grid__column-12--mobile m-marketingFooter__column"
class="m-grid__column-2 m-grid__column-12--mobile m-marketingFooter__column"
>
<h4>Developers</h4>
......@@ -161,7 +169,7 @@
</div>
<div
class="m-grid__column-3 m-grid__column-12--mobile m-marketingFooter__column"
class="m-grid__column-2 m-grid__column-12--mobile m-marketingFooter__column"
>
<h4>Support</h4>
......@@ -190,29 +198,30 @@
</a>
</li>
<li hidden>
<a routerLink="/p/contact" i18n>
<li>
<a href="#" i18n>
Contact
</a>
</li>
<li>
<a href="#" i18n>
Donate
</a>
</li>
</ul>
</div>
</div>
<div class="m-marketing__sep m-marketing__sep--big"></div>
<div
class="m-marketing__sep m-marketing__sep--dashed m-marketing__sep--big"
></div>
<div class="m-grid m-marketingFooter__columns">
<div
class="m-grid__column-2 m-grid__column-12--mobile m-marketingFooter__column m-marketingFooter__column--noMobileSpacing"
i18n
>
<div class="m-marketingFooter__text">&copy; {{ year }} Minds, Inc.</div>
</div>
<div
class="m-grid__column-10 m-grid__column-12--mobile m-marketingFooter__column"
class="m-grid__column-12 m-grid__column-12--mobile m-marketingFooter__column"
>
<ul class="m-marketingFooter__inlineList">
<ul class="m-marketingFooter__inlineList m-marketingFooter__legalLinks">
<li>
<a routerLink="/p/terms" i18n>
Terms of Service
......
src/app/common/components/marketing/footer.component.scss
View file @ f392c2b3
......@@ -2,10 +2,10 @@
m-marketing__footer {
display: block;
margin-top: 105px;
margin: 105px 0 95px;
@media screen and (max-width: $m-grid-min-vp) {
margin-top: 80px;
margin: 80px 0 0;
}
@include m-theme() {
......@@ -19,12 +19,14 @@ m-marketing__footer {
.m-marketing__footer {
padding: 60px 0 48px;
border-top: 1px dashed;
@media screen and (max-width: $m-grid-min-vp) {
padding: 32px 0;
}
@include m-theme() {
border-color: themed($m-grey-50);
color: themed($m-grey-800);
}
......@@ -47,6 +49,17 @@ m-marketing__footer {
}
}
&.m-marketingFooter__brandColumn {
width: 60%;
margin: 0 auto;
@media screen and (max-width: $m-grid-min-vp) {
width: 60%;
grid-row: 999;
margin: 32px 0 0;
}
}
h4 {
font-weight: 500;
font-size: 16px;
......@@ -60,11 +73,27 @@ m-marketing__footer {
@include m-theme() {
color: themed($m-grey-800);
}
&.m-marketingFooter__sloganText {
margin: 0 0 21px;
}
}
.m-marketingFooter__mindsLogo {
margin: 0 0 20px;
> img {
height: 45px;
}
}
.m-marketingFooter__text {
font-size: 14px;
line-height: 26px;
@include m-theme() {
color: themed($m-grey-300);
}
}
ul {
......@@ -108,6 +137,16 @@ m-marketing__footer {
margin-right: 0;
}
}
&.m-marketingFooter__legalLinks {
text-align: right;
padding-right: 92px;
@media screen and (max-width: $m-grid-min-vp) {
text-align: inherit;
padding-right: initial;
}
}
}
}
}
......
src/app/common/components/marketing/footer.component.ts
View file @ f392c2b3
......@@ -7,4 +7,6 @@ import { ChangeDetectionStrategy, Component } from '@angular/core';
})
export class MarketingFooterComponent {
readonly year: number = new Date().getFullYear();
readonly cdnAssetsUrl: string = window.Minds.cdn_assets_url;
}
src/app/common/components/marketing/marketing.component.scss
View file @ f392c2b3
......@@ -20,6 +20,10 @@ m-marketing {
width: 100%;
margin: 40px 0;
&.m-marketing__sep--dashed {
border-top-style: dashed;
}
&.m-marketing__sep--big {
margin: 60px 0;
}
......
src/app/modules/upgrades/upgrade-options.component.html
View file @ f392c2b3
......@@ -4,7 +4,7 @@
<div class="m-upgradesUpgradeOptionsHeader__toggleContainer">
<div class="m-upgradesUpgradeOptionsHeader__toggle">
<span>Yearly</span>
<span i18n>Yearly</span>
<span
><m-toggle
[(mModel)]="interval"
......@@ -12,10 +12,10 @@
rightValue="monthly"
></m-toggle
></span>
<span>Monthly</span>
<span i18n>Monthly</span>
</div>
<div class="m-upgradesUpgradeOptionsHeader__toggle">
<span>USD</span>
<span i18n>USD</span>
<span
><m-toggle
[(mModel)]="currency"
......@@ -23,7 +23,7 @@
rightValue="tokens"
></m-toggle
></span>
<span>Tokens</span>
<span i18n>Tokens</span>
</div>
</div>
</div>
......@@ -34,47 +34,52 @@
>
<h3 i18n>Plus</h3>
<p class="m-upgradesUpgradeOptionsPlan__targetAudience">
<p class="m-upgradesUpgradeOptionsPlan__targetAudience" i18n>
Ideal for all Minds Users
</p>
</div>
<div class="m-upgradesUpgradeOptionsPlan__row">
<p class="m-upgradesUpgradeOptionsPlan__description">
<p class="m-upgradesUpgradeOptionsPlan__description" i18n>
Upgrade your channel to unlock new features and upgrade your experience.
</p>
</div>
<div class="m-upgradesUpgradeOptionsPlan__row">
<ul>
<li>
<li i18n>
Access exclusive content
</li>
<li>
<li i18n>
Verify your channel
</li>
<li>
<li i18n>
Hide boosted content
</li>
</ul>
<p>
<a class="m-upgradesUpgradeOptionsPlan__moreInfo" routerLink="/plus">
<a
class="m-upgradesUpgradeOptionsPlan__moreInfo"
routerLink="/plus"
i18n
>
More info
</a>
</p>
</div>
<div class="m-upgradesUpgradeOptionsPlan__row">
<p class="m-upgradesUpgradeOptionsPlan__pricing">
<p class="m-upgradesUpgradeOptionsPlan__pricing" i18n>
<span>{{ plusPricing.amount }}</span> per month
</p>
<p
class="m-upgradesUpgradeOptionsPlan__offer"
*ngIf="plusPricing.offerFrom"
i18n
>
{{ plusPricing.offerFrom }} per month
</p>
......@@ -86,6 +91,7 @@
routerLink="/plus"
[queryParams]="intervalCurrencyQueryParams"
*ngIf="!session.getLoggedInUser()?.plus"
i18n
>
Upgrade to Plus
</a>
......@@ -94,49 +100,54 @@
<div
class="m-upgradesUpgradeOptionsPlan__row m-upgradesUpgradeOptionsPlan__row--first"
>
<h3>Pro</h3>
<h3 i18n>Pro</h3>
<p class="m-upgradesUpgradeOptionsPlan__targetAudience">
<p class="m-upgradesUpgradeOptionsPlan__targetAudience" i18n>
For independent content creators
</p>
</div>
<div class="m-upgradesUpgradeOptionsPlan__row">
<p class="m-upgradesUpgradeOptionsPlan__description">
<p class="m-upgradesUpgradeOptionsPlan__description" i18n>
The ultimate platform for independent content creators on the Internet.
</p>
</div>
<div class="m-upgradesUpgradeOptionsPlan__row">
<ul>
<li>
<li i18n>
Get paid for your work
</li>
<li>
<li i18n>
Build your own custom website
</li>
<li>
<li i18n>
Professional media tools
</li>
</ul>
<p>
<a class="m-upgradesUpgradeOptionsPlan__moreInfo" routerLink="/pro">
<a
class="m-upgradesUpgradeOptionsPlan__moreInfo"
routerLink="/pro"
i18n
>
More info
</a>
</p>
</div>
<div class="m-upgradesUpgradeOptionsPlan__row">
<p class="m-upgradesUpgradeOptionsPlan__pricing">
<p class="m-upgradesUpgradeOptionsPlan__pricing" i18n>
<span>{{ proPricing.amount }}</span> per month
</p>
<p
class="m-upgradesUpgradeOptionsPlan__offer"
*ngIf="proPricing.offerFrom"
i18n
>
{{ proPricing.offerFrom }} per month
</p>
......@@ -149,6 +160,7 @@
routerLink="/pro"
[queryParams]="intervalCurrencyQueryParams"
*ngIf="!session.getLoggedInUser()?.pro"
i18n
>
Upgrade to Pro
</a>
......@@ -157,6 +169,7 @@
<a
class="mf-button m-upgradesUpgradeOptionsPlan__action"
routerLink="/pro"
i18n
>
Coming soon
</a>
......@@ -166,43 +179,47 @@
<div
class="m-upgradesUpgradeOptionsPlan__row m-upgradesUpgradeOptionsPlan__row--first"
>
<h3>Node</h3>
<h3 i18n>Node</h3>
<p class="m-upgradesUpgradeOptionsPlan__targetAudience">
<p class="m-upgradesUpgradeOptionsPlan__targetAudience" i18n>
For next-level content creators
</p>
</div>
<div class="m-upgradesUpgradeOptionsPlan__row">
<p class="m-upgradesUpgradeOptionsPlan__description">
<p class="m-upgradesUpgradeOptionsPlan__description" i18n>
Launch your own white-labeled social network and mobile app.
</p>
</div>
<div class="m-upgradesUpgradeOptionsPlan__row">
<ul>
<li>
<li i18n>
White-labeled web + mobile app
</li>
<li>
<li i18n>
Custom domain and brand
</li>
<li>
<li i18n>
Independent from Minds
</li>
</ul>
<p>
<a class="m-upgradesUpgradeOptionsPlan__moreInfo" routerLink="/nodes">
<a
class="m-upgradesUpgradeOptionsPlan__moreInfo"
routerLink="/nodes"
i18n
>
More info
</a>
</p>
</div>
<div class="m-upgradesUpgradeOptionsPlan__row">
<p class="m-upgradesUpgradeOptionsPlan__pricing">
<p class="m-upgradesUpgradeOptionsPlan__pricing" i18n>
Contact us for pricing
</p>
</div>
......@@ -211,6 +228,7 @@
<a
class="mf-button m-upgradesUpgradeOptionsPlan__action"
routerLink="/nodes"
i18n
>
Contact us
</a>
......