#330394 Add CSS class for icon images. Add it to photo-picker component and remove the css class from all other screens. Fix timestamp on group join requests resolution screen for resent requests.

2017-03-24 12:23:30 +02:00 · 2017-03-24 12:23:30 +02:00 · 41c3d63749
--- a/app/events/editable-event/editable-event.component.css
+++ b/app/events/editable-event/editable-event.component.css
@ -27,15 +27,6 @@ TextView {
  height: 200;
 }

-.user >>> .no-image,
-.user >>> Image {
-  width: 30;
-  height: 30;
-  margin-right: 5;
-  border-radius: 15;
-  background-color: rgba(0, 0, 0, .35);
-}
-
 .date .label,
 .group .label,
 .user .label {
--- a/app/events/editable-event/editable-event.component.ts
+++ b/app/events/editable-event/editable-event.component.ts
@ -40,6 +40,8 @@ export class EditableEventComponent implements OnInit {
        }
        this._markSelectedGroupIfPresent(this.event, this.userGroups);
        this._handleEventDatesIfPresent(this.event);
+        this._usersService.currentUser()
+            .then(u => this.currentUser = u);
    }

    onAddDateOption(date: Date) {
--- a/app/events/editable-event/editable-event.template.html
+++ b/app/events/editable-event/editable-event.template.html
@ -47,11 +47,6 @@
            </StackLayout>
        </StackLayout>

-        <StackLayout *ngIf="currentUser" class="input-field user">
-            <Label class="label" text="Organizer"></Label>
-            <user-display [users]="currentUser" [showNames]="true"></user-display>
-        </StackLayout>
-
        <StackLayout *ngIf="!event.RegistrationCompleted" class="input-field switch-field">
            <Label class="label" text="Visibility"></Label>
            <GridLayout columns="*, 65" class="switch-wrp border-bottom">
@ -59,5 +54,10 @@
                <Switch col="1" class="switch" [(ngModel)]="event.OpenForRegistration"></Switch>
            </GridLayout>
        </StackLayout>
+
+        <StackLayout *ngIf="currentUser" class="input-field user">
+            <Label class="label" text="Organizer"></Label>
+            <user-display [users]="currentUser" [showNames]="true"></user-display>
+        </StackLayout>
    </StackLayout>
 </StackLayout>
--- a/app/events/event-details/event-details.component.css
+++ b/app/events/event-details/event-details.component.css
@ -38,18 +38,6 @@
  margin-left: 0;
 }

-/* this is angular2 syntax :| */
-.registered-users-wrapper >>> Image,
-.organizer >>> Image,
-.registered-users-wrapper >>> .no-image,
-.organizer >>> .no-image {
-  width: 30;
-  height: 30;
-  margin-right: 5;
-  border-radius: 15;
-  background-color: rgba(0, 0, 0, .35);
-}
-
 .vote,
 .info-label,
 .votes-count,
--- a/app/groups/editable-group/editable-group.component.css
+++ b/app/groups/editable-group/editable-group.component.css
@ -27,15 +27,6 @@ TextView {
  height: 200;
 }

-.user >>> .no-image,
-.user >>> Image {
-  width: 30;
-  height: 30;
-  margin-right: 5;
-  border-radius: 15;
-  background-color: rgba(0, 0, 0, .35);
-}
-
 .user .label {
  margin-bottom: 5;
 }
--- a/app/groups/group-details/group-details.component.css
+++ b/app/groups/group-details/group-details.component.css
@ -57,15 +57,6 @@
  border-width: 0;
 }

-.members-wrapper >>> .no-image,
-.members-wrapper >>> Image {
-  width: 30;
-  height: 30;
-  margin-right: 5;
-  border-radius: 15;
-  background-color: rgba(0, 0, 0, .35);
-}
-
 .join-group {
  margin: 15;
 }
--- a/app/groups/group-join-requests/group-join-requests.template.html
+++ b/app/groups/group-join-requests/group-join-requests.template.html
@ -16,7 +16,7 @@
                <GridLayout columns="*, 75" *ngFor="let req of requests" class="item">
                    <StackLayout col="0" orientation="horizontal">
                        <user-display class="user-display" [users]="req.Applicant" [showNames]="true"></user-display>
-                        <Label class="time-since-creation" [text]="getTimeSinceCreation(req.CreatedAt)"></Label>
+                        <Label class="time-since-creation" [text]="getTimeSinceCreation(req.ModifiedAt)"></Label>
                    </StackLayout>
                    <StackLayout col="1" class="resolve" *ngIf="!req.Resolved" orientation="horizontal">
                        <StackLayout class=" btn-resolve no" (tap)="resolve(req, false)">
--- a/app/shared/event-list/event-list.component.css
+++ b/app/shared/event-list/event-list.component.css
@ -76,15 +76,6 @@
  vertical-align: middle;
 }

-.event-organiser >>> Image,
-.event-organiser >>> .no-image {
-  width: 30;
-  height: 30;
-  margin-right: 5;
-  border-radius: 15;
-  background-color: rgba(0, 0, 0, .35);
-}
-
 .event-organiser >>> .user-name,
 .user-name,
 .group {
--- a/app/shared/photo-picker/photo-picker.component.css
+++ b/app/shared/photo-picker/photo-picker.component.css
@ -49,3 +49,11 @@
 .container.large AbsoluteLayout .text {
  color: rgba(255, 255, 255, .5);
 }
+
+.user.no-image {
+  width: 30;
+  height: 30;
+  margin-right: 5;
+  border-radius: 15;
+  background-color: rgba(0, 0, 0, .35);
+}
--- a/app/shared/photo-picker/photo-picker.template.html
+++ b/app/shared/photo-picker/photo-picker.template.html
@ -1,9 +1,9 @@
 <StackLayout *ngIf="!resizedUrl">
-    <StackLayout class="no-image editable" *ngIf="editable" (tap)="onEdit()" [ngClass]="{ 'large': !isSmall }">
+    <StackLayout class="{{type}} no-image editable" *ngIf="editable" (tap)="onEdit()" [ngClass]="{ 'large': !isSmall }">
        <Label class="icon if" *ngIf="noImageIcon" [text]="noImageIcon"></Label>
        <Label class="text" *ngIf="noImageText || !isSmall" [text]="noImageText"></Label>
    </StackLayout>
-    <StackLayout class="no-image" *ngIf="!editable" [ngClass]="{ 'large': !isSmall }">
+    <StackLayout class="{{type}} no-image" *ngIf="!editable" [ngClass]="{ 'large': !isSmall }">
        <Label class="icon if" *ngIf="noImageIcon" [text]="noImageIcon"></Label>
        <Label class="text" *ngIf="noImageText || !isSmall" [text]="noImageText"></Label>
    </StackLayout>
--- a/app/shared/user-display/user-display.component.css
+++ b/app/shared/user-display/user-display.component.css
@ -1,12 +1,3 @@
-/* this is angular2 syntax :| */
-.list-wrapper >>> Image {
-  width: 30;
-  height: 30;
-  margin-right: 5;
-  border-radius: 15;
-  background-color: rgba(0, 0, 0, .35);
-}
-
 .user-image,
 .user-name {
  vertical-align: middle;
--- a/app/shared/user-display/user-display.component.ts
+++ b/app/shared/user-display/user-display.component.ts
@ -12,7 +12,7 @@ export class UserDisplayComponent implements OnInit {
    private _users: User[] = [];
    
    @Input('withImages') imgCount: number = null;
-    @Input() showNames: boolean = false;
+    @Input() showNames: boolean;

    @Input() set users(newValue: User[]) {
        this._users = [].concat(newValue);
@ -42,6 +42,6 @@ export class UserDisplayComponent implements OnInit {
    }

    shouldShowNames() {
-        return this.showNames || this.users.length === 1;
+        return this.showNames || (this.showNames !== false && this.users.length === 1);
    }
 }
--- a/app/shared/user-list/user-list.component.css
+++ b/app/shared/user-list/user-list.component.css
@ -11,12 +11,3 @@
  margin-left: 5;
  font-size: 12;
 }
-
-.user-display >>> Image,
-.user-display >>> .no-image {
-  width: 30;
-  height: 30;
-  margin-right: 5;
-  border-radius: 15;
-  background-color: rgba(0, 0, 0, .35);
-}