Skip to content

Commit c5a4682

Browse files
committed
Iteration on design
1 parent c96f51c commit c5a4682

45 files changed

Lines changed: 312 additions & 178 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

css/global.css

Lines changed: 13 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -8,22 +8,29 @@
88
*/
99

1010

11-
/* Top Bar */
11+
/*--------------
12+
Page Header
13+
---------------*/
14+
1215
body > .page.header {
1316
background-color: #f5f5f5;
1417
border-bottom: 1px solid #e5e5e5;
15-
min-width: 1000px;
1618
padding-bottom: 10px;
1719
padding-top: 10px;
1820
}
1921

22+
/* No padding on menu */
2023
body > .page.header .menu {
2124
margin-top: 0em;
2225
margin-bottom: 0em;
2326
}
27+
28+
/* Space right of input */
2429
body > .page.header .menu .item .input {
2530
margin-right: 1em;
2631
}
32+
33+
/* Resize images */
2734
body > .page.header .menu .item > .logo.image {
2835
width: auto;
2936
height: 28px;
@@ -38,17 +45,11 @@ body > .page.header .user.dropdown .menu {
3845
margin: 5px 9px 0px 0px !important;
3946
}
4047

41-
/* Watch Button */
48+
/*--------------
49+
Watch Button
50+
---------------*/
51+
4252
.watch.dropdown.button > .menu h4 {
4353
margin-bottom: 5px;
4454
}
4555

46-
47-
/* Top Bar */
48-
49-
50-
/* This will be removed */
51-
52-
.ui.menu .item {
53-
flex: 0 0 auto !important;
54-
}

css/home.css

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,9 @@
1414

1515
}
1616

17+
/*--------------
18+
Top Ribbon
19+
---------------*/
1720

1821
#repo .repo.ribbon {
1922
border-bottom: 1px solid #EEEEEE;
@@ -27,4 +30,36 @@
2730
margin: 1em 0em;
2831
font-size: 16px;
2932
line-height: 22px;
33+
}
34+
35+
/*----------------
36+
Latest Commits
37+
-----------------*/
38+
39+
#repo .latest {
40+
padding: 0.5em;
41+
color: #999999;
42+
}
43+
#repo .latest b {
44+
color: rgba(0, 0, 0, 0.8);
45+
}
46+
47+
48+
/*----------------
49+
Branch Dropdown
50+
-----------------*/
51+
52+
#repo .branch.button .dropdown.icon {
53+
vertical-align: top;
54+
}
55+
56+
/* Branch label */
57+
#repo .branch.button .text {
58+
color: #888888;
59+
}
60+
/* Branch name */
61+
#repo .branch.button b {
62+
display: inline-block;
63+
margin-left: 2px;
64+
color: rgba(0, 0, 0, 0.8);
3065
}

index.html

Lines changed: 93 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -14,18 +14,21 @@
1414
<link rel="stylesheet" type="text/css" href="semantic/dist/components/reset.css">
1515
<link rel="stylesheet" type="text/css" href="semantic/dist/components/site.css">
1616

17-
<link rel="stylesheet" type="text/css" href="semantic/dist/components/menu.css">
18-
<link rel="stylesheet" type="text/css" href="semantic/dist/components/button.css">
1917
<link rel="stylesheet" type="text/css" href="semantic/dist/components/breadcrumb.css">
18+
<link rel="stylesheet" type="text/css" href="semantic/dist/components/button.css">
19+
<link rel="stylesheet" type="text/css" href="semantic/dist/components/container.css">
20+
<link rel="stylesheet" type="text/css" href="semantic/dist/components/dropdown.css">
2021
<link rel="stylesheet" type="text/css" href="semantic/dist/components/grid.css">
2122
<link rel="stylesheet" type="text/css" href="semantic/dist/components/header.css">
22-
<link rel="stylesheet" type="text/css" href="semantic/dist/components/input.css">
23-
<link rel="stylesheet" type="text/css" href="semantic/dist/components/label.css">
24-
<link rel="stylesheet" type="text/css" href="semantic/dist/components/image.css">
25-
<link rel="stylesheet" type="text/css" href="semantic/dist/components/container.css">
2623
<link rel="stylesheet" type="text/css" href="semantic/dist/components/icon.css">
27-
<link rel="stylesheet" type="text/css" href="semantic/dist/components/dropdown.css">
2824
<link rel="stylesheet" type="text/css" href="semantic/dist/components/image.css">
25+
<link rel="stylesheet" type="text/css" href="semantic/dist/components/image.css">
26+
<link rel="stylesheet" type="text/css" href="semantic/dist/components/input.css">
27+
<link rel="stylesheet" type="text/css" href="semantic/dist/components/label.css">
28+
<link rel="stylesheet" type="text/css" href="semantic/dist/components/menu.css">
29+
<link rel="stylesheet" type="text/css" href="semantic/dist/components/message.css">
30+
<link rel="stylesheet" type="text/css" href="semantic/dist/components/segment.css">
31+
<link rel="stylesheet" type="text/css" href="semantic/dist/components/table.css">
2932
<link rel="stylesheet" type="text/css" href="semantic/dist/components/transition.css">
3033

3134
<link rel="stylesheet" type="text/css" href="css/global.css">
@@ -40,14 +43,14 @@
4043
<div class="ui container">
4144
<div class="ui right floated icon text menu">
4245
<a class="item">
43-
<i class="large inbox icon"></i>
46+
<i class="inbox icon"></i>
4447
</a>
4548
<a class="item">
4649
<i class="add icon"></i>
47-
<i class="large dropdown icon"></i>
50+
<i class="dropdown icon"></i>
4851
</a>
4952
<div class="user top right pointing ui dropdown item">
50-
<img class="ui rounded user image" src="images/avatar.jpg">
53+
<img class="ui mini rounded image" src="images/avatar.jpg">
5154
<i class="dropdown icon"></i>
5255
<div class="menu">
5356
<div class="disabled item">
@@ -134,6 +137,7 @@ <h4>Ignoring</h4>
134137
<div class="ui container">
135138
<div class="ui vertically padded grid">
136139
<div class="twelve wide column">
140+
137141
<div class="repo description">
138142
<div>Semantic is a UI component framework based around useful principles from natural language.</div>
139143
<a href="http://www.semantic-ui.com">http://www.semantic-ui.com</a>
@@ -156,6 +160,85 @@ <h4>Ignoring</h4>
156160
111 contributors
157161
</a>
158162
</div>
163+
164+
<div class="repo title">
165+
<div class="ui right floated compact icon button">
166+
<i class="content icon"></i>
167+
</div>
168+
<div class="ui positive compact icon button">
169+
<i class="fork icon"></i>
170+
</div>
171+
<div class="ui dropdown branch compact button">
172+
<div class="text">
173+
Branch:
174+
<b>Master</b>
175+
</div>
176+
<i class="dropdown icon"></i>
177+
</div>
178+
</div>
179+
180+
<div class="ui top attached info message">
181+
Merge pull request #2728 from sunseth/patch-1
182+
</div>
183+
<div class="ui attached latest segment">
184+
<img class="ui mini right spaced rounded image" src="images/avatar.jpg">
185+
<b>jlukic</b>
186+
authored 2 days ago
187+
</div>
188+
<table class="ui bottom attached table">
189+
<tbody>
190+
<tr>
191+
<td class="collapsing">
192+
<i class="blue folder icon"></i>
193+
<a href="#">
194+
node_modules
195+
</a>
196+
</td>
197+
<td>Initial commit</td>
198+
<td class="right aligned collapsing">10 hours ago</td>
199+
</tr>
200+
<tr>
201+
<td>
202+
<i class="blue folder icon"></i>
203+
<a href="#">
204+
test
205+
</a>
206+
</td>
207+
<td>Initial commit</td>
208+
<td class="right aligned">10 hours ago</td>
209+
</tr>
210+
<tr>
211+
<td>
212+
<i class="blue folder icon"></i>
213+
<a href="#">
214+
build
215+
</a>
216+
</td>
217+
<td>Initial commit</td>
218+
<td class="right aligned">10 hours ago</td>
219+
</tr>
220+
<tr>
221+
<td>
222+
<i class="grey file outline icon"></i>
223+
<a href="#">
224+
package.json
225+
</a>
226+
</td>
227+
<td>Initial commit</td>
228+
<td class="right aligned">10 hours ago</td>
229+
</tr>
230+
<tr>
231+
<td>
232+
<i class="grey file outline icon"></i>
233+
<a href="#">
234+
Gruntfile.js
235+
</a>
236+
</td>
237+
<td>Initial commit</td>
238+
<td class="right aligned">10 hours ago</td>
239+
</tr>
240+
</tbody>
241+
</table>
159242
</div>
160243
<!-- <div class="four wide column">
161244
<div class="ui vertical tabular menu">

javascript/home.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ $(document)
1313

1414
var
1515
$userDropdown = $('.user.dropdown'),
16+
$button = $('.ui.button'),
1617
$watchButton = $('.watch.button')
1718
;
1819

semantic/dist/components/card.css

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -540,12 +540,12 @@ a.ui.card:hover,
540540
.ui.green.cards > .card,
541541
.ui.cards > .green.card,
542542
.ui.green.card {
543-
box-shadow: 0px 0px 0px 1px #d4d4d5, 0px 2px 0px 0px #21ba45, 0px 1px 3px 0px #d4d4d5;
543+
box-shadow: 0px 0px 0px 1px #d4d4d5, 0px 2px 0px 0px #60b044, 0px 1px 3px 0px #d4d4d5;
544544
}
545545
.ui.green.cards > .card:hover,
546546
.ui.cards > .green.card:hover,
547547
.ui.green.card:hover {
548-
box-shadow: 0px 0px 0px 1px #d4d4d5, 0px 2px 0px 0px #16ab39, 0px 1px 3px 0px #bcbdbd;
548+
box-shadow: 0px 0px 0px 1px #d4d4d5, 0px 2px 0px 0px #54a238, 0px 1px 3px 0px #bcbdbd;
549549
}
550550

551551
/* Teal */
@@ -564,12 +564,12 @@ a.ui.card:hover,
564564
.ui.blue.cards > .card,
565565
.ui.cards > .blue.card,
566566
.ui.blue.card {
567-
box-shadow: 0px 0px 0px 1px #d4d4d5, 0px 2px 0px 0px #2185d0, 0px 1px 3px 0px #d4d4d5;
567+
box-shadow: 0px 0px 0px 1px #d4d4d5, 0px 2px 0px 0px #80a6cd, 0px 1px 3px 0px #d4d4d5;
568568
}
569569
.ui.blue.cards > .card:hover,
570570
.ui.cards > .blue.card:hover,
571571
.ui.blue.card:hover {
572-
box-shadow: 0px 0px 0px 1px #d4d4d5, 0px 2px 0px 0px #1678c2, 0px 1px 3px 0px #bcbdbd;
572+
box-shadow: 0px 0px 0px 1px #d4d4d5, 0px 2px 0px 0px #6999ca, 0px 1px 3px 0px #bcbdbd;
573573
}
574574

575575
/* Violet */

0 commit comments

Comments
 (0)