forum added

This commit is contained in:
CHIEFSOFT\ameye
2025-12-10 14:22:00 -05:00
parent 19c81a875e
commit 9616d28ce8
+65 -33
View File
@@ -1,6 +1,6 @@
import Layout from "../components/layout/Layout"
import Link from "next/link"
import { useState } from "react"
import {useState} from "react"
const tabs = [
{name: 'Getting Started', icon: 'flaticon-mechanics'},
@@ -10,25 +10,41 @@ const tabs = [
]
const tabContents = {
'Getting Started' : [
{title: 'What is MERMS, and how does it work?', desc: `MERMS operates on a cloud-based model, allowing users to access the software from anywhere, at any time. By leveraging advanced technology, MERMS streamlines processes, enhances collaboration, and provides real-time data analytics. This system automates routine tasks, enabling teams to focus on more strategic initiatives.`},
{title: 'What can I do with MERMS?', desc: `With MERMS, users can manage projects, track budgets, oversee inventory, and collaborate across different departments. Whether you're in finance, marketing, or operations, MERMS offers customizable solutions to cater to your specific needs. Not only can you streamline processes, but you can also improve decision-making with data-driven insights.`},
{title: 'Which Product and Tools does MERMS support?', desc: `MERMS supports a wide array of tools, including CRM systems, project management software, and financial applications. It integrates seamlessly with popular platforms like Slack, Microsoft Teams, and Google Workspace, allowing for a comprehensive management experience without losing functionality.`},
{title: 'Can I Automate with MERMS?', desc: `Yes! MERMS offers robust automation capabilities. Users can set up automated workflows for routine tasks, such as reporting, notifications, and data entry, minimizing human error and saving valuable time. This feature enhances productivity, making it easier for organizations to scale and adapt to changing needs.`}
],
'Getting Started': [
{
title: 'What is MERMS, and how does it work?',
desc: `MERMS operates on a cloud-based model, allowing users to access the software from anywhere, at any time. By leveraging advanced technology, MERMS streamlines processes, enhances collaboration, and provides real-time data analytics. This system automates routine tasks, enabling teams to focus on more strategic initiatives.`
},
{
title: 'What can I do with MERMS?',
desc: `With MERMS, users can manage projects, track budgets, oversee inventory, and collaborate across different departments. Whether you're in finance, marketing, or operations, MERMS offers customizable solutions to cater to your specific needs. Not only can you streamline processes, but you can also improve decision-making with data-driven insights.`
},
{
title: 'Which Product and Tools does MERMS support?',
desc: `MERMS supports a wide array of tools, including CRM systems, project management software, and financial applications. It integrates seamlessly with popular platforms like Slack, Microsoft Teams, and Google Workspace, allowing for a comprehensive management experience without losing functionality.`
},
{
title: 'Can I Automate with MERMS?',
desc: `Yes! MERMS offers robust automation capabilities. Users can set up automated workflows for routine tasks, such as reporting, notifications, and data entry, minimizing human error and saving valuable time. This feature enhances productivity, making it easier for organizations to scale and adapt to changing needs.`
}
],
'My Account': [
{title: 'Sign up and manage your account', desc: `Curabitur ac dapibus libero eu congue tristique neque.`},
],
{title: 'Sign up and manage your account', desc: `Curabitur ac dapibus libero eu congue tristique neque.`},
],
'Pricing Plans': [
{title: 'How much does MERMS cost?', desc: `Curabitur ac dapibus libero eu congue tristique neque.`},
],
{title: 'How much does MERMS cost?', desc: `Curabitur ac dapibus libero eu congue tristique neque.`},
],
'Other Questions': [
{title: 'How do I get the error log?', desc: `Curabitur ac dapibus libero eu congue tristique neque.`},
]
{
title: 'How do I get a custom solution from MERMS?',
desc: `Simply contact our product team and describe your need. We will engage to understand and help reach your objectives.`
},
{title: 'How do I get the error log?', desc: `Curabitur ac dapibus libero eu congue tristique neque.`},
]
}
export default function Home() {
@@ -75,33 +91,40 @@ export default function Home() {
<div className="tabs-nav tabs--theme clearfix">
<ul className="tabs-1">
{/* TAB-1 LINK */}
{tabs.map((tab, index)=>(
<li key={index} className={activeTab?.name === tab?.name ? "tab-link ico-45 r-16 current" : "tab-link ico-45 r-16"} onClick={() => handleOnClick(tab)}>
<div className="tab-link-ico"><span className={tab.icon} /></div>
{tabs.map((tab, index) => (
<li key={index}
className={activeTab?.name === tab?.name ? "tab-link ico-45 r-16 current" : "tab-link ico-45 r-16"}
onClick={() => handleOnClick(tab)}>
<div className="tab-link-ico"><span className={tab.icon}/></div>
<p>{tab.name}</p>
</li>
))}
</ul>
</div>
</div>
</div> {/* END TABS NAVIGATION */}
</div>
{/* END TABS NAVIGATION */}
{/* TABS CONTENT */}
<div className="tabs-content">
<div className="row justify-content-center">
<div className="col-xl-10">
{/* CONTENT */}
{tabs.map((tab, index)=>(
<div key={index} id="tab-1" className={activeTab?.name === tab?.name ? "tab-content current" : "tab-content "}>
{tabs.map((tab, index) => (
<div key={index} id="tab-1"
className={activeTab?.name === tab?.name ? "tab-content current" : "tab-content "}>
<div className="accordion-wrapper">
<ul className="accordion">
{tabContents[activeTab.name]?.map((content, index)=>(
<li key={index} className={isActive.key == index ? "accordion-item is-active" : "accordion-item"} onClick={() => handleToggle(index)}>
{tabContents[activeTab.name]?.map((content, index) => (
<li key={index}
className={isActive.key == index ? "accordion-item is-active" : "accordion-item"}
onClick={() => handleToggle(index)}>
{/* Question */}
<div className="accordion-thumb">
<h5 className="s-22 w-700">{content?.title}</h5>
</div>
{/* Answer */}
<div className="accordion-panel color--grey" style={{ display: `${isActive.key == index ? "block" : "none"}` }}>
<div className="accordion-panel color--grey"
style={{display: `${isActive.key == index ? "block" : "none"}`}}>
{/* Text */}
<p>{content?.desc}</p>
</div>
@@ -113,10 +136,14 @@ export default function Home() {
))}
{/* END OF CONTENT */}
</div>
</div> {/* End row */}
</div> {/* END TABS CONTENT */}
</div> {/* End container */}
</section> {/* END FAQs-4 */}
</div>
{/* End row */}
</div>
{/* END TABS CONTENT */}
</div>
{/* End container */}
</section>
{/* END FAQs-4 */}
{/* BANNER-9
============================================= */}
<section id="banner-9" className="bg--02 py-70 x-border banner-section">
@@ -130,20 +157,25 @@ export default function Home() {
{/* Title */}
<h3 className="s-40 w-700">Still need help?</h3>
{/* Text */}
<p className="p-lg">Don't hesitate to contact us about any question you might be interested in</p>
<p className="p-lg">Don't hesitate to contact us about any question you
might be interested in</p>
{/* Button */}
<Link href="/contacts" className="btn r-04 btn--theme hover--theme">Ask your question here</Link>
<Link href="/contacts" className="btn r-04 btn--theme hover--theme">Ask your
question here</Link>
</div>
</div>
{/* BANNER-9 IMAGE */}
<div className="col-md-5 col-xl-5">
<div className="banner-9-img text-end">
<img className="img-fluid" src="/images/help.png" alt="banner-image" />
<img className="img-fluid" src="/images/help.png" alt="banner-image"/>
</div>
</div>
</div> {/* End row */}
</div> {/* END BANNER-9 WRAPPER */}
</div> {/* End container */}
</div>
{/* End row */}
</div>
{/* END BANNER-9 WRAPPER */}
</div>
{/* End container */}
</section>
</div>