Skip to content

C
Codeinfotech
Commit c5485bb4 by abraham
Options

updated

parent 46bdce61
Showing with 388 additions and 47 deletions
src/app/body/aboutus/aboutus.component.scss
...@@ -223,6 +223,7 @@ ...@@ -223,6 +223,7 @@
} }
.container{ .container{
margin-top: 50px; margin-top: 50px;
margin-bottom: 30px;
.row{ .row{
justify-content: space-around; justify-content: space-around;
.col-md-5{ .col-md-5{
......
src/app/body/landingpage/landingpage.component.html
<div class="backgnd_grey"> <div class="landing_page">
<div class="backgnd_grey">
<div class="map_overlay"> <div class="map_overlay">
<div class="container map_contents"> <div class="container map_contents">
<ngx-slick-carousel class="carousel" <ngx-slick-carousel class="carousel"
#slickModal="slick-carousel" #slickModal="slick-carousel"
[config]="firstConfig"> [config]="firstConfig">
<div ngxSlickItem class="slick_main"> <div ngxSlickItem class="slick_main">
<div class="row"> <div class="row">
<div class="col-md-5"> <div class="col-md-5">
<div class="left_side"> <div class="left_side">
<span class="lorem">Lorem</span><span class="ipsum"> Ipsum </span> <span class="lorem">Lorem</span><span class="ipsum"> Ipsum </span><br>
is simply dummy text is simply dummy text
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the</p> <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the</p>
<div class="get_info" href="#"> <div class="get_info" href="#">
...@@ -23,8 +24,8 @@ ...@@ -23,8 +24,8 @@
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div ngxSlickItem class="slick_main"> <div ngxSlickItem class="slick_main">
<div class="row"> <div class="row">
<div class="col-md-5"> <div class="col-md-5">
<div class="left_side"> <div class="left_side">
...@@ -43,8 +44,8 @@ ...@@ -43,8 +44,8 @@
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div ngxSlickItem class="slick_main"> <div ngxSlickItem class="slick_main">
<div class="row"> <div class="row">
<div class="col-md-5"> <div class="col-md-5">
<div class="left_side"> <div class="left_side">
...@@ -63,8 +64,8 @@ ...@@ -63,8 +64,8 @@
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div ngxSlickItem class="slick_main"> <div ngxSlickItem class="slick_main">
<div class="row"> <div class="row">
<div class="col-md-5"> <div class="col-md-5">
<div class="left_side"> <div class="left_side">
...@@ -83,12 +84,12 @@ ...@@ -83,12 +84,12 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</ngx-slick-carousel>
</div> </div>
</ngx-slick-carousel>
</div> </div>
</div> </div>
<div class="our_products"> </div>
<div class="our_products">
<div class="prod_overlay"> <div class="prod_overlay">
<h2><div class="prod_color">OUR</div> PRODUCTS</h2> <h2><div class="prod_color">OUR</div> PRODUCTS</h2>
</div> </div>
...@@ -204,8 +205,8 @@ ...@@ -204,8 +205,8 @@
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="why_codein_overlay"> <div class="why_codein_overlay">
<div class="code_overlay"> <div class="code_overlay">
<h2 class="white_head"><div class="prod_color">WHY</div> CODEINFOTEC ?</h2> <h2 class="white_head"><div class="prod_color">WHY</div> CODEINFOTEC ?</h2>
<hr> <hr>
...@@ -264,8 +265,8 @@ ...@@ -264,8 +265,8 @@
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="rating_review"> <div class="rating_review">
<div class="rating_overlay"> <div class="rating_overlay">
<h2>RATINGS AND REVIEWS</h2> <h2>RATINGS AND REVIEWS</h2>
<hr> <hr>
...@@ -462,4 +463,5 @@ ...@@ -462,4 +463,5 @@
</div> </div>
</ngx-slick-carousel> </ngx-slick-carousel>
</div> </div>
</div>
</div> </div>
src/app/body/landingpage/landingpage.component.scss
@import url(//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css); @import url(//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css);
/****** Style Star Rating Widget *****/ /****** Style Star Rating Widget *****/
.landing_page{
.rating { .rating {
border: none; border: none;
float: left; float: left;
...@@ -36,7 +36,8 @@ ...@@ -36,7 +36,8 @@
.rating > label:hover ~ input:checked ~ label, /* lighten current selection */ .rating > label:hover ~ input:checked ~ label, /* lighten current selection */
.rating > input:checked ~ label:hover ~ label { color: #FFED85; } .rating > input:checked ~ label:hover ~ label { color: #FFED85; }
//css for landingpage //css for landingpage
.backgnd_grey{
.backgnd_grey{
background-color: rgb(239,240,241); background-color: rgb(239,240,241);
max-height: 1080px; max-height: 1080px;
max-width: 1920px; max-width: 1920px;
...@@ -49,6 +50,7 @@ ...@@ -49,6 +50,7 @@
padding-top: 300px; padding-top: 300px;
padding-bottom: 250px; padding-bottom: 250px;
.slick_main{ .slick_main{
outline: none;
.row{ .row{
.col-md-5{ .col-md-5{
display: flex; display: flex;
...@@ -122,8 +124,8 @@ ...@@ -122,8 +124,8 @@
} }
} }
} }
} }
.our_products{ .our_products{
background-color: #ffffff; background-color: #ffffff;
max-width: 1920px; max-width: 1920px;
height: auto; height: auto;
...@@ -235,8 +237,8 @@ ...@@ -235,8 +237,8 @@
} }
} }
} }
} }
h2{ h2{
display: inline; display: inline;
object-fit: contain; object-fit: contain;
font-family: Roboto; font-family: Roboto;
...@@ -252,16 +254,16 @@ h2{ ...@@ -252,16 +254,16 @@ h2{
color: #67912c; color: #67912c;
display: inline; display: inline;
} }
} }
hr{ hr{
border: 5px solid rgb(125,181,50); border: 5px solid rgb(125,181,50);
width: 57px; width: 57px;
background-color: rgb(125,181,50); background-color: rgb(125,181,50);
} }
.white_head{ .white_head{
color: #ffffff; color: #ffffff;
} }
.why_codein_overlay{ .why_codein_overlay{
padding-bottom: 70px; padding-bottom: 70px;
background-color: rgb(0, 0, 0); background-color: rgb(0, 0, 0);
overflow: auto; overflow: auto;
...@@ -291,7 +293,7 @@ hr{ ...@@ -291,7 +293,7 @@ hr{
border-right: 1px solid; border-right: 1px solid;
.image_icon{ .image_icon{
width: 74px; width: 74px;
height: 84px; height: 77px;
margin: 0 auto; margin: 0 auto;
img{ img{
width: 100%; width: 100%;
...@@ -314,8 +316,8 @@ hr{ ...@@ -314,8 +316,8 @@ hr{
} }
} }
} }
} }
.rating_review{ .rating_review{
background-color: #ffffff; background-color: #ffffff;
text-align: center; text-align: center;
.rating_overlay{ .rating_overlay{
...@@ -405,4 +407,5 @@ hr{ ...@@ -405,4 +407,5 @@ hr{
} }
} }
} }
} }
\ No newline at end of file }
src/app/body/landingpage/landingpage.component.ts
...@@ -11,6 +11,6 @@ export class LandingpageComponent implements OnInit { ...@@ -11,6 +11,6 @@ export class LandingpageComponent implements OnInit {
ngOnInit() { ngOnInit() {
} }
firstConfig = {"slidesToShow": 1, "slidesToScroll": 1,"arrows": false,"dots":true,"autoplay":true,"autoplaySpeed":2000}; firstConfig = {"slidesToShow": 1, "slidesToScroll": 1,"arrows": false,"dots":true,"autoplay":false,"autoplaySpeed":2000};
ratingConfig = {"slidesToShow": 1, "slidesToScroll": 1,"arrows": true,"autoplay":true,"autoplaySpeed":2000,responsive:[{breakpoint:480,settings:{arrows:false}}]}; ratingConfig = {"slidesToShow": 1, "slidesToScroll": 1,"arrows": true,"autoplay":false,"autoplaySpeed":2000,responsive:[{breakpoint:480,settings:{arrows:false}}]};
} }
src/assets/responsive.scss
...@@ -61,13 +61,15 @@ nav{ ...@@ -61,13 +61,15 @@ nav{
} }
} }
// landing page scss // landing page scss
.backgnd_grey{ .landing_page{
.backgnd_grey{
.map_overlay{ .map_overlay{
.map_contents{ .map_contents{
padding-top: 100px !important; padding-top: 100px !important;
padding-bottom: 50px !important; padding-bottom: 50px !important;
.row{ .row{
.col-md-5{ .col-md-5{
padding-bottom: 20px !important;
.left_side{ .left_side{
font-size: 28px !important; font-size: 28px !important;
.lorem{ .lorem{
...@@ -76,18 +78,23 @@ nav{ ...@@ -76,18 +78,23 @@ nav{
.ipsum{ .ipsum{
font-size: 50px !important; font-size: 50px !important;
} }
.get_info{
margin-left: 1px !important;
}
} }
} }
.col-md-7{ .col-md-7{
.right_side{ .right_side{
max-width: 400px !important; max-width: 400px !important;
margin-left: 1px !important;
margin-right: 1px !important;
} }
} }
} }
} }
} }
} }
.our_products{ .our_products{
margin-bottom: 50px !important; margin-bottom: 50px !important;
.prod_overlay{ .prod_overlay{
padding-top: 40px !important; padding-top: 40px !important;
...@@ -131,11 +138,11 @@ nav{ ...@@ -131,11 +138,11 @@ nav{
} }
} }
} }
} }
h2{ h2{
font-size: 35px !important; font-size: 35px !important;
} }
.why_codein_overlay{ .why_codein_overlay{
.code_overlay{ .code_overlay{
padding-top: 40px !important; padding-top: 40px !important;
} }
...@@ -152,8 +159,8 @@ h2{ ...@@ -152,8 +159,8 @@ h2{
} }
} }
} }
} }
.rating_review{ .rating_review{
.rating_overlay{ .rating_overlay{
padding-top: 40px !important; padding-top: 40px !important;
} }
...@@ -193,10 +200,13 @@ h2{ ...@@ -193,10 +200,13 @@ h2{
} }
} }
} }
}
} }
//scss for aboutus //scss for aboutus
.about{ .about{
padding-top: 50px !important; padding-top: 50px !important;
margin-bottom: 0px !important;
.map_overlay{ .map_overlay{
padding-left: 10px !important; padding-left: 10px !important;
padding-right: 10px !important; padding-right: 10px !important;
...@@ -209,6 +219,24 @@ h2{ ...@@ -209,6 +219,24 @@ h2{
} }
} }
} }
.our_process{
.our_process_bg{
.container{
.row{
.col{
.our_process_img{
margin-right: 20px !important;
}
.our_process_contents{
.process_line{
left: -61px !important;
}
}
}
}
}
}
}
.anim_background{ .anim_background{
.anim_background_overlay{ .anim_background_overlay{
.container{ .container{
...@@ -358,12 +386,41 @@ h2{ ...@@ -358,12 +386,41 @@ h2{
margin-left: 0px !important; margin-left: 0px !important;
} }
} }
//scss for aboutus
.anim_background{
.anim_background_overlay{
.container{
.row{
padding-top: 70px !important;
padding-bottom: 70px !important;
.col-md-3{
h3{
font-size: 55px !important;
}
h5{
font-size: 20px !important;
}
}
}
}
}
}
//scss for landing //scss for landing
.landing_page{
.backgnd_grey{ .backgnd_grey{
.map_overlay{ .map_overlay{
.map_contents{ .map_contents{
padding-top: 180px !important; padding-top: 180px !important;
padding-bottom: 150px !important; padding-bottom: 150px !important;
.slick_main{
.row{
.col-md-5{
.get_info{
margin-left: 1px !important;
}
}
}
}
} }
} }
} }
...@@ -397,6 +454,8 @@ h2{ ...@@ -397,6 +454,8 @@ h2{
} }
} }
} }
}
.foot-codeinfo{ .foot-codeinfo{
.col-md-4{ .col-md-4{
...@@ -477,10 +536,260 @@ h2{ ...@@ -477,10 +536,260 @@ h2{
} }
@media only screen and (min-width: 1250px) and (max-device-width: 1359px) { @media only screen and (min-width: 1250px) and (max-device-width: 1359px) {
//scss for navbar
nav{
.navbar-collapse{
ul{
.icon_box{
height: 35px !important;
width: 35px !important;
.icon_facebook{
margin: 5px !important;
}
.icon_twitter{
margin: 4px !important;
}
.icon_google{
margin: 5px !important;
}
}
}
}
}
//scss for aboutus.html
.anim_background{
.anim_background_overlay{
.container{
.row{
padding-top: 70px !important;
padding-bottom: 70px !important;
.col-md-3{
h3{
font-size: 55px !important;
}
}
}
}
}
}
//scss for landingpage.html
.landing_page{
h2{
font-size: 38px !important;
}
hr{
border: 3px solid rgb(125,181,50) !important;
width: 40px !important;
}
.backgnd_grey{
.map_overlay{
.map_contents{
padding-top: 180px !important;
padding-bottom: 125px !important;
.slick_main{
.row{
.col-md-7{
.right_side{
max-width: 480px !important;
margin: 0 auto !important;
}
}
.col-md-5{
.left_side{
font-size: 35px !important;
p{
margin-top: 10px !important;
}
.lorem{
font-size: 50px !important;
}
.ipsum{
font-size: 50px !important;
}
.get_info{
font-size: 20px !important;
font-weight: 700 !important;
}
}
}
}
}
ngx-slick-carousel{
.slick-dots{
li{
margin: 0px 0px !important;
button{
&::before{
font-size: 8px !important;
}
}
}
}
}
}
}
}
.our_products{
margin-bottom: 40px !important;
.prod_overlay{
padding-top: 50px !important;
}
.pill_margin{
margin-top: 40px !important;
}
.container{
.nav-pills{
.nav-item{
.nav-link{
padding: 5px 20px 5px 20px !important;
font-size: 16px !important;
}
}
}
}
}
.why_codein_overlay{
.icon_container{
.row{
.col{
h4{
font-size: 24px !important;
}
}
}
}
}
}
} }
@media only screen and (min-width: 1360px) and (max-device-width: 1399px) { @media only screen and (min-width: 1360px) and (max-device-width: 1399px) {
//scss for landingpage.html
.landing_page{
.backgnd_grey{
.map_overlay{
.map_contents{
padding-top: 180px !important;
padding-bottom: 130px !important;
.slick_main{
.row{
.col-md-7{
.right_side{
max-width: 480px !important;
margin: 0 auto !important;
}
}
.col-md-5{
.left_side{
font-size: 35px !important;
p{
margin-top: 10px !important;
}
.lorem{
font-size: 50px !important;
}
.ipsum{
font-size: 50px !important;
}
.get_info{
font-size: 20px !important;
font-weight: 700 !important;
}
}
}
}
}
ngx-slick-carousel{
.slick-dots{
li{
margin: 0px 0px !important;
button{
&::before{
font-size: 8px !important;
}
}
}
}
}
}
}
}
h2{
font-size: 38px !important;
}
hr{
border: 3px solid rgb(125,181,50) !important;
}
.our_products{
margin-bottom: 40px !important;
.prod_overlay{
padding-top: 50px !important;
}
.pill_margin{
margin-top: 40px !important;
}
.container{
.nav-pills{
.nav-item{
.nav-link{
padding: 5px 20px 5px 20px !important;
font-size: 16px !important;
}
}
}
}
}
.why_codein_overlay{
.icon_container{
.row{
.col{
h4{
font-size: 24px !important;
}
}
}
}
}
.rating_review{
.rating_review_box{
max-width: 700px !important;
}
}
}
//scss for aboutus.html
.anim_background{
.anim_background_overlay{
.container{
.row{
.col-md-3{
h3{
font-size: 48px !important;
}
}
}
}
}
}
//scss for navbar
nav{
.navbar-collapse{
ul{
.icon_box{
height: 35px !important;
width: 35px !important;
.icon_facebook{
margin: 5px !important;
}
.icon_twitter{
margin: 4px !important;
}
.icon_google{
margin: 5px !important;
}
}
}
}
}
} }
@media only screen and (min-width: 1400px) and (max-device-width: 1600px) { @media only screen and (min-width: 1400px) and (max-device-width: 1600px) {
......
src/styles.scss
...@@ -28,5 +28,31 @@ ...@@ -28,5 +28,31 @@
font-size: 30px; font-size: 30px;
} }
} }
.slick-list{
.slick-track{
.rating_slide{
outline: none;
}
}
}
}
}
//scss for slick_main
.backgnd_grey{
.map_overlay{
.map_contents{
ngx-slick-carousel{
.slick-dots{
li{
margin: 0px 0px ;
button{
&::before{
font-size: 10px;
}
}
}
}
}
}
} }
} }
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment