Commit e105fa63 by Pham Huy

update responsive homepage

parent 7382a313
...@@ -342,7 +342,7 @@ body:not(.custom-background-image):before, body:not(.custom-background-image):af ...@@ -342,7 +342,7 @@ body:not(.custom-background-image):before, body:not(.custom-background-image):af
#tintucnoibat .item-child .img{ #tintucnoibat .item-child .img{
position: relative; position: relative;
overflow: hidden; overflow: hidden;
width: 21.9em; width: 100.5%;
left: -1px; left: -1px;
top: -1px; top: -1px;
} }
......
/* 320×568*/ /* 320×568*/
@media screen and (max-width: 568px){ @media screen and (max-width: 568px){
.slick-next{
display: none !important;
}
#tintucnoibat .item-child{
margin-top: 35px;
}
.showhome .content-showhome{
padding: 1em;
}
.title-feature{
width: 22em;
height: 4em;
margin: 1em 0em;
background: none;
}
.feature-1, .feature-2, .feature-3 {
background: none;
width: 100%;
float: right;
padding: 20px;
margin: 20px 0px;
height: auto;
border-radius: 30px;
}
.feature-1{
border: 1px solid #FEC107;
}
.feature-2{
border: 1px solid #ED2027;
}
.feature-3{
border: 1px solid #56BC86;
}
.icon-ft-1, .icon-ft-2, .icon-ft-3, .icon-ft-4{
width: 100px;
}
/* Footer */ /* Footer */
.footer-bct { .footer-bct {
text-align: center !important; text-align: center !important;
...@@ -23,6 +60,42 @@ ...@@ -23,6 +60,42 @@
/* <=640 px */ /* <=640 px */
@media screen and (max-width: 640px) and (min-width: 568px) { @media screen and (max-width: 640px) and (min-width: 568px) {
.slick-next{
display: none !important;
}
#tintucnoibat .item-child{
margin-top: 35px;
}
.showhome .content-showhome{
padding: 1em;
}
.title-feature{
width: 22em;
height: 4em;
margin: 1em 0em;
background: none;
}
.feature-1, .feature-2, .feature-3 {
background: none;
width: 100%;
float: right;
padding: 20px;
margin: 20px 0px;
height: auto;
border-radius: 30px;
}
.feature-1{
border: 1px solid #FEC107;
}
.feature-2{
border: 1px solid #ED2027;
}
.feature-3{
border: 1px solid #56BC86;
}
.icon-ft-1, .icon-ft-2, .icon-ft-3, .icon-ft-4{
width: 100px;
}
/* Footer */ /* Footer */
.footer-bct { .footer-bct {
text-align: center !important; text-align: center !important;
...@@ -43,6 +116,42 @@ ...@@ -43,6 +116,42 @@
/* <=768 px */ /* <=768 px */
@media screen and (max-width: 768px) and (min-width: 640px) { @media screen and (max-width: 768px) and (min-width: 640px) {
.slick-next{
display: none !important;
}
#tintucnoibat .item-child{
margin-top: 35px;
}
.showhome .content-showhome{
padding: 1em;
}
.title-feature{
width: 22em;
height: 4em;
margin: 1em 0em;
background: none;
}
.feature-1, .feature-2, .feature-3 {
background: none;
width: 100%;
float: right;
padding: 20px;
margin: 20px 0px;
height: auto;
border-radius: 30px;
}
.feature-1{
border: 1px solid #FEC107;
}
.feature-2{
border: 1px solid #ED2027;
}
.feature-3{
border: 1px solid #56BC86;
}
.icon-ft-1, .icon-ft-2, .icon-ft-3, .icon-ft-4{
width: 100px;
}
/* Footer */ /* Footer */
.footer-bct { .footer-bct {
text-align: center !important; text-align: center !important;
......
...@@ -12,7 +12,7 @@ get_header(); ...@@ -12,7 +12,7 @@ get_header();
<section id="intro-hd"> <section id="intro-hd">
<div class="container container-fluid"> <div class="container container-fluid">
<article class="row introduce"> <article class="row introduce">
<div class="col col-xs-12 col-sm-12 col-md-4 col-lg-4"> <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4">
<h2>A HÓA ĐƠN</h2> <h2>A HÓA ĐƠN</h2>
<p class="sub-tit">Giải pháp hóa đơn điện tử chuyên nghiệp</p> <p class="sub-tit">Giải pháp hóa đơn điện tử chuyên nghiệp</p>
<p><span class="txt-red">A hóa đơn</span> giúp dễ dàng tạo lập, phát hành, quản lý hóa đơn với nhiều tính năng cao cấp, phù hợp đa dạng loại hình, quy mô doanh nghiệp</p> <p><span class="txt-red">A hóa đơn</span> giúp dễ dàng tạo lập, phát hành, quản lý hóa đơn với nhiều tính năng cao cấp, phù hợp đa dạng loại hình, quy mô doanh nghiệp</p>
...@@ -21,7 +21,7 @@ get_header(); ...@@ -21,7 +21,7 @@ get_header();
<div class="btn btn-2"><a href="#">Đăng ký đại lý</a></div> <div class="btn btn-2"><a href="#">Đăng ký đại lý</a></div>
</div> </div>
</div> </div>
<div class="col col-xs-12 col-sm-12 col-md-8 col-lg-8"> <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8">
<?php echo do_shortcode("[URIS id=18]"); ?> <?php echo do_shortcode("[URIS id=18]"); ?>
</div> </div>
</article> </article>
...@@ -31,8 +31,8 @@ get_header(); ...@@ -31,8 +31,8 @@ get_header();
<section id="show-hd"> <section id="show-hd">
<div class="container container-fluid"> <div class="container container-fluid">
<article class="row showhome"> <article class="row showhome">
<div class="col col-xs-12 col-sm-12 col-md-4 col-lg-4 "><div class="img-showhome"></div></div> <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 "><div class="img-showhome"></div></div>
<div class="col col-xs-12 col-sm-12 col-md-8 col-lg-8"> <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8">
<div class="content-showhome"> <div class="content-showhome">
<h3>HÓA ĐƠN ĐIỆN TỬ LÀ GÌ?</h3> <h3>HÓA ĐƠN ĐIỆN TỬ LÀ GÌ?</h3>
<p>Hóa đơn điện tử là tập hợp các thông điệp dữ liệu điện tử về bán hàng hoá, cung ứng dịch vụ, được khởi tạo, lập, gửi, nhận, lưu trữ và quản lý bằng phương tiện điện tử. </p> <p>Hóa đơn điện tử là tập hợp các thông điệp dữ liệu điện tử về bán hàng hoá, cung ứng dịch vụ, được khởi tạo, lập, gửi, nhận, lưu trữ và quản lý bằng phương tiện điện tử. </p>
...@@ -55,28 +55,28 @@ get_header(); ...@@ -55,28 +55,28 @@ get_header();
<h2 class="mf-title">Lợi ích nổi bật của A HÓA ĐƠN</h2> <h2 class="mf-title">Lợi ích nổi bật của A HÓA ĐƠN</h2>
<p class="mf-title-sub">Lợi ích của hóa đơn điện tử đối với doanh nghiệp:</p> <p class="mf-title-sub">Lợi ích của hóa đơn điện tử đối với doanh nghiệp:</p>
<div class="row"> <div class="row">
<div class="col col-xs-12 col-sm-12 col-md-6 col-lg-6"> <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
<div class="content-ft-1"> <div class="content-ft-1">
<h3>AN TOÀN</h3> <h3>AN TOÀN</h3>
<p>Không xảy ra cháy, hỏng, mất hóa đơn. Tăng độ tin cậy cho hóa đơn của doanh nghiệp</p> <p>Không xảy ra cháy, hỏng, mất hóa đơn. Tăng độ tin cậy cho hóa đơn của doanh nghiệp</p>
<div class="icon-ft-1"></div> <div class="icon-ft-1"></div>
</div> </div>
</div> </div>
<div class="col col-xs-12 col-sm-12 col-md-6 col-lg-6"> <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
<div class="content-ft-2"> <div class="content-ft-2">
<h3>NHANH CHÓNG</h3> <h3>NHANH CHÓNG</h3>
<p>Người mua tức thời nhận được hóa đơn, rút ngắn thời gian thu nợ</p> <p>Người mua tức thời nhận được hóa đơn, rút ngắn thời gian thu nợ</p>
<div class="icon-ft-2"></div> <div class="icon-ft-2"></div>
</div> </div>
</div> </div>
<div class="col col-xs-12 col-sm-12 col-md-6 col-lg-6"> <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
<div class="content-ft-3"> <div class="content-ft-3">
<h3>TIẾT KIỆM</h3> <h3>TIẾT KIỆM</h3>
<p>Tiết kiệm 90% chi phí in ấn, vận chuyển, lưu trữ và bảo quản hóa đơn</p> <p>Tiết kiệm 90% chi phí in ấn, vận chuyển, lưu trữ và bảo quản hóa đơn</p>
<div class="icon-ft-3"></div> <div class="icon-ft-3"></div>
</div> </div>
</div> </div>
<div class="col col-xs-12 col-sm-12 col-md-6 col-lg-6"> <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
<div class="content-ft-4"> <div class="content-ft-4">
<h3>BẢO VỆ MÔI TRƯỜNG</h3> <h3>BẢO VỆ MÔI TRƯỜNG</h3>
<p>Giảm bớt việc sử dụng giấy, góp phần bảo vệ môi trường</p> <p>Giảm bớt việc sử dụng giấy, góp phần bảo vệ môi trường</p>
...@@ -95,7 +95,7 @@ get_header(); ...@@ -95,7 +95,7 @@ get_header();
<div class="container"> <div class="container">
<h2 class="prices-title">BẢNG GIÁ PHẦN MỀM A HÓA ĐƠN</h2> <h2 class="prices-title">BẢNG GIÁ PHẦN MỀM A HÓA ĐƠN</h2>
<div id="price_slider" class="row"> <div id="price_slider" class="row">
<div class="col col-md-4"> <div class="col-xs-12 col-sm-12 col-md-4">
<div class="card text-center box-price"> <div class="card text-center box-price">
<h2 class="card-header"> HD1 3000 </h2> <h2 class="card-header"> HD1 3000 </h2>
<article class="card-body"> <article class="card-body">
...@@ -107,7 +107,7 @@ get_header(); ...@@ -107,7 +107,7 @@ get_header();
</article> </article>
</div> </div>
</div> </div>
<div class="col col-md-4"> <div class="col-xs-12 col-sm-12 col-md-4">
<div class="card text-center box-price"> <div class="card text-center box-price">
<h2 class="card-header"> HD1 3000 </h2> <h2 class="card-header"> HD1 3000 </h2>
<article class="card-body"> <article class="card-body">
...@@ -119,7 +119,7 @@ get_header(); ...@@ -119,7 +119,7 @@ get_header();
</article> </article>
</div> </div>
</div> </div>
<div class="col col-md-4"> <div class="col-xs-12 col-sm-12 col-md-4">
<div class="card text-center box-price"> <div class="card text-center box-price">
<h2 class="card-header"> HD1 3000 </h2> <h2 class="card-header"> HD1 3000 </h2>
<article class="card-body"> <article class="card-body">
...@@ -131,7 +131,7 @@ get_header(); ...@@ -131,7 +131,7 @@ get_header();
</article> </article>
</div> </div>
</div> </div>
<div class="col col-md-4"> <div class="col-xs-12 col-sm-12 col-md-4">
<div class="card text-center box-price"> <div class="card text-center box-price">
<h2 class="card-header"> HD1 3000 </h2> <h2 class="card-header"> HD1 3000 </h2>
<article class="card-body"> <article class="card-body">
...@@ -145,7 +145,7 @@ get_header(); ...@@ -145,7 +145,7 @@ get_header();
</div> </div>
</div> </div>
<div class="row text-center price_fee"> <div class="row text-center price_fee">
<div class="col col-xs-12 col-sm-12 col-md-12"> <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
<p class="txt-red"> PHÍ KHỞI TẠO: 800.000 VNĐ </p> <p class="txt-red"> PHÍ KHỞI TẠO: 800.000 VNĐ </p>
<p>Phí chưa bao gồm VAT 10%</p> <p>Phí chưa bao gồm VAT 10%</p>
</div> </div>
...@@ -166,7 +166,7 @@ get_header(); ...@@ -166,7 +166,7 @@ get_header();
<h2>Tin tức nổi bật</h2> <h2>Tin tức nổi bật</h2>
<div class="row"> <div class="row">
<?php foreach($recent_posts as $post) : ?> <?php foreach($recent_posts as $post) : ?>
<div class="col col-xs-12 col-md-4 col-lg-4 item"> <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 item">
<div class="item-child" title="<?php echo $post['post_title'] ?>" > <div class="item-child" title="<?php echo $post['post_title'] ?>" >
<?php $img_url = get_the_post_thumbnail_url($post['ID']); ?> <?php $img_url = get_the_post_thumbnail_url($post['ID']); ?>
<div class="img"> <div class="img">
......
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