updated looks

src/app/about/about.component.html

@@ -1,24 +1,34 @@
-<h4 class="pull-right"><u>?למה לדווח</u></h4><br><br>
+<h4 class="pull-right"><u>מטרת האתר</u></h4><br><br>
 <p style="text-align: right;">
-    ייתכן ששוטר בסיור לא יודע מה נורמלי ברחוב שלנו ואולי לא יזהה זר בשטח שלנו <br><br>
-
+    .אתר זה הוא יוזמה פרטית של תושבים בשכונת גני אביב
+    <br>
     אנחנו והשכנים שלנו מסוגלים לצפות
 
     <strong>
-        ולדווח על כל דבר בעל אופי חשוד,
+        ולדווח על כל דבר בעל אופי חשוד
     </strong>
-
+    <br>
+    .ובכך לשמש כזוג עיניים ואוזניים נוסף למען שמירת השקט והבטחון בשכונתינו
+    <br><br>
     יותר דיווחים - יותר מודעות <br><br>
 
-    פושעים מתקשים לפעול באזורים בהם אנשים נוטלים תפקיד פעיל במניעת פשיעה <br><br>
+    .פושעים מתקשים לפעול באזורים בהם תושבים נוטלים תפקיד פעיל במניעת הפשיעה <br>
 
-    יש לזכור ששום כוח משטרה לא יכול להגן ביעילות על חיים ורכוש ללא התמיכה הפעילה ושיתוף הפעולה של האנשים אותם הוא
-    נועד לשרת
+    בנוסף, יש לזכור ששום כוח משטרה לא יכול להגן ביעילות על חיים ורכוש ללא התמיכה הפעילה
+    ושיתוף הפעולה של האנשים אותם הוא נועד לשרת
+    <br><br>
+    אתר זה משמש ככלי לתלונות התושבים במקרים בהם ישנה פעילות חשודה, הפרת סדר
     <br>
-    <br>
-    <br>
-    <br>
-    אין להשתמש באתר כשיטה חלופית לדיווח על פשעים או עבירות אחרות. אם מדובר במקרה חירום יש לחייג 100
+    :או עבירה על החוק, ובכך לתרום
+    <br><br>
+    <li dir="rtl">בשמירה על תחושת הביטחון בשכונה </li>
+    <li dir="rtl">בשמירה על הסדר, הרכוש ואיכות החיים בשכונה </li>
+    <li dir="rtl">באיתור חשודים במישור הפלילי והחבלני </li>
+    <li dir="rtl">בתמיכה וסיוע במערך האבטחה הקיים </li>
 
+    <br><br>
+    .אין להשתמש באתר כשיטה חלופית לדיווח על פשעים או עבירות אחרות
+    <br>
+    אם מדובר במקרה חירום יש לחייג 100
 </p>
 <br>

src/app/header/header/header.component.html

@@ -1,7 +1,14 @@
 <nav class="navbar navbar-default">
     <div class="container-fluid">
         <div class="navbar-header navbar-right">
-            <a href="#" class="navbar-brand">מלשינון</a>
+            <a href="#" class="navbar-brand">
+                משמר שכונת גני אביב
+
+                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye-fill" viewBox="0 -2 16 16">
+                    <path d="M10.5 8a2.5 2.5 0 1 1-5 0 2.5 2.5 0 0 1 5 0z"/>
+                    <path d="M0 8s3-5.5 8-5.5S16 8 16 8s-3 5.5-8 5.5S0 8 0 8zm8 3.5a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7z"/>
+                  </svg>
+            </a>
         </div>
         <ul class="nav navbar-nav mr-auto">
             <li class="nav-item" routerLinkActive="active"><a class="nav-link" routerLink="/reports">תלונות אחרונות</a>

src/app/reports/report-detail/report-detail.component.css

@@ -1,4 +1,3 @@
 .panel {
-    padding: 10px;
     border: 0px;
 }

src/app/reports/report-detail/report-detail.component.html

@@ -34,7 +34,7 @@ <h4>
                 </h4>
                 <br><br><br>
                 <div class="row">
-                    <button class="btn btn-info" (click)="onLikeReport()" *ngIf="!liked">
+                    <button class="btn btn-success" (click)="onLikeReport()" *ngIf="!liked">
 
 
                         <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor"

src/app/reports/report-edit/report-edit.component.css

@@ -1,6 +1,6 @@
 textarea {
-    resize: none;
-  }
+  resize: none;
+}
 
 textarea.ng-invalid.ng-touched {
   border: 1px solid red;
@@ -11,6 +11,5 @@ select.ng-invalid.ng-touched {
 }
 
 .panel {
-  padding: 10px;
   border: 0px;
 }

src/app/reports/report-edit/report-edit.component.html

@@ -1,6 +1,6 @@
 <div class="row">
     <div class="col-xs-12">
-        <div class="panel panel-success">
+        <div class="panel panel-info">
 
             <!-- <div class="panel-heading text-center">{{ editMode? 'עדכון דיווח קיים' : 'יצירת דיווח חדש'}}</div> -->
             <div class="panel-heading text-center">יצירת דיווח חדש</div>

src/app/reports/report-edit/report-edit.component.ts

@@ -51,45 +51,45 @@ export class ReportEditComponent implements OnInit, OnDestroy {
     if (!this.editMode) {
       this.reportService.addReport(report);
     }
-    this.router.navigate(['../'], { relativeTo: this.route }) // back to reports page after submit
+    this.router.navigate(['../thanks'], { relativeTo: this.route }) // back to reports page after submit
   }
 
-onCancel() { // user presses cancel - goes back to reports page
-  this.router.navigate(['../'], { relativeTo: this.route })
-}
+  onCancel() { // user presses cancel - goes back to reports page
+    this.router.navigate(['../'], { relativeTo: this.route })
+  }
 
-onDelete() {
-  if (this.editMode) {
-    this.reportService.deleteReport(this.id);
-    this.router.navigate(['../../'], { relativeTo: this.route }) // goes back to reports page
+  onDelete() {
+    if (this.editMode) {
+      this.reportService.deleteReport(this.id);
+      this.router.navigate(['../../'], { relativeTo: this.route }) // goes back to reports page
+    }
   }
-}
 
   private initForm() {
-  let reportDesc = ''; // init values in case of new mode
-  let reportType = null;
-  let reportPlace = null;
+    let reportDesc = ''; // init values in case of new mode
+    let reportType = null;
+    let reportPlace = null;
 
-  if (this.editMode) { // get old values if in edit mode
-    const report = this.reportService.getReport(this.id);
-    reportDesc = report.description;
-    reportType = this.reportService.parseType(report.type);
-    reportPlace = this.reportService.parseStreet(report.place);
+    if (this.editMode) { // get old values if in edit mode
+      const report = this.reportService.getReport(this.id);
+      reportDesc = report.description;
+      reportType = this.reportService.parseType(report.type);
+      reportPlace = this.reportService.parseStreet(report.place);
+    }
+    this.newReportForm = new FormGroup({ // set values to new form
+      'type': new FormControl(reportType, Validators.required),
+      'description': new FormControl(reportDesc, Validators.required),
+      'place': new FormControl(reportPlace, Validators.required)
+    });
   }
-  this.newReportForm = new FormGroup({ // set values to new form
-    'type': new FormControl(reportType, Validators.required),
-    'description': new FormControl(reportDesc, Validators.required),
-    'place': new FormControl(reportPlace, Validators.required)
-  });
-}
 
-update(e) { // selector helper function
-  this.selected = e.target.value
-}
+  update(e) { // selector helper function
+    this.selected = e.target.value
+  }
 
-// *Lists* of streets & types. eg: ['street1','street2', etc]
-types = Array.from(this.reportService.repTypeMap.values());
-places = Array.from(this.reportService.streetMap.values());
+  // *Lists* of streets & types. eg: ['street1','street2', etc]
+  types = Array.from(this.reportService.repTypeMap.values());
+  places = Array.from(this.reportService.streetMap.values());
 
 
 }

src/app/reports/report-list/report-item/report-item.component.css

@@ -0,0 +1,4 @@
+.badge {
+    background-color: rgb(74, 190, 113, 0.8);
+
+}

src/app/reports/report-list/report-item/report-item.component.html

@@ -6,9 +6,15 @@
                 {{ report.score }}
             </span>
 
-            {{ report.time | date: 'dd/MM - HH:mm' }}
-            {{ pType(report.type) }}
-            בשעה
+            <span>
+                {{pPlace(report.place)}}
+            </span>
+
+            <span class="pull-right">
+                {{ report.time | date: 'dd/MM - HH:mm' }}
+                -
+                {{ pType(report.type) }}
+            </span>
         </p>
     </div>
 </a>

src/app/reports/report-list/report-list.component.css

@@ -4,7 +4,3 @@ ul.list-group {
   max-height: calc(85vh - 50px);
 
 }
-
-/* .panel {
-    border: 0;
-  } */

src/app/reports/report-list/report-list.component.html

@@ -1,5 +1,17 @@
 <div class="panel panel-info">
-    <div class="panel-heading text-center">תלונות אחרונות</div>
+    <div class="panel-heading text-right">
+        תלונות אחרונות
+
+        <span class="pull-left">
+
+            <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor"
+                class="bi bi-hand-thumbs-up" viewBox="-2 0 16 16">
+                <path
+                    d="M8.864.046C7.908-.193 7.02.53 6.956 1.466c-.072 1.051-.23 2.016-.428 2.59-.125.36-.479 1.013-1.04 1.639-.557.623-1.282 1.178-2.131 1.41C2.685 7.288 2 7.87 2 8.72v4.001c0 .845.682 1.464 1.448 1.545 1.07.114 1.564.415 2.068.723l.048.03c.272.165.578.348.97.484.397.136.861.217 1.466.217h3.5c.937 0 1.599-.477 1.934-1.064a1.86 1.86 0 0 0 .254-.912c0-.152-.023-.312-.077-.464.201-.263.38-.578.488-.901.11-.33.172-.762.004-1.149.069-.13.12-.269.159-.403.077-.27.113-.568.113-.857 0-.288-.036-.585-.113-.856a2.144 2.144 0 0 0-.138-.362 1.9 1.9 0 0 0 .234-1.734c-.206-.592-.682-1.1-1.2-1.272-.847-.282-1.803-.276-2.516-.211a9.84 9.84 0 0 0-.443.05 9.365 9.365 0 0 0-.062-4.509A1.38 1.38 0 0 0 9.125.111L8.864.046zM11.5 14.721H8c-.51 0-.863-.069-1.14-.164-.281-.097-.506-.228-.776-.393l-.04-.024c-.555-.339-1.198-.731-2.49-.868-.333-.036-.554-.29-.554-.55V8.72c0-.254.226-.543.62-.65 1.095-.3 1.977-.996 2.614-1.708.635-.71 1.064-1.475 1.238-1.978.243-.7.407-1.768.482-2.85.025-.362.36-.594.667-.518l.262.066c.16.04.258.143.288.255a8.34 8.34 0 0 1-.145 4.725.5.5 0 0 0 .595.644l.003-.001.014-.003.058-.014a8.908 8.908 0 0 1 1.036-.157c.663-.06 1.457-.054 2.11.164.175.058.45.3.57.65.107.308.087.67-.266 1.022l-.353.353.353.354c.043.043.105.141.154.315.048.167.075.37.075.581 0 .212-.027.414-.075.582-.05.174-.111.272-.154.315l-.353.353.353.354c.047.047.109.177.005.488a2.224 2.224 0 0 1-.505.805l-.353.353.353.354c.006.005.041.05.041.17a.866.866 0 0 1-.121.416c-.165.288-.503.56-1.066.56z" />
+            </svg>
+
+        </span>
+    </div>
     <ul class="list-group">
         <div class="col-xs-12">
             <app-report-item *ngFor="let reportEl of reports; let i = index " [report]="reportEl"

src/app/reports/report-start/report-start.component.css

@@ -1,4 +1,3 @@
 .panel {
-    padding: 10px;
     border: 0px;
 }

src/app/reports/report-start/report-start.component.html

@@ -1,34 +1,57 @@
-<div>
-    <p style="text-align: left;">
-        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-left"
-            viewBox="0 0 16 16">
-            <path fill-rule="evenodd"
-                d="M15 8a.5.5 0 0 0-.5-.5H2.707l3.147-3.146a.5.5 0 1 0-.708-.708l-4 4a.5.5 0 0 0 0 .708l4 4a.5.5 0 0 0 .708-.708L2.707 8.5H14.5A.5.5 0 0 0 15 8z" />
-        </svg>
-
-        <em>
-            לחיצה על תלונה מהרשימה תציג פרטים נוספים על אותה התלונה
-        </em>
-    </p>
-</div>
-
 <div class="panel panel-primary">
     <div class="panel-heading text-center">
-        דיווחים על פעילות חשודה בזמן אמת - {{ placeName }}
+        דיווחים על פעילות חשודה בזמן אמת
+    </div>
+
+
+    <div>
+        <br>
+        <p style="text-align: left;">
+            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="13" fill="currentColor" class="bi bi-arrow-left"
+                viewBox="0 0 16 16">
+                <path fill-rule="evenodd"
+                    d="M15 8a.5.5 0 0 0-.5-.5H2.707l3.147-3.146a.5.5 0 1 0-.708-.708l-4 4a.5.5 0 0 0 0 .708l4 4a.5.5 0 0 0 .708-.708L2.707 8.5H14.5A.5.5 0 0 0 15 8z" />
+            </svg>
+
+            <em>
+                לחיצה על תלונה מהרשימה תציג פרטים נוספים על אותה התלונה
+            </em>
+        </p>
     </div>
+
+
+
+
+
     <br>
     <p style="text-align: right;">
-        לדיווח חדש יש ללחוץ על כפתור
-        <strong>
-            דיווח חדש
-        </strong>
-        בראש העמוד, למלא את הפרטים הנדרשים וללחוץ
-        <strong>
-            שלח
-        </strong><br><br>
-        ישנן 4 קטגוריות ראשיות לתלונה, יש לבחור אחת מהן המתאימה ביותר לסוג התלונה <br><br>
-        הדיווח החדש יתווסף לראש רשימת התלונות האחרונות וכך משתמשים אחרים יוכלו להתעדכן ו/או להגיש דיווחים נוספים
-        במקרה
-        הצורך
+        <li dir="rtl">
+
+            לדיווח חדש יש ללחוץ על כפתור
+            <strong>
+                דיווח חדש
+            </strong>
+            בראש העמוד, למלא את הפרטים הנדרשים וללחוץ
+            <strong>
+                שלח
+            </strong>
+            <br>
+            ישנן 4 קטגוריות ראשיות לתלונה, יש לבחור אחת מהן המתאימה ביותר לסוג התלונה
+        </li>
+        <br><br>
+
+        <li dir="rtl">
+            <u>במידה וכבר קיימת תלונה דומה</u>
+
+            ניתן לבצע "לייק" לאותה התלונה בלחיצה על כפתור ה
+
+            <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="currentColor"
+                class="bi bi-hand-thumbs-up" viewBox="0 0 16 16">
+                <path
+                    d="M8.864.046C7.908-.193 7.02.53 6.956 1.466c-.072 1.051-.23 2.016-.428 2.59-.125.36-.479 1.013-1.04 1.639-.557.623-1.282 1.178-2.131 1.41C2.685 7.288 2 7.87 2 8.72v4.001c0 .845.682 1.464 1.448 1.545 1.07.114 1.564.415 2.068.723l.048.03c.272.165.578.348.97.484.397.136.861.217 1.466.217h3.5c.937 0 1.599-.477 1.934-1.064a1.86 1.86 0 0 0 .254-.912c0-.152-.023-.312-.077-.464.201-.263.38-.578.488-.901.11-.33.172-.762.004-1.149.069-.13.12-.269.159-.403.077-.27.113-.568.113-.857 0-.288-.036-.585-.113-.856a2.144 2.144 0 0 0-.138-.362 1.9 1.9 0 0 0 .234-1.734c-.206-.592-.682-1.1-1.2-1.272-.847-.282-1.803-.276-2.516-.211a9.84 9.84 0 0 0-.443.05 9.365 9.365 0 0 0-.062-4.509A1.38 1.38 0 0 0 9.125.111L8.864.046zM11.5 14.721H8c-.51 0-.863-.069-1.14-.164-.281-.097-.506-.228-.776-.393l-.04-.024c-.555-.339-1.198-.731-2.49-.868-.333-.036-.554-.29-.554-.55V8.72c0-.254.226-.543.62-.65 1.095-.3 1.977-.996 2.614-1.708.635-.71 1.064-1.475 1.238-1.978.243-.7.407-1.768.482-2.85.025-.362.36-.594.667-.518l.262.066c.16.04.258.143.288.255a8.34 8.34 0 0 1-.145 4.725.5.5 0 0 0 .595.644l.003-.001.014-.003.058-.014a8.908 8.908 0 0 1 1.036-.157c.663-.06 1.457-.054 2.11.164.175.058.45.3.57.65.107.308.087.67-.266 1.022l-.353.353.353.354c.043.043.105.141.154.315.048.167.075.37.075.581 0 .212-.027.414-.075.582-.05.174-.111.272-.154.315l-.353.353.353.354c.047.047.109.177.005.488a2.224 2.224 0 0 1-.505.805l-.353.353.353.354c.006.005.041.05.041.17a.866.866 0 0 1-.121.416c-.165.288-.503.56-1.066.56z" />
+            </svg>
+
+            בתיאור אותה התלונה ובכך להעלות את המודעות של שאר המשתמשים באתר
+        </li>
     </p>
 </div>

src/app/reports/report-thanks/report-thanks.component.html

@@ -9,7 +9,8 @@
                 d="M10.97 4.97a.235.235 0 0 0-.02.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-1.071-1.05z" />
         </svg><br><br>
 
-        <h4>תודה על תרומתך</h4>
+        <h4>!תודה על תרומתך</h4>
+        <p>המידע נקלט במערכת</p>
         <br>
         <button class="btn btn-primary" (click)="onBack()">חזרה</button>
 

src/styles.css

@@ -1 +1 @@
-/* You can add global styles to this file, and also import other style files */
+/* You can add global styles to this file, and also import other style files */