Skip to content

Minds Frontend
Minds Frontend
Source
...
Target
 
Commits (64)
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 7332 additions and 4585 deletions
.gitignore
View file @ 7d74b971
......@@ -39,3 +39,4 @@ cypress/videos
!/.gitlab
!/.githooks
!/.prettierrc
!.gitattributes
.gitlab-ci.yml
View file @ 7d74b971
image: markharding/minds-front-base
services:
- docker:dind
stages:
- test
- build
......@@ -154,6 +151,8 @@ build:production:i18n:
prepare:review:
stage: prepare
image: minds/ci:latest
services:
- docker:dind
script:
- docker login -u gitlab-ci-token -p ${CI_BUILD_TOKEN} ${CI_REGISTRY}
- docker build -t $CI_REGISTRY_IMAGE/front-init:$CI_PIPELINE_ID -f containers/front-init/Dockerfile dist/.
......@@ -179,6 +178,8 @@ prepare:review:sentry:
prepare:production:
stage: prepare
image: minds/ci:latest
services:
- docker:dind
script:
- docker login -u gitlab-ci-token -p ${CI_BUILD_TOKEN} ${CI_REGISTRY}
- docker build -t $CI_REGISTRY_IMAGE/front-init:$CI_PIPELINE_ID -f containers/front-init/Dockerfile dist/.
......@@ -261,6 +262,8 @@ review:stop:
.deploy: &deploy
image: minds/ci:latest
services:
- docker:dind
script:
## Sync assets with CDN
- aws s3 sync dist $S3_REPOSITORY_URL
......
README.md
View file @ 7d74b971
......@@ -6,7 +6,7 @@ Minds Front
Front-end web application for Minds. Please run inside of [the Minds repo](https://github.com/minds/minds).
## Documentation
Documentation for Minds can be found at [minds.org/docs](https://www.minds.org/docs)
Please see the documentation on [developers.minds.com](https://developers.minds.com) for instructions on how to [build the Minds Front-end](https://developers.minds.com/docs/guides/frontend).
### Building
Please see the documentation on Minds.org for instructions on how to [build the Minds Front-end](https://www.minds.org/docs/install/preparation.html#front-end).
......
cypress/integration/blockchain/rewards-marketing.spec.js 0 → 100644
View file @ 7d74b971
context('Rewards Product Page', () => {
before(() => {
cy.getCookie('minds_sess').then(sessionCookie => {
if (!sessionCookie) {
return cy.login(true);
}
});
});
beforeEach(() => {
cy.preserveCookies();
});
const joinRewards = '.m-marketing__mainWrapper .mf-button';
it('should have a join rewards button', () => {
cy.visit('/rewards');
cy.get(joinRewards)
.should('be.visible')
.should('contain', 'Join Rewards')
.click();
cy.location('pathname').should(
'contains',
'/wallet/tokens/contributions'
);
});
});
cypress/integration/blockchain/token-marketing.spec.js 0 → 100644
View file @ 7d74b971
context('Token Page', () => {
before(() => {
cy.getCookie('minds_sess').then(sessionCookie => {
if (!sessionCookie) {
return cy.login(true);
}
});
});
beforeEach(() => {
cy.preserveCookies();
cy.visit('/token');
});
it('should have the ability to trigger Buy Tokens modal', () => {
const tokensInput = 'm-blockchain--purchase input[name=amount]';
const buyTokensButton =
'm-blockchain--purchase .m-blockchainTokenPurchase__action .mf-button';
const anyBuyTokensModal =
'm-blockchain--purchase m-modal .m-modal-container';
cy.get(tokensInput)
.focus()
.clear()
.type('0');
cy.get(buyTokensButton).should('be.disabled');
cy.get(tokensInput)
.focus()
.clear()
.type('1');
cy.get(buyTokensButton)
.should('not.be.disabled')
.click();
cy.get('.m-get-metamask--cancel-btn.m-btn').click();
cy.get(anyBuyTokensModal).should('be.visible');
});
it('should have the ability to trigger Buy Eth modal', () => {
const buyEthLink =
'm-blockchain--purchase .m-blockchainTokenPurchase__ethRate a';
const buyEthModal = 'm-blockchain__eth-modal .m-modal-container';
cy.get(buyEthLink).click();
cy.get(buyEthModal).should('be.visible');
});
});
cypress/integration/boost/marketing.spec.js 0 → 100644
View file @ 7d74b971
context('Boost Product Page', () => {
before(() => {
cy.getCookie('minds_sess').then(sessionCookie => {
if (!sessionCookie) {
return cy.login(true);
}
});
});
beforeEach(() => {
cy.preserveCookies();
});
const createBoostButton = '.m-marketing__mainWrapper .mf-button';
it('should have a create boost button', () => {
cy.visit('/boost');
cy.get(createBoostButton)
.should('be.visible')
.should('contain', 'Create Boost')
.click();
cy.location('pathname').should(
'contains',
'/boost/console/newsfeed/create'
);
});
});
cypress/integration/newsfeed.spec.js
View file @ 7d74b971
import generateRandomId from '../support/utilities';
context('Newsfeed', () => {
before(() => {
cy.getCookie('minds_sess').then(sessionCookie => {
......@@ -14,7 +16,6 @@ context('Newsfeed', () => {
cy.route('POST', '**/api/v1/media').as('mediaPOST');
cy.route('POST', '**/api/v1/newsfeed/**').as('newsfeedEDIT');
cy.route('POST', '**/api/v1/media/**').as('mediaEDIT');
cy.visit('/newsfeed/subscriptions')
.location('pathname')
.should('eq', '/newsfeed/subscriptions');
......@@ -37,6 +38,19 @@ context('Newsfeed', () => {
cy.get('minds-newsfeed-poster textarea').type(content);
};
const attachRichEmbed = (embedUrl) => {
cy.get('minds-newsfeed-poster').should('be.visible');
cy.get('minds-newsfeed-poster textarea')
.type(embedUrl);
cy.route('GET', `**/api/v1/newsfeed/preview?url=${embedUrl}**`)
.as('previewGET')
.wait('@previewGET')
.then(xhr => {
expect(xhr.status).to.equal(200);
});
}
const attachImageToActivity = () => {
cy.uploadFile(
'#attachment-input-poster',
......@@ -511,4 +525,140 @@ context('Newsfeed', () => {
deleteActivityFromNewsfeed();
});
it('should show a rich embed post from youtube in a modal', () => {
const content = generateRandomId() + " ",
url = 'https://www.youtube.com/watch?v=jNQXAC9IVRw';
// set up post.
newActivityContent(content);
attachRichEmbed(url);
// post and await.
cy.get('.m-posterActionBar__PostButton')
.click()
.wait('@newsfeedPOST').then(xhr => {
expect(xhr.status).to.equal(200);
//get activity, click it.
cy.get(`[minds-data-activity-guid='${xhr.response.body.guid}']`)
.click();
//check modal is open.
cy.get('[data-cy=data-minds-media-modal]')
.contains(content);
// close modal and tidy.
cy.get('.m-overlay-modal--backdrop')
.click({force: true});
deleteActivityFromNewsfeed();
});
});
it('should not open vimeo in a modal', () => {
const content = generateRandomId() + " ",
url = 'https://vimeo.com/8733915';
// set up post.
newActivityContent(content);
attachRichEmbed(url);
// post and await.
cy.get('.m-posterActionBar__PostButton')
.click()
.wait('@newsfeedPOST').then(xhr => {
expect(xhr.status).to.equal(200);
//get activity, make assertions tht would not be true for modals.
cy.get(`[minds-data-activity-guid='${xhr.response.body.guid}']`)
.should('be.visible')
.get('iframe')
.should('be.visible')
.get('.minds-more')
.should('be.visible');
// tidy.
deleteActivityFromNewsfeed();
});
});
it('should not open soundcloud in a modal', () => {
const content = generateRandomId() + " ",
url = 'https://soundcloud.com/richarddjames/piano-un10-it-happened';
// set up post.
newActivityContent(content);
attachRichEmbed(url);
// post and await.
cy.get('.m-posterActionBar__PostButton')
.click()
.wait('@newsfeedPOST').then(xhr => {
expect(xhr.status).to.equal(200);
//get activity, make assertions tht would not be true for modals.
cy.get(`[minds-data-activity-guid='${xhr.response.body.guid}']`)
.should('be.visible')
.get('.m-rich-embed-action-overlay')
.should('be.visible')
.get('.minds-more')
.should('be.visible');
deleteActivityFromNewsfeed();
});
});
it('should not open spotify in a modal', () => {
const content = generateRandomId() + " ",
url = 'https://open.spotify.com/track/2MZSXhq4XDJWu6coGoXX1V?si=nvja0EfwR3q6GMQmYg6gPQ';
// set up post.
newActivityContent(content);
attachRichEmbed(url);
// post and await.
cy.get('.m-posterActionBar__PostButton')
.click()
.wait('@newsfeedPOST').then(xhr => {
expect(xhr.status).to.equal(200);
//get activity, make assertions tht would not be true for modals.
cy.get(`[minds-data-activity-guid='${xhr.response.body.guid}']`)
.should('be.visible')
.get('.m-rich-embed-action-overlay')
.should('be.visible')
.get('.minds-more')
.should('be.visible');
deleteActivityFromNewsfeed();
});
});
it('should not open spotify in a modal', () => {
const content = generateRandomId() + " ",
url = 'http://giphygifs.s3.amazonaws.com/media/IzVquL965ib4s/giphy.gif';
// set up post.
newActivityContent(content);
attachRichEmbed(url);
// post and await.
cy.get('.m-posterActionBar__PostButton')
.click()
.wait('@newsfeedPOST').then(xhr => {
expect(xhr.status).to.equal(200);
//get activity, make assertions tht would not be true for modals.
cy.get(`[minds-data-activity-guid='${xhr.response.body.guid}']`)
.should('be.visible')
.get('.m-rich-embed-action-overlay')
.should('be.visible')
.get('.minds-more')
.should('be.visible');
deleteActivityFromNewsfeed();
});
});
});
cypress/integration/nodes/marketing.spec.js 0 → 100644
View file @ 7d74b971
context('Pro Product Page', () => {
before(() => {
cy.getCookie('minds_sess').then(sessionCookie => {
if (!sessionCookie) {
return cy.login(true);
}
});
});
beforeEach(() => {
cy.preserveCookies();
});
const contactUsButton = '.m-marketing__mainWrapper .mf-button';
it('should have a contact us button', () => {
cy.visit('/nodes', {
onBeforeLoad(_window) {
cy.stub(_window, 'open');
},
});
cy.get(contactUsButton)
.should('be.visible')
.should('contain', 'Contact us for details')
.click();
cy.window()
.its('open')
.should('be.called');
});
});
cypress/integration/plus/marketing.spec.js 0 → 100644
View file @ 7d74b971
context('Plus Product Page', () => {
before(() => {
cy.getCookie('minds_sess').then(sessionCookie => {
if (!sessionCookie) {
return cy.login(true);
}
});
});
beforeEach(() => {
cy.preserveCookies();
});
const upgradeButton = 'm-plus--subscription .mf-button';
const wirePaymentsComponent = 'm-wire__paymentscreator .m-wire--creator';
it('should open the Wire Payment modal', () => {
cy.visit('/plus');
cy.get(upgradeButton)
.should('be.visible')
.should('contain', 'Upgrade to Plus')
.click();
cy.get(wirePaymentsComponent).should('be.visible');
});
it('should automatically open the Wire Payment modal', () => {
cy.visit('/plus?i=yearly&c=tokens');
cy.get(wirePaymentsComponent).should('be.visible');
});
});
cypress/integration/pro/marketing.spec.js 0 → 100644
View file @ 7d74b971
context('Pro Product Page', () => {
before(() => {
cy.getCookie('minds_sess').then(sessionCookie => {
if (!sessionCookie) {
return cy.login(true);
}
});
});
beforeEach(() => {
cy.preserveCookies();
});
const upgradeButton = 'm-pro--subscription .mf-button';
const wirePaymentsComponent = 'm-wire__paymentscreator .m-wire--creator';
it('should show a coming soon button', () => {
cy.visit('/pro');
cy.get(upgradeButton)
.should('be.visible')
.should('contain', 'Coming soon')
.click();
});
// it('should open the Wire Payment modal', () => {
//
// cy.visit('/pro');
//
// cy.get(upgradeButton)
// .should('be.visible')
// .should('contain', 'Upgrade to Pro')
// .click();
//
// cy.get(wirePaymentsComponent).should('be.visible');
// });
//
// it('should automatically open the Wire Payment modal', () => {
// cy.visit('/pro?i=yearly&c=tokens');
//
// cy.get(wirePaymentsComponent).should('be.visible');
// });
});
cypress/integration/pro/settings.spec.js
View file @ 7d74b971
......@@ -21,7 +21,6 @@ context('Pro Settings', () => {
43: '#tile_ratio_4\:3', // 4:3
11: '#tile_ratio_1\:1' , // 1:1
},
logoGuid: '#logo_guid',
}
const hashtags = {
......
cypress/integration/upgrades.spec.js 0 → 100644
View file @ 7d74b971
context('Upgrades page', () => {
before(() => {
cy.getCookie('minds_sess').then(sessionCookie => {
if (!sessionCookie) {
return cy.login(true);
}
});
});
beforeEach(() => {
cy.preserveCookies();
cy.visit('/upgrades');
});
it('should scroll to upgrades table', () => {
cy.viewport(1200, 600); // Only on desktop
const scrollButton = '[data-cy="m-upgrades__upgrade-now-button"]';
const heading = '.m-upgradesUpgradeOptions__header h2';
cy.get(scrollButton)
.should('contain', 'Upgrade now')
.click();
cy.wait(1500);
cy.isInViewport(heading);
});
// TODO: Toggles tests (make them testable)
it('should have the ability to trigger Buy Tokens modal', () => {
const tokensInput = 'm-blockchain--purchase input[name=amount]';
const buyTokensButton =
'm-blockchain--purchase .m-blockchainTokenPurchase__action .mf-button';
const anyBuyTokensModal =
'm-blockchain--purchase m-modal .m-modal-container';
cy.get(tokensInput)
.focus()
.clear()
.type('0');
cy.get(buyTokensButton).should('be.disabled');
cy.get(tokensInput)
.focus()
.clear()
.type('1');
cy.get(buyTokensButton)
.should('not.be.disabled')
.click();
cy.get('.m-get-metamask--cancel-btn.m-btn').click();
cy.get(anyBuyTokensModal).should('be.visible');
});
it('should have the ability to trigger Buy Eth modal', () => {
const buyEthLink =
'm-blockchain--purchase .m-blockchainTokenPurchase__ethRate a';
const buyEthModal = 'm-blockchain__eth-modal .m-modal-container';
cy.get(buyEthLink).click();
cy.get(buyEthModal).should('be.visible');
});
it('should navigate to Plus and trigger a Wire', () => {
const upgradeButton = cy.get(
'[data-cy="m-upgradeOptions__upgrade-to-plus-button"]'
);
upgradeButton.click();
cy.location('pathname').should('contain', '/plus');
});
it('should navigate to Pro and trigger a Wire', () => {
const upgradeButton = cy.get(
'[data-cy="m-upgradeOptions__upgrade-to-pro-button"]'
);
upgradeButton.click();
cy.location('pathname').should('contain', '/pro');
});
it('should navigate to Nodes', () => {
const upgradeButton = cy.get(
'[data-cy="m-upgradeOptions__contact-us-nodes-button"]'
);
upgradeButton.click();
cy.location('pathname').should('contain', '/nodes');
});
});
cypress/integration/wire.spec.js → cypress/integration/wire/creator.spec.js
View file @ 7d74b971
......@@ -5,10 +5,10 @@
* @desc Spec tests for Wire transactions.
*/
import generateRandomId from "../support/utilities";
import generateRandomId from "../../support/utilities";
// Issue to re-enable https://gitlab.com/minds/front/issues/1846
context.skip('Wire', () => {
context.skip('Wire Creator', () => {
const receiver = {
username: generateRandomId(),
......
cypress/integration/wire/marketing.spec.js 0 → 100644
View file @ 7d74b971
context('Pay Product Page', () => {
before(() => {
cy.getCookie('minds_sess').then(sessionCookie => {
if (!sessionCookie) {
return cy.login(true);
}
});
});
beforeEach(() => {
cy.preserveCookies();
});
const monetizeChannelButton = '.m-marketing__mainWrapper .mf-button';
it('should have a monetize channel button', () => {
cy.visit('/pay');
cy.get(monetizeChannelButton)
.should('be.visible')
.should('contain', 'Monetize your channel')
.click();
cy.location('pathname').should(
'contains',
'/wallet/tokens/contributions'
);
});
});
cypress/support/commands.js
View file @ 7d74b971
......@@ -255,3 +255,36 @@ function b64toBlob(b64Data, contentType, sliceSize = 512) {
blob.lastModifiedDate = new Date();
return blob;
}
/**
* Check if certain element is on viewport
* @param {*} element
*/
Cypress.Commands.add('isInViewport', element => {
cy.get(element).then($el => {
const bottom = Cypress.$(cy.state('window')).height();
const rect = $el[0].getBoundingClientRect();
expect(rect.top).not.to.be.greaterThan(bottom);
expect(rect.bottom).not.to.be.greaterThan(bottom);
expect(rect.top).not.to.be.greaterThan(bottom);
expect(rect.bottom).not.to.be.greaterThan(bottom);
})
});
/**
* Check if certain element is on viewport
* @param {*} element
*/
Cypress.Commands.add('isNotInViewport', element => {
cy.get(element).then($el => {
const bottom = Cypress.$(cy.state('window')).height();
const rect = $el[0].getBoundingClientRect();
expect(rect.top).to.be.greaterThan(bottom);
expect(rect.bottom).to.be.greaterThan(bottom);
expect(rect.top).to.be.greaterThan(bottom);
expect(rect.bottom).to.be.greaterThan(bottom);
})
});
src/app/common/common.module.ts
View file @ 7d74b971
......@@ -113,6 +113,9 @@ import { MarketingComponent } from './components/marketing/marketing.component';
import { MarketingFooterComponent } from './components/marketing/footer.component';
import { ToggleComponent } from './components/toggle/toggle.component';
import { MarketingAsFeaturedInComponent } from './components/marketing/as-featured-in.component';
import { SidebarMenuComponent } from './components/sidebar-menu/sidebar-menu.component';
import { ChartV2Component } from './components/chart-v2/chart-v2.component';
import { MiniChartComponent } from './components/mini-chart/mini-chart.component';
@NgModule({
imports: [
......@@ -215,6 +218,9 @@ import { MarketingAsFeaturedInComponent } from './components/marketing/as-featur
MarketingComponent,
MarketingFooterComponent,
MarketingAsFeaturedInComponent,
SidebarMenuComponent,
ChartV2Component,
MiniChartComponent,
],
exports: [
MINDS_PIPES,
......@@ -305,6 +311,7 @@ import { MarketingAsFeaturedInComponent } from './components/marketing/as-featur
ToggleComponent,
MarketingComponent,
MarketingAsFeaturedInComponent,
SidebarMenuComponent,
],
providers: [
SiteService,
......
src/app/common/components/chart-v2/chart-v2.component.html 0 → 100644
View file @ 7d74b971
<!-- <div
#chartContainer
class="m-chartV2__chartContainer"
[ngClass]="{ isTouchDevice: isTouchDevice }"
>
<plotly-plot
*ngIf="init"
#graphDiv
id="graphDiv"
[data]="data"
[layout]="layout"
[config]="config"
[useResizeHandler]="true"
[style]="{ position: 'relative' }"
(hover)="onHover($event)"
(unhover)="onUnhover($event)"
(plotly_click)="onClick($event)"
>
</plotly-plot>
</div>
<div #hoverInfoDiv id="hoverInfoDiv" class="m-chartV2__hoverInfoDiv">
<i *ngIf="isTouchDevice" class="material-icons" (click)="onUnhover($event)"
>close</i
>
<div class="m-chartV2__hoverInfo__row">
{{ hoverInfo.date | utcDate | date: datePipe }}
</div>
<div
[ngSwitch]="selectedMetric?.unit"
class="m-chartV2__hoverInfo__row--primary"
>
<ng-template ngSwitchCase="number">
{{ hoverInfo.value | number }} {{ selectedMetric.label | lowercase }}
</ng-template>
<ng-template ngSwitchCase="usd">
{{ hoverInfo.value | currency }} USD
</ng-template>
<ng-template ngSwitchDefault>
{{ hoverInfo.value | number: '1.1-3' }} {{ selectedMetric?.unit }}
</ng-template>
</div>
<div class="m-chartV2__hoverInfo__row" *ngIf="isComparison">
vs
<ng-container
[ngSwitch]="selectedMetric?.unit"
class="m-chartV2__hoverInfo__row"
>
<ng-template ngSwitchCase="number">
{{ hoverInfo.comparisonValue | number }}
</ng-template>
<ng-template ngSwitchCase="usd">
{{ hoverInfo.comparisonValue | currency }}
</ng-template>
<ng-template ngSwitchDefault>
{{ hoverInfo.comparisonValue | number: '1.1-3' }}
</ng-template>
</ng-container>
on {{ hoverInfo.comparisonDate | utcDate | date: datePipe }}
</div>
</div> -->
src/app/modules/analytics/v2/components/menu/menu.component.spec.ts → src/app/common/components/chart-v2/chart-v2.component.spec.ts
View file @ 7d74b971
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { AnalyticsMenuComponent } from './menu.component';
import { ChartV2Component } from './chart-v2.component';
describe('AnalyticsMenuComponent', () => {
let component: AnalyticsMenuComponent;
let fixture: ComponentFixture<AnalyticsMenuComponent>;
describe('ChartV2Component', () => {
let component: ChartV2Component;
let fixture: ComponentFixture<ChartV2Component>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [AnalyticsMenuComponent],
declarations: [ChartV2Component],
}).compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(AnalyticsMenuComponent);
fixture = TestBed.createComponent(ChartV2Component);
component = fixture.componentInstance;
fixture.detectChanges();
});
xit('should create', () => {
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/common/components/chart-v2/chart-v2.component.ts 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/app/common/components/editors/plugins/buttons.plugin.ts
View file @ 7d74b971
......@@ -443,7 +443,9 @@ export class ButtonsPlugin {
const $input = this.$element.querySelector('.medium-media-buttons');
if ($input) {
$input.parentNode.removeChild($input);
try {
$input.parentNode.removeChild($input);
} catch (e) {}
}
}
......
src/app/common/components/featured-content/featured-content.service.ts
View file @ 7d74b971
import { Injectable } from '@angular/core';
import {
filter,
first,
map,
switchMap,
mergeMap,
skip,
take,
} from 'rxjs/operators';
import { filter, first, switchMap, mergeMap, skip, take } from 'rxjs/operators';
import { FeedsService } from '../../services/feeds.service';
import { Subscription } from 'rxjs';
@Injectable()
export class FeaturedContentService {
offset: number = -1;
offset = 0;
maximumOffset = 0;
feedLength = 0;
protected feedSubscription: Subscription;
constructor(protected feedsService: FeedsService) {
this.onInit();
}
onInit() {
this.feedSubscription = this.feedsService.feed.subscribe(feed => {
this.feedLength = feed.length;
this.maximumOffset = this.feedLength - 1;
});
this.feedsService
.setLimit(12)
.setOffset(0)
......@@ -23,28 +28,36 @@ export class FeaturedContentService {
}
async fetch() {
if (this.offset >= this.feedsService.rawFeed.getValue().length) {
this.offset = -1;
}
// Refetch every 2 calls, if not loading
if (this.offset % 2 && !this.feedsService.inProgress.getValue()) {
this.feedsService.clear();
this.feedsService.fetch();
}
return await this.feedsService.feed
.pipe(
filter(feed => feed.length > 0),
first(),
mergeMap(feed => feed),
filter(entities => entities.length > 0),
mergeMap(feed => feed), // Convert feed array to stream
skip(this.offset++),
take(1),
switchMap(async entity => {
if (!entity) {
return false;
} else {
const resolvedEntity = await entity.pipe(first()).toPromise();
this.resetOffsetAtEndOfStream();
return resolvedEntity;
}
return await entity.pipe(first()).toPromise();
})
)
.toPromise();
}
protected resetOffsetAtEndOfStream() {
if (this.offset >= this.maximumOffset) {
this.offset = 0;
this.fetchNextFeed();
}
}
protected fetchNextFeed() {
if (!this.feedsService.inProgress.getValue()) {
this.feedsService.clear();
this.feedsService.fetch();
}
}
}
src/app/common/components/marketing/as-featured-in.component.html
View file @ 7d74b971
......@@ -6,29 +6,25 @@
<ul class="m-grid__column-10">
<li>
<a
href="https://www.independent.co.uk/news/business/indyventure/minds-facebook-alternative-deletefacebook-social-network-data-a8475841.html"
href="https://www.wsj.com/articles/facebook-on-notice-as-vietnam-tightens-grip-on-social-media-11547036594"
target="_blank"
>
<img
[src]="cdnAssetsUrl + 'assets/marketing/press-logos/independent.png'"
alt="Independent"
[src]="cdnAssetsUrl + 'assets/marketing/wsj.png'"
alt="The Wall Street Journal"
/>
</a>
</li>
<li>
<a
href="https://www.foxnews.com/tech/alternate-social-media-squash-extremist-content-without-violating-first-amendment"
href="https://www.wired.com/story/minds-anti-facebook/"
target="_blank"
>
<img
[src]="cdnAssetsUrl + 'assets/marketing/foxnews.png'"
alt="Fox News"
/>
<img [src]="cdnAssetsUrl + 'assets/marketing/wired.png'" alt="Wired" />
</a>
</li>
<li *ngIf="false">
<img [src]="cdnAssetsUrl + 'assets/marketing/forbes.png'" alt="Forbes" />
</li>
<li>
<a
href="https://techcrunch.com/2018/04/16/minds-aims-to-decentralize-the-social-network/"
......@@ -40,35 +36,62 @@
/>
</a>
</li>
<li>
<a
href="https://mobile.reuters.com/article/amp/idUSKBN1K7147"
href="http://podcasts.joerogan.net/podcasts/bill-ottman"
target="_blank"
>
<img
[src]="cdnAssetsUrl + 'assets/marketing/reuters.png'"
alt="Reuters"
[src]="cdnAssetsUrl + 'assets/marketing/tjre.png'"
alt="The Joe Rogan Experience"
/>
</a>
</li>
<li>
<a
href="https://www.wired.com/story/minds-anti-facebook/"
href="https://www.foxnews.com/tech/alternate-social-media-squash-extremist-content-without-violating-first-amendment"
target="_blank"
>
<img [src]="cdnAssetsUrl + 'assets/marketing/wired.png'" alt="Wired" />
<img
[src]="cdnAssetsUrl + 'assets/marketing/foxnews.png'"
alt="Fox News"
/>
</a>
</li>
<li>
<a
href="http://podcasts.joerogan.net/podcasts/bill-ottman"
href="https://www.independent.co.uk/news/business/indyventure/minds-facebook-alternative-deletefacebook-social-network-data-a8475841.html"
target="_blank"
>
<img
[src]="cdnAssetsUrl + 'assets/marketing/tjre.png'"
alt="The Joe Rogan Experience"
[src]="cdnAssetsUrl + 'assets/marketing/press-logos/independent.png'"
alt="Independent"
/>
</a>
</li>
<li>
<a
href="https://www.reuters.com/article/us-vietnam-cyber-usa/u-s-lawmakers-urge-google-facebook-to-resist-vietnam-cybersecurity-law-idUSKBN1K7147"
target="_blank"
>
<img
[src]="cdnAssetsUrl + 'assets/marketing/reuters.png'"
alt="Reuters"
/>
</a>
</li>
<li>
<a
href="https://www.npr.org/2019/08/06/748810962/debate-over-policing-free-speech-intensifies-as-8chan-struggles-to-stay-online"
target="_blank"
>
<img [src]="cdnAssetsUrl + 'assets/marketing/npr.png'" alt="npr" />
</a>
</li>
</ul>
</div>
src/app/common/components/marketing/as-featured-in.component.scss
View file @ 7d74b971
......@@ -2,14 +2,19 @@
.m-marketing__asFeaturedIn {
max-width: 1084px;
margin: 40px auto 0;
margin: 45px auto 80px;
.m-marketing__asFeaturedIn--noMargin & {
margin-bottom: 0;
}
@media screen and (max-width: $m-grid-min-vp) {
&.m-grid {
display: block;
margin-bottom: 45px;
}
margin: 20px 0 45px;
margin: 20px 0 50px;
padding: 0 12px;
}
......@@ -45,20 +50,8 @@
object-fit: contain;
@media screen and (max-width: $m-grid-min-vp) {
width: 40px;
height: 40px;
}
}
&.m-marketingAsFeaturedIn__item--bigger {
img {
width: 96px;
height: 96px;
@media screen and (max-width: $m-grid-min-vp) {
width: 40px;
height: 40px;
}
width: 32px;
height: 32px;
}
}
}
......
src/app/common/components/marketing/footer.component.html
View file @ 7d74b971
<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"
>
<h4 i18n>About</h4>
<div class="m-marketingFooter__mindsLogo"></div>
<ul>
<li hidden>
<a href="#" i18n>
Company
</a>
</li>
<h4 class="m-marketingFooter__sloganText" i18n>
Take back control of your social media
</h4>
<li hidden>
<a href="#" i18n>
Mission
</a>
</li>
<div class="m-marketingFooter__text">&copy; {{ year }} Minds, Inc.</div>
</div>
<li hidden>
<a href="#" i18n>
Features
</a>
</li>
<div
class="m-grid__column-2 m-grid__column-12--mobile m-marketingFooter__column"
>
<h4 i18n>About</h4>
<ul>
<li>
<a routerLink="/mobile" i18n>
Mobile
......@@ -32,7 +26,7 @@
<li>
<a routerLink="/jobs" i18n>
Jobs
Careers
</a>
</li>
......@@ -67,7 +61,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>
......@@ -96,6 +90,12 @@
</a>
</li>
<li>
<a routerLink="/pay" i18n>
Pay
</a>
</li>
<li>
<a routerLink="/nodes" i18n>
Nodes
......@@ -109,8 +109,8 @@
</li>
<li>
<a routerLink="/wire" i18n>
Pay
<a routerLink="/rewards" i18n>
Rewards
</a>
</li>
......@@ -123,7 +123,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 +161,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>
......@@ -189,30 +189,19 @@
Status
</a>
</li>
<li hidden>
<a routerLink="/p/contact" i18n>
Contact
</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 @ 7d74b971
......@@ -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,34 @@ m-marketing__footer {
@include m-theme() {
color: themed($m-grey-800);
}
&.m-marketingFooter__sloganText {
margin: 0 0 21px;
}
}
.m-marketingFooter__mindsLogo {
width: 116px;
height: 43px;
margin: 0 0 35px;
background: url('<%= APP_CDN %>/assets/logos/logo.svg') no-repeat center
left;
background-size: contain;
@include m-on-theme(dark) {
background: url('<%= APP_CDN %>/assets/logos/logo-white.svg') no-repeat
center left;
background-size: contain;
}
}
.m-marketingFooter__text {
font-size: 14px;
line-height: 26px;
@include m-theme() {
color: themed($m-grey-300);
}
}
ul {
......@@ -90,7 +126,7 @@ m-marketing__footer {
a {
color: inherit;
font-weight: 300;
font-weight: normal;
text-decoration: none;
}
}
......@@ -108,6 +144,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 @ 7d74b971
......@@ -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 @ 7d74b971
......@@ -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/common/components/marketing/styles/general.scss 0 → 100644
View file @ 7d74b971
@import '../../../../foundation/grid-values';
.m-marketing__main,
.m-marketing__section {
a {
font: inherit;
text-decoration: none;
cursor: pointer;
@include m-theme() {
color: themed($m-blue);
}
}
.m-marketing--hideMobile {
@media screen and (max-width: $m-grid-min-vp) {
display: none;
}
}
.m-marketing__title,
h1 {
font-size: 22px;
line-height: 44px;
font-weight: bold;
opacity: 0.7;
margin: 12px 0 4px;
@include m-theme() {
color: themed($m-grey-800);
}
}
.m-marketing__subtitle,
h2 {
font-weight: 900;
font-size: 42px;
line-height: 44px;
margin: 0 0 23px;
position: relative;
z-index: 0;
@media screen and (max-width: $m-grid-min-vp) {
font-size: 32px;
line-height: 34px;
margin: 0 0 18px;
}
&.m-marketing__subtitle--asTitle {
font-size: 48px;
line-height: 53px;
margin: 0 0 26px;
@media screen and (max-width: $m-grid-min-vp) {
font-size: 38px;
line-height: 46px;
margin: 0 0 21px;
}
}
em {
font-style: inherit;
text-decoration: inherit;
white-space: nowrap;
position: relative;
&::after {
content: '';
display: inline-block;
position: absolute;
background: rgba(80, 226, 195, 0.3);
top: 0.36em;
left: -0.03em;
right: -0.03em;
bottom: 0.22em;
pointer-events: none;
z-index: -1;
}
}
em + em::after {
left: -0.25em;
}
}
p.m-marketing__description {
font-size: 18px;
line-height: 27px;
margin: 0 0 36px;
}
ul.m-marketing__points {
list-style: disc;
margin: 0 0 45px;
padding: 0 0 0 1em;
font-size: 16px;
line-height: 21px;
> li {
margin-bottom: 19px;
&:last-child {
margin-bottom: 0;
}
}
}
.m-marketing__actionButtons {
> * {
margin: 0 25px 0 0;
@media screen and (max-width: $m-grid-min-vp) {
margin: 0 0 20px;
}
&:last-child {
margin-right: initial;
}
}
}
.m-marketing__links {
@media screen and (max-width: $m-grid-min-vp) {
text-align: center;
}
h3 {
margin: 0;
font-size: 15px;
line-height: 20px;
opacity: 0.5;
font-weight: normal;
@include m-theme() {
color: themed($m-grey-800);
}
}
ul {
margin: 13px 0 0 0;
padding: 0;
list-style: none;
> li {
margin: 0 0 10px;
font-size: 15px;
line-height: 20px;
&:last-child {
margin: 0;
}
}
}
a {
> * {
vertical-align: middle;
}
i.material-icons {
margin-left: 0.35em;
font-size: 16px;
line-height: 16px;
opacity: 0.4;
@include m-theme() {
color: themed($m-grey-800);
}
}
}
}
}
src/app/common/components/marketing/marketing-styles.scss → src/app/common/components/marketing/styles/style-1.scss
View file @ 7d74b971
@import '../../../../foundation/grid-values';
.m-marketing__main,
.m-marketing__section {
// Common
overflow-x: hidden;
.m-marketing--hideMobile {
@media screen and (max-width: $m-grid-min-vp) {
display: none;
}
}
.m-marketing__title,
h1 {
font-size: 22px;
line-height: 44px;
font-weight: bold;
opacity: 0.7;
margin: 12px 0 4px;
@include m-theme() {
color: themed($m-grey-800);
}
}
.m-marketing__subtitle,
h2 {
font-weight: 900;
font-size: 42px;
line-height: 44px;
margin: 0 0 23px;
position: relative;
z-index: 0;
@media screen and (max-width: $m-grid-min-vp) {
font-size: 32px;
line-height: 34px;
margin: 0 0 18px;
}
&.m-marketing__subtitle--asTitle {
font-size: 48px;
line-height: 53px;
margin: 0 0 26px;
@media screen and (max-width: $m-grid-min-vp) {
font-size: 38px;
line-height: 46px;
margin: 0 0 21px;
}
}
em {
font-style: inherit;
text-decoration: inherit;
white-space: nowrap;
position: relative;
&::after {
content: '';
display: inline-block;
position: absolute;
background: rgba(80, 226, 195, 0.3);
top: 0.36em;
left: -0.03em;
right: -0.03em;
bottom: 0.22em;
pointer-events: none;
z-index: -1;
}
}
em + em::after {
left: -0.25em;
}
}
p.m-marketing__description {
font-size: 18px;
line-height: 27px;
margin: 0 0 36px;
}
ul.m-marketing__points {
list-style: disc;
margin: 0 0 45px;
padding: 0 0 0 1em;
font-size: 16px;
line-height: 21px;
> li {
margin-bottom: 19px;
&:last-child {
margin-bottom: 0;
}
}
}
// Style 1
&.m-marketing__section--style-1 {
@include m-theme() {
background: linear-gradient(
......@@ -272,160 +176,4 @@
}
}
}
// Style 2
&.m-marketing__section--style-2 {
.m-marketing__wrapper {
position: relative;
z-index: 0;
padding: 72px 0 32px;
@media screen and (max-width: $m-grid-min-vp) {
padding: 0;
}
}
.m-marketing__body {
position: relative;
@media screen and (max-width: $m-grid-min-vp) {
padding: 0 30px 30px;
}
&::before {
content: '';
position: absolute;
top: 0;
right: -290px;
bottom: -56px;
left: 0;
transform: translate(-86px, -56px);
clip-path: polygon(0% 0%, 0% 100%, 100% 92%, 100% 0%);
z-index: -1;
@include m-theme() {
background: linear-gradient(
180deg,
themed($m-marketing-bg-colored-gradient-start) 0%,
themed($m-marketing-bg-colored-gradient-end) 99.99%
);
}
@media screen and (max-width: $m-grid-min-vp) {
right: 0;
bottom: -3vw;
transform: none;
clip-path: none;
}
}
h1 {
@include m-on-theme(dark) {
color: #ffffff;
}
@media screen and (max-width: $m-grid-min-vp) {
margin: 15px 0 15px;
text-align: center;
}
}
h2 {
@include m-on-theme(dark) {
color: #ffffff;
}
@media screen and (max-width: $m-grid-min-vp) {
font-size: 28px;
line-height: 32px;
margin: 0 0 17px;
text-align: center;
}
}
}
p.m-marketing__description {
margin-bottom: 42px;
padding-right: 200px;
@include m-theme() {
color: themed($m-grey-300);
}
@include m-on-theme(dark) {
color: #ffffff;
}
@media screen and (max-width: $m-grid-min-vp) {
padding-right: 0;
margin-bottom: 30px;
font-size: 16px;
line-height: 23px;
text-align: center;
}
}
.m-marketing__image {
position: relative;
z-index: 0;
img {
object-fit: contain;
clip-path: polygon(0% 1%, 0% 97%, 100% 100%, 100% 0%);
@media screen and (max-width: $m-grid-min-vp) {
width: 100vw;
height: 100vw;
object-fit: cover;
clip-path: polygon(0% 2%, 0% 97%, 100% 100%, 100% 0%);
}
}
span {
display: inline-block;
position: relative;
// Deco
&::before {
content: '';
display: block;
position: absolute;
width: 393px;
height: 193px;
bottom: 0;
right: 0;
transform: translate(45px, 32px);
background: url('<%= APP_CDN %>/assets/marketing/deco_1.svg')
no-repeat;
z-index: -1;
@media screen and (max-width: $m-grid-min-vp) {
content: initial;
display: none;
}
}
&::after {
content: '';
display: block;
position: absolute;
top: 0;
right: 0;
width: 284px;
height: 262px;
transform: translate(35px, -35px);
background: url('<%= APP_CDN %>/assets/marketing/deco_2-straight.svg')
no-repeat;
z-index: -1;
@media screen and (max-width: $m-grid-min-vp) {
content: initial;
display: none;
}
}
}
}
}
}
src/app/common/components/marketing/styles/style-2.scss 0 → 100644
View file @ 7d74b971
@import '../../../../foundation/grid-values';
.m-marketing__main,
.m-marketing__section {
&.m-marketing__section--style-2 {
.m-marketing__wrapper {
position: relative;
z-index: 0;
padding: 72px 0 0;
margin-bottom: 95px;
@media screen and (max-width: $m-grid-min-vp) {
padding: 0;
margin-bottom: 15px;
}
}
.m-marketing__body {
position: relative;
@media screen and (max-width: $m-grid-min-vp) {
padding: 0 30px 30px;
}
&::before {
content: '';
position: absolute;
top: 0;
right: -290px;
bottom: -56px;
left: 0;
transform: translate(-86px, -56px);
clip-path: polygon(0% 0%, 0% 100%, 100% 92%, 100% 0%);
z-index: -1;
@include m-theme() {
background: linear-gradient(
180deg,
themed($m-marketing-bg-colored-gradient-start) 0%,
themed($m-marketing-bg-colored-gradient-end) 99.99%
);
}
@media screen and (max-width: $m-grid-min-vp) {
right: 0;
bottom: -3vw;
transform: none;
clip-path: none;
}
}
h1 {
@include m-on-theme(dark) {
color: #ffffff;
}
@media screen and (max-width: $m-grid-min-vp) {
margin: 15px 0 15px;
text-align: center;
}
}
h2 {
@include m-on-theme(dark) {
color: #ffffff;
}
@media screen and (max-width: $m-grid-min-vp) {
font-size: 28px;
line-height: 32px;
margin: 0 0 17px;
text-align: center;
}
}
}
p.m-marketing__description {
margin-bottom: 42px;
padding-right: 200px;
@include m-theme() {
color: themed($m-grey-300);
}
@include m-on-theme(dark) {
color: #ffffff;
}
@media screen and (max-width: $m-grid-min-vp) {
padding-right: 0;
margin-bottom: 30px;
font-size: 16px;
line-height: 23px;
text-align: center;
}
}
.m-marketing__image {
position: relative;
z-index: 0;
img {
object-fit: cover;
width: 438px;
height: 547px;
clip-path: polygon(0% 1%, 0% 97%, 100% 100%, 100% 0%);
@media screen and (max-width: $m-grid-min-vp) {
width: 100vw;
height: 100vw;
clip-path: polygon(0% 2%, 0% 97%, 100% 100%, 100% 0%);
}
}
span {
display: inline-block;
position: relative;
// Deco
&::before {
content: '';
display: block;
position: absolute;
width: 393px;
height: 193px;
bottom: 0;
right: 0;
transform: translate(45px, 32px);
background: url('<%= APP_CDN %>/assets/marketing/deco_1.svg')
no-repeat;
z-index: -1;
@media screen and (max-width: $m-grid-min-vp) {
content: initial;
display: none;
}
}
&::after {
content: '';
display: block;
position: absolute;
top: 0;
right: 0;
width: 284px;
height: 262px;
transform: translate(35px, -35px);
background: url('<%= APP_CDN %>/assets/marketing/deco_2-straight.svg')
no-repeat;
z-index: -1;
@media screen and (max-width: $m-grid-min-vp) {
content: initial;
display: none;
}
}
}
}
}
}
src/app/common/components/marketing/styles/style-3.scss 0 → 100644
View file @ 7d74b971
@import '../../../../foundation/grid-values';
.m-marketing__main,
.m-marketing__section {
&.m-marketing__section--style-3 {
margin-bottom: 100px;
@media screen and (max-width: $m-grid-min-vp) {
margin-bottom: 80px;
}
.m-marketing__wrapper {
position: relative;
z-index: 0;
padding: 80px 0 80px;
@media screen and (max-width: $m-grid-min-vp) {
padding: 0;
}
}
.m-marketing__body {
position: relative;
margin: auto 0;
padding: 0;
min-height: 330px;
@media screen and (max-width: $m-grid-min-vp) {
padding: 0 30px 0;
min-height: 0;
}
&::before {
content: '';
position: absolute;
top: 0;
right: -360px;
left: 0;
bottom: auto;
height: calc(100% + 160px);
transform: translate(-230px, -80px);
clip-path: polygon(0% 6%, 0% 95%, 100% 100%, 100% 0%);
z-index: -1;
@include m-theme() {
background: linear-gradient(
180deg,
themed($m-marketing-bg-colored-gradient-start) 0%,
themed($m-marketing-bg-colored-gradient-end) 99.99%
);
}
@media screen and (max-width: $m-grid-min-vp) {
content: initial;
display: none;
}
}
h2 {
@include m-on-theme(dark) {
color: #ffffff;
}
@media screen and (max-width: $m-grid-min-vp) {
font-size: 28px;
line-height: 32px;
margin: 20px 0 17px;
text-align: center;
}
}
}
p.m-marketing__description {
margin-bottom: 42px;
padding-right: 200px;
@include m-theme() {
color: themed($m-grey-300);
}
@include m-on-theme(dark) {
color: #ffffff;
}
@media screen and (max-width: $m-grid-min-vp) {
padding-right: 0;
margin-bottom: 30px;
font-size: 16px;
line-height: 23px;
text-align: center;
}
}
ul.m-marketing__points {
@include m-theme() {
color: themed($m-grey-300);
}
@include m-on-theme(dark) {
color: #ffffff;
}
> li em {
font-style: normal;
@include m-theme() {
color: themed($m-black);
}
@include m-on-theme(dark) {
color: #ffffff;
font-weight: bold;
}
}
}
.m-marketing__image {
position: relative;
z-index: 0;
grid-column-start: 1;
grid-row: 1;
img.m-marketing__image--1 {
object-fit: cover;
width: 438px;
height: 518px;
clip-path: polygon(0% 1%, 0% 100%, 100% 96%, 100% 0%);
@media screen and (max-width: $m-grid-min-vp) {
width: 100vw;
height: 100vw;
clip-path: polygon(0% 1%, 0% 100%, 100% 97%, 100% 0%);
}
}
img.m-marketing__image--2 {
object-fit: contain;
width: 358px;
height: 191px;
position: absolute;
right: 0;
bottom: 35px;
transform: translate(15px, 0);
@media screen and (max-width: $m-grid-min-vp) {
right: auto;
left: 50%;
bottom: 0;
transform: translate(-50%, 50%);
width: 85vw;
height: 45.35vw;
}
}
span {
display: inline-block;
position: relative;
width: 100%;
@media screen and (max-width: $m-grid-min-vp) {
margin-bottom: calc(
20vw + 40px
); // A little bit less than half UX image + normal margin
&.m-marketing__image--noUxSample {
margin-bottom: 40px;
}
}
// Deco
&::after {
content: '';
display: block;
position: absolute;
top: 0;
left: 0;
width: 191px;
height: 191px;
transform: translate(-60px, -58px);
background: url('<%= APP_CDN %>/assets/marketing/deco_3.svg')
no-repeat;
z-index: -1;
@media screen and (max-width: $m-grid-min-vp) {
content: initial;
display: none;
}
}
}
}
}
}
src/app/common/components/marketing/styles/style-4.scss 0 → 100644
View file @ 7d74b971
@import '../../../../foundation/grid-values';
.m-marketing__main,
.m-marketing__section {
&.m-marketing__section--style-4 {
margin-bottom: 100px;
@media screen and (max-width: $m-grid-min-vp) {
margin-bottom: 80px;
}
.m-marketing__wrapper {
position: relative;
z-index: 0;
@media screen and (max-width: $m-grid-min-vp) {
padding: 0;
}
}
.m-marketing__body {
position: relative;
margin: auto 0;
padding: 0;
min-height: 360px;
@media screen and (max-width: $m-grid-min-vp) {
padding: 0 30px 0;
min-height: 0;
}
h2 {
@include m-on-theme(dark) {
color: #ffffff;
}
@media screen and (max-width: $m-grid-min-vp) {
font-size: 28px;
line-height: 32px;
margin: 20px 0 17px;
text-align: center;
}
}
}
p.m-marketing__description {
margin-bottom: 42px;
padding-right: 200px;
@include m-theme() {
color: themed($m-grey-300);
}
@include m-on-theme(dark) {
color: #ffffff;
}
@media screen and (max-width: $m-grid-min-vp) {
padding-right: 0;
margin-bottom: 30px;
font-size: 16px;
line-height: 23px;
text-align: center;
}
}
ul.m-marketing__points {
@include m-theme() {
color: themed($m-grey-300);
}
@include m-on-theme(dark) {
color: #ffffff;
}
> li em {
font-style: normal;
@include m-theme() {
color: themed($m-black);
}
@include m-on-theme(dark) {
color: #ffffff;
font-weight: bold;
}
}
}
.m-marketing__image {
position: relative;
z-index: 0;
@media screen and (max-width: $m-grid-min-vp) {
grid-row: 1;
}
img.m-marketing__image--1 {
object-fit: cover;
width: 438px;
height: 547px;
clip-path: polygon(0% 1%, 0% 96%, 100% 100%, 100% 0%);
@media screen and (max-width: $m-grid-min-vp) {
width: 100vw;
height: 100vw;
clip-path: polygon(0% 1%, 0% 97%, 100% 100%, 100% 0%);
}
}
img.m-marketing__image--2 {
object-fit: contain;
width: 358px;
height: 191px;
position: absolute;
left: 0;
bottom: 35px;
transform: translate(-15px, 0);
@media screen and (max-width: $m-grid-min-vp) {
right: auto;
left: 50%;
bottom: 0;
transform: translate(-50%, 50%);
width: 85vw;
height: 45.35vw;
}
}
span {
display: inline-block;
position: relative;
width: 100%;
text-align: right;
@media screen and (max-width: $m-grid-min-vp) {
margin-bottom: calc(
20vw + 40px
); // A little bit less than half UX image + normal margin
&.m-marketing__image--noUxSample {
margin-bottom: 40px;
}
}
// Deco
&::after {
content: '';
display: block;
position: absolute;
right: 0;
bottom: 0;
width: 169px;
height: 169px;
transform: translate(50px, 50px);
background: url('<%= APP_CDN %>/assets/marketing/deco_4.svg')
no-repeat;
z-index: -1;
@media screen and (max-width: $m-grid-min-vp) {
content: initial;
display: none;
}
}
}
}
}
}
src/app/common/components/marketing/styles/style-tail.scss 0 → 100644
View file @ 7d74b971
@import '../../../../foundation/grid-values';
.m-marketing__main,
.m-marketing__section {
&.m-marketing__section--tail {
h2 {
font-size: 24px;
line-height: 32px;
font-weight: 700;
margin: 0 0 70px;
@include m-theme() {
color: themed($m-grey-300);
}
@media screen and (max-width: $m-grid-min-vp) {
margin: 0 0 35px;
}
}
.m-marketing__body {
position: relative;
text-align: center;
padding: 0 36px;
h3 {
margin: 0 0 24px;
font-size: 24px;
line-height: 32px;
font-weight: 900;
@media screen and (max-width: $m-grid-min-vp) {
margin: 0 0 12px;
}
}
p.m-marketing__description {
font-size: 16px;
line-height: 21px;
@include m-theme() {
color: themed($m-grey-300);
}
em {
font-style: normal;
@include m-theme() {
color: themed($m-black);
}
@include m-on-theme(dark) {
color: #ffffff;
font-weight: bold;
}
}
}
&.m-marketing__body--extra {
margin-top: 135px;
@media screen and (max-width: $m-grid-min-vp) {
margin-top: 0;
}
}
}
.m-marketingSectionTail__table {
.m-marketing__body {
@media screen and (max-width: $m-grid-min-vp) {
margin-bottom: 45px;
&:last-child {
margin-bottom: 55px;
}
}
}
> *::after {
content: '';
display: block;
position: absolute;
width: 1px;
height: 100%;
top: 0;
right: 0;
transform: translateX(($m-grid-gap / 2) + 1px);
@include m-theme() {
background: linear-gradient(
to bottom,
rgba(themed($m-grey-100), 0) 0%,
rgba(themed($m-grey-100), 0) 25%,
rgba(themed($m-grey-100), 0.9) 50%,
rgba(themed($m-grey-100), 0) 75%,
rgba(themed($m-grey-100), 0) 100%
);
}
@media screen and (max-width: $m-grid-min-vp) {
content: initial;
display: initial;
}
}
> *:last-child::after {
content: initial;
display: initial;
}
}
}
}
src/app/common/components/mini-chart/mini-chart.component.html 0 → 100644
View file @ 7d74b971
<p>
mini-chart works!
</p>
src/app/modules/analytics/v2/layouts/layout-table/layout-table.component.spec.ts → src/app/common/components/mini-chart/mini-chart.component.spec.ts
View file @ 7d74b971
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { AnalyticsLayoutTableComponent } from './layout-table.component';
import { MiniChartComponent } from './mini-chart.component';
describe('AnalyticsLayoutTableComponent', () => {
let component: AnalyticsLayoutTableComponent;
let fixture: ComponentFixture<AnalyticsLayoutTableComponent>;
describe('MiniChartComponent', () => {
let component: MiniChartComponent;
let fixture: ComponentFixture<MiniChartComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [AnalyticsLayoutTableComponent],
declarations: [MiniChartComponent],
}).compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(AnalyticsLayoutTableComponent);
fixture = TestBed.createComponent(MiniChartComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
xit('should create', () => {
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/modules/analytics/v2/layouts/layout-table/layout-table.component.ts → src/app/common/components/mini-chart/mini-chart.component.ts
View file @ 7d74b971
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'm-analytics__layout--table',
templateUrl: './layout-table.component.html',
selector: 'm-miniChart',
templateUrl: './mini-chart.component.html',
})
export class AnalyticsLayoutTableComponent implements OnInit {
export class MiniChartComponent implements OnInit {
constructor() {}
ngOnInit() {}
......
src/app/common/components/nsfw-selector/nsfw-selector.component.ts
View file @ 7d74b971
......@@ -31,6 +31,12 @@ export class NSFWSelectorComponent {
private storage: Storage
) {}
ngOnInit() {
if (this.service.reasons) {
this.service.reasons.map(r => this.toggle(r.value));
}
}
get service() {
switch (this.serviceRef) {
case 'editing':
......
src/app/common/components/rich-embed/rich-embed.html
View file @ 7d74b971
......@@ -55,7 +55,7 @@
[href]="src.perma_url"
target="_blank"
rel="noopener noreferrer"
class="meta mdl-color-text--blue-grey-900"
class="meta"
[ngClass]="{ 'm-rich-embed-has-thumbnail': src.thumbnail_src, 'm-rich-embed--title--no-padding': hasInlineContentLoaded() }"
>
<h2
......@@ -74,10 +74,7 @@
<a class="thumbnail" *ngIf="preview.thumbnail">
<img src="{{preview.thumbnail}}" />
</a>
<a
class="meta mdl-color-text--blue-grey-900"
[ngClass]="{ 'm-has-thumbnail': preview.thumbnail }"
>
<a class="meta" [ngClass]="{ 'm-has-thumbnail': preview.thumbnail }">
<h2 class="m-rich-embed--title mdl-card__title-text">
{{preview.title | excerpt}}
</h2>
......
src/app/common/components/rich-embed/rich-embed.scss
View file @ 7d74b971
......@@ -16,9 +16,6 @@ minds-rich-embed {
left: 0;
width: 100%;
height: 100%;
@include m-theme() {
background-color: rgba(themed($m-black-always), 0.2);
}
&:hover {
background: transparent;
......
src/app/common/components/rich-embed/rich-embed.ts
View file @ 7d74b971
......@@ -3,11 +3,14 @@ import {
ElementRef,
ChangeDetectorRef,
ChangeDetectionStrategy,
Output,
EventEmitter,
} from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser';
import { RichEmbedService } from '../../../services/rich-embed';
import mediaProxyUrl from '../../../helpers/media-proxy-url';
import { FeaturesService } from '../../../services/features.service';
@Component({
moduleId: module.id,
......@@ -17,18 +20,22 @@ import mediaProxyUrl from '../../../helpers/media-proxy-url';
})
export class MindsRichEmbed {
type: string = '';
mediaSource: string = '';
src: any = {};
preview: any = {};
maxheight: number = 320;
inlineEmbed: any = null;
embeddedInline: boolean = false;
cropImage: boolean = false;
modalRequestSubscribed: boolean = false;
@Output() mediaModalRequested: EventEmitter<any> = new EventEmitter();
private lastInlineEmbedParsed: string;
constructor(
private sanitizer: DomSanitizer,
private service: RichEmbedService,
private cd: ChangeDetectorRef
private cd: ChangeDetectorRef,
protected featureService: FeaturesService
) {}
set _src(value: any) {
......@@ -65,6 +72,14 @@ export class MindsRichEmbed {
// Inline Embedding
let inlineEmbed = this.parseInlineEmbed(this.inlineEmbed);
if (
this.featureService.has('media-modal') &&
this.mediaSource === 'youtube'
) {
this.modalRequestSubscribed =
this.mediaModalRequested.observers.length > 0;
}
if (
inlineEmbed &&
inlineEmbed.id &&
......@@ -80,9 +95,35 @@ export class MindsRichEmbed {
}
this.inlineEmbed = inlineEmbed;
if (
this.modalRequestSubscribed &&
this.featureService.has('media-modal') &&
this.mediaSource === 'youtube'
) {
if (this.inlineEmbed && this.inlineEmbed.htmlProvisioner) {
this.inlineEmbed.htmlProvisioner().then(html => {
this.inlineEmbed.html = html;
this.detectChanges();
});
// @todo: catch any error here and forcefully window.open to destination
}
}
}
action($event) {
if (
this.modalRequestSubscribed &&
this.featureService.has('media-modal') &&
this.mediaSource === 'youtube'
) {
$event.preventDefault();
$event.stopPropagation();
this.mediaModalRequested.emit();
return;
}
if (this.inlineEmbed && !this.embeddedInline) {
$event.preventDefault();
$event.stopPropagation();
......@@ -120,6 +161,7 @@ export class MindsRichEmbed {
if ((matches = youtube.exec(url)) !== null) {
if (matches[1]) {
this.mediaSource = 'youtube';
return {
id: `video-youtube-${matches[1]}`,
className:
......@@ -138,12 +180,13 @@ export class MindsRichEmbed {
if ((matches = vimeo.exec(url)) !== null) {
if (matches[1]) {
this.mediaSource = 'vimeo';
return {
id: `video-vimeo-${matches[1]}`,
className:
'm-rich-embed-video m-rich-embed-video-iframe m-rich-embed-video-vimeo',
html: this.sanitizer.bypassSecurityTrustHtml(`<iframe
src="https://player.vimeo.com/video/${matches[1]}?autoplay=1&title=0&byline=0&portrait=0"
src="https://player.vimeo.com/video/${matches[1]}?title=0&byline=0&portrait=0"
frameborder="0"
webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>`),
playable: true,
......@@ -156,6 +199,7 @@ export class MindsRichEmbed {
if ((matches = soundcloud.exec(url)) !== null) {
if (matches[1]) {
this.mediaSource = 'soundcloud';
return {
id: `audio-soundcloud-${matches[1]}`,
className:
......@@ -183,6 +227,7 @@ export class MindsRichEmbed {
if ((matches = spotify.exec(url)) !== null) {
if (matches[1]) {
this.mediaSource = 'spotify';
return {
id: `audio-spotify-${matches[1]}`,
className:
......@@ -207,7 +252,7 @@ export class MindsRichEmbed {
if (!id) {
return null;
}
this.mediaSource = 'giphy';
return {
id: `image-giphy-${matches[1]}`,
className:
......@@ -225,7 +270,11 @@ export class MindsRichEmbed {
}
hasInlineContentLoaded() {
return this.embeddedInline && this.inlineEmbed && this.inlineEmbed.html;
return this.featureService.has('media-modal')
? !this.modalRequestSubscribed &&
this.inlineEmbed &&
this.inlineEmbed.html
: this.embeddedInline && this.inlineEmbed && this.inlineEmbed.html;
}
detectChanges() {
......
src/app/common/components/sidebar-menu/categories.default.ts 0 → 100644
View file @ 7d74b971
const sidebarMenuCategories = [
{
category: {
id: 'analytics',
label: 'Analytics',
path: '/analytics/dashboard/',
permissions: ['admin', 'user'],
},
subcategories: [
// {
// id: 'summary',
// label: 'Summary',
// permissions: ['admin', 'user'],
// },
{
id: 'traffic',
label: 'Traffic',
permissions: ['admin', 'user'],
},
{
id: 'earnings',
label: 'Earnings',
permissions: ['admin', 'user'],
},
{
id: 'engagement',
label: 'Engagement',
permissions: ['admin', 'user'],
},
{
id: 'trending',
label: 'Trending',
permissions: ['admin', 'user'],
},
// {
// id: 'referrers',
// label: 'Referrers',
// permissions: ['admin', 'user'],
// },
// {
// id: 'plus',
// label: 'Plus',
// permissions: ['admin'],
// },
// {
// id: 'pro',
// label: 'Pro',
// permissions: ['admin'],
// {
// id: 'boost',
// label: 'Boost',
// permissions: ['admin'],
// },
// {
// id: 'nodes',
// label: 'Nodes',
// permissions: ['admin'],
// },
],
},
// {
// category: {
// id: 'test1',
// label: 'Test1',
// permissions: ['admin', 'user'],
// path: '/somepath/bork',
// },
// subcategories: [
// {
// id: 'nodes',
// label: 'Nodes',
// permissions: ['admin'],
// },
// {
// id: 'nodes2',
// label: 'Nodes2',
// permissions: ['admin'],
// },
// ],
// },
// {
// category: {
// id: 'test2',
// label: 'Test2 no subcats',
// path: '/anotherpath/test2',
// },
// },
];
export default sidebarMenuCategories;
src/app/common/components/sidebar-menu/sidebar-menu.component.html 0 → 100644
View file @ 7d74b971
<section class="m-sidebarMenu">
<div class="m-sidebarMenu__topbar">
<i class="material-icons" (click)="mobileMenuExpanded = true">menu</i>
<div class="m-sidebarMenu__topbarCatLabel" *ngIf="activeCat">
{{ activeCat.category.label }}
</div>
</div>
<div
class="m-sidebarMenu__overlay"
[ngClass]="{ mobileMenuExpanded: mobileMenuExpanded }"
(click)="mobileMenuExpanded = false"
></div>
<div
class="m-sidebarMenu__sidebar"
[ngClass]="{ mobileMenuExpanded: mobileMenuExpanded }"
>
<a class="m-sidebarMenu__userWrapper" [routerLink]="['/', user.username]">
<img
class="m-sidebarMenu__userAvatar"
[src]="minds.cdn_url + 'icon/' + user.guid + '/small/' + user.icontime"
/>
<div class="m-sidebarMenu__userDetails">
<div class="m-sidebarMenu__userDetails__name">{{ user.name }}</div>
<div class="m-sidebarMenu__userDetails__username">
@{{ user.username }}
</div>
<!-- TODO: get subscriberCount and remove username -->
<!-- <div class="m-sidebarMenu__userDetails__subscribers">
{{ user.subscribers_count | abbr }} subscribers
</div> -->
</div>
</a>
<ng-container *ngFor="let cat of cats">
<div
class="m-sidebarMenu__catContainer"
*ngIf="cat.category.permissionGranted"
[ngClass]="{ expanded: cat.category.expanded }"
>
<div class="m-sidebarMenu__catLabel">
<h3>{{ cat.category.label }}</h3>
<i
class="material-icons"
*ngIf="cat.category.expanded && cat.subcategories"
(click)="cat.category.expanded = false"
>keyboard_arrow_up</i
>
<i
class="material-icons"
*ngIf="!cat.category.expanded && cat.subcategories"
(click)="cat.category.expanded = true"
>keyboard_arrow_down</i
>
</div>
<div class="m-sidebarMenu__subcatContainer" *ngIf="cat.subcategories">
<div
class="m-sidebarMenu__subcat"
*ngFor="let subcat of cat.subcategories"
>
<a
*ngIf="subcat.permissionGranted"
class="m-sidebarMenu__subcatLabel"
(click)="mobileMenuExpanded = false"
[routerLink]="'../' + subcat.id"
routerLinkActive="selected"
>{{ subcat.label }}</a
>
</div>
</div>
</div>
</ng-container>
</div>
</section>
src/app/modules/analytics/v2/components/menu/menu.component.scss → src/app/common/components/sidebar-menu/sidebar-menu.component.scss
View file @ 7d74b971
// .m-sidebarMarkers__container,
// m-v2-topbar {
// display: none;
// }
m-sidebarMenu {
display: block;
// min-width: 180px;
// padding: 16px 16px 16px 80px;
// flex: 1 1 0px;
.m-sidebarMenu {
padding: 16px 16px 16px 80px;
}
i {
display: none;
cursor: pointer;
}
.m-sidebarMenu__topbar,
.m-sidebarMenu__userWrapper {
display: none;
}
.m-sidebarMenu__catContainer {
.m-sidebarMenu__subcatContainer {
display: block;
cursor: pointer;
}
}
// .m-sidebarMenu__sidebar {
// position: relative;
// position: -webkit-sticky;
// position: sticky;
// top: 0;
// }
.page.isMobile m-analytics__menu {
margin-right: -32px;
flex: 0 1 0px;
}
.m-sidebarMenu__catLabel {
display: flex;
justify-content: space-between;
align-items: center;
i {
display: none;
}
}
m-analytics__menu {
display: block;
max-width: 160px;
// ----------------------------------------
// MOBILE
.m-sidebarMenu__subcatContainer {
cursor: pointer;
display: none;
.m-sidebarMenu__subcat {
a {
display: block;
padding: 8px 0;
text-decoration: none;
font-weight: 400;
@include m-theme() {
color: themed($m-grey-300);
}
}
a.selected,
&:hover a {
@include m-theme() {
color: themed($m-blue);
}
}
}
}
}
// --------------------------------------------------
// TABLET & MOBILE
// --------------------------------------------------
@media screen and (max-width: $min-tablet) {
m-sidebarMenu {
margin-right: -32px;
flex: 0 1 0px;
padding: 0;
.m-sidebarMenu {
padding: 0 8px;
}
.isMobile {
.topbar {
.m-sidebarMenu__topbar {
display: block;
z-index: 99999;
position: fixed;
top: 0;
......@@ -24,7 +80,7 @@ m-analytics__menu {
padding: 16px;
text-align: center;
@include m-theme() {
background-color: themed($m-grey-100);
background-color: themed($m-grey-50);
color: themed($m-grey-800);
}
......@@ -35,34 +91,32 @@ m-analytics__menu {
left: 16px;
transform: translateY(-50%);
@include m-theme() {
background-color: themed($m-grey-100);
color: themed($m-grey-700);
color: themed($m-grey-300);
}
}
.pageTitle {
.m-sidebarMenu__topbarCatLabel {
font-size: 20px;
margin: 0;
margin: 0 0 0 -24px;
min-height: 20px;
}
}
.overlay {
.m-sidebarMenu__overlay {
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: -1;
// display: none;
background-color: transparent;
transition: background-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
&.expanded {
// display: block;
&.mobileMenuExpanded {
z-index: 999998;
@include m-theme() {
background-color: rgba(themed($m-grey-700), 0.2);
}
}
}
.sidebar {
.m-sidebarMenu__sidebar {
z-index: 999999;
position: fixed;
top: 0;
......@@ -76,50 +130,66 @@ m-analytics__menu {
@include m-theme() {
background-color: themed($m-white);
}
&.expanded {
&.mobileMenuExpanded {
left: 0;
}
.sidebarTitle {
.m-sidebarMenu__catContainer {
.m-sidebarMenu__subcatContainer {
display: none;
}
&.expanded {
.m-sidebarMenu__subcatContainer {
display: block;
.m-sidebarMenu__subcat {
a {
padding: 6px 0;
}
}
}
}
}
.m-sidebarMenu__catLabel {
display: flex;
justify-content: space-between;
align-items: center;
h3 {
font-size: 20px;
margin: 0;
margin: 16px 0;
}
i {
font-size: 20px;
display: inline-block;
font-size: 26px;
@include m-theme() {
color: themed($m-grey-200);
}
}
}
.profile {
.m-sidebarMenu__userWrapper {
display: flex;
text-decoration: none;
margin: 24px 0;
@include m-theme() {
color: themed($m-grey-800);
}
.avatar {
.m-sidebarMenu__userAvatar {
border-radius: 50%;
margin-right: 16px;
}
.details {
.m-sidebarMenu__userDetails {
& > {
padding: 8px 0;
}
.name {
.m-sidebarMenu__userDetails__name {
font-weight: bold;
}
.username {
.m-sidebarMenu__userDetails__username {
@include m-theme() {
color: themed($m-grey-200);
}
}
.subscribers {
.m-sidebarMenu__userDetails__subscribers {
font-size: 11px;
@include m-theme() {
color: themed($m-grey-200);
......@@ -129,32 +199,4 @@ m-analytics__menu {
}
}
}
// ----------------------------------------
padding: 16px 16px 16px 16px;
flex: 1 1 0px;
i {
display: none;
}
.catContainer {
cursor: pointer;
.cat {
a {
display: block;
padding: 6px 0;
text-decoration: none;
font-weight: 400;
@include m-theme() {
color: themed($m-grey-200);
}
}
a.selected,
&:hover a {
@include m-theme() {
color: themed($m-blue);
}
}
}
}
}
src/app/common/components/sidebar-menu/sidebar-menu.component.spec.ts 0 → 100644
View file @ 7d74b971
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { RouterTestingModule } from '@angular/router/testing';
import { Session } from '../../../services/session';
import { sessionMock } from '../../../../tests/session-mock.spec';
import { SidebarMenuComponent } from './sidebar-menu.component';
describe('SidebarMenuComponent', () => {
let component: SidebarMenuComponent;
let fixture: ComponentFixture<SidebarMenuComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [SidebarMenuComponent],
imports: [RouterTestingModule],
providers: [{ provide: Session, useValue: sessionMock }],
}).compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(SidebarMenuComponent);
component = fixture.componentInstance;
// component.user = sessionMock.user;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/common/components/sidebar-menu/sidebar-menu.component.ts 0 → 100644
View file @ 7d74b971
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { Session } from '../../../services/session';
import menuCategories from './categories.default';
interface MenuCategory {
category: MenuLink;
subcategories?: MenuLink[];
expanded?: boolean;
}
export { MenuCategory };
interface MenuLink {
id: string;
label: string;
permissions?: string[];
permissionGranted?: boolean;
path?: string;
}
export { MenuLink };
@Component({
selector: 'm-sidebarMenu',
templateUrl: './sidebar-menu.component.html',
})
export class SidebarMenuComponent implements OnInit {
cats: MenuCategory[] = menuCategories;
mobileMenuExpanded = false;
activeCat;
minds: Minds;
user;
userRoles: string[] = ['user'];
constructor(public route: ActivatedRoute, public session: Session) {}
ngOnInit() {
this.minds = window.Minds;
this.user = this.session.getLoggedInUser();
this.getUserRoles();
this.grantPermissionsAndFindActiveCat();
}
getUserRoles() {
if (this.session.isAdmin()) {
this.userRoles.push('admin');
}
// TODO: define & handle other userRole options, e.g. pro, loggedIn
}
grantPermissionsAndFindActiveCat() {
this.cats.forEach(catObj => {
catObj.category['permissionGranted'] = catObj.category.permissions
? this.checkForRoleMatch(catObj.category.permissions)
: true;
if (catObj.subcategories) {
catObj.subcategories.forEach(subCat => {
subCat['permissionGranted'] = subCat.permissions
? this.checkForRoleMatch(subCat.permissions)
: true;
});
}
if (location.pathname.indexOf(catObj.category.path) !== -1) {
catObj.category['expanded'] = true;
this.activeCat = catObj;
} else {
catObj.category['expanded'] = false;
}
});
}
checkForRoleMatch(permissionsArray) {
return permissionsArray.some(role => this.userRoles.includes(role));
}
}
src/app/common/pipes/tags.spec.ts
View file @ 7d74b971
import { TestBed } from '@angular/core/testing';
import { TagsPipe } from './tags';
import { FeaturesService } from '../../services/features.service';
import { MockService } from '../../utils/mock';
import { SiteService } from '../services/site.service';
describe('TagPipe', () => {
let featuresServiceMock: any = MockService(FeaturesService, {
const featuresServiceMock: any = MockService(FeaturesService, {
has: feature => {
return true;
},
});
const siteServiceMock: any = MockService(SiteService, {
props: {
isProDomain: { get: () => false },
pro: { get: () => false },
},
});
let pipe;
beforeEach(() => {
TestBed.configureTestingModule({
declarations: [TagsPipe],
providers: [
{
provide: FeaturesService,
useValue: featuresServiceMock,
},
],
});
pipe = new TagsPipe(featuresServiceMock, siteServiceMock);
});
it('should transform when # in the middle ', () => {
const pipe = new TagsPipe(featuresServiceMock);
const string = 'textstring#name';
const transformedString = pipe.transform(<any>string);
expect(transformedString).toContain(
......@@ -32,7 +32,6 @@ describe('TagPipe', () => {
});
it('should transform when # preceded by space ', () => {
const pipe = new TagsPipe(featuresServiceMock);
const string = 'textstring #name';
const transformedString = pipe.transform(<any>string);
expect(transformedString).toContain(
......@@ -41,7 +40,6 @@ describe('TagPipe', () => {
});
it('should transform when # preceded by [] ', () => {
const pipe = new TagsPipe(featuresServiceMock);
const string = 'textstring [#name';
const transformedString = pipe.transform(<any>string);
expect(transformedString).toContain(
......@@ -50,7 +48,6 @@ describe('TagPipe', () => {
});
it('should transform when # preceded by () ', () => {
const pipe = new TagsPipe(featuresServiceMock);
const string = 'textstring (#name)';
const transformedString = pipe.transform(<any>string);
expect(transformedString).toContain(
......@@ -59,7 +56,6 @@ describe('TagPipe', () => {
});
it('should transform uppercase text following # to lower case ', () => {
const pipe = new TagsPipe(featuresServiceMock);
const string = 'textString #NaMe';
const transformedString = pipe.transform(<any>string);
expect(transformedString).toContain(
......@@ -68,7 +64,6 @@ describe('TagPipe', () => {
});
it('should correctly parse when duplicates substrings present', () => {
const pipe = new TagsPipe(featuresServiceMock);
const string = '#hash #hashlonger';
const transformedString = pipe.transform(<any>string);
expect(transformedString).toContain(
......@@ -80,28 +75,24 @@ describe('TagPipe', () => {
});
it('should transform when @ preceded by () ', () => {
const pipe = new TagsPipe(featuresServiceMock);
const string = 'textstring (@name';
const transformedString = pipe.transform(<any>string);
expect(transformedString).toContain('<a class="tag"');
});
it('should transform when @ preceded by [] ', () => {
const pipe = new TagsPipe(featuresServiceMock);
const string = 'textstring [@name';
const transformedString = pipe.transform(<any>string);
expect(transformedString).toContain('<a class="tag"');
});
it('should transform when @ preceded by space', () => {
const pipe = new TagsPipe(featuresServiceMock);
const string = 'textstring @name';
const transformedString = pipe.transform(<any>string);
expect(transformedString).toContain('<a class="tag"');
});
it('should transform when @ followed by `.com`', () => {
const pipe = new TagsPipe(featuresServiceMock);
const string = 'textstring @name.com';
const transformedString = pipe.transform(<any>string);
expect(transformedString).toContain('<a class="tag"');
......@@ -109,7 +100,6 @@ describe('TagPipe', () => {
});
it('should transform two adjacent tags', () => {
const pipe = new TagsPipe(featuresServiceMock);
const string = '@test1 @test2';
const transformedString = pipe.transform(<any>string);
expect(transformedString).toEqual(
......@@ -118,7 +108,6 @@ describe('TagPipe', () => {
});
it('should transform many adjacent tags', () => {
const pipe = new TagsPipe(featuresServiceMock);
const string =
'@test1 @test2 @test3 @test4 @test5 @test6 @test7 @test8 @test9 @test10 @test11 @test12 @test13 @test14 @test15';
const transformedString = pipe.transform(<any>string);
......@@ -135,14 +124,12 @@ describe('TagPipe', () => {
});
it('should transform to an email', () => {
const pipe = new TagsPipe(featuresServiceMock);
const string = 'textstring@name.com';
const transformedString = pipe.transform(<any>string);
expect(transformedString).toContain('<a href="mailto:textstring@name.com"');
});
it('should not transform when @ not present', () => {
const pipe = new TagsPipe(featuresServiceMock);
const string = 'textstring name';
const transformedString = pipe.transform(<any>string);
expect(transformedString).toEqual(string);
......@@ -150,35 +137,30 @@ describe('TagPipe', () => {
});
it('should transform url http', () => {
const pipe = new TagsPipe(featuresServiceMock);
const string = 'textstring http://minds.com/';
const transformedString = pipe.transform(<any>string);
expect(transformedString).toContain('<a href="http://minds.com/');
});
it('should transform url with https', () => {
const pipe = new TagsPipe(featuresServiceMock);
const string = 'textstring https://minds.com/';
const transformedString = pipe.transform(<any>string);
expect(transformedString).toContain('<a href="https://minds.com/');
});
it('should transform url with ftp', () => {
const pipe = new TagsPipe(featuresServiceMock);
const string = 'textstring ftp://minds.com/';
const transformedString = pipe.transform(<any>string);
expect(transformedString).toContain('<a href="ftp://minds.com/');
});
it('should transform url with file', () => {
const pipe = new TagsPipe(featuresServiceMock);
const string = 'textstring file://minds.com/';
const transformedString = pipe.transform(<any>string);
expect(transformedString).toContain('<a href="file://minds.com/');
});
it('should transform url with a hashtag', () => {
const pipe = new TagsPipe(featuresServiceMock);
const string = 'text http://minds.com/#position';
const transformedString = pipe.transform(<any>string);
expect(transformedString).toContain(
......@@ -187,7 +169,6 @@ describe('TagPipe', () => {
});
it('should transform url with a hashtag and @', () => {
const pipe = new TagsPipe(featuresServiceMock);
const string = 'text http://minds.com/#position@some';
const transformedString = pipe.transform(<any>string);
expect(transformedString).toContain(
......@@ -196,7 +177,6 @@ describe('TagPipe', () => {
});
it('should transform many tags', () => {
const pipe = new TagsPipe(featuresServiceMock);
const string = `text http://minds.com/#position@some @name
@name1 #hash1#hash2 #hash3 ftp://s.com name@mail.com
`;
......
src/app/common/pipes/tags.ts
View file @ 7d74b971
import { Pipe, Inject, PipeTransform } from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser';
import { FeaturesService } from '../../services/features.service';
import { SiteService } from '../services/site.service';
@Pipe({
name: 'tags',
......@@ -31,7 +32,11 @@ export class TagsPipe implements PipeTransform {
hash: {
rule: /(^|\s||)#(\w+)/gim,
replace: m => {
if (this.featureService.has('top-feeds')) {
if (this.siteService.isProDomain) {
return `${
m.match[1]
}<a href="/all;query=${m.match[2].toLowerCase()}">#${m.match[2]}</a>`;
} else if (this.featureService.has('top-feeds')) {
return `${
m.match[1]
}<a href="/newsfeed/global/top;hashtag=${m.match[2].toLowerCase()};period=24h">#${
......@@ -49,7 +54,10 @@ export class TagsPipe implements PipeTransform {
},
};
constructor(private featureService: FeaturesService) {}
constructor(
private featureService: FeaturesService,
private siteService: SiteService
) {}
/**
* Push a match to results array
......
src/app/common/services/block-list.service.ts
View file @ 7d74b971
......@@ -4,13 +4,6 @@ import { Client } from '../../services/api/client';
import { Session } from '../../services/session';
import { Storage } from '../../services/storage';
import AsyncLock from '../../helpers/async-lock';
import MindsClientHttpAdapter from '../../lib/minds-sync/adapters/MindsClientHttpAdapter.js';
import browserStorageAdapterFactory from '../../helpers/browser-storage-adapter-factory';
import BlockListSync from '../../lib/minds-sync/services/BlockListSync.js';
import AsyncStatus from '../../helpers/async-status';
@Injectable()
export class BlockListService {
blocked: BehaviorSubject<string[]>;
......
src/app/common/services/entities.service.ts
View file @ 7d74b971
import { Injectable } from '@angular/core';
import { BehaviorSubject, Observable, of } from 'rxjs';
import { first, catchError } from 'rxjs/operators';
import { BehaviorSubject } from 'rxjs';
import { first } from 'rxjs/operators';
import { Client } from '../../services/api';
import { BlockListService } from './block-list.service';
import MindsClientHttpAdapter from '../../lib/minds-sync/adapters/MindsClientHttpAdapter.js';
import browserStorageAdapterFactory from '../../helpers/browser-storage-adapter-factory';
import EntitiesSync from '../../lib/minds-sync/services/EntitiesSync.js';
import AsyncStatus from '../../helpers/async-status';
import normalizeUrn from '../../helpers/normalize-urn';
type EntityObservable = BehaviorSubject<Object>;
type EntityObservables = Map<string, EntityObservable>;
......
src/app/common/services/feeds.service.ts
View file @ 7d74b971
......@@ -6,40 +6,8 @@ import { Session } from '../../services/session';
import { EntitiesService } from './entities.service';
import { BlockListService } from './block-list.service';
import MindsClientHttpAdapter from '../../lib/minds-sync/adapters/MindsClientHttpAdapter.js';
import browserStorageAdapterFactory from '../../helpers/browser-storage-adapter-factory';
import FeedsSync from '../../lib/minds-sync/services/FeedsSync.js';
import hashCode from '../../helpers/hash-code';
import AsyncStatus from '../../helpers/async-status';
import { BehaviorSubject, Observable, of, forkJoin, combineLatest } from 'rxjs';
import {
take,
switchMap,
map,
tap,
skipWhile,
first,
filter,
} from 'rxjs/operators';
export type FeedsServiceGetParameters = {
endpoint: string;
timebased: boolean;
//
limit: number;
offset?: number;
//
syncPageSize?: number;
forceSync?: boolean;
};
export type FeedsServiceGetResponse = {
entities: any[];
next?: number;
};
import { BehaviorSubject, Observable, combineLatest } from 'rxjs';
import { switchMap, map, tap, first } from 'rxjs/operators';
/**
* Enables the grabbing of data through observable feeds.
......@@ -69,6 +37,7 @@ export class FeedsService {
this.pageSize = this.offset.pipe(
map(offset => this.limit.getValue() + offset)
);
this.feed = this.rawFeed.pipe(
tap(feed => {
if (feed.length) this.inProgress.next(true);
......@@ -87,6 +56,7 @@ export class FeedsService {
this.inProgress.next(false);
})
);
this.hasMore = combineLatest(
this.rawFeed,
this.inProgress,
......
src/app/common/services/user-avatar.service.ts
View file @ 7d74b971
......@@ -13,7 +13,7 @@ import { MindsUser } from '../../interfaces/entities';
export class UserAvatarService {
private minds = window.Minds;
private user: MindsUser;
public src$: BehaviorSubject<string>;
public src$: BehaviorSubject<string> = new BehaviorSubject<string>('');
public loggedIn$: Subscription;
constructor(public session: Session) {
......@@ -34,7 +34,7 @@ export class UserAvatarService {
*/
public init(): void {
this.user = this.session.getLoggedInUser();
this.src$ = new BehaviorSubject(this.getSrc());
this.src$.next(this.getSrc());
}
/**
......
src/app/controllers/admin/boosts/boosts.ts
View file @ 7d74b971
......@@ -184,36 +184,14 @@ export class AdminBoosts {
}
onKeyPress(e: KeyboardEvent) {
if (this.reasonModalOpened || e.ctrlKey || e.altKey || e.shiftKey) {
//If an input is focused, disregard.
if (document.activeElement.tagName === 'INPUT') {
return;
}
e.stopPropagation();
// numbers
switch (e.key.toLowerCase()) {
case '1':
case '2':
case '3':
case '4':
case '5':
case '6':
case '7':
case '8':
case '9':
case '0':
const keyValue = Number.parseInt(e.key);
this.boosts[0].quality = keyValue > 0 ? keyValue * 10 : 100;
break;
case 'arrowleft':
return this.accept();
case 'arrowright':
return this.openReasonsModal();
case 'e':
//mark as nsfw and reject
this.eTag(this.boosts[0]);
break;
case 'n':
//mark as nsfw and accept
this.accept(this.boosts[0], true);
......@@ -221,9 +199,6 @@ export class AdminBoosts {
case 'a':
this.accept();
break;
case 'r':
this.openReasonsModal();
break;
}
}
......
src/app/foundation/buttons.scss
View file @ 7d74b971
......@@ -17,12 +17,36 @@
appearance: none;
text-decoration: none;
> * {
vertical-align: middle;
margin-right: 0.35em; // A space
&:last-child {
margin-right: initial;
}
}
i.material-icons {
line-height: 1em;
font-size: 20px;
height: auto;
color: inherit;
opacity: 0.4;
}
@include m-theme() {
background: themed($m-blue);
color: themed($m-white-always);
border-color: themed($m-blue);
}
&.mf-button--smaller {
font-size: 15px;
line-height: 21px;
padding: 10px 20px;
border-radius: 3px;
}
&.mf-button--alt {
@include m-theme() {
background: themed($m-aqua);
......@@ -55,12 +79,20 @@
&.mf-button--hollow {
@include m-theme() {
background: themed($m-white);
background: transparent; // Within theme because of cascading
color: themed($m-black);
border-color: themed($m-blue);
}
}
&.mf-button--hollow-mono {
@include m-theme() {
background: transparent; // Within theme because of cascading
color: themed($m-black);
border-color: themed($m-grey-200);
}
}
&[disabled] {
cursor: default;
opacity: 0.6;
......
src/app/interfaces/entities.ts
View file @ 7d74b971
......@@ -85,7 +85,6 @@ export interface MindsUser {
pro_published?: boolean;
pro_settings?: {
logo_image: string;
logo_guid: string;
tag_list?: Tag[];
background_image: string;
title: string;
......@@ -97,6 +96,9 @@ export interface MindsUser {
featured_content?: Array<string>;
tile_ratio?: string;
styles?: { [key: string]: string };
domain: string;
has_custom_logo?: boolean;
has_custom_background?: boolean;
};
mode: ChannelMode;
}
......
src/app/modules/analytics/analytics.module.ts
View file @ 7d74b971
......@@ -51,7 +51,6 @@ import { PageviewsCardComponent } from './components/cards/pageviews/pageviews.c
import { PageviewsChartComponent } from './components/charts/pageviews/pageviews.component';
import { AnalyticsDashboardComponent } from './v2/dashboard.component';
import { AnalyticsLayoutChartComponent } from './v2/layouts/layout-chart/layout-chart.component';
import { AnalyticsLayoutTableComponent } from './v2/layouts/layout-table/layout-table.component';
import { AnalyticsLayoutSummaryComponent } from './v2/layouts/layout-summary/layout-summary.component';
import { AnalyticsMetricsComponent } from './v2/components/metrics/metrics.component';
import { AnalyticsFiltersComponent } from './v2/components/filters/filters.component';
......@@ -63,7 +62,6 @@ import { SearchModule } from '../search/search.module';
import { AnalyticsSearchComponent } from './v2/components/search/search.component';
import { FormsModule } from '@angular/forms';
import { AnalyticsSearchSuggestionsComponent } from './v2/components/search-suggestions/search-suggestions.component';
import { AnalyticsMenuComponent } from './v2/components/menu/menu.component';
PlotlyModule.plotlyjs = PlotlyJS;
......@@ -163,7 +161,6 @@ const routes: Routes = [
Graph,
AnalyticsDashboardComponent,
AnalyticsLayoutChartComponent,
AnalyticsLayoutTableComponent,
AnalyticsLayoutSummaryComponent,
AnalyticsMetricsComponent,
AnalyticsFiltersComponent,
......@@ -172,7 +169,6 @@ const routes: Routes = [
AnalyticsTableComponent,
AnalyticsSearchComponent,
AnalyticsSearchSuggestionsComponent,
AnalyticsMenuComponent,
],
providers: [AnalyticsDashboardService],
})
......
src/app/modules/analytics/v2/categories.default.ts deleted 100644 → 0
View file @ e169b919
const categories: Array<any> = [
// {
// id: 'summary',
// label: 'Summary',
// permissions: ['admin', 'user'],
// metrics: [],
// },
{
id: 'traffic',
label: 'Traffic',
permissions: ['admin', 'user'],
metrics: [
'active_users',
'signups',
'unique_visitors',
'pageviews',
'impressions',
'retention',
],
},
{
id: 'earnings',
label: 'Earnings',
permissions: ['admin', 'user'],
metrics: ['total', 'pageviews', 'active_referrals', 'customers'],
},
// {
// id: 'engagement',
// label: 'Engagement',
// permissions: ['admin', 'user'],
// metrics: ['posts', 'votes', 'comments', 'reminds', 'subscribers', 'tags'],
// },
{
id: 'trending',
label: 'Trending',
permissions: ['admin', 'user'],
metrics: ['top_content', 'top_channels'],
},
// {
// id: 'referrers',
// label: 'Referrers',
// permissions: ['admin', 'user'],
// metrics: ['top_referrers'],
// },
// {
// id: 'plus',
// label: 'Plus',
// permissions: ['admin'],
// metrics: ['transactions', 'users', 'revenue_usd', 'revenue_tokens'],
// },
// {
// id: 'pro',
// label: 'Pro',
// permissions: ['admin'],
// metrics: ['transactions', 'users', 'revenue_usd', 'revenue_tokens'],
// },
// {
// id: 'boost',
// label: 'Boost',
// permissions: ['admin'],
// metrics: ['transactions', 'users', 'revenue_tokens'],
// },
// {
// id: 'nodes',
// label: 'Nodes',
// permissions: ['admin'],
// metrics: ['transactions', 'users', 'revenue_usd', 'revenue_tokens'],
// },
];
export default categories;
src/app/modules/analytics/v2/chart-palette.default.ts
View file @ 7d74b971
const chartPalette: Array<any> = [
{
id: 'm-white',
themeMap: ['#fff', '#161616'],
},
{
id: 'm-transparent',
themeMap: ['rgba(0,0,0,0)', 'rgba(0,0,0,0)'],
},
{
id: 'm-grey-50',
themeMap: ['rgba(232,232,232,1)', 'rgba(53,53,53,1)'],
},
{
id: 'm-grey-70',
themeMap: ['#eee', '#333'],
},
{
id: 'm-grey-130',
themeMap: ['#ccc', '#555'],
},
{
id: 'm-grey-160',
themeMap: ['#bbb', '#555'],
},
{
id: 'm-grey-300',
themeMap: ['#999', '#666'],
},
{
id: 'm-blue',
themeMap: ['#4690df', '#44aaff'],
},
{
id: 'm-red-dark',
themeMap: ['#c62828', '#e57373'],
},
{
id: 'm-amber-dark',
themeMap: ['#ffa000', '#ffecb3'],
},
{
id: 'm-green-dark',
themeMap: ['#388e3c', '#8bc34a'],
},
{
id: 'm-blue-grey-500',
themeMap: ['#607d8b', '#607d8b'],
},
];
const chartPalette = {
segmentColorIds: [
// Colors for up to 6 segments
'm-blue',
'm-grey-160',
'm-amber-dark',
'm-green-dark',
'm-red-dark',
'm-blue-grey-500',
],
themeMaps: [
{
id: 'm-white',
themeMap: ['#fff', '#232323'],
},
{
id: 'm-grey-50',
themeMap: ['rgba(232,232,232,1)', 'rgba(47,47,47,1)'], // 222
},
{
id: 'm-grey-70',
themeMap: ['#eee', '#404040'], // 333 before 5% lighten
},
{
id: 'm-grey-130',
themeMap: ['#ccc', '#515151'], // 444
},
{
id: 'm-grey-160',
themeMap: ['#bbb', '#626262'], // 555
},
{
id: 'm-grey-300',
themeMap: ['#999', '#737373'], // 666
},
{
id: 'm-blue',
themeMap: ['#4690df', '#5db6ff'], // 44aaff
},
{
id: 'm-red-dark',
themeMap: ['#c62828', '#e98989'], // e57373
},
{
id: 'm-amber-dark',
themeMap: ['#ffa000', '#fff2cc'], // ffecb3
},
{
id: 'm-green-dark',
themeMap: ['#388e3c', '#97c95d'], // 8bc34a
},
{
id: 'm-blue-grey-500',
themeMap: ['#607d8b', '#6b8a99'], // 607d8b
},
],
};
export default chartPalette;
src/app/modules/analytics/v2/components/chart/chart.component.html
View file @ 7d74b971
<!-- TODO: Make this into a different component -->
<!-- <m-chart [buckets]="(vm$.thecurrentvisualisation" | async)></m-chart> -->
<!-- TODO: then all this becomes m-plotlyChart -->
<!-- <div *ngIf="vm$ | async as vm"> -->
<div>
<div #graphDiv id="graphDiv"></div>
<!-- <plotly-plot
<div
#chartContainer
class="m-analyticsChart__chartContainer"
[ngClass]="{ isTouchDevice: isTouchDevice }"
>
<plotly-plot
*ngIf="init"
#graphDiv
id="graphDiv"
[divId]="graphDiv"
[data]="data"
[layout]="layout"
[config]="config"
[useResizeHandler]="true"
[style]="{ position: 'relative' }"
[useResizeHandler]="true"
(hover)="onHover($event)"
(unhover)="onUnhover($event)"
(afterPlot)="afterPlot()"
(plotly_click)="onClick($event)"
>
</plotly-plot> -->
<!-- <div class="hoverInfo__row">
{{ hoverInfo.date | date: selectedTimespan.datePipe }}
</div> -->
</plotly-plot>
</div>
<div #hoverInfoDiv id="hoverInfoDiv" class="hoverInfoDiv">
<div class="hoverInfo__row">
{{ hoverInfo.date | utcDate | date: datePipe }}
</div>
<div [ngSwitch]="selectedMetric.unit" class="hoverInfo__row--primary">
<div #hoverInfoDiv id="hoverInfoDiv" class="m-analyticsChart__hoverInfoDiv">
<i *ngIf="isTouchDevice" class="material-icons" (click)="onUnhover($event)"
>close</i
>
<div class="m-analyticsChart__hoverInfo__row">
{{ hoverInfo.date | utcDate | date: datePipe }}
</div>
<div
[ngSwitch]="selectedMetric?.unit"
class="m-analyticsChart__hoverInfo__row--primary"
>
<ng-template ngSwitchCase="number">
{{ hoverInfo.value | number }} {{ selectedMetric.label | lowercase }}
</ng-template>
<ng-template ngSwitchCase="usd">
{{ hoverInfo.value | currency }} USD
</ng-template>
<ng-template ngSwitchDefault>
{{ hoverInfo.value | number: '1.1-3' }} {{ selectedMetric?.unit }}
</ng-template>
</div>
<div class="m-analyticsChart__hoverInfo__row" *ngIf="isComparison">
vs
<ng-container
[ngSwitch]="selectedMetric?.unit"
class="m-analyticsChart__hoverInfo__row"
>
<ng-template ngSwitchCase="number">
{{ hoverInfo.value | number }} {{ selectedMetric.label | lowercase }}
{{ hoverInfo.comparisonValue | number }}
</ng-template>
<ng-template ngSwitchCase="usd">
{{ hoverInfo.value | currency }} USD
{{ hoverInfo.comparisonValue | currency }}
</ng-template>
<ng-template ngSwitchDefault>
{{ hoverInfo.value | number: '1.1-3' }} {{ selectedMetric.unit }}
{{ hoverInfo.comparisonValue | number: '1.1-3' }}
</ng-template>
</div>
<div class="hoverInfo__row" *ngIf="isComparison">
vs
<ng-container [ngSwitch]="selectedMetric.unit" class="hoverInfo__row">
<ng-template ngSwitchCase="number">
{{ hoverInfo.comparisonValue | number }}
</ng-template>
<ng-template ngSwitchCase="usd">
{{ hoverInfo.comparisonValue | currency }} USD
</ng-template>
<ng-template ngSwitchDefault>
{{ hoverInfo.comparisonValue | number: '1.1-3' }}
{{ selectedMetric.unit }}
</ng-template>
</ng-container>
on {{ hoverInfo.comparisonDate | utcDate | date: datePipe }}
</div>
</ng-container>
on {{ hoverInfo.comparisonDate | utcDate | date: datePipe }}
</div>
</div>
src/app/modules/analytics/v2/components/chart/chart.component.scss
View file @ 7d74b971
m-analytics__chart {
display: block;
position: relative;
margin-left: 40px;
.js-plotly-plot,
.plot-container {
height: 44vh;
min-height: 44vh;
display: block;
}
}
#graphDiv {
display: block;
position: relative;
g,
g > * {
......@@ -24,7 +28,7 @@ m-analytics__chart {
}
}
.hoverInfoDiv {
.m-analyticsChart__hoverInfoDiv {
width: 160px;
padding: 12px;
position: absolute;
......@@ -37,20 +41,49 @@ m-analytics__chart {
@include m-theme() {
background-color: themed($m-white);
box-shadow: 0 0 4px rgba(themed($m-black), 0.3);
color: themed($m-grey-200);
color: themed($m-grey-300);
}
[class*='hoverInfo__row'] {
[class*='m-analyticsChart__hoverInfo__row'] {
padding-bottom: 4px;
font-weight: 300;
&:last-of-type {
padding-top: 2px;
}
}
.hoverInfo__row--primary {
.m-analyticsChart__hoverInfo__row--primary {
font-weight: 400;
font-size: 15px;
// font-weight: bold;
@include m-theme() {
color: themed($m-grey-600);
}
}
i {
display: none;
font-size: 15px;
position: absolute;
cursor: pointer;
top: 10px;
right: 10px;
transition: color 0.3s cubic-bezier(0.23, 1, 0.32, 1);
@include m-theme() {
color: themed($m-grey-300);
}
&:hover {
@include m-theme() {
color: themed($m-grey-500);
}
}
}
}
.isTouchDevice .m-analyticsChart__hoverInfoDiv i {
display: block;
}
@media screen and (max-width: $min-tablet) {
m-analytics__chart {
margin-left: 16px;
}
}
src/app/modules/analytics/v2/components/filters/filters.component.html
View file @ 7d74b971
<div class="filtersContainer">
<div class="m-analytics__filtersContainer">
<!-- <ng-container *ngFor="let filter of filters$ | async"> -->
<ng-container *ngFor="let filter of filters">
<m-analytics__filter
......
src/app/modules/analytics/v2/fake-data.ts
View file @ 7d74b971
This diff is collapsed.
src/app/modules/analytics/v2/layouts/layout-table/layout-table.component.html deleted 100644 → 0
View file @ e169b919
<p>
analytics__layout--table works!
</p>
src/app/modules/blockchain/marketing/blogs.component.html deleted 100644 → 0
View file @ e169b919
<div class="m-blockchain--marketing--blogs">
<m-blog--tile *ngFor="let blog of blogs" [entity]="blog"> </m-blog--tile>
</div>
src/app/modules/blockchain/marketing/marketing.common.scss 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/app/modules/blockchain/marketing/rewards.component.html 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/app/modules/blockchain/marketing/rewards.component.ts 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/app/modules/blockchain/marketing/token.component.html 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/app/modules/blockchain/marketing/token.component.scss 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/app/modules/blockchain/marketing/token.component.ts 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/app/modules/blogs/view/view.html
View file @ 7d74b971
This diff is collapsed.
src/app/modules/blogs/view/view.ts
View file @ 7d74b971
This diff is collapsed.
src/app/modules/boost/boost.module.ts
View file @ 7d74b971
This diff is collapsed.
src/app/modules/canary/page.component.ts
View file @ 7d74b971
This diff is collapsed.
src/app/modules/modals/modal.scss
View file @ 7d74b971
This diff is collapsed.
src/app/modules/modals/signup/signup.html
View file @ 7d74b971
This diff is collapsed.
src/app/modules/modals/signup/signup.ts
View file @ 7d74b971
This diff is collapsed.
src/app/modules/plus/marketing.component.ts
View file @ 7d74b971
This diff is collapsed.
src/app/modules/pro/marketing.component.ts
View file @ 7d74b971
This diff is collapsed.
src/app/modules/pro/pro.routes.ts
View file @ 7d74b971
This diff is collapsed.
src/app/modules/pro/pro.service.ts
View file @ 7d74b971
This diff is collapsed.
src/app/modules/upgrades/upgrades.module.ts
View file @ 7d74b971
This diff is collapsed.
src/app/modules/wire/marketing.component.html deleted 100644 → 0
View file @ e169b919
This diff is collapsed.
src/app/modules/wire/marketing.component.scss deleted 100644 → 0
View file @ e169b919
This diff is collapsed.
src/app/modules/wire/marketing/marketing.component.html 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/app/modules/wire/wire.module.ts
View file @ 7d74b971
This diff is collapsed.
src/app/services/attachment.ts
View file @ 7d74b971
This diff is collapsed.
src/app/services/features.service.ts
View file @ 7d74b971
This diff is collapsed.
src/app/services/list-options.ts
View file @ 7d74b971
This diff is collapsed.
src/app/utils/mock.ts
View file @ 7d74b971
This diff is collapsed.
src/assets/marketing/deco_3.svg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/marketing/deco_4.svg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/marketing/npr.png 0 → 100755
View file @ 7d74b971
This diff is collapsed.
src/assets/marketing/wsj.png 0 → 100755
View file @ 7d74b971
This diff is collapsed.
src/assets/photos/network.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/.gitattributes 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/boost/boost-1.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/boost/boost-2-ux.png 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/boost/boost-2.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/boost/boost-3-ux.png 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/boost/boost-3.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/boost/boost-4-ux.png 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/boost/boost-4.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/nodes/nodes-1.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/nodes/nodes-2.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/nodes/nodes-3-ux.png 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/nodes/nodes-3.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/nodes/nodes-4-ux.png 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/nodes/nodes-4.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/pay/pay-1.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/pay/pay-2-ux.png 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/pay/pay-2.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/pay/pay-3-ux.png 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/pay/pay-3.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/pay/pay-4-ux.png 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/pay/pay-4.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/plus/plus-1.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/plus/plus-2-ux.png 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/plus/plus-2.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/plus/plus-3-ux.png 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/plus/plus-3.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/plus/plus-4-ux.png 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/plus/plus-4.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/pro/pro-1.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/pro/pro-2-ux.png 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/pro/pro-2.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/pro/pro-3-ux.png 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/pro/pro-3.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/pro/pro-4.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/pro/pro-5-ux.png 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/pro/pro-5.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/rewards/rewards-1.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/rewards/rewards-2-ux.png 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/rewards/rewards-2.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/rewards/rewards-3-ux.png 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/rewards/rewards-3.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/rewards/rewards-4-ux.png 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/rewards/rewards-4.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/token/token-1.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/token/token-2-ux.png 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/token/token-2.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/token/token-3-ux.png 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/token/token-3.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/token/token-4-ux.png 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/assets/product-pages/token/token-4.jpg 0 → 100644
View file @ 7d74b971
This diff is collapsed.
src/index.php
View file @ 7d74b971
This diff is collapsed.
src/typings/minds.d.ts
View file @ 7d74b971
This diff is collapsed.