Commit be906c26 authored by Filipa Lacerda's avatar Filipa Lacerda

Improves design when in mobile and tablet

parent 2c2b487d
...@@ -9,11 +9,19 @@ ...@@ -9,11 +9,19 @@
padding: 24px 0; padding: 24px 0;
border-bottom: none; border-bottom: none;
position: relative; position: relative;
@media (max-width: $screen-sm-min) {
padding: 6px 0 24px;
}
} }
.column { .column {
text-align: center; text-align: center;
@media (max-width: $screen-sm-min) {
padding: 15px 0;
}
.header { .header {
font-size: 30px; font-size: 30px;
line-height: 38px; line-height: 38px;
...@@ -28,16 +36,15 @@ ...@@ -28,16 +36,15 @@
&:last-child { &:last-child {
text-align: right; text-align: right;
@media (max-width: $screen-sm-min) {
text-align: center;
}
} }
} }
.dropdown { .dropdown {
top: 13px; top: 13px;
@media (max-width: $screen-sm-min) {
right: 15px;
top: 30px;
}
} }
} }
...@@ -64,9 +71,15 @@ ...@@ -64,9 +71,15 @@
line-height: 19px; line-height: 19px;
font-size: 15px; font-size: 15px;
font-weight: 600; 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 @@ ...@@ -75,7 +88,9 @@
text-align: right; text-align: right;
span { span {
line-height: 42px; position: relative;
vertical-align: middle;
top: 3px;
} }
} }
} }
...@@ -101,10 +116,9 @@ ...@@ -101,10 +116,9 @@
} }
.inner-content { .inner-content {
text-align: center;
@media (max-width: $screen-sm-min) { @media (max-width: $screen-sm-min) {
padding: 0 28px; padding: 0 28px;
text-align: center;
} }
h4 { h4 {
......
...@@ -27,11 +27,11 @@ ...@@ -27,11 +27,11 @@
.content-block .content-block
.container-fluid .container-fluid
.row .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}} %h3.header {{item.value}}
%p.text {{item.title}} %p.text {{item.title}}
.col-sm-3.col-xs-6.column .col-sm-3.col-xs-12.column
.dropdown.inline.js-ca-dropdown .dropdown.inline.js-ca-dropdown
%button.dropdown-menu-toggle{"data-toggle" => "dropdown", :type => "button"} %button.dropdown-menu-toggle{"data-toggle" => "dropdown", :type => "button"}
%span.dropdown-label Last 30 days %span.dropdown-label Last 30 days
...@@ -49,11 +49,11 @@ ...@@ -49,11 +49,11 @@
%li{"v-for" => "item in stats"} %li{"v-for" => "item in stats"}
.container-fluid .container-fluid
.row .row
.col-xs-10.title-col .col-xs-8.title-col
%p.title %p.title
{{item.title}} {{item.title}}
%p.text %p.text
{{item.description}} {{item.description}}
.col-xs-2.value-col .col-xs-4.value-col
%span %span
{{item.value}} {{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