Compare commits
5 Commits
884e9cac3f
...
a9f655930e
| Author | SHA1 | Date | |
|---|---|---|---|
| a9f655930e | |||
|
|
88fd584273 | ||
| 064c8f79a2 | |||
|
|
c664ebea9d | ||
|
|
dd083b1934 |
@ -92,14 +92,17 @@ const ServiceSectionS2 = () => {
|
||||
href={`/services/[slug]`}
|
||||
as={`/services/${service.slug}`} // Dynamic slug
|
||||
>
|
||||
{service.sTitle} {/* Service Title */}
|
||||
{service.sTitle.length > 30
|
||||
? service.sTitle.substring(0, 30) + "..."
|
||||
: service.sTitle
|
||||
}
|
||||
</Link>
|
||||
</h2>
|
||||
<p
|
||||
dangerouslySetInnerHTML={{
|
||||
__html:
|
||||
service.description.length > 100
|
||||
? service.description.substring(0, 100) + "..."
|
||||
service.description.length > 80
|
||||
? service.description.substring(0, 80) + "..."
|
||||
: service.description,
|
||||
}}
|
||||
></p>
|
||||
|
||||
@ -12,12 +12,12 @@ const OurMission = () => {
|
||||
<div className="wpo-blog-content">
|
||||
<div className="post format-standard-image">
|
||||
<div
|
||||
className="entry-media"
|
||||
style={{ width: "100%", height: "auto", overflow: "hidden" }}
|
||||
>
|
||||
className="responsive-entry-media" >
|
||||
<img
|
||||
src="/images/our-mission/imgg.webp"
|
||||
alt=""
|
||||
fill
|
||||
style={{ objectFit: 'cover' }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
@ -47,17 +47,14 @@ const BlogSingle = () => {
|
||||
<div className="col col-lg-12 col-12">
|
||||
<div className="wpo-blog-content">
|
||||
<div className={`post ${blogMeta.blClass}`}>
|
||||
<div className="entry-media">
|
||||
<div style={{ width: '100%', height: '400px', position: 'relative' }}>
|
||||
<Image
|
||||
src={blogMeta.blogSingleImg}
|
||||
alt={blogContent.title}
|
||||
fill
|
||||
style={{ objectFit: 'cover' }}
|
||||
/>
|
||||
</div>
|
||||
<div className="responsive-entry-media">
|
||||
<Image
|
||||
src={blogMeta.blogSingleImg}
|
||||
alt={blogContent.title}
|
||||
fill
|
||||
style={{ objectFit: 'cover' }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* <div className="entry-meta">
|
||||
<ul>
|
||||
<li><i className="fi flaticon-calendar"></i> {blogMeta.create_at}</li>
|
||||
|
||||
@ -42,16 +42,13 @@ const ServiceDetailsPage = ({ service }) => {
|
||||
<div className="wpo-blog-content">
|
||||
<div className="post format-standard-image">
|
||||
{/* Banner Image */}
|
||||
<div className="entry-media">
|
||||
<div style={{ width: "100%", height: "650px", position: "relative" }}>
|
||||
<Image
|
||||
src={service.sImgS}
|
||||
alt={service.sTitle}
|
||||
fill
|
||||
style={{ objectFit: "cover" }}
|
||||
unoptimized
|
||||
/>
|
||||
</div>
|
||||
<div className="responsive-entry-media2">
|
||||
<Image
|
||||
src={service.sImgS}
|
||||
alt={service.sTitle}
|
||||
fill
|
||||
style={{ objectFit: 'cover' }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<h2 className="mt-4">{service.sTitle}</h2>
|
||||
|
||||
@ -423,7 +423,7 @@
|
||||
float: none;
|
||||
position: relative;
|
||||
z-index: 99;
|
||||
text-align: center;
|
||||
// text-align: center;
|
||||
}
|
||||
|
||||
.wpo-site-header .navbar-right {
|
||||
@ -1328,6 +1328,13 @@
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.navbar-header .navbar-brand img {
|
||||
max-width: 220px;
|
||||
width: auto;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
/*navbar collaps less then 992px*/
|
||||
@include media-query (991px) {
|
||||
@ -1809,161 +1816,238 @@
|
||||
|
||||
|
||||
.mobileMenu {
|
||||
position: fixed;
|
||||
left: -300px;
|
||||
top: 0;
|
||||
z-index: 9999;
|
||||
height: 100vh;
|
||||
width: 300px;
|
||||
background: linear-gradient(286.02deg, #080A14 38.02%, #10121E 61.92%, #282A34 74.32%, #404354 90.71%, #343643 99.65%);
|
||||
transition: all 0.3s ease 0s;
|
||||
box-shadow: 0px 10px 40px 0px rgba(50, 50, 50, 0.1);
|
||||
overflow-x: auto;
|
||||
overflow-y: scroll;
|
||||
position: fixed;
|
||||
left: -300px;
|
||||
top: 0;
|
||||
z-index: 9999;
|
||||
height: 100vh;
|
||||
width: 300px;
|
||||
background: linear-gradient(286.02deg, #080A14 38.02%, #10121E 61.92%, #282A34 74.32%, #404354 90.71%, #343643 99.65%);
|
||||
transition: all 0.3s ease 0s;
|
||||
box-shadow: 0px 10px 40px 0px rgba(50, 50, 50, 0.1);
|
||||
overflow-x: auto;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
.responsivemenu .card-body{
|
||||
background: linear-gradient(286.02deg, #080A14 38.02%, #10121E 61.92%, #282A34 74.32%, #404354 90.71%, #343643 99.65%);
|
||||
|
||||
.responsivemenu .card-body {
|
||||
background: linear-gradient(286.02deg, #080A14 38.02%, #10121E 61.92%, #282A34 74.32%, #404354 90.71%, #343643 99.65%);
|
||||
}
|
||||
.mobileMenu h2{
|
||||
padding-left: 20px;
|
||||
|
||||
.mobileMenu h2 {
|
||||
padding-left: 20px;
|
||||
}
|
||||
.mobileMenu.show{
|
||||
left: 0;
|
||||
|
||||
.mobileMenu.show {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.showmenu {
|
||||
position: relative;
|
||||
top: 0;
|
||||
z-index: 999;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
top: 0;
|
||||
z-index: 999;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.responsivemenu {
|
||||
list-style: none;
|
||||
padding-left: 0;
|
||||
padding-top: 10px;
|
||||
list-style: none;
|
||||
padding-left: 0;
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
.responsivemenu li a,
|
||||
.responsivemenu li p,
|
||||
.responsivemenu ul{
|
||||
display: block;
|
||||
padding: 13px 35px;
|
||||
font-size: 16px;
|
||||
letter-spacing: 0;
|
||||
text-transform: capitalize;
|
||||
font-weight: 500;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
.responsivemenu ul {
|
||||
display: block;
|
||||
padding: 13px 35px;
|
||||
font-size: 16px;
|
||||
letter-spacing: 0;
|
||||
text-transform: capitalize;
|
||||
font-weight: 500;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
}
|
||||
.responsivemenu li p{
|
||||
position: relative;
|
||||
margin-bottom: 0;
|
||||
|
||||
.responsivemenu li p {
|
||||
position: relative;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.responsivemenu ul.subMenu{
|
||||
padding-top: 0;
|
||||
padding-left: 15px;
|
||||
padding-right: 0;
|
||||
|
||||
.responsivemenu ul.subMenu {
|
||||
padding-top: 0;
|
||||
padding-left: 15px;
|
||||
padding-right: 0;
|
||||
}
|
||||
.responsivemenu ul.subMenu ul{
|
||||
position: relative;
|
||||
margin-bottom: 0;
|
||||
padding-left: 0;
|
||||
|
||||
.responsivemenu ul.subMenu ul {
|
||||
position: relative;
|
||||
margin-bottom: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
.responsivemenu ul{
|
||||
list-style: none;
|
||||
|
||||
.responsivemenu ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.responsivemenu ul p,
|
||||
.responsivemenu ul a{
|
||||
color: #fff;
|
||||
position: relative;
|
||||
font-size: 16px;
|
||||
.responsivemenu ul a {
|
||||
color: #fff;
|
||||
position: relative;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.responsivemenu ul p i{
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 5px;
|
||||
.responsivemenu ul p i {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 5px;
|
||||
}
|
||||
|
||||
.responsivemenu .card{
|
||||
border:none
|
||||
.responsivemenu .card {
|
||||
border: none
|
||||
}
|
||||
.responsivemenu .card-body{
|
||||
padding-top: 0;
|
||||
|
||||
.responsivemenu .card-body {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
|
||||
.responsivemenu li a{
|
||||
position: relative;
|
||||
.responsivemenu li a {
|
||||
position: relative;
|
||||
}
|
||||
.responsivemenu li i{
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
top: 17px;
|
||||
|
||||
.responsivemenu li i {
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
top: 17px;
|
||||
}
|
||||
|
||||
.showmenu i {
|
||||
font-size: 30px;
|
||||
color: #fff;
|
||||
font-size: 30px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.mobileMenu{
|
||||
display: none;
|
||||
}
|
||||
.showmenu{
|
||||
display: none;
|
||||
}
|
||||
@media (max-width:992px){
|
||||
.showmenu {
|
||||
display: block;
|
||||
width: 40px;
|
||||
height: 36px;
|
||||
text-align: center;
|
||||
line-height: 40px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.showmenu button:focus{
|
||||
outline: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
.showmenu button span{
|
||||
background-color: #fff;
|
||||
width: 20px;
|
||||
display: block;
|
||||
height: 2px;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.mobileMenu{
|
||||
display: block;
|
||||
}
|
||||
.mobileMenu {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.showmenu {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media (max-width:992px) {
|
||||
.showmenu {
|
||||
display: block;
|
||||
width: 40px;
|
||||
height: 36px;
|
||||
text-align: center;
|
||||
line-height: 40px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.showmenu button:focus {
|
||||
outline: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.showmenu button span {
|
||||
background-color: #fff;
|
||||
width: 20px;
|
||||
display: block;
|
||||
height: 2px;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.mobileMenu {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.header-container {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
.showmenu {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
display: block;
|
||||
width: 40px;
|
||||
height: 36px;
|
||||
margin-right: 30px;
|
||||
text-align: center;
|
||||
line-height: 40px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.showmenu button span {
|
||||
width: 20px;
|
||||
height: 2px;
|
||||
margin: 0 auto 5px auto;
|
||||
background-color: #fff;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.middle-header-3 .showmenu {
|
||||
top: 36px;
|
||||
top: 36px;
|
||||
}
|
||||
|
||||
.middle-header2 .showmenu {
|
||||
top: 26px;
|
||||
top: 26px;
|
||||
}
|
||||
|
||||
.middle-header-3 .showmenu i{
|
||||
color: #fff;
|
||||
.middle-header-3 .showmenu i {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
|
||||
@media(max-width:450px){
|
||||
.mobileMenu {
|
||||
left: -260px;
|
||||
width: 260px;
|
||||
}
|
||||
.responsivemenu li a, .responsivemenu li p {
|
||||
font-size: 14px;
|
||||
padding: 13px 25px;
|
||||
}
|
||||
@media(max-width:450px) {
|
||||
.mobileMenu {
|
||||
left: -260px;
|
||||
width: 260px;
|
||||
}
|
||||
|
||||
.responsivemenu li a,
|
||||
.responsivemenu li p {
|
||||
font-size: 14px;
|
||||
padding: 13px 25px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.responsivemenu a:not([href]):not([class]),
|
||||
.responsivemenu a:not([href]):not([class]):hover{
|
||||
color: #ddd;
|
||||
}
|
||||
.responsivemenu a:not([href]):not([class]),
|
||||
.responsivemenu a:not([href]):not([class]):hover {
|
||||
color: #ddd;
|
||||
}
|
||||
.responsive-entry-media {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
aspect-ratio:28 / 9;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.responsive-entry-media img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.responsive-entry-media2 {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
aspect-ratio:3 / 2;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.responsive-entry-media2 img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
|
||||
@ -1082,6 +1082,7 @@
|
||||
}
|
||||
|
||||
.wpo-campaign-text-top {
|
||||
min-height: 215px;
|
||||
padding: 15px;
|
||||
padding-top: 22px;
|
||||
|
||||
|
||||
@ -81,12 +81,16 @@
|
||||
margin: -1px;
|
||||
cursor: pointer;
|
||||
|
||||
@media(max-width:1199px){
|
||||
padding: 12px;
|
||||
@media(max-width:1024px){
|
||||
padding: 10px 21px;
|
||||
font-size: 18px;
|
||||
}
|
||||
@media(max-width:767px){
|
||||
padding: 10px;
|
||||
@media(max-width:768px){
|
||||
padding: 5px 13px;
|
||||
font-size: 14px;
|
||||
}
|
||||
@media(max-width:500px){
|
||||
padding: 5px 2px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user