Improves design when in mobile and tablet
This commit is contained in:
parent
2c2b487dc3
commit
be906c2636
2 changed files with 28 additions and 14 deletions
|
@ -9,10 +9,18 @@
|
|||
padding: 24px 0;
|
||||
border-bottom: none;
|
||||
position: relative;
|
||||
|
||||
@media (max-width: $screen-sm-min) {
|
||||
padding: 6px 0 24px;
|
||||
}
|
||||
}
|
||||
|
||||
.column {
|
||||
text-align: center;
|
||||
|
||||
@media (max-width: $screen-sm-min) {
|
||||
padding: 15px 0;
|
||||
}
|
||||
|
||||
.header {
|
||||
font-size: 30px;
|
||||
|
@ -28,16 +36,15 @@
|
|||
|
||||
&:last-child {
|
||||
text-align: right;
|
||||
|
||||
@media (max-width: $screen-sm-min) {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown {
|
||||
top: 13px;
|
||||
|
||||
@media (max-width: $screen-sm-min) {
|
||||
right: 15px;
|
||||
top: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -64,9 +71,15 @@
|
|||
line-height: 19px;
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
color: $gl-title-color;
|
||||
}
|
||||
&:text {
|
||||
color: $cycle-analytics-box-text-color;
|
||||
|
||||
&.text {
|
||||
color: $layout-link-gray;
|
||||
|
||||
&.value-col {
|
||||
color: $gl-title-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -75,7 +88,9 @@
|
|||
text-align: right;
|
||||
|
||||
span {
|
||||
line-height: 42px;
|
||||
position: relative;
|
||||
vertical-align: middle;
|
||||
top: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -101,10 +116,9 @@
|
|||
}
|
||||
|
||||
.inner-content {
|
||||
text-align: center;
|
||||
|
||||
@media (max-width: $screen-sm-min) {
|
||||
padding: 0 28px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
h4 {
|
||||
|
|
|
@ -27,11 +27,11 @@
|
|||
.content-block
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-3.col-xs-6.column{"v-for" => "item in summary"}
|
||||
.col-sm-3.col-xs-12.column{"v-for" => "item in summary"}
|
||||
%h3.header {{item.value}}
|
||||
%p.text {{item.title}}
|
||||
|
||||
.col-sm-3.col-xs-6.column
|
||||
.col-sm-3.col-xs-12.column
|
||||
.dropdown.inline.js-ca-dropdown
|
||||
%button.dropdown-menu-toggle{"data-toggle" => "dropdown", :type => "button"}
|
||||
%span.dropdown-label Last 30 days
|
||||
|
@ -49,11 +49,11 @@
|
|||
%li{"v-for" => "item in stats"}
|
||||
.container-fluid
|
||||
.row
|
||||
.col-xs-10.title-col
|
||||
.col-xs-8.title-col
|
||||
%p.title
|
||||
{{item.title}}
|
||||
%p.text
|
||||
{{item.description}}
|
||||
.col-xs-2.value-col
|
||||
.col-xs-4.value-col
|
||||
%span
|
||||
{{item.value}}
|
||||
|
|
Loading…
Reference in a new issue