Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

latest

  • Loading branch information...
commit 7f1fcffab4d36c8f47493f6e233e2608c2595a81 1 parent f43a043
@adamsilver authored
View
35 catalogue.html
@@ -14,6 +14,7 @@
<link rel='stylesheet' type="text/css" href='css/mobile.css' media='screen and (max-width: 320px)' >
<link rel="stylesheet" type="text/css" href="css/handheld.css" media="handheld">
<link rel="stylesheet" type="text/css" href="css/print.css" media="print">
+ <!--[if IE 6]><link rel="stylesheet" href="css/ie6.css" type="text/css" /><![endif]-->
</head>
<body>
<div id="container">
@@ -26,22 +27,17 @@
</div>
<div id="ribbon">
<div id="ribbonInner">
- <div class="icon"></div>
- <div class="icon"></div>
- <div class="icon"></div>
+ <div class="icon"><img src="img/icons/tmp_service_kundencenter.png" alt=""></div>
+ <div class="icon"><img src="img/icons/tmp_service_mediencenter.png" alt=""></div>
+ <div class="icon"><img src="img/icons/tmp_service_programmmanager.png" alt=""></div>
+ <div class="icon"><img src="img/icons/tmp_service_topapps.png" alt=""></div>
</div>
</div>
- <div id="searchForm">
- <form action="" method="get">
- <div class="field">
- <input type="text" name="search" id="searchTerms" >
- </div>
- <div class="actions">
- <input type="submit" name="searchSubmit" value="Search" >
- </div>
- </form>
- </div>
+ <div class="heading">
+ <h1>Catalogue</h1>
+ </div>
<div id="main">
+
<div id="secondary">
<div id="navigation">
<ul>
@@ -53,8 +49,7 @@
</div>
<div id="primary">
<div class="inner">
- <h1>Catalogue</h1>
-
+
<div class="message">
<h2>Some message</h2>
</div>
@@ -64,31 +59,31 @@
<div class="thinger">
<div class="icon"></div>
<div class="details">
- <p>Details here baby</p>
+ <h3>Title</h3>
</div>
</div>
<div class="thinger">
<div class="icon"></div>
<div class="details">
- <p>Details here baby</p>
+ <h3>Youtube</h3>
</div>
</div>
<div class="thinger">
<div class="icon"></div>
<div class="details">
- <p>Details here baby</p>
+ <h3>Title</h3>
</div>
</div>
<div class="thinger">
<div class="icon"></div>
<div class="details">
- <p>Details here baby</p>
+ <h3>Title</h3>
</div>
</div>
<div class="thinger">
<div class="icon"></div>
<div class="details">
- <p>Details here baby</p>
+ <h3>Title</h3>
</div>
</div>
</div>
View
61 css/desktop.css
@@ -5,57 +5,10 @@ body {
max-width: 920px;
}
-#main {
- max-width: 920px;
- overflow: hidden;
-}
-
-#secondary {
- width: 25%;
- float: left;
-}
-
-#primary {
- width: 75%;
- float: left;
-}
-
-#primary .inner {
- padding-left: 20px;
-}
-
#footer p {
max-width: 960px;
}
-#navigation {
- border-top: 1px solid #ccc;
- border-bottom: none;
- margin-bottom: 30px;
-}
-
-#navigation ul {
- margin: 0;
- padding: 0;
-}
-
-#navigation ul li {
- list-style: none;
- font-size: 1.4em;
-}
-
-#navigation ul li a {
- display: block;
- padding: 10px;
- border-bottom: 1px solid #ccc;
- color: #444;
- text-decoration: none;
-}
-
-#navigation ul li a.selected {
- color: #E20074;
-}
-
.message {
background-color: #E0F1FA;
padding: 10px;
@@ -67,17 +20,3 @@ body {
color: #4B4B4B;
}
-#thingers {
- overflow: hidden;
-}
-
-#thingers .thinger {
- width: 145px;
- float: left;
- margin-bottom: 20px;
- border: 1px solid #d0d0d0;
- border-radius :3px;
- -webkit-border-radius :3px;
- padding: 20px;
- margin-right: 20px;
-}
View
89 css/global.css
@@ -108,6 +108,10 @@ h1 {
background-repeat: no-repeat;
background-position: 1px 1px;
background-size: 24px 24px;
+ -webkit-background-size: 24px 24px;
+ -moz-background-size: 24px 24px;
+ -ms-background-size: 24px 24px;
+ -o-background-size: 24px 24px;
display: none;
}
@@ -127,13 +131,8 @@ h1 {
}
#ribbon .icon {
- width: 80px;
float: left;
margin-right: 20px;
- height: 80px;
- background-color: #eee;
- border: 1px solid #444;
- border-radius: 7px;
margin-bottom: 20px;
}
@@ -145,7 +144,31 @@ h1 {
}
#navigation {
+ border-top: 1px solid #ccc;
+ border-bottom: none;
+ margin-bottom: 30px;
+}
+
+#navigation ul {
+ margin: 0;
+ padding: 0;
+}
+#navigation ul li {
+ list-style: none;
+ font-size: 1.4em;
+}
+
+#navigation ul li a {
+ display: block;
+ padding: 10px;
+ border-bottom: 1px solid #ccc;
+ color: #444;
+ text-decoration: none;
+}
+
+#navigation ul li a.selected {
+ color: #E20074;
}
#footer {
@@ -189,16 +212,31 @@ h1 {
}
#thingers {
-
+ overflow: hidden;
}
#thingers .thinger {
- overflow: hidden;
+ width: 145px;
+ float: left;
+ margin-bottom: 20px;
+ border: 1px solid #d0d0d0;
+ border-radius :3px;
+ -webkit-border-radius :3px;
+ padding: 20px;
+ margin-right: 20px;
+}
+
+#thingers .thinger h3 {
+ font-size: 1.6em;
+ color: #444;
+ text-transform: uppercase;
+ text-align: center;
}
#thingers .thinger .icon {
- width: 80px;
- height: 80px;
+ width: 100px;
+ height: 100px;
+ margin: 0 auto;
background-color: #ccc;
border-radius: 7px;
}
@@ -213,3 +251,36 @@ h1 {
margin: 0;
padding: 0;
}
+
+.heading {
+ background-color: #f0f0f0;
+ padding: 10px;
+}
+
+.heading h1 {
+ font-size: 1.6em;
+ color: #444;
+ text-align: center;
+ margin: 0;
+ padding: 0;
+ font-weight: normal;
+}
+
+#main {
+ max-width: 920px;
+ overflow: hidden;
+}
+
+#secondary {
+ width: 25%;
+ float: left;
+}
+
+#primary {
+ width: 75%;
+ float: left;
+}
+
+#primary .inner {
+ padding-left: 20px;
+}
View
12 css/ie6.css
@@ -0,0 +1,12 @@
+#headerInner,
+#ribbonInner,
+#primary,
+#primary .inner,
+#thingers,
+#navigation ul li{
+ zoom: 1;
+}
+
+#ribbonInner {
+ padding-bottom: 20px;
+}
View
19 css/mobile.css
@@ -74,13 +74,32 @@ body {
#thingers .thinger {
overflow: hidden;
margin-bottom: 10px;
+ width: auto;
+ float: none;
+ margin-right: 0px;
}
#thingers .thinger .icon {
float: left;
margin-right: 10px;
+ height: 50px;
+ width: 50px;
}
#thingers .thinger .details {
float: left;
+}
+
+#secondary {
+ width: auto;
+ float: none;
+}
+
+#primary {
+ width: auto;
+ float: none;
+}
+
+#primary .inner {
+ padding-left: 0px;
}
View
12 index.html
@@ -14,6 +14,7 @@
<link rel='stylesheet' type="text/css" href='css/mobile.css' media='screen and (max-width: 320px)' >
<link rel="stylesheet" type="text/css" href="css/handheld.css" media="handheld">
<link rel="stylesheet" type="text/css" href="css/print.css" media="print">
+ <!--[if IE 6]><link rel="stylesheet" href="css/ie6.css" type="text/css" /><![endif]-->
</head>
<body>
<div id="container">
@@ -26,11 +27,15 @@
</div>
<div id="ribbon">
<div id="ribbonInner">
- <div class="icon"></div>
- <div class="icon"></div>
- <div class="icon"></div>
+ <div class="icon"><img src="img/icons/tmp_service_kundencenter.png" alt=""></div>
+ <div class="icon"><img src="img/icons/tmp_service_mediencenter.png" alt=""></div>
+ <div class="icon"><img src="img/icons/tmp_service_programmmanager.png" alt=""></div>
+ <div class="icon"><img src="img/icons/tmp_service_topapps.png" alt=""></div>
</div>
</div>
+ <div class="heading">
+ <h1>Customer dashboard</h1>
+ </div>
<div id="searchForm">
<form action="" method="get">
<div class="field">
@@ -42,7 +47,6 @@
</form>
</div>
<div id="main">
- <h1>Home</h1>
<div class="panel">
<h2>Some panel</h2>
<a href="catalogue.html">Catalogue</a>
Please sign in to comment.
Something went wrong with that request. Please try again.