Skip to content

GeoInt_SIDT
GeoInt_SIDT
Commit 7325370f authored by Sergio Adrian Gongora Euan's avatar Sergio Adrian Gongora Euan
Browse files
Options

dashboard responsive for phone

parent e3c68d64
Show whitespace changes
Inline Side-by-side
Showing with 170 additions and 105 deletions
administration/templates/dashboard.html
View file @ 7325370f
...@@ -118,7 +118,7 @@ ...@@ -118,7 +118,7 @@
{% block content %} {% block content %}
<section class="content"> <section class="content" style="overflow-y: auto; height: 89vh">
<div class="row"> <div class="row">
<div class="col-md-2 col-sm-6 col-xs-12"> <div class="col-md-2 col-sm-6 col-xs-12">
<div class="info-box"> <div class="info-box">
...@@ -255,8 +255,9 @@ ...@@ -255,8 +255,9 @@
<div class="chart"> <div class="chart">
<!-- Sales Chart Canvas --> <!-- Sales Chart Canvas -->
<canvas id="salesChart" style="height: 142px; width: 814px;" width="814" <!-- <canvas id="salesChart" style="height: 142px; width: 814px;" width="814"
height="142"></canvas> height="142"></canvas> -->
<canvas id="salesChart"></canvas>
</div> </div>
<!-- /.chart-responsive --> <!-- /.chart-responsive -->
</div> </div>
......
catalog/static/catalog/css/body.css
View file @ 7325370f
...@@ -442,3 +442,11 @@ div .sidebar-input input[type="text"] { ...@@ -442,3 +442,11 @@ div .sidebar-input input[type="text"] {
.control-sidebar-open{ .control-sidebar-open{
right: 0px !important; right: 0px !important;
} }
.titleShoppingCart{
padding-top: 5px;
}
.actionsShoppingCart{
/* padding-top: 0px; */
}
catalog/static/catalog/css/responsivePhone.css
View file @ 7325370f
/*-------------------------------------------IOS-----------------------------------------*/ /*--------------------------------------- LANDSCAPE -----------------------------------------*/
/* ----------- iPhone X ----------- */
/* Portrait and Landscape */
@media only screen
and (min-device-width: 375px)
and (max-device-width: 812px)
and (-webkit-min-device-pixel-ratio: 3)
and (orientation: portrait) {
.skin-yellow .main-header .navbar .dropdown-menu li a {
color: #3c8dbc;
}
div .info-product-box {
display: none !important;
}
div .product_list_category {
max-height: 163px !important;
}
div #product-list-globe {
max-height: 345px !important;
}
}
/* ----------- iPhone X Landscape ----------- */
@media only screen @media only screen
and (min-device-width: 375px) and (min-device-width: 375px)
and (max-device-width: 812px) and (max-device-width: 812px)
...@@ -63,32 +41,9 @@ ...@@ -63,32 +41,9 @@
} }
} }
/* -----------END iPhone X ----------- */ /* -----------END iPhone X Landscape ----------- */
/* ----------- iPhone 6+, 7+ and 8+ ----------- */ /* ----------- iPhone 6+, 7+ and 8+ Landscape ----------- */
/* Portrait and Landscape */
@media only screen
and (min-device-width: 414px)
and (max-device-width: 736px)
and (-webkit-min-device-pixel-ratio: 3)
and (orientation: portrait) {
.skin-yellow .main-header .navbar .dropdown-menu li a {
color: #3c8dbc;
}
div .info-product-box {
display: none !important;
}
div .product_list_category {
max-height: 163px !important;
}
div #product-list-globe {
max-height: 345px !important;
}
}
@media only screen @media only screen
and (min-device-width: 414px) and (min-device-width: 414px)
...@@ -129,37 +84,59 @@ ...@@ -129,37 +84,59 @@
max-height: 194px !important; max-height: 194px !important;
} }
} }
/* ----------- END iPhone 6+, 7+ and 8+ ----------- */ /* ----------- END iPhone 6+, 7+ and 8+ Landscape----------- */
/* ----------- iPhone 6, 6S, 7 and 8 ----------- */ /* ----------- iPhone 6, 6S, 7 and 8 Landscape----------- */
/* Portrait and Landscape */
@media only screen @media only screen
and (min-device-width: 375px) and (min-device-width: 375px)
and (max-device-width: 667px) and (max-device-width: 667px)
and (-webkit-min-device-pixel-ratio: 2) and (-webkit-min-device-pixel-ratio: 2)
and (orientation: portrait) { and (orientation: landscape) {
.skin-yellow .main-header .navbar .dropdown-menu li a { .skin-yellow .main-header .navbar .dropdown-menu li a {
color: #3c8dbc; color: #3c8dbc;
} }
#option-list {
width: 210px !important;
}
div .info-product-box { div .info-product-box {
display: none !important; top: 17% !important;
left: -251px !important;
height: 80px !important;
width: 92% !important;
}
.info-product-box-img {
height: 80px !important;
width: 80px !important;
}
.info-product-box-img img {
height: 80px !important;
}
.info-product-box .progress,
.info-product-cart-box .progress {
margin: 5px 0px 5px -20px !important;
}
.info-product-box-content {
padding: 2px 1px !important;
} }
div .product_list_category { div .product_list_category {
max-height: 163px !important; max-height: 107px !important;
} }
div #product-list-globe { div #product-list-globe {
max-height: 425px !important; max-height: 194px !important;
} }
} }
/* ----------- END iPhone 6, 6S, 7 and 8 Landscape----------- */
/* ----------- iPhone 5, 5S, 5C and 5SE landscape ----------- */
@media only screen @media only screen
and (min-device-width: 375px) and (min-device-width: 320px)
and (max-device-width: 667px) and (max-device-width: 568px)
and (-webkit-min-device-pixel-ratio: 2) and (-webkit-min-device-pixel-ratio: 2)
and (orientation: landscape) { and (orientation: landscape){
.skin-yellow .main-header .navbar .dropdown-menu li a { .skin-yellow .main-header .navbar .dropdown-menu li a {
color: #3c8dbc; color: #3c8dbc;
} }
...@@ -167,8 +144,8 @@ ...@@ -167,8 +144,8 @@
#option-list { #option-list {
width: 210px !important; width: 210px !important;
} }
div .info-product-box { div .info-product-box {
/* position: fixed !important; */
top: 17% !important; top: 17% !important;
left: -251px !important; left: -251px !important;
height: 80px !important; height: 80px !important;
...@@ -197,10 +174,13 @@ ...@@ -197,10 +174,13 @@
max-height: 194px !important; max-height: 194px !important;
} }
} }
/* ----------- END iPhone 6, 6S, 7 and 8 ----------- */ /* ----------- END iPhone 5, 5S, 5C and 5SE landscape ----------- */
/*--------------------------------------- END SECTION LANDSCAPE -----------------------------------------*/
/*--------------------------------------- START SECTION PORTRAIT -----------------------------------------*/
/* ----------- iPhone 5, 5S, 5C and 5SE ----------- */ /* ----------- iPhone 5, 5S, 5C and 5SE Portrait ----------- */
/* Portrait and Landscape */
@media only screen @media only screen
and (min-device-width: 320px) and (min-device-width: 320px)
and (max-device-width: 568px) and (max-device-width: 568px)
...@@ -225,13 +205,18 @@ ...@@ -225,13 +205,18 @@
div #product-list-globe { div #product-list-globe {
max-height: 345px !important; max-height: 345px !important;
} }
.actionsShoppingCart{
padding-top: 25px;
}
} }
/* ----------- END iPhone 5, 5S, 5C and 5SE Portrait ----------- */
@media only screen /* ----------- Device HUAWEI ----------- */
and (min-device-width: 320px) @media screen
and (max-device-width: 568px) and (min-device-width: 360px)
and (-webkit-min-device-pixel-ratio: 2) and (max-device-width: 640px)
and (orientation: landscape){ and (orientation: portrait) {
.skin-yellow .main-header .navbar .dropdown-menu li a { .skin-yellow .main-header .navbar .dropdown-menu li a {
color: #3c8dbc; color: #3c8dbc;
} }
...@@ -239,33 +224,100 @@ ...@@ -239,33 +224,100 @@
#option-list { #option-list {
width: 210px !important; width: 210px !important;
} }
div .info-product-box { div .info-product-box {
/* position: fixed !important; */ display: none !important;
top: 17% !important;
left: -251px !important;
height: 80px !important;
width: 92% !important;
} }
.info-product-box-img {
height: 80px !important; div .product_list_category {
width: 80px !important; max-height: 163px !important;
} }
.info-product-box-img img {
height: 80px !important; div #product-list-globe {
max-height: 345px !important;
} }
.info-product-box .progress,
.info-product-cart-box .progress { .actionsShoppingCart{
margin: 5px 0px 5px -20px !important; padding-top: 16px;
} }
.info-product-box-content { }
padding: 2px 1px !important; /* ----------- END Device HUAWEI ----------- */
/* ----------- iPhone 6, 6S, 7 and 8 Portrait----------- */
@media only screen
and (min-device-width: 375px)
and (max-device-width: 667px)
and (-webkit-min-device-pixel-ratio: 2)
and (orientation: portrait) {
.skin-yellow .main-header .navbar .dropdown-menu li a {
color: #3c8dbc;
}
div .info-product-box {
display: none !important;
} }
div .product_list_category { div .product_list_category {
max-height: 107px !important; max-height: 163px !important;
} }
div #product-list-globe { div #product-list-globe {
max-height: 194px !important; max-height: 425px !important;
}
.actionsShoppingCart{
padding-top: 15px;
} }
} }
/* ----------- END iPhone 6, 6S, 7 and 8 Portrait----------- */
/* ----------- iPhone 6+, 7+ and 8+ portrait ----------- */
@media only screen
and (min-device-width: 414px)
and (max-device-width: 736px)
and (-webkit-min-device-pixel-ratio: 3)
and (orientation: portrait) {
.skin-yellow .main-header .navbar .dropdown-menu li a {
color: #3c8dbc;
}
div .info-product-box {
display: none !important;
}
div .product_list_category {
max-height: 163px !important;
}
div #product-list-globe {
max-height: 345px !important;
}
}
/* -----------END iPhone 6+, 7+ and 8+ portrait ----------- */
/* ----------- iPhone X portrait----------- */
@media only screen
and (min-device-width: 375px)
and (max-device-width: 812px)
and (-webkit-min-device-pixel-ratio: 3)
and (orientation: portrait) {
.skin-yellow .main-header .navbar .dropdown-menu li a {
color: #3c8dbc;
}
div .info-product-box {
display: none !important;
}
div .product_list_category {
max-height: 163px !important;
}
div #product-list-globe {
max-height: 345px !important;
}
}
/* -----------END iPhone X portrait----------- */
/*--------------------------------------- END SECTION PORTRAIT -----------------------------------------*/
\ No newline at end of file
catalog/templates/show_cart.html
View file @ 7325370f
...@@ -146,23 +146,27 @@ ...@@ -146,23 +146,27 @@
<h2 class="text-center">Your Shopping Cart is empty.</h2> <h2 class="text-center">Your Shopping Cart is empty.</h2>
</div> </div>
{% else %} {% else %}
<div class="col-md-5 col-md-offset-2"> <div class="col-md-5 col-md-offset-2" style="padding-bottom: 10px">
{% for product in product_list %} {% for product in product_list %}
<div class="box box-warning collapsed-box" style="margin-bottom: 10px"> <div class="box box-warning collapsed-box">
<div class="box-header with-border"> <div class="box-header with-border">
<div class="row">
<div class="col-lg-8 col-md-10 col-xs-6 titleShoppingCart" >
<h3 class="box-title">{{ product.process }}: {{ product.aggreg_date }}</h3> <h3 class="box-title">{{ product.process }}: {{ product.aggreg_date }}</h3>
</div>
<div class="col-lg-4 col-md-2 col-xs-6 actionsShoppingCart">
<div class="box-tools pull-right"> <div class="box-tools pull-right">
<span class="badge bg-green">Price ${{ product.price }}</span> <span class="badge bg-green">Price ${{ product.price }}</span>
<button type="button" class="btn btn-box-tool" data-widget="collapse"> <button type="button" class="btn btn-box-tool" data-widget="collapse">
<i class="fa fa-plus"></i> <i class="fa fa-plus"></i>
</button> </button>
<button type="button" class="btn btn-box-tool" data-toggle="tooltip" <button type="button" class="btn btn-box-tool" data-toggle="tooltip" data-original-title="Delete" onclick="deleteProductFromShoppingCart({{ product.id }})">
data-original-title="Delete"
onclick="deleteProductFromShoppingCart({{ product.id }})">
<i class="fa fa-trash"></i> <i class="fa fa-trash"></i>
</button> </button>
</div> </div>
</div> </div>
</div>
</div>
<div class="box-body" style="display: none"> <div class="box-body" style="display: none">
<ul class="products-list product-list-in-box"> <ul class="products-list product-list-in-box">
{% for catalog in product.catalog %} {% for catalog in product.catalog %}
......
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