Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
  • Loading branch information
akariv committed Feb 7, 2024
1 parent b21e502 commit be4956b
Show file tree
Hide file tree
Showing 7 changed files with 195 additions and 51 deletions.
2 changes: 2 additions & 0 deletions projects/srm/src/app/app.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -75,6 +75,7 @@ import { AreaSearchComponent } from './area-search/area-search.component';
import { SearchFiltersBarComponent } from './search-filters-bar/search-filters-bar.component';
import { AreaSearchNationalServicesCountComponent } from './area-search-national-services-count/area-search-national-services-count.component';
import { AreaSearchNationalServicesNotificationComponent } from './area-search-national-services-notification/area-search-national-services-notification.component';
import { MenuPopupAccordionComponent } from './menu/menu-popup/menu-popup-accordion/menu-popup-accordion.component';

@NgModule({
declarations: [
Expand Down Expand Up @@ -144,6 +145,7 @@ import { AreaSearchNationalServicesNotificationComponent } from './area-search-n
SearchFiltersBarComponent,
AreaSearchNationalServicesCountComponent,
AreaSearchNationalServicesNotificationComponent,
MenuPopupAccordionComponent,
],
imports: [
BrowserModule,
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
<div class='accordion' [class.open]='open' [style.height.px]='height()'>
<div class='accordion-inner' #inner>
<div class='section-title' (activated)='select()' clickOnReturn>
<div class='title'>{{title}}</div>
<div class='icon'></div>
</div>
<div class='section-text'>
<h3>האם שירותי העמותה שלכם מופיעים ב"כל שירות"?</h3>
<p>אם עדיין לא – זה הזמן לדאוג שיופיעו כך שכל הזקוקים להם ידעו על קיומם ויוכלו ליהנות מהם.</p>
<p>עליכם להזין את המידע על כל שירותי העמותה באתר "גיידסטאר" והמידע יישאב אוטומטית לאתר "כל שירות".</p>

<p>לעזרה בתהליך הזנת המידע ראו:</p>

<p>
<a href='https://drive.google.com/file/d/1UJlrXyyPBFBGPerqQKkBpj2UsUNtFA18/view?usp=sharing' target="_blank">המדריך של "כל שירות" להזנת מידע</a><br/>
<a href='https://drive.google.com/file/d/1SeW2Jeb6yGYA-87kIxO4iEAwTSUPqpQB/view?usp=sharing' target="_blank">סרטון הסבר על הזנת מידע בגיידסטאר</a><br/>
<a href='https://www.youtube.com/watch?v=nvEqq2dxb9Q' target="_blank">סרטון הסבר של גיידסטאר למה כדאי להזין מידע</a>
</p>

<p>שאלות? אנא כתבו אלינו לכתובת <a href='mailto:info@kolsherut.org.il'>info&commat;kolsherut.org.il</a></p>

</div>
</div>
</div>
Original file line number Diff line number Diff line change
@@ -0,0 +1,83 @@
@import '../../../../common.less';

.accordion {
padding: 8px 12px;
border: 1px solid @color-blue-6;
background-color: @color-blue-8;
transition-property: background-color height;
transition-duration: 0.3s;
overflow: hidden;
border-radius: 8px;

.section-title {
display: flex;
flex-flow: row nowrap;
align-items: center;
cursor: pointer;
height: 32px;

.title {
color: @color-blue-1;
.font-rag-sans;
font-size: 16px;
font-weight: 700;
line-height: 20px;
}
.icon {
margin-right: auto;
width: 16px;
height: 16px;
.background-image;
background-image: url(../../../../assets/img/icon-chevron-down-blue-700.svg);
transition: transform 0.3s;
}
}

.section-text {
margin-top: 6px;

h2 {
color: @color-gray-1;
.font-rag-sans;
font-size: 20px;
font-weight: 400;
line-height: 20px;
margin: 0;
margin-bottom: 24px;
}

h3 {
color: @color-gray-1;
.font-rag-sans;
font-size: 16px;
font-weight: 700;
line-height: 20px;
margin: 0;
margin-bottom: 4px;
}

p, ul {
margin: 0;
margin-bottom: 16px;
font-weight: 300;
}

a {
color: @color-blue-1;
text-decoration: underline;
}
}

&.open {
background-color: white;
.section-title {
.icon {
transform: rotate(180deg);
}
}

.section-text {
display: block;
}
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
import { Component, ElementRef, EventEmitter, Input, OnChanges, Output, SimpleChanges, ViewChild, signal } from '@angular/core';
import { timer } from 'rxjs';

@Component({
selector: 'app-menu-popup-accordion',
templateUrl: './menu-popup-accordion.component.html',
styleUrl: './menu-popup-accordion.component.less'
})
export class MenuPopupAccordionComponent implements OnChanges {

@Input() title: string;
@Input() open = false;

@Output() selected = new EventEmitter<void>();

@ViewChild('inner') content: ElementRef;

height = signal(48);

select() {
this.selected.emit();
}

ngOnChanges(): void {
timer(0).subscribe(() => {
this.height.set(18 + (this.open ? this.content.nativeElement.scrollHeight : 32));
});
}
}
Original file line number Diff line number Diff line change
@@ -1,25 +1,52 @@
<app-menu-popup title='בתקופת החירום, אילו שירותים חסרים לנו באתר?' subtitle='הזינו פרטים בסיסיים על השירות וההצעה תועבר לעורכי התוכן'>
<app-menu-popup title='חסרים לנו שירותים באתר?' subtitle='סייעו לנו להוסיף אותם'>
<ng-container class='content'>
<p>
בתקופת המלחמה מתגייסת החברה האזרחית בישראל, כמו גם רשויות מקומיות, עמותות וחברות לתמיכה וסולידריות עם נפגעי המלחמה, החיילים, המילואימניקים ומשפחותיהם ואוכלוסיות בסיכון.
</p>
<h3>אילו שירותים מוצגים באתר?</h3>
<p>
בשגרה אתר כל שירות מציג שירותים ומענים חברתיים שהמדינה, ארגונים וגופים שונים מעמידים לרשותנו, התושבים. במצב החירום המלחמתי הדגש הוא על שירותים מותאמים למצב זה, המוצעים ללא תשלום ובאופן אמין ועדכני.
כבר אספנו <a [routerLink]='["/s", "שירותים_למצב_החירום"]'>די הרבה שירותים כאלה</a>, אולי גם שלך ביניהם.
</p>
<h3>איך לוודא שהתוכן אמין ועדכני?</h3>
<p>
כל שירות שנכנס לאתר חייב לכלול כותרת, תיאור ממצה, קטגוריה (המתאימה ביותר למצב החירום) ופרטי התקשרות ודאיים (בדקתם בעצמכם) של ספק השירות.
</p>
<h3>איך לעדכן שירותים של עמותות?</h3>
<p>
הדרך המומלצת לעדכן שירותים של עמותות היא דרך הממשק של <a href='https://www.guidestar.org.il/' target='_blank'>אתר העמותות גיידסטאר</a> שממנו אנחנו שואבים מידע בכל יום. יצרנו סרטון הדרכה קצר שמסביר בדיוק <a href='https://youtu.be/JExX4gR8NBs' target='_blank'>איך לעשות את זה</a>. אפשר לנסות לפנות אל העמותה גם אם אין לך קשר ישיר אליה או בכל זאת למלא את המידע בטופס שלנו.
</p>
<div class='wrapper'>
<app-menu-popup-accordion title='שירותים המופעלים על ידי עמותה' [open]='section === "ngo"' (selected)='section = "ngo"'>
<h3>האם שירותי העמותה שלכם מופיעים ב"כל שירות"?</h3>
<p>אם עדיין לא – זה הזמן לדאוג שיופיעו כך שכל הזקוקים להם ידעו על קיומם ויוכלו ליהנות מהם.</p>
<p>עליכם להזין את המידע על כל שירותי העמותה באתר "גיידסטאר" והמידע יישאב אוטומטית לאתר "כל שירות".</p>

<p>לעזרה בתהליך הזנת המידע ראו:</p>

<p>
<a href='https://drive.google.com/file/d/1UJlrXyyPBFBGPerqQKkBpj2UsUNtFA18/view?usp=sharing' target="_blank">המדריך של "כל שירות" להזנת מידע</a><br/>
<a href='https://drive.google.com/file/d/1SeW2Jeb6yGYA-87kIxO4iEAwTSUPqpQB/view?usp=sharing' target="_blank">סרטון הסבר על הזנת מידע בגיידסטאר</a><br/>
<a href='https://www.youtube.com/watch?v=nvEqq2dxb9Q' target="_blank">סרטון הסבר של גיידסטאר למה כדאי להזין מידע</a>
</p>

<p>שאלות? אנא כתבו אלינו לכתובת <a href='mailto:info@kolsherut.org.il'>info&commat;kolsherut.org.il</a></p>
</app-menu-popup-accordion>
<app-menu-popup-accordion title='שירותים אחרים' [open]='section === "others"' (selected)='section = "others"'>
<h3>אילו שירותים מוצגים באתר?</h3>
<p>
אתר כל שירות מציג שירותים ומענים חברתיים שהמדינה, ארגונים וגופים שונים מעמידים לרשותנו, התושבים.
</p>
<h3>מה צריך לעשות על מנת שהשירותים שלכם יופיע באתר?</h3>
<p>
כתבו אלינו לכתובת <a href='mailto:info@kolsherut.org.il'>info&commat;kolsherut.org.il</a>
</p>
<p>
אנא ציינו את שמכם, שם הארגון ואילו שירותים חברתיים אתם מספקים.
וכמובן, פרטי ההתקשרות שלכם.
</p>
<p>
תודה, צוות כל שירות.
</p>
</app-menu-popup-accordion>
</div>
</ng-container>
<div class='bottom'>
<a class='button' href='https://docs.google.com/forms/d/e/1FAIpQLScI6Nr1M5KeWCBDb0hwX5YIIh1ByNzE7EzEY9yi3iP846bphA/viewform' clickOnReturn target="_blank">
<span>למילוי הטופס</span>
</a>
</div>
@if (section === 'ngo' || section === 'others') {
<div class='bottom'>
@if (section === 'ngo') {
<a class='button' href='https://www.guidestar.org.il/' clickOnReturn target="_blank">
<span>לאתר גיידסטאר</span>
</a>
}
@if (section === 'others') {
<a class='button' href='mailto:info@kolsherut.org.il' clickOnReturn target="_blank">
<span>כתבו אלינו</span>
</a>
}
</div>
}
</app-menu-popup>
Original file line number Diff line number Diff line change
Expand Up @@ -5,35 +5,12 @@
height: 100%;
width: 100%;

h2 {
color: @color-gray-1;
.font-rag-sans;
font-size: 20px;
font-weight: 400;
line-height: 20px;
margin: 0;
margin-bottom: 24px;
}

h3 {
color: @color-gray-1;
.font-rag-sans;
font-size: 16px;
font-weight: 700;
line-height: 20px;
margin: 0;
margin-bottom: 4px;
}

p, ul {
margin: 0;
margin-bottom: 16px;
font-weight: 300;
}

a {
color: @color-blue-1;
text-decoration: underline;
.wrapper {
min-height: 360px;
width: 100%;
display: flex;
flex-flow: column;
gap: 8px;
}

.bottom {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,8 @@ import { A11yService } from '../../../a11y.service';
})
export class MenuPopupMissingComponent implements OnInit {

section = 'none';

constructor(private seo: SeoSocialShareService, private a11y: A11yService,
@Inject(DOCUMENT) private document: any) { }

Expand Down

0 comments on commit be4956b

Please sign in to comment.