Skip to content
This repository was archived by the owner on Dec 4, 2017. It is now read-only.

Commit 9c58d28

Browse files
alexwolfenaomiblack
alexwolfe
authored and
naomiblack
committed
Updated Events Page
The table now is using the table from the style guide and presents the information in a clearer more attractive way to viewers.
1 parent 9b27bfb commit 9c58d28

File tree

2 files changed

+152
-179
lines changed

2 files changed

+152
-179
lines changed

‎public/events.jade

Lines changed: 116 additions & 169 deletions
Original file line numberDiff line numberDiff line change
@@ -1,170 +1,117 @@
1+
table.is-full-width
2+
thead
3+
tr
4+
th Event
5+
th Location
6+
th Date
17

2-
<!-- I/O -->
3-
.grid-fluid
4-
.c2.text-left
5-
h4 May 18-20, 2016
6-
.c4.text-left
7-
h4 Mountain View, CA, USA
8-
.c4.text-left
9-
h4
10-
a(
11-
target="_blank"
12-
href="https://events.google.com/io2016/"
13-
) Google I/O
14-
.grid-fluid
15-
.c10.text-center
16-
hr
17-
<!-- DrupalCon -->
18-
.grid-fluid
19-
.c2.text-left
20-
h4 May 9-13, 2016
21-
.c4.text-left
22-
h4 New Orleans, LA, USA
23-
.c4.text-left
24-
h4
25-
a(
26-
target="_blank"
27-
href="https://events.drupal.org/neworleans2016"
28-
) DrupalCon
29-
.grid-fluid
30-
.c10.text-center
31-
hr
32-
<!-- angular-attack -->
33-
.grid-fluid
34-
.c2.text-left
35-
h4 May 14-15, 2016
36-
.c4.text-left
37-
h4 48 hour online Angular hackathon
38-
.c4.text-left
39-
h4
40-
a(
41-
target="_blank"
42-
href="http://www.angularattack.com/"
43-
) Angular Attack
44-
.grid-fluid
45-
.c10.text-center
46-
hr
47-
48-
<!-- Devoxx -->
49-
.grid-fluid
50-
.c2.text-left
51-
h4 June 22-25, 2016
52-
.c4.text-left
53-
h4 Krakow, Poland
54-
.c4.text-left
55-
h4
56-
a(
57-
target="_blank"
58-
href="http://devoxx.pl/"
59-
) Devoxx
60-
.grid-fluid
61-
.c10.text-center
62-
hr
63-
64-
<!-- FullStack -->
65-
.grid-fluid
66-
.c2.text-left
67-
h4 July 13-15, 2016
68-
.c4.text-left
69-
h4 London, UK
70-
.c4.text-left
71-
h4
72-
a(
73-
target="_blank"
74-
href="https://skillsmatter.com/conferences/7278-fullstack-2016-the-conference-on-javascript-node-and-internet-of-things"
75-
) FullStack
76-
.grid-fluid
77-
.c10.text-center
78-
hr
79-
80-
<!-- UtahJS -->
81-
.grid-fluid
82-
.c2.text-left
83-
h4 Sept. 16, 2016
84-
.c4.text-left
85-
h4 Salt Lake City, UT, USA
86-
.c4.text-left
87-
h4
88-
a(
89-
target="_blank"
90-
href="https://conf.utahjs.com/"
91-
) UtahJS
92-
.grid-fluid
93-
.c10.text-center
94-
hr
95-
96-
<!-- Angular Connect -->
97-
.grid-fluid
98-
.c2.text-left
99-
h4 Sept. 27-28, 2016
100-
.c4.text-left
101-
h4 London, UK
102-
.c4.text-left
103-
h4
104-
a(
105-
target="_blank"
106-
href="http://angularconnect.com/"
107-
) Angular Connect
108-
.grid-fluid
109-
.c10.text-center
110-
hr
111-
112-
<!-- ng-europe -->
113-
.grid-fluid
114-
.c2.text-left
115-
h4 Oct. 24-26, 2016
116-
.c4.text-left
117-
h4 Paris, France
118-
.c4.text-left
119-
h4
120-
a(
121-
target="_blank"
122-
href="https://ngeurope.org/"
123-
) ng-europe
124-
.grid-fluid
125-
.c10.text-center
126-
hr
127-
128-
<!-- Devoxx Belgium -->
129-
.grid-fluid
130-
.c2.text-left
131-
h4 Nov. 7-11, 2016
132-
.c4.text-left
133-
h4 Antwerp, Belgium
134-
.c4.text-left
135-
h4
136-
a(
137-
target="_blank"
138-
href="https://www.devoxx.be/"
139-
) Devoxx Belgium
140-
.grid-fluid
141-
.c10.text-center
142-
hr
143-
<!-- DEVIntersection -->
144-
.grid-fluid
145-
.c2.text-left
146-
h4 Nov 14-16, 2016
147-
.c4.text-left
148-
h4 Amsterdam, Netherlands
149-
.c4.text-left
150-
h4
151-
a(
152-
target="_blank"
153-
href="https://www.devintersectioneurope.com/"
154-
) DEVintersection Europe
155-
.grid-fluid
156-
.c10.text-center
157-
hr
158-
159-
<!-- dotJS -->
160-
.grid-fluid
161-
.c2.text-left
162-
h4 Dec. 5, 2016
163-
.c4.text-left
164-
h4 Paris, France
165-
.c4.text-left
166-
h4
167-
a(
168-
target="_blank"
169-
href="http://www.dotjs.io/"
170-
) dotJS
8+
tbody
9+
10+
<!-- I/O -->
11+
tr
12+
th
13+
a(
14+
target="_blank"
15+
href="https://events.google.com/io2016/"
16+
) Google I/O
17+
td Mountain View, CA, USA
18+
td May 18-20, 2016
19+
20+
21+
<!-- angular-attack -->
22+
tr
23+
th
24+
a(
25+
target="_blank"
26+
href="http://www.angularattack.com/"
27+
) Angular Attack
28+
td 48 hour online Angular hackathon
29+
td May 14-15, 2016
30+
31+
32+
33+
<!-- Devoxx -->
34+
tr
35+
th
36+
a(
37+
target="_blank"
38+
href="http://devoxx.pl/"
39+
) Devoxx
40+
td Krakow, Poland
41+
td June 22-25, 2016
42+
43+
44+
<!-- FullStack -->
45+
tr
46+
th
47+
a(
48+
target="_blank"
49+
href="https://skillsmatter.com/conferences/7278-fullstack-2016-the-conference-on-javascript-node-and-internet-of-things"
50+
) FullStack
51+
td London, UK
52+
td July 13-15, 2016
53+
54+
55+
<!-- UtahJS -->
56+
tr
57+
th
58+
a(
59+
target="_blank"
60+
href="https://conf.utahjs.com/"
61+
) UtahJS
62+
td Salt Lake City, UT, USA
63+
td Sept. 16, 2016
64+
65+
<!-- Angular Connect -->
66+
tr
67+
th
68+
a(
69+
target="_blank"
70+
href="http://angularconnect.com/"
71+
) Angular Connect
72+
td London, UK
73+
td Sept. 27-28, 2016
74+
75+
76+
<!-- ng-europe -->
77+
tr
78+
th
79+
a(
80+
target="_blank"
81+
href="https://ngeurope.org/"
82+
) ng-europe
83+
td Paris, France
84+
td Oct. 24-26, 2016
85+
86+
87+
<!-- Devoxx Belgium -->
88+
tr
89+
th
90+
a(
91+
target="_blank"
92+
href="https://www.devoxx.be/"
93+
) Devoxx Belgium
94+
td Antwerp, Belgium
95+
td Nov. 7-11, 2016
96+
97+
98+
<!-- DEVIntersection -->
99+
tr
100+
th
101+
a(
102+
target="_blank"
103+
href="https://www.devintersectioneurope.com/"
104+
) DEVintersection Europe
105+
td Amsterdam, Netherlands
106+
td Nov 14-16, 2016
107+
108+
109+
<!-- dotJS -->
110+
tr
111+
th
112+
a(
113+
target="_blank"
114+
href="http://www.dotjs.io/"
115+
) dotJS
116+
td Paris, France
117+
td Dec. 5, 2016

‎public/resources/css/module/_table.scss

Lines changed: 36 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -4,19 +4,45 @@ table {
44
border-radius: 2px;
55
background: $snow;
66

7-
th,
8-
td {
9-
padding: ($unit * 2) ($unit * 4);
10-
border-bottom: 1px solid $fog;
11-
text-align: left;
7+
&.is-full-width {
8+
width: 100%;
129
}
1310

14-
th {
15-
background: $mist;
16-
font-weight: 500;
11+
thead {
12+
th {
13+
background: $mist;
14+
border-bottom: 1px solid $mist;
15+
color: $metal;
16+
font-size: 12px;
17+
font-weight: 600;
18+
padding: ($unit) ($unit * 4);
19+
text-align: left;
20+
text-transform: uppercase;
21+
}
1722
}
1823

19-
tr:last-child td {
20-
border: none;
24+
tbody {
25+
th,
26+
td {
27+
border-bottom: 1px solid $mist;
28+
color: $platinum;
29+
padding: ($unit * 2) ($unit * 4);
30+
text-align: left;
31+
}
32+
33+
th {
34+
background: rgba($mist, .24);
35+
border-right: 1px solid $mist;
36+
font-weight: 600;
37+
max-width: 100px;
38+
39+
a {
40+
color: $blueberry;
41+
}
42+
}
43+
44+
tr:last-child td {
45+
border: none;
46+
}
2147
}
2248
}

0 commit comments

Comments
 (0)