Commit 9918ca92 authored by prumde's avatar prumde

Updated

git-svn-id: http://15.206.35.175/svn/proteus/business-java/trunk@206085 ce508802-f39f-4f6c-b175-0d175dae99d5
parent 8d2eacc7
...@@ -237,11 +237,11 @@ ...@@ -237,11 +237,11 @@
.kpi-box { .kpi-box {
text-align: unset; text-align: unset;
height: 160px; max-height: 100px;
box-shadow: 0 0 1px #ccc; box-shadow: 0 0 1px #ccc;
position: relative; position: relative;
margin: 4px; margin: 4px;
display: inline-block; display: inline-flex;
color: #fff; color: #fff;
padding: 0px !important; padding: 0px !important;
border-radius: 4px; border-radius: 4px;
...@@ -250,29 +250,33 @@ ...@@ -250,29 +250,33 @@
.kpi-icon { .kpi-icon {
color: #fff; color: #fff;
width: 96px; margin: auto;
height: 96px; padding: 5%;
padding: 0;
background-color: rgba(0,0,0,.1);
margin: 32px 16px;
border-radius: 50%; border-radius: 50%;
display: inline-block; display: inline-flex;
float: left; float: left;
width: 25%;
align-items: center;
position: relative;
} }
.kpi-icon img { .kpi-icon img {
text-align: center; text-align: center;
height: 48px; height: 75%;
width: 48px; width: 75%;
margin: 24px; margin: auto;
padding: 0;
} }
.kpi-info { .kpi-info {
display: grid; display: flex;
height: 144px; flex-direction: column;
align-items: center; min-height: 100px;
width: calc( 100% - 128px ); position: relative;
padding: 8px 0; align-items: flex-start;
justify-content: center;
width: 75%;
padding: 0;
} }
.kpi-title { .kpi-title {
...@@ -280,37 +284,41 @@ ...@@ -280,37 +284,41 @@
padding: 0; padding: 0;
font-size: 18px; font-size: 18px;
width: 100%; width: 100%;
align-self: end; display: inline-flex;
} }
.kpi-count-summary { .kpi-count-summary {
display: inline-flex; display: inline-flex;
align-items: baseline; align-items: baseline;
align-self: start;
} }
.kpi-count { .kpi-count {
color: #fff; color: #fff;
padding: 0; padding: 0;
font-size: 6em; font-size: 42px;
float: left; float: left;
} }
.kpi-summary { .kpi-summary {
color: #fff; color: #fff;
padding: 0 .5em; padding: 0 .5em;
font-size: 2em; font-size: 14px;
} }
.quick-row .col, .quick-row .col,
.kpi-row .col{ .kpi-row .col{
padding-left: .625rem;
padding-right: .625rem;
float: left; float: left;
} }
@media (min-width:320px) { @media (min-width:320px) {
.kpi-icon {
padding: 0;
}
.kpi-icon img {
height: 25%;
width: 25%;
}
.kpi-card { .kpi-card {
width: calc(100% - 8px) ; width: calc(100% - 8px) ;
} }
...@@ -320,6 +328,13 @@ ...@@ -320,6 +328,13 @@
} }
@media (min-width:576px) { @media (min-width:576px) {
.kpi-icon {
padding: 5%;
}
.kpi-icon img {
height: 50%;
width: 50%;
}
.kpi-card { .kpi-card {
width: calc(50% - 8px) ; width: calc(50% - 8px) ;
} }
...@@ -328,14 +343,28 @@ ...@@ -328,14 +343,28 @@
} }
} }
@media (min-width:768px) { @media (min-width:768px) {
.kpi-icon {
padding: 5%;
}
.kpi-icon img {
height: 75%;
width: 75%;
}
.kpi-card { .kpi-card {
width: calc(25% - 8px) ; width: calc(50% - 8px) ;
} }
.quick-card { .quick-card {
width: calc(50% - 8px) ; width: calc(33.33333% - 8px) ;
} }
} }
@media (min-width:992px) { @media (min-width:992px) {
.kpi-icon {
padding: 5%;
}
.kpi-icon img {
height: 75%;
width: 75%;
}
.kpi-card { .kpi-card {
width: calc(25% - 8px) ; width: calc(25% - 8px) ;
} }
...@@ -344,6 +373,13 @@ ...@@ -344,6 +373,13 @@
} }
} }
@media (min-width:1200px) { @media (min-width:1200px) {
.kpi-icon {
padding: 5%;
}
.kpi-icon img {
height: 75%;
width: 75%;
}
.kpi-card { .kpi-card {
width: calc(25% - 8px) ; width: calc(25% - 8px) ;
} }
......
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