diff --git a/src/app/components/stream/user-profile/user-profile.component.html b/src/app/components/stream/user-profile/user-profile.component.html index 034814cd..bf6a095d 100644 --- a/src/app/components/stream/user-profile/user-profile.component.html +++ b/src/app/components/stream/user-profile/user-profile.component.html @@ -33,10 +33,21 @@
+
+
+
+
+
+
+ {{ field.name }} +
+
+
+
diff --git a/src/app/components/stream/user-profile/user-profile.component.scss b/src/app/components/stream/user-profile/user-profile.component.scss index aa634090..979997d2 100644 --- a/src/app/components/stream/user-profile/user-profile.component.scss +++ b/src/app/components/stream/user-profile/user-profile.component.scss @@ -1,27 +1,25 @@ @import "variables"; @import "mixins"; @import "commons"; - +$validated-font-color: #4fde23; +$validated-background: #164109; $header-height: 160px; - .profile { // overflow: auto; height: calc(100%); overflow: auto; - &-header { background-size: cover; position: relative; // height: 140px; overflow: hidden; // background-color: black; border-bottom: 1px solid black; - & h2 { font-size: $default-font-size; } &__inner { overflow: auto; height: $header-height; - background-color: rgba(0, 0, 0, .45); + background-color: rgba(0, 0, 0, .45); } &__avatar { position: absolute; @@ -34,19 +32,19 @@ $header-height: 160px; position: absolute; top: 105px; left: 15px; - width: calc(100% - 30px); - overflow: hidden; + width: calc(100% - 30px); + overflow: hidden; color: white; } &__fullhandle a { position: absolute; top: 130px; left: 15px; - width: calc(100% - 30px); - overflow: hidden; + width: calc(100% - 30px); + overflow: hidden; color: white; } - &__follow{ + &__follow { // transition: all .4s; position: absolute; top: 10px; @@ -55,15 +53,10 @@ $header-height: 160px; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; - - &--button{ + &--button { @include clearButton; } - - &--unfollowed { - - } - + &--unfollowed {} &--followed { color: #38abff; color: #5fbcff; @@ -75,38 +68,95 @@ $header-height: 160px; top: 50px; right: 15px; font-size: 12px; - - &--data{ - text-align: right; + &--data { + text-align: right; } } - } - &-sub-header { // overflow: auto; // height: calc(100% - #{$header-height}); - // height: calc(100%); // height: calc(20% - 190px); // height: 150px; // border: 1px solid greenyellow; } - &-description { padding: 10px 10px 15px 10px; font-size: 13px; border-bottom: 1px solid black; - &__content { width: calc(100%); word-break: break-word; } } - + &-fields { + font-size: 13px; + border-bottom: 1px solid black; + &__field { + &:not(:last-child) { + border-bottom: 1px solid black; + } + &--name { + padding: 10px; + border-right: 1px solid black; + text-align: center; + width: calc(33%); + background-color: #0b0d13; + white-space: nowrap; + overflow: hidden; + } + &--value { + padding: 10px; + width: calc(66%); + float: right; + white-space: nowrap; + } + &--validated { + background-color: $validated-background; + // border: 1px solid $validated-font-color; + } + } + @include clearfix; + } &-no-toots { text-align: center; margin: 15px; border: 2px solid whitesmoke; } +} + +//Mastodon styling +:host ::ng-deep .profile-fields__field--value { + // font-size: 14px; + color: $status-primary-color; + & a, + .mention, + .ellipsis { + color: $status-links-color; + } + & .invisible { + display: none; + } + & p { + margin: 0px; //font-size: .9em; + // font-size: 14px; + } +} + +:host ::ng-deep .profile-fields__field--validated { + // font-size: 14px; + color: $validated-font-color; + & a, + .mention, + .ellipsis { + color: $validated-font-color; + } + & .invisible { + display: none; + } + & p { + margin: 0px; //font-size: .9em; + // font-size: 14px; + } } \ No newline at end of file diff --git a/src/app/components/stream/user-profile/user-profile.component.ts b/src/app/components/stream/user-profile/user-profile.component.ts index ecd30c43..b47536f1 100644 --- a/src/app/components/stream/user-profile/user-profile.component.ts +++ b/src/app/components/stream/user-profile/user-profile.component.ts @@ -62,7 +62,6 @@ export class UserProfileComponent implements OnInit { ngOnInit() { this.accountSub = this.accounts$.subscribe((accounts: AccountInfo[]) => { if (this.account) { - //this.relationship = null; this.currentlyUsedAccount = accounts.filter(x => x.isSelected)[0]; this.toolsService.findAccount(this.currentlyUsedAccount, this.lastAccountName) @@ -91,6 +90,9 @@ export class UserProfileComponent implements OnInit { return this.toolsService.findAccount(this.currentlyUsedAccount, this.lastAccountName) .then((account: Account) => { + + console.warn(account); + this.isLoading = false; this.statusLoading = true; diff --git a/src/app/services/models/mastodon.interfaces.ts b/src/app/services/models/mastodon.interfaces.ts index 3e184b04..8b44bcfc 100644 --- a/src/app/services/models/mastodon.interfaces.ts +++ b/src/app/services/models/mastodon.interfaces.ts @@ -1,136 +1,153 @@ export interface AppData { - client_id: string; - client_secret: string; - id: string; - name: string; - redirect_uri: string; - website: string; + client_id: string; + client_secret: string; + id: string; + name: string; + redirect_uri: string; + website: string; } export interface TokenData { - access_token: string; - token_type: string; - scope: string; - created_at: string; + access_token: string; + token_type: string; + scope: string; + created_at: string; } export interface Account { - id: number; - username: string; - acct: string; - display_name: string; - locked: string; - created_at: string; - followers_count: number; - following_count: number; - statuses_count: number; - note: string; - url: string; - avatar: string; - avatar_static: string; - header: string; - header_static: string; + id: number; + username: string; + acct: string; + display_name: string; + locked: string; + created_at: string; + followers_count: number; + following_count: number; + statuses_count: number; + note: string; + url: string; + avatar: string; + avatar_static: string; + header: string; + header_static: string; + emojis: Emoji[]; + moved: boolean; + fields: Field[]; + bot: boolean; +} + +export interface Emoji { + shortcode: string; + static_url: string; + url: string; + visible_in_picker: boolean; +} + +export interface Field { + name: string; + value: string; + verified_at: string; } export interface Application { - name: string; - website: string; + name: string; + website: string; } export interface Attachment { - id: string; - type: 'image' | 'video' | 'gifv'; - url: string; - remote_url: string; - preview_url: string; - text_url: string; + id: string; + type: 'image' | 'video' | 'gifv'; + url: string; + remote_url: string; + preview_url: string; + text_url: string; } export interface Card { - url: string; - title: string; - description: string; - image: string; + url: string; + title: string; + description: string; + image: string; } export interface Context { - ancestors: Status[]; - descendants: Status[]; + ancestors: Status[]; + descendants: Status[]; } export interface Error { - error: string; + error: string; } export interface Instance { - uri: string; - title: string; - description: string; - email: string; + uri: string; + title: string; + description: string; + email: string; } export interface Mention { - url: string; - username: string; - acct: string; - id: string; + url: string; + username: string; + acct: string; + id: string; } export interface Notification { - id: string; - type: 'mention' | 'reblog' | 'favourite' | 'follow'; - created_at: string; - account: Account; - status?: Status; + id: string; + type: 'mention' | 'reblog' | 'favourite' | 'follow'; + created_at: string; + account: Account; + status?: Status; } export interface Relationship { - id: number; - following: boolean; - followed_by: boolean; - blocking: boolean; - muting: boolean; - requested: boolean; + id: number; + following: boolean; + followed_by: boolean; + blocking: boolean; + muting: boolean; + requested: boolean; } export interface Report { - id: string; - action_taken: boolean; + id: string; + action_taken: boolean; } export interface Results { - accounts: Account[]; - statuses: Status[]; - hashtags: string[]; + accounts: Account[]; + statuses: Status[]; + hashtags: string[]; } export interface Status { - id: string; - uri: string; - url: string; - account: Account; - in_reply_to_id: string; - in_reply_to_account_id: string; - reblog: Status; - content: string; - created_at: string; - reblogs_count: string; - favourites_count: string; - reblogged: boolean; - favourited: boolean; - sensitive: boolean; - spoiler_text: string; - visibility: string; - media_attachments: Attachment[]; - mentions: Mention[]; - tags: Tag[]; - application: Application; - emojis: any[]; - language: string; - pinned: boolean; + id: string; + uri: string; + url: string; + account: Account; + in_reply_to_id: string; + in_reply_to_account_id: string; + reblog: Status; + content: string; + created_at: string; + reblogs_count: string; + favourites_count: string; + reblogged: boolean; + favourited: boolean; + sensitive: boolean; + spoiler_text: string; + visibility: string; + media_attachments: Attachment[]; + mentions: Mention[]; + tags: Tag[]; + application: Application; + emojis: any[]; + language: string; + pinned: boolean; } export interface Tag { - name: string; - url: string; + name: string; + url: string; }