Commit a0d254fa48faa3599f70925cc99975fc28d3091c

Authored by Leonardo Merlin
1 parent 8cbe7ec1

Fix event-list styles

src/app/components/event-list/event-list.html
... ... @@ -11,10 +11,11 @@
11 11 Agenda <b>Dialoga Brasil</b>
12 12 </h1>
13 13 </div>
14   - <div class="col-sm-6">
  14 + <div class="col-sm-6 text-right">
15 15 <h2 class="event-bar--trigger-toggle text-right">
16 16 <span><b>18</b> bate papos <b>agendados</b></span>
17   - <span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span>
  17 + <span ng-if="vm.isCollapsed" class="glyphicon glyphicon-menu-down" aria-hidden="true"></span>
  18 + <span ng-if="!vm.isCollapsed" class="glyphicon glyphicon-menu-up" aria-hidden="true"></span>
18 19 </h2>
19 20 </div>
20 21 </div>
... ... @@ -25,20 +26,6 @@
25 26  
26 27 <section class="section-table">
27 28 <div class="container">
28   - <!-- <div class="event-tab--trigger" ng-show="vm.isCollapsed" ng-click="vm.toggleView()">
29   - <div class="event-tab--header">
30   - <div class="event-tab--icon">
31   - <span class="glyphicon glyphicon-calendar" aria-hidden="true"></span>
32   - </div>
33   - <div class="event-tab--title">Bate-Papo com ministr@s</div>
34   - </div>
35   - <button class="btn btn-link event-tab--button">
36   - <span class="event-tab--total-scheduled">18</span>
37   - <span>bate-papos agendados</span>
38   - <span class="glyphicon glyphicon-triangle-bottom" aria-hidden="true"></span>
39   - </button>
40   - </div> -->
41   -
42 29 <div class="event-list--panel ng-hide" ng-show="!vm.isCollapsed">
43 30 <div class="event-list--table-wrapper">
44 31 <div class="row row-level-1" ng-repeat="event in vm.events | orderBy:'start_date':false">
... ...
src/app/components/event-list/event-list.scss
... ... @@ -10,18 +10,36 @@
10 10 }
11 11  
12 12 .event-list--panel {
13   - height: 310px;
14   - padding: 0px;
15   - margin: 20px 0;
16   - line-height: 20px;
  13 + width: 100%;
  14 + height: 240px;
  15 + margin: 8px 0;
  16 + padding: 0 20px;
  17 + overflow-x: hidden;
  18 + overflow-y: scroll;
17 19 transition: .3s linear all;
18   - overflow: hidden;
19 20  
20 21 &.ng-hide {
21 22 height: 0;
22 23 line-height: 0;
23 24 }
24 25  
  26 + .btn {
  27 + color: #e1e1e1;
  28 + text-transform: uppercase;
  29 + font-weight: bold;
  30 + }
  31 +
  32 + .row-level-1 {
  33 + height: 48px;
  34 + line-height: 30px;
  35 + padding: 5px 0;
  36 + border-bottom: 1px solid #ccc;
  37 + }
  38 +
  39 + .row-level-1:last-child {
  40 + border-bottom: none;
  41 + }
  42 +
25 43 // .event-list--header {
26 44 // border-bottom: 1px solid #333333;
27 45 // }
... ... @@ -61,10 +79,7 @@
61 79 line-height: 20px;
62 80 cursor: pointer;
63 81  
64   - -webkit-transition: -webkit-transform 0.3s linear all;
65   - -moz-transition: -moz-transform 0.3s linear all;
66   - -o-transition: -o-transform 0.3s linear all;
67   - transition: transform 0.3s linear all;
  82 + transition: all 0.3s linear all;
68 83  
69 84 overflow: hidden;
70 85 z-index: 100;
... ... @@ -96,32 +111,19 @@
96 111 }
97 112  
98 113 &-toggle {
  114 + display: inline-block;
  115 + text-transform: uppercase;
  116 + font-size: 16px;
  117 +
99 118 .glyphicon {
100 119 position: relative;
101 120 top: 5px;
  121 + font-size: 30px;
102 122 }
103 123 }
104 124 }
105 125  
106 126 .event-list--panel {
107   - width: 100%;
108   - height: 260px;
109   - overflow-y: scroll;
110   -
111   - .btn {
112   - color: #e1e1e1;
113   - text-transform: uppercase;
114   - font-weight: bold;
115   - }
116   -
117   - .row-level-1 {
118   - padding: 5px 0;
119   - border-top: 1px solid #ccc;
120   - }
121   -
122   - .row-level-1:last-child {
123   - border-bottom: 1px solid #ccc;
124   - }
125 127 }
126 128  
127 129 .event-tab--icon {
... ...