#329502 Events/Groups> Style Delete button

app/app.css

@@ -1,5 +1,3 @@
-@import '~/css/core.light.css'; 
-
 @import 'nativescript-theme-core/css/core.light.css';
 @import url('./platform.css');
 
@@ -176,3 +174,16 @@ ActivityIndicator {
   text-align: center;
   color: #F4550F;
 }
+
+.btn-delete {
+  margin: 0 20 20;
+  padding-top: 20;
+  border-top-width: 1;
+  border-color: #ebebed;
+  color: #ff0000;
+}
+
+.btn-delete .if {
+  margin-right: 10;
+  font-size: 20;
+}

app/events/edit-event/edit-event.component.css

@@ -2,8 +2,3 @@
   height: 100%;
   background-color: #fff;
 }
-
-.btn-delete {
-  text-align: right;
-  color: red; /* wireframes are work in progress */
-}

app/events/edit-event/edit-event.template.html

@@ -11,7 +11,10 @@
     <ScrollView class="cntnr">
         <StackLayout *ngIf="event && userGroups">
             <editable-event  [event]="event" [userGroups]="userGroups"></editable-event>
-            <Label class="btn-delete" (tap)="delete()" text="Delete event"></Label>
+            <StackLayout class="btn-delete" orientation="horizontal" (tap)="delete()">
+                <Label class="if" text="&#x72;"></Label>
+                <Label text="Delete event"></Label>
+            </StackLayout>
         </StackLayout>
         <ScrollView>
             <ActivityIndicator [busy]="!event || userGroups" [visibility]="event || userGroups ? 'collapse' : 'visible'" horizontalAlignment="center" verticalAlignment="center"></ActivityIndicator>

app/groups/edit-group/edit-group.component.css

@@ -2,8 +2,3 @@
   background-color: #fff;
   height: 100%;
 }
-
-.btn-delete {
-  text-align: right;
-  color: red; /* wireframes are work in progress */
-}

app/groups/edit-group/edit-group.template.html

@@ -11,7 +11,10 @@
     <ScrollView class="cntnr">
         <StackLayout *ngIf="group">
             <editable-group [group]="group"></editable-group>
-            <Label class="btn-delete" text="Delete group" (tap)="delete()"></Label>
+            <StackLayout class="btn-delete" orientation="horizontal" (tap)="delete()">
+                <Label class="if" text="&#x72;"></Label>
+                <Label text="Delete event"></Label>
+            </StackLayout>
         </StackLayout>
         <ScrollView>
             <ActivityIndicator [busy]="!group" [visibility]="group ? 'collapse' : 'visible'" horizontalAlignment="center" verticalAlignment="center"></ActivityIndicator>