========================HTML====================================================================

Help & Support Center

Get instant help, submit queries, and find answers to your questions

Coming Soon

Browse Help Topics

Frequently Asked Questions

Have questions about RO platform? Find answers here.

Still have questions?

Can’t find the answer you’re looking for? Please chat to our friendly team.

============================================================================== CSS ==================================================== * { margin: 0; padding: 0; box-sizing: border-box; //font-size: 0.73vw; } body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif; background-color: #f8f9fa; color: #333; line-height: 1.6; } .hero-section { border-radius: 1.25vw; background: linear-gradient(101deg, rgba(239, 65, 54, 0.30) 1.02%, rgba(173, 0, 60, 0.30) 79.1%); padding: 1.25vw 1.25vw; text-align: center; color: #333; margin: 1.35vw 1.35vw; } .hero-title { color: var(--Primary-Main, #112030); text-align: center; font-family: Poppins; font-size: 1.67vw; font-style: normal; font-weight: 600; line-height: 2.3vw; letter-spacing: -0.03vw; } .hero-subtitle { color: var(--Neutral-80, #3B4453); text-align: center; font-family: Poppins; font-size: 0.83vw; font-style: normal; font-weight: 400; line-height: 1.25vw; } .search-container { max-width: 26vw; margin: 0 auto; position: relative; } .search-input { width: 100%; padding: 0.68vw 0.78vw; border: none; transition: box-shadow 0.3s ease; border-radius: 0.42vw; background: var(--Neutral-10, #FFF); color: var(--Neutral-70, #515966); font-family: Poppins; font-size: 0.63vw; font-style: normal; font-weight: 400; line-height: 0.73vw; letter-spacing: 0.003vw; } .search-input:focus { outline: none; box-shadow: 0 0.21vw 1.04vw rgba(0, 0, 0, 0.15); } .search-btn { position: absolute; right: 0.52vw; top: 50%; transform: translateY(-50%); background: none; border: none; cursor: pointer; padding: 0.26vw; color: #666; transition: color 0.3s ease; } .search-btn:hover { color: #333; } .main-content { max-width: 67.7vw; margin: 0 auto; padding: 0 0.52vw 1vw 0; } .support-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(14.6vw, 1fr)); gap: 1.3vw; margin: 0.16vw 0; } .support-card { padding: 1.3vw; text-align: center; box-shadow: 0 0.1vw 0.42vw rgba(0, 0, 0, 0.1); transition: transform 0.3s ease, box-shadow 0.3s ease; cursor: pointer; border-radius: 0.63vw; background: var(--Neutral-10, #FFF); box-shadow: var(--sds-size-depth-0) var(--sds-size-depth-025) var(--sds-size-depth-100) var(--sds-size-depth-0) var(--sds-color-black-200), var(--sds-size-depth-0) var(--sds-size-depth-025) var(--sds-size-depth-100) var(--sds-size-depth-0) var(--sds-color-black-100); } .support-card:hover { transform: translateY(-0.21vw); box-shadow: 0 0.42vw 1.3vw rgba(0, 0, 0, 0.15); } .support-icon { width: 2.5vw; height: 2.5vw; margin: 0 auto 0.52vw; display: flex; align-items: center; justify-content: center; border-radius: 50%; font-size: 0.78vw; } .support-icon.query { background-color: #e3f2fd; color: #1976d2; } .support-icon.tickets { background-color: #ffebee; color: #d32f2f; } .support-icon.chat { background-color: #f3e5f5; color: #7b1fa2; } .support-icon.contact { background-color: #e8f5e8; color: #388e3c; } .support-title { margin: 1vw 0 0 0; color: var(--Neutral-90, #232B39); text-align: center; font-family: Poppins; font-size: 0.83vw; font-style: normal; font-weight: 500; line-height: 1.25vw; } .support-description { color: var(--Neutral-60, #707784); text-align: center; font-family: Poppins; font-size: 0.83vw; font-style: normal; font-weight: 400; line-height: 1.25vw; } .section-title { color: var(--Neutral-90, #232B39); text-align: center; font-family: Poppins; font-size: 1.25vw; font-style: normal; font-weight: 600; line-height: 1.25vw; margin: 2.04vw 0 1.5vw; } .help-topics { display: grid; grid-template-columns: repeat(auto-fit, minmax(13.02vw, 1fr)); gap: 1.04vw; margin: 1.04vw 0; } .topic-card { background: white; padding: 1.78vw; border-radius: 0.63vw; text-align: center; box-shadow: 0 0.1vw 0.42vw rgba(0, 0, 0, 0.1); transition: transform 0.3s ease, box-shadow 0.3s ease; cursor: pointer; } .topic-card:hover { transform: translateY(-0.1vw); box-shadow: 0 0.21vw 0.78vw rgba(0, 0, 0, 0.12); } .topic-icon { width: 3.13vw; height: 3.13vw; margin: 0 auto 0.52vw; border-radius: 0.63vw; display: flex; align-items: center; justify-content: center; font-size: 0.78vw; color: white; } .topic-icon.account { background: linear-gradient(135deg, #64b5f6, #42a5f5); } .topic-icon.create { background: linear-gradient(135deg, #81c784, #66bb6a); } .topic-icon.assignments { background: linear-gradient(135deg, #ffb74d, #ffa726); } .topic-icon.lms { background: linear-gradient(135deg, #ba68c8, #ab47bc); } .topic-icon.rewards { background: linear-gradient(135deg, #f06292, #ec407a); } .topic-icon.invite { background: linear-gradient(135deg, #4db6ac, #26a69a); } .topic-icon.review { background: linear-gradient(135deg, #78909c, #607d8b); } .topic-icon.guidelines { background: linear-gradient(135deg, #ff8a65, #ff7043); } .topic-title { font-size: 0.83vw; font-weight: 600; margin-bottom: 0.26vw; color: #333; } .topic-articles { color: #666; font-size: 0.44vw; } .faq-title { color: var(--Neutral-90, #232B39); text-align: center; font-family: Poppins; font-size: 1.25vw; font-style: normal; font-weight: 600; line-height: 1.56vw; margin: 2.26vw 0 0.4vw 0; } .faq-subtitle { color: var(--Neutral-60, #707784); text-align: center; font-family: Poppins; font-size: 0.94vw; font-style: normal; font-weight: 400; line-height: 1.41vw; margin-bottom: 1.25vw; } .faq-item { border-bottom: 0.05vw solid #eee; padding: 0.78vw 0; } .faq-item:last-child { border-bottom: none; } img{ height: 3.25vw; } .faq-question { display: flex; justify-content: space-between; align-items: center; cursor: pointer; color: var(--Primary-Black, #191A15); font-family: Poppins; font-size: 0.94vw; font-style: normal; font-weight: 600; line-height: 1.41vw; /* 27px */ letter-spacing: -0.028vw; } .faq-question:hover { color: #666; } .faq-toggle { width: 1.25vw; /* 24px */ height: 1.25vw; border-radius: 50%; background: #f0f0f0; display: flex; align-items: center; justify-content: center; transition: background-color 0.3s ease; } .faq-toggle:hover { background: #e0e0e0; } .faq-answer { padding: 0.52vw 0; /* 10px */ color: var(--secondary-Grey, #323232); font-family: Poppins; font-size: 0.83vw; /* 16px */ font-style: normal; font-weight: 500; line-height: 1.25vw; /* 24px */ letter-spacing: -0.025vw; line-height: 1.6; } .contact-section { background: white; margin: 2.08vw 0; /* 40px */ padding: 2.08vw; /* 40px */ border-radius: 0.63vw; /* 12px */ box-shadow: 0 0.1vw 0.42vw rgba(0, 0, 0, 0.1); } .contact-header { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; //margin-bottom: 0.52vw; /* 10px */ } .contact-title { color: var(--Neutral-90, #232B39); font-family: Poppins; font-size: 0.94vw; /* 18px */ font-style: normal; font-weight: 600; line-height: 1.15vw; /* 22.063px */ } .contact-description { color: var(--Neutral-60, #707784); font-family: Poppins; font-size: 0.73vw; /* 14px */ font-style: normal; font-weight: 400; line-height: 1.07vw; /* 20.592px */ margin: 0; } .btn-primary { border-radius: 0.31vw; /* 5.884px */ background: var(--Button-Linear, linear-gradient(101deg, #EF4136 1.02%, #AD003C 79.1%)); box-shadow: 0 0.038vw 0.076vw 0 rgba(16, 24, 40, 0.05); cursor: pointer; transition: transform 0.3s ease, box-shadow 0.3s ease; color: var(--White, #FFF); font-family: Poppins; font-size: 0.73vw; /* 14px */ font-style: normal; font-weight: 500; border: none; line-height: 0.92vw; /* 17.651px */ padding: 0.63vw 0.63vw; /* 12px */ } .btn-primary:hover { transform: translateY(-0.1vw); /* 2px */ background-color: #0056b3; } // @media (max-width: 768px) { // .hero-title { // font-size: 2rem; // } // .support-options { // grid-template-columns: 1fr; // gap: 1rem; // } // .help-topics { // grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); // gap: 1rem; // } // .faq-section, // .contact-section { // margin: 2rem 0; // padding: 1.5rem; // } // } // @media (max-width: 480px) { // .hero-section { // padding: 2rem 1rem; // } // .hero-title { // font-size: 1.75rem; // } // .support-card, // .topic-card { // padding: 1.5rem; // } // .help-topics { // grid-template-columns: 1fr; // } // } .modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); display: flex; align-items: center; justify-content: center; z-index: 999; margin-top: 1.5vw; } .modal-content { background: white; //max-height: 40vw; border-radius: 0.63vw; /* 12px */ max-width: 31.25vw; /* 600px */ width: 100%; padding: 1.25vw; /* 1.5rem → 1.25vw */ box-shadow: 0 0.26vw 1.56vw rgba(0, 0, 0, 0.2); /* 5px 30px */ } .raise-query-container { display: flex; flex-direction: column; gap: 0.5vw; /* 1.25rem → 1.04vw */ } .header-section { display: flex; justify-content: space-between; align-items: center; } .title { font-size: 1.0416666666666667vw; font-weight: 600; font-family: 'Poppins', sans-serif; color: #1f2937; } .close-btn { font-size: 2vw; cursor: pointer; color: #1f2937; } .form-group { display: flex; flex-direction: column; gap: 0.26vw; /* 5px */ } input.form-control:focus-visible { border-color: #86b7fe; box-shadow: 0 0 0 0.07vw rgba(13, 110, 253, 0.25); outline: none; //border: 1px solid #009E12; } .form-group label { font-size: 0.7291666666666666vw; color: #515966; font-weight: 500; font-family: "Poppins", sans-serif; } .required-star { color: #dc2626; } .form-group input, .form-group textarea { padding: 0.26vw 0.39vw; /* 5px 7.5px */ border: 0.05vw solid #e4e4e7; /* 1px */ border-radius: 0.42vw; /* 8px */ font-size: 0.73vw; /* 0.875rem → 0.73vw */ font-family: 'Poppins', sans-serif; color: #1f2937; } .form-group input::placeholder, .form-group textarea::placeholder { color: #9ca3af; } .priority-options { display: flex; gap: 1.67vw; /* 2rem → 1.67vw */ margin-top: 0.26vw; /* 5px */ } .error-message{ font-size: 0.7vw; } .priority-options label { display: flex; align-items: center; gap: 0.26vw; /* 5px */ font-family: 'Poppins', sans-serif; color: #1f2937; } .upload-box { border: 0.05vw solid #e4e4e7; /* 1px */ padding: 0.52vw; /* 10px */ border-radius: 0.52vw; /* 10px */ text-align: center; color: #6b7280; font-size: 0.72vw; font-family: 'Inter', sans-serif; background-color: #f9fafb; } .upload-box .browse-link { color: #2563eb; cursor: pointer; } .submit-btn { display: flex; justify-content: flex-end; padding-top: 0.52vw; /* 10px */ } .submit-btn button { background: linear-gradient(to bottom, #ef4444, #be123c); color: white; padding: 0.39vw 0.78vw; /* 7.5px 15px */ border-radius: 0.42vw; /* 8px */ font-family: 'Poppins', sans-serif; font-size: 0.83vw; /* 1rem → 0.83vw */ font-weight: 500; border: none; cursor: pointer; width: 29vw; } .submit-btn button:hover { background: linear-gradient(to bottom, #be123c, #ef4444); } /* ================== FAQ Card Base ================== */ .faq-card { width: 100%; background: #fff; border-radius: 0.833vw; display: flex; flex-direction: column; margin-bottom: 0.833vw; } .faq-header { display: flex; align-items: center; justify-content: space-between; padding: 1.51vw 1.25vw; border-top-left-radius: 0.625vw; border-top-right-radius: 0.625vw; cursor: pointer; } .faq-question-text { flex: 1; color: #191A15; font-size: 0.938vw; font-family: Poppins, sans-serif; font-weight: 600; line-height: 1.406vw; } .faq-toggle { width: 1.667vw; height: 1.667vw; background: #f5f6f7; border-radius: 50%; display: flex; justify-content: center; align-items: center; color: #323232; } .faq-divider { height: 0.052vw; background: #F0F0F0; width: 100%; } .faq-answer { padding: 1.667vw 1.563vw; color: #525252; font-size: 0.833vw; font-family: Poppins, sans-serif; font-weight: 400; line-height: 1.25vw; } /* ================== Badge Section ================== */ .badge-text { color: #CA8A04; font-size: 0.729vw; font-weight: 500; font-family: 'Poppins', sans-serif; line-height: 1.042vw; letter-spacing: -0.01em; } /* ================== Time Section ================== */ .time-info { color: #6B7280; font-size: 0.833vw; font-weight: 400; font-family: 'Poppins', sans-serif; } /* ================== Query Meta Section ================== */ .query-meta { color: #6B7280; font-size: 0.833vw; font-weight: 400; font-family: 'Poppins', sans-serif; } /* ================== Query Description Section ================== */ .query-description { color: #6B7280; font-size: 0.833vw; font-weight: 400; font-family: 'Poppins', sans-serif; } /* Change question text color when open */ .faq-card.faq-open .faq-question-text { color: #294D92; /* your active color */ font-weight: 700; } /* Optional: change toggle background color */ .faq-card.faq-open .faq-toggle { background: #294D92; color: white; } /* Optional: change card border or background */ .faq-card.faq-open { border: 1px solid #294D92; background: #f0f4ff; } .coming-soon { position: absolute; top: 0; left: 0; background: #009E12; border-radius: 3vw; padding: 0.2vw 1vw; display: inline-flex; justify-content: center; align-items: center; } .coming-soon-text { color: #fff; font-size: 0.8vw; font-family: Poppins, sans-serif; font-weight: 500; line-height: 1.2vw; white-space: nowrap; } .coming-soon-badge { padding: 0.1vw 0.2vw; font-size: 0.6166666666666667vw; background: #009E12; color: #fff; border-radius: 0.4vw; white-space: nowrap; margin: 0 0 0 9.3vw; } /* Add a disabled style */ .disabled-card { pointer-events: none; /* prevents clicking */ opacity: 0.5; /* visually show it’s disabled */ cursor: not-allowed; } ::ng-deep .custom-select .ng-select-container { width: 100%; height: 1.8vw !important; min-height: 1.8vw !important; border-radius: 0.42vw; background: #fff; border: 0.05vw solid #e4e4e7; padding: 0; } ::ng-deep .custom-select .ng-value-container { padding: 0 0.5vw; display: flex; align-items: center; height: 100%; } ::ng-deep .custom-select .ng-placeholder, ::ng-deep .custom-select .ng-value { font-family: Poppins, sans-serif; font-size: 0.733vw; font-style: normal; font-weight: 400; line-height: 1.25vw; top: 0; padding: 0; } ::ng-deep .custom-select .ng-input input { font-family: Poppins, sans-serif; font-size: 0.833vw; } ::ng-deep .custom-select .ng-dropdown-panel { font-family: Poppins, sans-serif; font-size: 0.733vw; border-radius: 0.42vw; border: 0.05vw solid #e4e4e7; //margin-top: 0.2vw; } ::ng-deep .custom-select .ng-option { padding: 0.5vw; font-size: 0.733vw; line-height: 1.25vw; } ::ng-deep .custom-select .ng-option:hover { background-color: #f5f5f5; } ::ng-deep .custom-select .ng-option-selected { background-color: #e8f5e9; } ============================================================================ Ts ========================================================= import { Component, numberAttribute } from '@angular/core'; import { FormBuilder, FormGroup, Validators } from '@angular/forms'; import { ActivatedRoute, Router } from '@angular/router'; import { ToastrService } from 'ngx-toastr'; import { ApiService } from 'src/app/core/api.service'; @Component({ selector: 'app-help-and-support', templateUrl: './help-and-support.component.html', styleUrls: ['./help-and-support.component.scss'] }) export class HelpAndSupportComponent { showPopup:boolean=false raiseQueryForm!: FormGroup; constructor(private fb: FormBuilder,private apiservice:ApiService,private router: Router, private toastr:ToastrService,private userService: ApiService, private route: ActivatedRoute,){} ngOnDestroy() { this.showPopup=true; } ngOnInit(){ this.raiseQueryForm = this.fb.group({ manuscriptId: [''], queryList:[null,Validators.required], subject: ['', Validators.required], priority: ['', Validators.required], description: ['', Validators.required], attachments: [null] }); } searchTerm = ''; supportOptions = [ { icon: 'help', // This is the Material Symbols icon name iconClass: 'query', title: 'Raise a Query', description: 'Submit a support ticket for technical issues, account problems, or general inquiries', } , { icon: 'description', iconClass: 'tickets', title: 'My Queries', description: 'Track your submitted queries and view response history', }, { icon: 'support_agent', iconClass: 'chat', title: 'Live Chat Support', description: 'Get instant help from our support team during business hours', }, { icon: 'contact_mail', iconClass: 'contact', title: 'Reach us via email', description: 'The ReviewerOne team can also be reached at support@reviewerone.com . Note that it usually takes us 3-4 business days to respond.', } ]; helpTopics = [ { icon: '8380015 2.svg', iconClass: 'account', title: 'Account & Profile', articles: '8 Articles' }, { icon: '26433067_7228781 1.svg', iconClass: 'create', title: 'Create Assignment', articles: '12 Articles' }, { icon: '15682 2.svg', iconClass: 'assignments', title: 'My Assignments', articles: '13 Articles' }, { icon: '34654433_8202589 1.svg', iconClass: 'lms', title: 'Reviewer Academy', articles: '14 Articles' }, { icon: '9486926 2.svg', iconClass: 'rewards', title: 'Rewards and Recognition', articles: '14 Articles' }, { icon: '13677906_5143448 2.svg', iconClass: 'invite', title: 'Invite and Refer', articles: '14 Articles' }, { icon: '29210391_34 2.svg', iconClass: 'review', title: 'Review Process', articles: '12 Articles' }, { icon: '32554801_m003t0569_a_paperwork_014aug22 2.svg', iconClass: 'guidelines', title: 'Guidelines & Policies', articles: '10 Articles' }, ]; get filteredSupportOptions() { return this.supportOptions.filter(opt => opt.title.toLowerCase().includes(this.searchTerm.toLowerCase()) || opt.description.toLowerCase().includes(this.searchTerm.toLowerCase()) ); } get filteredHelpTopics() { return this.helpTopics.filter(topic => topic.title.toLowerCase().includes(this.searchTerm.toLowerCase()) ); } myQueryList=[ {label:'A manuscript I am reviewing Manuscript ID', value:'A manuscript I am reviewing Manuscript ID'}, {label:'Reviewer recognition - for a specific manuscript', value:'Reviewer recognition - for a specific manuscript'}, {label:'Reviewer recognition - general query ', value:'Reviewer recognition - general query '}, {label:'An issue while reviewing', value:'An issue while reviewing'}, {label:'My ReviewerOne account', value:'My ReviewerOne account'}, {label:'Something that is not listed here', value:'Something that is not listed here'} ] faqs = [ { question: 'What should a reviewer do if they face technical issues while using ReviewerOne?', answer: 'If reviewers face login issues, system errors, or problems accessing manuscripts, they can immediately contact the ReviewerOne support team through the Help & Support tab available on their dashboard. Additionally, users can email the dedicated support team or raise a ticket via the integrated support system for quicker resolution.', open: false }, { question: 'Where can reviewers find training or help resources?', answer: 'ReviewerOne provides user guides and FAQ sections for self-help. If further assistance is needed, reviewers can contact the support team for one-on-one guidance.', open: false }, { question: 'How secure is my data on ReviewerOne?', answer: 'ReviewerOne ensures high-level data protection with encrypted file handling, secure logins, and GDPR-compliant privacy measures. Manuscripts, reviews, and personal data are strictly confidential.', open: false }, { question: 'How does ReviewerOne handle deadlines for reviewers?', answer: 'The platform displays clear deadlines on the reviewer’s dashboard. Reviewers also receive automated reminders before the due date. If a reviewer is unable to complete a review on time, they should inform the editor through the platform so alternate arrangements can be made.', open: false }, { question: 'Can I update my profile and expertise areas in ReviewerOne?', answer: 'Yes, reviewers can update their profiles at any time by adding qualifications, affiliations, and areas of expertise. This helps the system and editors assign relevant manuscripts that match the reviewer’s domain knowledge.', open: false }, { question: 'What happens if a reviewer misses the deadline?', answer: 'If a reviewer does not submit feedback by the deadline, the system notifies the editor. The editor may choose to extend the deadline or reassign the manuscript to another reviewer. Reviewers are encouraged to communicate in advance if they anticipate delays.', open: false }, { question: 'What should I do if I cannot access a manuscript file or feedback form?', answer: 'If a manuscript or feedback form is not opening, reviewers should try refreshing the page, clearing their cache, or switching browsers. If the issue persists, they should immediately raise a support ticket via the Help section.', open: false }, { question: 'How do I contact ReviewerOne support?', answer: 'Users can access the Help & Support tab inside the platform, where they can raise a ticket describing their issue, access FAQs and troubleshooting guides, or directly email the ReviewerOne support team. Support is available for all technical, access, or workflow-related queries.', open: false } ]; toggleFaq(index: number) { this.faqs = this.faqs.map((faq, i) => { if (i === index) { // Toggle the clicked FAQ return { ...faq, open: !faq.open }; } else { // Close all other FAQs return { ...faq, open: false }; } }); } closePopup() { this.showPopup = false; } getBaseRoute(): string { const url = this.router.url; return url.includes('/login') ? 'login' : 'home'; } raiseQuery(i:number){ debugger const base = this.getBaseRoute(); if(i === 0){ this.showPopup = true; }else if (i === 1) { this.router.navigate([`/${base}/help/queries`]); } else if (i === 2){ //this.router.navigate([`/${base}/help/Livechat`]); } else if (i === 3){ this.router.navigate([`/${base}/help/contact`]); } } contatUs(){ const base = this.getBaseRoute(); this.router.navigate([`/${base}/help/contact`]); } onHelpManual(topicTitle: string) { const url = `/help-manual?topic=${encodeURIComponent(topicTitle)}`; console.log('URL',url) window.open(url, '_blank'); // opens in new tab } onSubmit() { if (this.raiseQueryForm.invalid) { this.raiseQueryForm.markAllAsTouched() this.toastr.error('Please fill all required fields'); return; } const requestBody = { queryId:"String", userId: Number(localStorage.getItem('basicUserId')), manuScriptId: this.raiseQueryForm.get('manuscriptId')?.value, subject: this.raiseQueryForm.get('subject')?.value, description: this.raiseQueryForm.get('description')?.value, priorityLevel: this.raiseQueryForm.get('priority')?.value, attachments: this.raiseQueryForm.get('attachments')?.value, createdOn: new Date().toISOString() }; console.log(requestBody) this.apiservice.addHelpSupport(requestBody).subscribe({ next: (res: any) => { if (res.message === 'Help & Support record inserted successfully') { this.toastr.success('Query added successfully'); this.raiseQueryForm.reset(); // reset form after submit this.showPopup=false } else { this.toastr.error('Something went wrong'); } }, error: (err) => { this.toastr.error('Server error, please try again later'); console.error(err); } }); } }

Help & Support Center

{{ option.title }}

Browse Help Topics

{{ topic.title }}

Frequently Asked Questions

Still have questions?