forked from MMux/37signalsClone
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
107 lines (103 loc) · 4.1 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="css/main.css" type="text/css" />
<title>Mike Moss's 37 Signals Homepage Homework Assignment</title>
<link rel="SHORTCUT ICON" href="favicon.ico">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="js/application.js"></script>
</head>
<body>
<div class="wrapper">
<div class="today">
Happy Thursday.
</div>
<ul id="nav">
<li><a href="#">Company blog</a></li>
<li><a href="#">Our story</a></li>
<li><a href="#">Follow us on Twitter</a></li>
<li><a href="#">System status</a></li>
<li><a href="#" class="signIn">Sign in</a></li>
</ul>
<div id="container">
<div id="bannerMain">
<!-- begin bannerMain -->
<div class="logo">
<img src="images/logo-37s-large.png">
</div>
<!-- Headline area that toggles based on product hover -->
<div id="headlines">
<div id="headline" class="headline"><!-- default headline -->
<h1>
Making collaboration productive and<br/>enjoyable for people every day.
</h1>
<h3>
Frustration-free web apps for collaboration, sharing information, and making decisions.
</h3>
</div><!-- end default -->
<div id="headlineBc" class="headline">
<h1>
<a href="#">Basecamp</a> is the project management tool you wish you had on your last project.
</h1>
<h3>
Are you still managing projects with email? Are you still using Excel for your to-do lists? It's time to upgrade to Basecamp. Manage projects and collaborate with your team and clients the modern way.
</h3>
</div><!-- end headlineBc -->
<div id="headlineHr" class="headline">
<h1>
<a href="#">Highrise</a> remembers the important things about people you'd normally forget.
</h1>
<h3>
Keep a permanent record of people you do business with. Know who you talked to, when you talked to them, what was said, and when to follow up. Over 20,000,000 contacts are tracked using Highrise.
</h3>
</div><!-- end headlineHr -->
<div id="headlineCf" class="headline">
<h1>
From near or far, <a href="#">Campfire</a> helps teams work together over the web in real-time.
</h1>
<h3>
Share ideas, discussions, concepts, images, code samples, videos, mockups, and documents in a real-time private chat room. We couldn't run our own business without Campfire.
</h3>
</div><!-- end headline -->
</div> <!-- end headlines -->
</div><!-- end bannerMain -->
<!-- begin productSelect -->
<div class="productSelect clearfix">
<div id="productWrap">
<!-- link wrapping product box -->
<div class="productBox" data-target="headlineBc">
<img class="productPic" src="images/logo-bc.png"/>
<div>
<h2>Basecamp</h2><sup>®</sup>
</div>
<p class="prodDesc">Manage Projects</p>
<p class="desc">Used by millions for project management.</p>
<img class="prodArrow" src="images/arrow-left.png">
</div>
<!-- link wrapping product box -->
<div class="productBox" data-target="headlineHr">
<img class="productPic" src="images/logo-hr.png"/>
<div>
<h2>Highrise</h2><sup>®</sup>
</div>
<p class="prodDesc">Manage Contacts</p>
<p class="desc">Know the people you do business with.</p>
<img class="prodArrow" src="images/arrow-left.png">
</div>
<!-- link wrapping product box -->
<div class="productBox" data-target="headlineCf">
<img class="productPic" src="images/logo-cf.png"/>
<div>
<h2>Campfire</h2><sup>™</sup>
</div>
<p class="prodDesc">Work in Real—Time</p>
<p class="desc">Group chat rooms for your business.</p>
<img class="prodArrow right" src="images/arrow-right.png">
</div>
</div><!-- end productWrap -->
</div><!-- end productSelect -->
</div>
<hr class="sectionBreak"></hr>
</div><!-- end wrapper -->
</body>
</html>