Commit be906c26 authored by Filipa Lacerda's avatar Filipa Lacerda

Improves design when in mobile and tablet

parent 2c2b487d
......@@ -9,11 +9,19 @@
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;
line-height: 38px;
......@@ -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: $layout-link-gray;
&.value-col {
color: $gl-title-color;
}
&:text {
color: $cycle-analytics-box-text-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}}
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