From 7f34cca13a7162c31476403c40f3d65baf04d8ae Mon Sep 17 00:00:00 2001 From: Aaryan-kapur <44099242+Aaryan-kapur@users.noreply.github.com> Date: Tue, 17 Dec 2019 23:52:48 +0530 Subject: [PATCH] fix-search-overflow --- .../contact-form/contact-form.component.html | 131 ++++++++++++--- .../contact-form/contact-form.component.ts | 49 ++++-- src/app/feed/info-box/info-box.component.html | 157 +++++++++++++----- src/app/feed/info-box/info-box.component.scss | 143 ++++++++-------- .../feed/info-box/info-box.component.spec.ts | 22 +-- src/app/feed/info-box/info-box.component.ts | 67 ++++---- .../user-info-box.component.html | 96 ++++++++--- .../user-info-box.component.scss | 21 +-- .../user-info-box.component.spec.ts | 36 ++-- .../user-info-box/user-info-box.component.ts | 18 +- .../service-box/service-box.component.scss | 2 +- src/app/settings/settings.component.scss | 9 +- 12 files changed, 496 insertions(+), 255 deletions(-) diff --git a/src/app/contact/contact-form/contact-form.component.html b/src/app/contact/contact-form/contact-form.component.html index 755531840..755996abf 100644 --- a/src/app/contact/contact-form/contact-form.component.html +++ b/src/app/contact/contact-form/contact-form.component.html @@ -1,47 +1,128 @@
-
+
Contact Form -
+
- -
- Name is required -
+ +
+ + Name is required + +
- -
- Valid Email is required -
+ +
+ + Valid Email is required + +
- - - - -
- Valid Mobile Number is required. -
+ + - + + +
+ + Valid Mobile Number is required. + +
- -
- Describe more with Minimum 100 characters. -
+ +
+ + Describe more with Minimum 100 characters. + +
*All fields are mandatory - - Your Form has been submitted + + Your Form has been submitted
diff --git a/src/app/contact/contact-form/contact-form.component.ts b/src/app/contact/contact-form/contact-form.component.ts index 6fd8d875f..6d8943727 100644 --- a/src/app/contact/contact-form/contact-form.component.ts +++ b/src/app/contact/contact-form/contact-form.component.ts @@ -1,8 +1,12 @@ import { Component, OnInit, Output, EventEmitter } from '@angular/core'; -import { FormGroup, FormControl, FormBuilder, Validators } from '@angular/forms'; +import { + FormGroup, + FormControl, + FormBuilder, + Validators +} from '@angular/forms'; import { HttpClient, HttpHeaders } from '@angular/common/http'; import { countrycodearray } from '../../shared/countrycode/countrycode'; - @Component({ selector: 'contact-form', templateUrl: './contact-form.component.html', @@ -15,40 +19,53 @@ export class ContactFormComponent implements OnInit { public countries = countrycodearray; @Output() hideContactForm: EventEmitter = new EventEmitter(); - constructor( private http: HttpClient ) { } + constructor(private http: HttpClient) {} ngOnInit() { this.contactForm = new FormGroup({ name: new FormControl('', [Validators.required]), - email: new FormControl('', [Validators.required, Validators.email]), + email: new FormControl('', [ + Validators.required, + Validators.email + ]), countrycode: new FormControl('', [Validators.required]), - telephone: new FormControl('', [Validators.required, Validators.minLength(10), Validators.pattern('^[0-9]*$')]), - message: new FormControl('', [Validators.required, Validators.minLength(100)]) - }); + telephone: new FormControl('', [ + Validators.required, + Validators.minLength(10), + Validators.pattern('^[0-9]*$') + ]), + message: new FormControl('', [ + Validators.required, + Validators.minLength(100) + ]) + }); } - public sendtosuperuser(user) { this.hideContactForm.emit(false); const headers = new HttpHeaders(); - const formObj = user.getRawValue(); + const formObj = this.contactForm.value; const data = JSON.stringify(formObj); - + console.log(this.contactForm.value); headers.append('Content-Type', 'application/X-www-form-urlencoded'); headers.append('Accept', 'application/json'); - this.http.post('https://formspree.io/office@fossasia.org', data, { headers: headers }) - .subscribe((response) => { - this.http.post('https://formspree.io/office@fossasia.org', data, { headers: headers }) - .subscribe((responsesent) => { + this.http + .post('https://formspree.io/office@fossasia.org', data, { + headers: headers + }) + .subscribe(response => { + this.http + .post('https://formspree.io/office@fossasia.org', data, { + headers: headers + }) + .subscribe(responsesent => { console.log('Sent successfully'); }); }); } - public showSubmit() { this.submitted = true; } - } diff --git a/src/app/feed/info-box/info-box.component.html b/src/app/feed/info-box/info-box.component.html index b7f395af7..29375feb1 100644 --- a/src/app/feed/info-box/info-box.component.html +++ b/src/app/feed/info-box/info-box.component.html @@ -1,34 +1,62 @@ -
+
-
+

Top Twitterers

- {{item[1][0]}} - {{item[1][0].length}} + {{ item[1][0] }} + {{ + item[1][0].length + }} - @{{item[1][0]}} + @{{ item[1][0] }}
-
+

Top Hashtags

- + @@ -36,17 +64,31 @@

Top Hashtags

-
+

Top Mentions

-
{{item[1]}}
+
{{ item[1] }}
 - #{{item[0]}} + #{{ item[0] }}
@@ -54,33 +96,70 @@

Top Mentions

- - +
- Bug Report or Feature Request - Developed by FOSSASIA - Contributors - Web Apps - loklak Android Wok - Like on Facebook - Follow on Twitter + Bug Report or Feature Request + Developed by FOSSASIA + Contributors + Web Apps + loklak Android Wok + Like on Facebook + Follow on Twitter
- - - RSS -   - - - JSON - + + + RSS   + + + JSON + -
  + +  diff --git a/src/app/feed/info-box/info-box.component.scss b/src/app/feed/info-box/info-box.component.scss index e671f4ea3..3422183e4 100644 --- a/src/app/feed/info-box/info-box.component.scss +++ b/src/app/feed/info-box/info-box.component.scss @@ -3,12 +3,14 @@ } .info-box { - -webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.16), 0 0 0 1px rgba(0,0,0,0.08); - box-shadow: 0 2px 2px 0 rgba(0,0,0,0.16), 0 0 0 1px rgba(0,0,0,0.08); - border-radius: 2px; - min-height: 420px; - width: 100%; - margin-bottom: 20px; + -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), + 0 0 0 1px rgba(0, 0, 0, 0.08); + box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.08); + border-radius: 2px; + min-height: 420px; + width: 100%; + margin-bottom: 20px; + overflow: hidden; } .row:first-child { @@ -17,99 +19,100 @@ } .leaderboard-item { - text-align: left; - border-bottom: 2px solid #ccc; - padding: 4px 0; - font-size: 14px; - height: 40px; - img { - border-radius: 50%; - } - td { - position: relative; - padding-left: 10px; - padding-right: 0; - img { - height: 30px; - width: 30px; - } - } + text-align: left; + border-bottom: 2px solid #ccc; + padding: 4px 0; + font-size: 14px; + height: 40px; + img { + border-radius: 50%; + } + td { + position: relative; + padding-left: 10px; + padding-right: 0; + img { + height: 30px; + width: 30px; + } + } } .data { - display: inline-block; - text-decoration: none; - img { - height: 24px; - border-radius: 20%; - } - span { - padding: 5px; - vertical-align: super; - } + display: inline-block; + text-decoration: none; + img { + height: 24px; + border-radius: 20%; + } + span { + padding: 5px; + vertical-align: super; + } } .rss { - background-color: #F79128; - color: white; - height: 24px; - border-radius: 9%; + background-color: #f79128; + color: white; + height: 24px; + border-radius: 9%; } .json { - background-color: #5EBC62; - color: white; - height: 24px; - border-radius: 9%; + background-color: #5ebc62; + color: white; + height: 24px; + border-radius: 9%; } .leaderboard-count { - background-color: #337ab7; - height: 30px; - width: 30px; - padding: 8px 0; - text-align: center; - border-radius: 50%; - font-weight: bold; - font-size: 14px; - color: #fff; + background-color: #337ab7; + height: 30px; + width: 30px; + padding: 8px 0; + text-align: center; + border-radius: 50%; + font-weight: bold; + font-size: 14px; + color: #fff; } .leaderboard-label { - top: -8px; - font-size: 14px; - position: absolute; - left: 20px; - text-align: center; - line-height: 24px; - background-color: #337ab7; - border-radius: 50%; - color: #fff; - width: 23px; - height: 23px; + top: -8px; + font-size: 14px; + position: absolute; + left: 20px; + text-align: center; + line-height: 24px; + background-color: #337ab7; + border-radius: 50%; + color: #fff; + width: 23px; + height: 23px; } .leaderboard-text { - a { - font-size: 14px; - line-height: 21px; - } + a { + font-size: 14px; + line-height: 21px; + } } .link-sidebar-container { - -webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.16), 0 0 0 1px rgba(0,0,0,0.08); - box-shadow: 0 2px 2px 0 rgba(0,0,0,0.16), 0 0 0 1px rgba(0,0,0,0.08); + -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), + 0 0 0 1px rgba(0, 0, 0, 0.08); + box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.08); border-radius: 2px; width: 100%; - display:flex; + display: flex; flex-wrap: wrap; margin: 30px 0px; padding: 15px 10px; } .link-sidebar { - margin: 3px 7px; - padding: 0px 15px; + margin: 3px 7px; + padding: 0px 15px; } @media (max-width: 470px) { diff --git a/src/app/feed/info-box/info-box.component.spec.ts b/src/app/feed/info-box/info-box.component.spec.ts index 1f14791b5..9241fe86c 100644 --- a/src/app/feed/info-box/info-box.component.spec.ts +++ b/src/app/feed/info-box/info-box.component.spec.ts @@ -15,9 +15,7 @@ describe('Component: InfoBox', () => { ChartsModule, StoreModule.forRoot(fromRoot.reducers) ], - declarations: [ - InfoBoxComponent - ] + declarations: [InfoBoxComponent] }); }); @@ -42,21 +40,13 @@ describe('Component: InfoBox', () => { 'FOSSASIA', 'pslab' ], - screen_name: [ - 'hpdang' - ], + screen_name: ['hpdang'], user: { - profile_image_url_https: 'https://pbs.twimg.com/profile_images/1141238022/fossasia-cubelogo_400x400.jpg', + profile_image_url_https: + 'https://pbs.twimg.com/profile_images/1141238022/fossasia-cubelogo_400x400.jpg' }, - mentions: [ - 'fossasia', - 'mariobehling', - 'hpdang', - 'mariobehling' - ], - created_at: [ - new Date() - ] + mentions: ['fossasia', 'mariobehling', 'hpdang', 'mariobehling'], + created_at: [new Date()] } ]; component.ngOnChanges(); diff --git a/src/app/feed/info-box/info-box.component.ts b/src/app/feed/info-box/info-box.component.ts index cbd4b3047..74b2dfb0e 100644 --- a/src/app/feed/info-box/info-box.component.ts +++ b/src/app/feed/info-box/info-box.component.ts @@ -38,18 +38,24 @@ export class InfoBoxComponent implements OnChanges { public configUrl = defaultUrlConfig; - constructor( private store: Store ) {} + constructor(private store: Store) {} ngOnChanges() { - this.store.select(fromRoot.getQuery).subscribe(query => this.stringQuery = query.displayString); + this.store + .select(fromRoot.getQuery) + .subscribe(query => (this.stringQuery = query.displayString)); this.parseApiResponseData(); - if ( hashtagRegExp.exec(this.stringQuery) !== null ) { + if (hashtagRegExp.exec(this.stringQuery) !== null) { // Check for hashtag this.stringQuery - this.queryString = '%23' + hashtagRegExp.exec(this.stringQuery)[1] + '' + hashtagRegExp.exec(this.stringQuery)[0]; - } else if ( fromRegExp.exec(this.stringQuery) !== null ) { + this.queryString = + '%23' + + hashtagRegExp.exec(this.stringQuery)[1] + + '' + + hashtagRegExp.exec(this.stringQuery)[0]; + } else if (fromRegExp.exec(this.stringQuery) !== null) { // Check for from user this.stringQuery this.queryString = 'from%3A' + fromRegExp.exec(this.stringQuery)[1]; - } else if ( mentionRegExp.exec(this.stringQuery) !== null ) { + } else if (mentionRegExp.exec(this.stringQuery) !== null) { // Check for mention this.stringQuery this.queryString = '%40' + mentionRegExp.exec(this.stringQuery)[1]; } else { @@ -64,7 +70,10 @@ export class InfoBoxComponent implements OnChanges { for (const s in statistics) { if (s) { for (let i = 0; i < statistics[s].length; i++) { - if ( this.stringQuery.substring(1).toLowerCase() !== statistics[s][i].toLowerCase() ) { + if ( + this.stringQuery.substring(1).toLowerCase() !== + statistics[s][i].toLowerCase() + ) { stored.push(statistics[s][i]); } } @@ -73,7 +82,6 @@ export class InfoBoxComponent implements OnChanges { this.topHashtags = this.parseRawDataWithFrequency(stored); this.areTopHashtagsAvailable = this.topHashtags.length > 0; return this.topHashtags; - } else if (typeof statistics === 'undefined') { this.topHashtags = []; this.areTopHashtagsAvailable = false; @@ -86,17 +94,17 @@ export class InfoBoxComponent implements OnChanges { for (let i = 0; i < statistics.length; i++) { let check = true; for (let j = 0; j < temp.length; j++) { - if ( statistics[i][0] === temp[j][0] ) { + if (statistics[i][0] === temp[j][0]) { check = false; } } - if ( check ) { + if (check) { temp.push(statistics[i]); } } statistics = temp; - for ( let i = 0; i < statistics.length - 1; i++ ) { - for ( let j = i + 1; j < statistics.length; j++ ) { + for (let i = 0; i < statistics.length - 1; i++) { + for (let j = i + 1; j < statistics.length; j++) { if (statistics[i][0] === statistics[j][0]) { if (i !== j) { statistics.splice(j, 1); @@ -110,10 +118,10 @@ export class InfoBoxComponent implements OnChanges { sortable.push([s, statistics[s]]); } } - sortable.sort(function (a, b) { + sortable.sort(function(a, b) { return b[1] - a[1]; }); - sortable = (sortable.slice(0, 10)); + sortable = sortable.slice(0, 10); this.topTwitterers = sortable; this.areTopTwitterersAvailable = true; return this.topTwitterers; @@ -122,7 +130,6 @@ export class InfoBoxComponent implements OnChanges { this.topTwitterers = []; return this.topTwitterers; } - } sortMentions(statistics) { const stored = []; @@ -130,7 +137,10 @@ export class InfoBoxComponent implements OnChanges { for (const s in statistics) { if (s) { for (let i = 0; i < statistics[s][0].length; i++) { - if ( this.stringQuery.substring(1).toLowerCase() !== statistics[s][0][i].toLowerCase() ) { + if ( + this.stringQuery.substring(1).toLowerCase() !== + statistics[s][0][i].toLowerCase() + ) { stored.push(statistics[s][0][i]); } } @@ -148,20 +158,20 @@ export class InfoBoxComponent implements OnChanges { public parseRawDataWithFrequency(stored) { let topFrequencyData = []; - stored = stored.reduce(function (acc, curr) { + stored = stored.reduce(function(acc, curr) { if (typeof acc[curr] === 'undefined') { - acc[curr] = 1; + acc[curr] = 1; } else { acc[curr] += 1; } return acc; }, []); topFrequencyData = Object.keys(stored) - .map(key => key.trim()) - .filter(key => key !== '') - .map(key => ([key, stored[key]])) - .sort((a, b) => b[1] - a[1]) - .slice(0, 10); + .map(key => key.trim()) + .filter(key => key !== '') + .map(key => [key, stored[key]]) + .sort((a, b) => b[1] - a[1]) + .slice(0, 10); return topFrequencyData; } @@ -182,7 +192,7 @@ export class InfoBoxComponent implements OnChanges { const screenStrings = []; const mentionStrings = []; const createdStrings = []; - for ( let i = 0; i < this.ApiResponseResult.length; i++) { + for (let i = 0; i < this.ApiResponseResult.length; i++) { if (this.ApiResponseResult[i]['hashtags'].length !== 0) { tagStrings.push(this.ApiResponseResult[i]['hashtags']); } @@ -193,9 +203,7 @@ export class InfoBoxComponent implements OnChanges { ]); } if (this.ApiResponseResult[i]['mentions'].length !== 0) { - mentionStrings.push([ - this.ApiResponseResult[i]['mentions'] - ]); + mentionStrings.push([this.ApiResponseResult[i]['mentions']]); } if (this.ApiResponseResult[i]['created_at'].length !== 0) { createdStrings.push(this.ApiResponseResult[i]['created_at']); @@ -208,12 +216,13 @@ export class InfoBoxComponent implements OnChanges { } getChartData(statistics) { - for (let i = 0; i < statistics.length; i++) { statistics[i] = JSON.stringify(statistics[i]).substring(1, 11); } const count = {}; - statistics.forEach(function(i) { count[i] = (count[i] || 0) + 1; }); + statistics.forEach(function(i) { + count[i] = (count[i] || 0) + 1; + }); if (statistics !== undefined && statistics.length !== 0) { const data = []; const labels = []; diff --git a/src/app/feed/user-info-box/user-info-box.component.html b/src/app/feed/user-info-box/user-info-box.component.html index 41ee00879..a836a2ba0 100644 --- a/src/app/feed/user-info-box/user-info-box.component.html +++ b/src/app/feed/user-info-box/user-info-box.component.html @@ -1,14 +1,21 @@
-
+
-
+
- +
- +
@@ -19,33 +26,50 @@

{{ apiResponseUser.name }}

+ [useAll]="true" + >
  • Tweets:  - {{ apiResponseUser.statuses_count }} + {{ + apiResponseUser.statuses_count + }}
  • Following:  - {{ apiResponseUser.friends_count }} + {{ + apiResponseUser.friends_count + }}
  • Followers:  - {{ apiResponseUser.followers_count }} + {{ + apiResponseUser.followers_count + }}
  • Likes:  - {{ apiResponseUser.favourites_count }} + {{ + apiResponseUser.favourites_count + }}
  • Location:  - {{ apiResponseUser.location }} + {{ + apiResponseUser.location + }}
  • Website:  - {{ apiResponseUser.entities.url.urls[0].expanded_url }} + {{ apiResponseUser.entities.url.urls[0].expanded_url }}
@@ -53,20 +77,31 @@

{{ apiResponseUser.name }}

Followers

    -
  • - +
  • +
    - +
    {{ item.name }}
    -
    - @{{ item.screen_name }} -
    +
    @{{ item.screen_name }}
    - Followers: {{ item.followers_count }} + Followers: {{ item.followers_count }}
    @@ -76,20 +111,31 @@

    Followers

    Following

      -
    • - +
    • +
      - +
      {{ item.name }}
      -
      - @{{ item.screen_name }} -
      +
      @{{ item.screen_name }}
      - Followers: {{ item.followers_count }} + Followers: {{ item.followers_count }}
      diff --git a/src/app/feed/user-info-box/user-info-box.component.scss b/src/app/feed/user-info-box/user-info-box.component.scss index 03f1c867f..509df283f 100644 --- a/src/app/feed/user-info-box/user-info-box.component.scss +++ b/src/app/feed/user-info-box/user-info-box.component.scss @@ -3,12 +3,14 @@ } .info-box { - -webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.16), 0 0 0 1px rgba(0,0,0,0.08); - box-shadow: 0 2px 2px 0 rgba(0,0,0,0.16), 0 0 0 1px rgba(0,0,0,0.08); + -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), + 0 0 0 1px rgba(0, 0, 0, 0.08); + box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.08); border-radius: 2px; min-height: 420px; width: 100%; margin-bottom: 20px; + overflow: hidden; } .image-gallery { @@ -23,7 +25,7 @@ right: 0; bottom: 0; left: 0; - background-color: #1DA1F2; + background-color: #1da1f2; img { width: 100%; @@ -35,7 +37,7 @@ position: absolute; bottom: 0; left: 50px; - background: #FFFFFF; + background: #ffffff; height: 94px; width: 94px; img { @@ -52,7 +54,7 @@ .heading { width: 100%; padding: 15px; - border-bottom: 1px solid rgba(0,0,0,0.10); + border-bottom: 1px solid rgba(0, 0, 0, 0.1); h2 { margin: 0 0 10px 0; @@ -105,7 +107,6 @@ } .item-image { - display: flex; justify-content: center; @@ -142,16 +143,16 @@ margin: 0 auto; width: 24px; height: 24px; - border: 2px solid rgb(216,27,96); - border-top-color: rgba(216,97,96,0.2); + border: 2px solid rgb(216, 27, 96); + border-top-color: rgba(216, 97, 96, 0.2); animation: spin 1s infinite linear; } @keyframes spin { 0% { - transform: rotate(0deg); + transform: rotate(0deg); } 100% { - transform: rotate(360deg); + transform: rotate(360deg); } } diff --git a/src/app/feed/user-info-box/user-info-box.component.spec.ts b/src/app/feed/user-info-box/user-info-box.component.spec.ts index 97aa9717e..70cd28158 100644 --- a/src/app/feed/user-info-box/user-info-box.component.spec.ts +++ b/src/app/feed/user-info-box/user-info-box.component.spec.ts @@ -22,14 +22,8 @@ class FeedLinkerStubComponent { describe('Component: UserInfoBox', () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [ - RouterTestingModule, - StoreModule.forRoot(fromRoot.reducers) - ], - declarations: [ - UserInfoBoxComponent, - FeedLinkerStubComponent - ] + imports: [RouterTestingModule, StoreModule.forRoot(fromRoot.reducers)], + declarations: [UserInfoBoxComponent, FeedLinkerStubComponent] }); }); @@ -58,7 +52,7 @@ describe('Component: UserInfoBox', () => { username: 'user3', followers_count: 10, statuses_count: 5 - }, + } ]; component.apiResponseUserFollowers = [ @@ -79,12 +73,24 @@ describe('Component: UserInfoBox', () => { } ]; component.ngOnInit(); - expect(component.sortedApiResponseUserFollowing[0].username).toBeTruthy('user3'); - expect(component.sortedApiResponseUserFollowing[1].username).toBeTruthy('user1'); - expect(component.sortedApiResponseUserFollowing[2].username).toBeTruthy('user2'); + expect(component.sortedApiResponseUserFollowing[0].username).toBeTruthy( + 'user3' + ); + expect(component.sortedApiResponseUserFollowing[1].username).toBeTruthy( + 'user1' + ); + expect(component.sortedApiResponseUserFollowing[2].username).toBeTruthy( + 'user2' + ); - expect(component.sortedApiResponseUserFollowers[0].username).toBeTruthy('userF2'); - expect(component.sortedApiResponseUserFollowers[1].username).toBeTruthy('userF1'); - expect(component.sortedApiResponseUserFollowers[2].username).toBeTruthy('userF3'); + expect(component.sortedApiResponseUserFollowers[0].username).toBeTruthy( + 'userF2' + ); + expect(component.sortedApiResponseUserFollowers[1].username).toBeTruthy( + 'userF1' + ); + expect(component.sortedApiResponseUserFollowers[2].username).toBeTruthy( + 'userF3' + ); })); }); diff --git a/src/app/feed/user-info-box/user-info-box.component.ts b/src/app/feed/user-info-box/user-info-box.component.ts index c829b8395..faabdf535 100644 --- a/src/app/feed/user-info-box/user-info-box.component.ts +++ b/src/app/feed/user-info-box/user-info-box.component.ts @@ -16,16 +16,24 @@ export class UserInfoBoxComponent implements OnInit { public sortedApiResponseUserFollowing: Array; public sortedApiResponseUserFollowers: Array; - constructor() { } + constructor() {} ngOnInit() { - this.sortedApiResponseUserFollowing = immutableSort(this.apiResponseUserFollowing, this.compareUsers); - this.sortedApiResponseUserFollowers = immutableSort(this.apiResponseUserFollowers, this.compareUsers); + this.sortedApiResponseUserFollowing = immutableSort( + this.apiResponseUserFollowing, + this.compareUsers + ); + this.sortedApiResponseUserFollowers = immutableSort( + this.apiResponseUserFollowers, + this.compareUsers + ); } private compareUsers(user1: UserApiResponse, user2: UserApiResponse): number { - const follower_count_diff: number = user1.followers_count - user2.followers_count; - const statuses_count_diff: number = user1.statuses_count - user2.statuses_count; + const follower_count_diff: number = + user1.followers_count - user2.followers_count; + const statuses_count_diff: number = + user1.statuses_count - user2.statuses_count; if (follower_count_diff) { return follower_count_diff; diff --git a/src/app/service-box/service-box.component.scss b/src/app/service-box/service-box.component.scss index 79124a750..e378aa0a5 100644 --- a/src/app/service-box/service-box.component.scss +++ b/src/app/service-box/service-box.component.scss @@ -43,7 +43,7 @@ top: 44px; z-index: 1; background: white; - visibility: hidden; + // visibility: hidden; &.opened { visibility: visible; diff --git a/src/app/settings/settings.component.scss b/src/app/settings/settings.component.scss index 34fdfb7fb..872f74b9f 100644 --- a/src/app/settings/settings.component.scss +++ b/src/app/settings/settings.component.scss @@ -14,9 +14,10 @@ div.outer-wrapper { justify-content: space-around; align-items: center; width: 584px; - box-shadow: 0px 2px 5px 2px #D10046; + box-shadow: 2px 0px 2px 0px black; margin: 15px; - background-color: #f9f2f4; + background-color: white; + border-radius: 20px; @include --center-flex-vertical(); width: 584px; @@ -30,7 +31,7 @@ div.outer-wrapper { } h2 { text-align: center; - color: #d10042; + color: black; } h5 { text-align: center; @@ -41,7 +42,7 @@ div.outer-wrapper { text-align: center; } .news { - color: #d10042; + color:black; } } }
- {{item[0]}} - {{item[1]}} + {{ item[0] }} + {{ item[1] }} - @{{item[0]}} + @{{ item[0] }}