Download as
Browse Code »

Commit 658c9639273038e380ba2f5c59b819dabc31e474

Authored by Felipe Bormann
1 parent f688228e
Exists in master and in 2 other branches amadeus_univasf, refactoring

fixed broken layout for reports

Showing 5 changed files with 102 additions and 100 deletions   Show diff stats
analytics/static/.sass-cache/9bdb779ec82a4a96f72be09b83b7c997addd0129/general.sassc
View file @658c963
No preview for this file type
analytics/static/analytics/general.css
  Diff comments   View file @658c963
1 1 .report-body {
2 2 border: 1px solid #3ebeb4;
3 3 border-radius: 20px;
4   - padding: 10px; }
  4 + padding: 10px;
  5 + overflow: auto;
  6 + width: 100%; }
5 7  
6 8 #general-report-header {
7 9 height: 10%;
... ... @@ -32,7 +34,11 @@
32 34 background: linear-gradient(to right, #0e8999, #6bf0ce);
33 35 height: 40px;
34 36 border-radius: 10px;
35   - color: #ffffff; }
  37 + color: #ffffff;
  38 + padding-top: 1px;
  39 + margin-top: 10px; }
  40 + #most-used-tags-header h4 {
  41 + margin-left: 1%; }
36 42  
37 43 .data-container {
38 44 width: 80px;
... ... @@ -48,19 +54,12 @@
48 54 font-size: 10px; }
49 55  
50 56 #left-data-selector {
51   - background: linear-gradient(#0e8999, #6bf0ce);
52   - width: 30%; }
53   -
54   -.middle-chart {
55   - width: 30%;
56   - float: left; }
57   - .middle-chart h4 {
58   - color: #009688; }
  57 + background: linear-gradient(#0e8999, #6bf0ce); }
59 58  
60   -.right-chart {
  59 +.chart {
61 60 width: 30%;
62 61 float: left; }
63   - .right-chart h4 {
  62 + .chart h4 {
64 63 color: #009688; }
65 64  
66 65 /*# sourceMappingURL=general.css.map */
... ...
analytics/static/analytics/general.css.map
  Diff comments   View file @658c963
1 1 {
2 2 "version": 3,
3   -"mappings": "AAEA,YAAY;EACX,MAAM,EAAE,iBAAiB;EACzB,aAAa,EAAE,IAAI;EACnB,OAAO,EAAE,IAAI;;AAGd,sBAAsB;EACrB,MAAM,EAAE,GAAG;EACX,OAAO,EAAE,KAAK;EACd,yBAAE;IACD,KAAK,EAZO,OAAO;EAcpB,yBAAE;IACD,KAAK,EAAE,KAAK;IACZ,OAAO,EAAE,WAAW;IACpB,KAAK,EAAE,GAAG;IACV,MAAM,EAAE,GAAG;IAEX,4BAAE;MACD,YAAY,EAAE,EAAE;MAChB,KAAK,EAAE,GAAG;MACV,KAAK,EAAE,KAAK;MAEZ,yCAAY;QACX,gBAAgB,EAAE,OAAO;QACzB,KAAK,EAAE,IAAI;QACX,UAAU,EAAE,MAAM;QAClB,aAAa,EAAE,IAAI;MAEpB,gCAAG;QACF,gBAAgB,EAAE,OAAO;QACzB,KAAK,EAAE,IAAI;QACX,UAAU,EAAE,MAAM;QAClB,aAAa,EAAE,IAAI;;AAIvB,sBAAsB;EACrB,UAAU,EAAE,2CAA2C;EACvD,MAAM,EAAE,IAAI;EACZ,aAAa,EAAE,IAAI;EACnB,KAAK,EAAE,OAAO;;AAEf,eAAe;EACd,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,IAAI;;AAEb,UAAU;EACT,aAAa,EAAE,IAAI;EACnB,KAAK,EAAE,OAAO;EACd,KAAK,EAAE,IAAI;;AAIZ,SAAS;EACR,KAAK,EAAE,OAAO;EACd,SAAS,EAAE,IAAI;;AAGhB,mBAAmB;EAClB,UAAU,EAAE,iCAAmC;EAC/C,KAAK,EAAE,GAAG;;AAGX,aAAa;EACZ,KAAK,EAAE,GAAG;EACV,KAAK,EAAE,IAAI;EACX,gBAAE;IACD,KAAK,EAtEO,OAAO;;AAwErB,YAAY;EACX,KAAK,EAAE,GAAG;EACV,KAAK,EAAE,IAAI;EACX,eAAE;IACD,KAAK,EA5EO,OAAO",
  3 +"mappings": "AAEA,YAAY;EACR,MAAM,EAAE,iBAAiB;EACzB,aAAa,EAAE,IAAI;EACnB,OAAO,EAAE,IAAI;EACb,QAAQ,EAAE,IAAI;EACd,KAAK,EAAE,IAAI;;AAEf,sBAAsB;EAClB,MAAM,EAAE,GAAG;EACX,OAAO,EAAE,KAAK;EACd,yBAAE;IACE,KAAK,EAbC,OAAO;EAejB,yBAAE;IACE,KAAK,EAAE,KAAK;IACZ,OAAO,EAAE,WAAW;IACpB,KAAK,EAAE,GAAG;IACV,MAAM,EAAE,GAAG;IAEX,4BAAE;MACE,YAAY,EAAE,EAAE;MAChB,KAAK,EAAE,GAAG;MACV,KAAK,EAAE,KAAK;MAEZ,yCAAY;QACR,gBAAgB,EAAE,OAAO;QACzB,KAAK,EAAE,IAAI;QACX,UAAU,EAAE,MAAM;QAClB,aAAa,EAAE,IAAI;MAEvB,gCAAG;QACC,gBAAgB,EAAE,OAAO;QACzB,KAAK,EAAE,IAAI;QACX,UAAU,EAAE,MAAM;QAClB,aAAa,EAAE,IAAI;;AAInC,sBAAsB;EAClB,UAAU,EAAE,2CAA2C;EACvD,MAAM,EAAE,IAAI;EACZ,aAAa,EAAE,IAAI;EACnB,KAAK,EAAE,OAAO;EACd,WAAW,EAAE,GAAG;EAChB,UAAU,EAAE,IAAI;EAEhB,yBAAE;IACE,WAAW,EAAE,EAAE;;AAEvB,eAAe;EACX,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,IAAI;;AAEhB,UAAU;EACN,aAAa,EAAE,IAAI;EACnB,KAAK,EAAE,OAAO;EACd,KAAK,EAAE,IAAI;;AAIf,SAAS;EACL,KAAK,EAAE,OAAO;EACd,SAAS,EAAE,IAAI;;AAGnB,mBAAmB;EACf,UAAU,EAAE,iCAAmC;;AAEnD,MAAM;EACF,KAAK,EAAE,GAAG;EACV,KAAK,EAAE,IAAI;EACX,SAAE;IACE,KAAK,EA1EC,OAAO",
4 4 "sources": ["general.sass"],
5 5 "names": [],
6 6 "file": "general.css"
... ...
analytics/static/analytics/general.sass
  Diff comments   View file @658c963
1 1 $title-color: #009688
2 2  
3 3 .report-body
4   - border: 1px solid #3ebeb4
5   - border-radius: 20px
6   - padding: 10px
7   -
  4 + border: 1px solid #3ebeb4
  5 + border-radius: 20px
  6 + padding: 10px
  7 + overflow: auto
  8 + width: 100%
8 9  
9 10 #general-report-header
10   - height: 10%
11   - display: block
12   - h3
13   - color: $title-color
  11 + height: 10%
  12 + display: block
  13 + h3
  14 + color: $title-color
14 15  
15   - ul
16   - float: right
17   - display: inline-flex
18   - width: 50%
19   - height: 15%
  16 + ul
  17 + float: right
  18 + display: inline-flex
  19 + width: 50%
  20 + height: 15%
20 21  
21   - li
22   - margin-right: 2%
23   - width: 50%
24   - color: white
  22 + li
  23 + margin-right: 2%
  24 + width: 50%
  25 + color: white
25 26  
26   - div.selected
27   - background-color: #4dcfbd
28   - width: 100%
29   - text-align: center
30   - border-radius: 20px
  27 + div.selected
  28 + background-color: #4dcfbd
  29 + width: 100%
  30 + text-align: center
  31 + border-radius: 20px
31 32  
32   - div
33   - background-color: #0f8a9a
34   - width: 100%
35   - text-align: center
36   - border-radius: 20px
  33 + div
  34 + background-color: #0f8a9a
  35 + width: 100%
  36 + text-align: center
  37 + border-radius: 20px
37 38  
38 39  
39 40  
40 41 #most-used-tags-header
41   - background: linear-gradient(to right, #0e8999, #6bf0ce)
42   - height: 40px
43   - border-radius: 10px
44   - color: #ffffff
  42 + background: linear-gradient(to right, #0e8999, #6bf0ce)
  43 + height: 40px
  44 + border-radius: 10px
  45 + color: #ffffff
  46 + padding-top: 1px
  47 + margin-top: 10px
  48 +
  49 + h4
  50 + margin-left: 1%
45 51  
46 52 .data-container
47   - width: 80px
48   - height: 40px
  53 + width: 80px
  54 + height: 40px
49 55  
50 56 .tag-cloud
51   - border-radius: 25px
52   - color: #ffffff
53   - width: 80px
  57 + border-radius: 25px
  58 + color: #ffffff
  59 + width: 80px
54 60  
55   -
  61 +
56 62  
57 63 .tag-name
58   - color: #ffffff
59   - font-size: 10px
  64 + color: #ffffff
  65 + font-size: 10px
60 66  
61 67  
62 68 #left-data-selector
63   - background: linear-gradient( #0e8999, #6bf0ce )
64   - width: 30%
65   -
66   -
67   -.middle-chart
68   - width: 30%
69   - float: left
70   - h4
71   - color: $title-color
  69 + background: linear-gradient( #0e8999, #6bf0ce )
72 70  
73   -.right-chart
74   - width: 30%
75   - float: left
76   - h4
77   - color: $title-color
78 71 \ No newline at end of file
  72 +.chart
  73 + width: 30%
  74 + float: left
  75 + h4
  76 + color: $title-color
79 77 \ No newline at end of file
... ...
analytics/templates/analytics/general.html
  Diff comments   View file @658c963
... ... @@ -20,22 +20,24 @@
20 20  
21 21  
22 22 {% block content %}
23   - <div id="core-subjects-options-div">
24   - <ul class="core-subjects-options report-menu-choice">
25   - <li class="active">
26   - {% trans "Platform Report" %}
27   - </li>
28   - <li>
29   - {% trans "Category Report" %}
30   - </li>
31   - <li>
32   - {% trans "Subject Report" %}
33   - </li>
34   - </ul>
35   - </div>
36   -
37   - <div id="general-report">
38   - <div id="general-report-header">
  23 + <section id="core-subjects-options-div">
  24 + <nav>
  25 + <ul class="core-subjects-options report-menu-choice">
  26 + <li class="active">
  27 + {% trans "Platform Report" %}
  28 + </li>
  29 + <li>
  30 + {% trans "Category Report" %}
  31 + </li>
  32 + <li>
  33 + {% trans "Subject Report" %}
  34 + </li>
  35 + </ul>
  36 + </nav>
  37 + </section>
  38 +
  39 + <section id="general-report">
  40 + <header id="general-report-header">
39 41 <h3>{% trans "Amadeus Report" %}</h3>
40 42  
41 43 <ul id="report-header-options">
... ... @@ -46,27 +48,25 @@
46 48 <div>{% trans "Log" %}<div>
47 49 </li>
48 50 </ul>
49   - </div>
  51 + </header>
50 52  
51   - <div class="report-body">
  53 + <article class="report-body">
52 54  
53   - <div id="most-used-tags">
54   - <div id="most-used-tags-header">
  55 + <section id="most-used-tags">
  56 + <header id="most-used-tags-header">
55 57 <h4 >
56 58 {% trans "most used tags" %}
57 59 </h4>
58   - </div>
  60 + </header>
59 61 <div id="most-used-tags-body">
60 62  
61 63 </div>
62   - </div>
63   - <div class="bottom-section">
64   - <div class="left-chart">
  64 + </section>
  65 + <section class="bottom-section">
  66 + <div class="chart left-chart">
65 67 <div id="date-selector">
66   - <p>{% trans "Between" %}</p>
67   - <p>20-20-17</p>
68   - <p>{% trans "and" %}</p>
69   - <p>20-20-17</p>
  68 + <p>{% trans "Between" %} 20-20-17 {% trans "and" %}
  69 + 20-20-17</p>
70 70 </div>
71 71  
72 72 <div id="left-data-selector">
... ... @@ -85,14 +85,19 @@
85 85 </div>
86 86  
87 87 </div>
88   - <div class="middle-chart">
89   - <h4>{% trans "most active users" %}</h4>
  88 + <div class="chart middle-chart">
  89 + <article>
  90 + <h4>{% trans "most active users" %}</h4>
  91 + </article>
  92 + </div>
  93 + <div class="chart right-chart">
  94 +
  95 +
90 96 </div>
91   - <div class="right-chart"></div>
92   - </div>
  97 + </section>
93 98  
94   - </div>
95   - </div>
  99 + </article>
  100 + </section>
96 101  
97 102 <script type="text/javascript">
98 103 </script>
... ...