irongit
slroof/pages/services-details.js
147 lines12 KBJavaScript
1import Layout from "@/components/layout/Layout"
2import Brand3 from "@/components/sections/Brand3"
3import Link from "next/link"
4export default function ServiceDetails() {
5
6 return (
7 <>
8 <Layout breadcrumbTitle="Service Details">
9 <div>
10 <section className="services-details-area pt-120">
11 <div className="container">
12 <div className="row justify-content-center">
13 <div className="col-xl-8">
14 <div className="services-details-wrap">
15 <div className="services-details-thumb">
16 <img src="/assets/img/services/services_details01.jpg" alt="" />
17 </div>
18 <div className="services-details-content">
19 <h2 className="title">Modified roofing beautiful wooden house with big windows</h2>
20 <p>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in somes form, by injected humour, or randomised words which don't look even slightlcy believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of textss. All the Lorem Ipsum generators on the Internet tend to repeat</p>
21 <div className="services-process-wrap">
22 <div className="row justify-content-center">
23 <div className="col-lg-6 col-md-8">
24 <div className="services-process-img">
25 <img src="/assets/img/services/sp_img01.jpg" alt="" />
26 <img src="/assets/img/services/sp_img02.jpg" alt="" />
27 </div>
28 </div>
29 <div className="col-lg-6">
30 <div className="services-process-content">
31 <h2 className="title">Our Service Process</h2>
32 <ul className="list-wrap">
33 <li>
34 <div className="services-process-item">
35 <div className="icon">
36 <img src="/assets/img/icon/sp_icon01.svg" alt="" />
37 </div>
38 <div className="content">
39 <h4 className="title">Creative Analysis</h4>
40 <p>Creative analysis is important. It is common for marketers</p>
41 </div>
42 </div>
43 </li>
44 <li>
45 <div className="services-process-item">
46 <div className="icon">
47 <img src="/assets/img/icon/sp_icon02.svg" alt="" />
48 </div>
49 <div className="content">
50 <h4 className="title">Design Scratches</h4>
51 <p>Creative analysis is important. It is common for marketers</p>
52 </div>
53 </div>
54 </li>
55 <li>
56 <div className="services-process-item">
57 <div className="icon">
58 <img src="/assets/img/icon/sp_icon01.svg" alt="" />
59 </div>
60 <div className="content">
61 <h4 className="title">Development Delivery</h4>
62 <p>Creative analysis is important. It is common for marketers</p>
63 </div>
64 </div>
65 </li>
66 </ul>
67 </div>
68 </div>
69 </div>
70 </div>
71 <h2 className="title-two">We Hope You Find What You are Looking for</h2>
72 <p>There are many variations of passages of Lorem Ipsum available, but the majorty have suffered alteration in as some form by injected humour, or randomised words which don't look even slightly believable. If you are going a to use as passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of textss. All the Lorem Ipsum generators on the Internet tend to repeat</p>
73 <div className="service-benefits-wrap">
74 <div className="row">
75 <div className="col-lg-7 order-0 order-lg-2">
76 <div className="benefits-img">
77 <img src="/assets/img/services/sb_img01.jpg" alt="" />
78 <img src="/assets/img/services/sb_img02.jpg" alt="" />
79 </div>
80 </div>
81 <div className="col-lg-5">
82 <div className="benefits-content">
83 <h2 className="title">Our Service Benefits</h2>
84 <p>There are many variations of passages of Lorem by injected humour, or randomised words whic Lorem Ipsum, you need to.</p>
85 <ul className="list-wrap">
86 <li><i className="fas fa-check-circle" />In id diam nec nisi congue tincidunt</li>
87 <li><i className="fas fa-check-circle" />Vestibulum tincidunt arcu vel nisl</li>
88 <li><i className="fas fa-check-circle" />Provide the best roof services</li>
89 <li><i className="fas fa-check-circle" />Sed tristique lorem non tesque</li>
90 </ul>
91 </div>
92 </div>
93 </div>
94 </div>
95 </div>
96 </div>
97 </div>
98 <div className="col-xl-4 col-lg-6">
99 <aside className="services-sidebar">
100 <div className="services-widget">
101 <h4 className="widget-title">Our All Service</h4>
102 <div className="our-services-list">
103 <ul className="list-wrap">
104 <li><Link href="#">Single play roofing<i className="fas fa-arrow-right" /></Link></li>
105 <li><Link href="#">Modified roofing<i className="fas fa-arrow-right" /></Link></li>
106 <li><Link href="#">Buil-up roofing<i className="fas fa-arrow-right" /></Link></li>
107 <li><Link href="#">Roof inspection<i className="fas fa-arrow-right" /></Link></li>
108 <li><Link href="#">Metal roofing<i className="fas fa-arrow-right" /></Link></li>
109 </ul>
110 </div>
111 </div>
112 <div className="services-widget widget-bg" data-background="/assets/img/services/sw_bg.jpg">
113 <h4 className="widget-title">Get a free quote</h4>
114 <form action="#" className="sidebar-form">
115 <div className="form-grp">
116 <input id="name" type="text" placeholder="Your Name" />
117 </div>
118 <div className="form-grp">
119 <input id="email" type="text" placeholder="Your Email Address" />
120 </div>
121 <div className="form-grp">
122 <textarea id="message" placeholder="Your Message" />
123 </div>
124 <button type="submit" className="btn btn-two">Contact Us</button>
125 </form>
126 </div>
127 <div className="services-widget">
128 <h4 className="widget-title">Our Brochures Download</h4>
129 <div className="download-wrap">
130 <Link href="assets/img/services/services_details01.jpg" download target="_blank"><i className="fas fa-cloud-download-alt" />Service Details.pdf 65 KB</Link>
131 <Link href="assets/img/services/services_details01.jpg" download target="_blank"><i className="fas fa-file-pdf" />Roofing Models.doc 48 KB</Link>
132 </div>
133 </div>
134 </aside>
135 </div>
136 </div>
137 </div>
138 </section>
139 {/* services-details-area-end */}
140 {/* brand-area */}
141 <Brand3 />
142 </div>
143
144 </Layout>
145 </>
146 )
147}