← Back to branch summary

~canonical-losas/ubuntu-start-page/u-s-p-content

« back to all changes in this revision

Viewing changes to www/12.10/index.html.en-gb

  • Committer: Martin Albisetti
  • Date: 2015-04-22 18:39:15 UTC
  • mfrom: (145.1.6 1252899-mobile-friendly)
  • Revision ID: martin.albisetti@canonical.com-20150422183915-4vbw6f6qgcefpa1z
Merge mobile-friendly branch, add 15.04 symlink

Show diffs side-by-side

added added

removed removed

Lines of Context:
www/12.10/index.html.en-gb
1
1
<!DOCTYPE html>
2
2
<html lang="en_GB" dir="ltr">
3
3
<head>
4
 
<meta http-equiv="content-type" content="text/html; charset=UTF-8" /> 
 
4
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
 
5
 <meta name="viewport" content="width=device-width">
5
6
<title>Ubuntu Start Page</title>
 
7
 
6
8
<style type="text/css">
 
9
html {
 
10
    font: normal 300 16px/25px "Ubuntu", Arial, "libra sans", sans-serif;
 
11
    color: #333;
 
12
}
7
13
body {
8
14
    background: white;
9
 
    font-family: ubuntu, ubuntubeta, 'Bitstream Vera Sans', 'DejaVu Sans', Tahoma, sans-serif;
10
 
    font-size: 12px;
11
 
    line-height: 14px;
12
15
    margin: 0 auto;
13
16
}
14
17
button::-moz-focus-inner {
21
24
    button{
22
25
        margin: 0;
23
26
    }
24
 
}   
 
27
}
25
28
.acchide {
26
29
    text-indent: -999em;
27
30
    display: block;
28
31
}
 
32
/* one-form */
 
33
input[type="search"] {
 
34
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 
35
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 
36
  border-radius: 2px;
 
37
  width: 100%;
 
38
  padding: 0.5em 0.6em;
 
39
  margin: 0 0 0.5em 0;
 
40
  display: block;
 
41
  border: 1px solid #ccc;
 
42
  font-weight: inherit;
 
43
  -webkit-transition: 0.3s linear border;
 
44
  -moz-transition: 0.3s linear border;
 
45
  -ms-transition: 0.3s linear border;
 
46
  -o-transition: 0.3s linear border;
 
47
  transition: 0.3s linear border;
 
48
}
 
49
input[type="search"]:focus {
 
50
  outline: 0;
 
51
  outline: thin dotted \9;
 
52
  /* IE6-9 */
 
53
  border-color: #129FEA;
 
54
}
 
55
/* end one-form */
 
56
 
 
57
/* one-list */
 
58
ul, ol {
 
59
  margin: 0.5em 0;
 
60
  padding: 0;
 
61
}
 
62
ul li {
 
63
  list-style: none;
 
64
}
 
65
.one-list-inline {
 
66
  display: inline;
 
67
  overflow: hidden;
 
68
  margin: 0 0 0 0.3em;
 
69
  padding: 0;
 
70
}
 
71
.one-list-inline li {
 
72
  list-style: none;
 
73
  display: inline-block;
 
74
}
 
75
.one-list-inline li:after {
 
76
  margin: 0 0.15em;
 
77
}
 
78
.one-list-inline li:last-child:after {
 
79
  content: '';
 
80
}
 
81
/* end one-list */
 
82
 
 
83
/* one-box */
 
84
.one-box {
 
85
  padding: 20px;
 
86
  margin: 0 0 2em 0;
 
87
  -webkit-border-radius: 5px;
 
88
  border-radius: 5px;
 
89
  padding: 20px;
 
90
}
 
91
.one-box-bordered {
 
92
  border: 1px solid #ccc;
 
93
}
 
94
/* end one-box */
 
95
 
29
96
.search-box {
30
 
    width: 595px;
31
 
    margin: 0 auto;
32
 
    margin-top: 63px;
 
97
    margin: 1em;
 
98
    border-color: #eee;
 
99
 
 
100
    -webkit-transition: margin 200ms ease, padding 200ms ease;
 
101
    -moz-transition: margin 200ms ease, padding 200ms ease;
 
102
    transition: margin 200ms ease, padding 200ms ease;
33
103
}
34
104
.ubuntu-branding {
35
105
    background: url(http://start.ubuntu.com/12.04/sprite.png) no-repeat;
37
107
    background-color: #aea79f;
38
108
    height: 40px;
39
109
    border-radius: 5px 5px 0 0;
40
 
}
41
 
.wrapper {
42
 
    padding: 0;
43
 
    border: 1px solid #eee;
44
 
    border-top: 0;
45
 
    border-radius: 0 0 5px 5px;
46
 
    margin: 0 auto;
47
 
    text-align: center;
48
 
}
49
 
.wrapper h1 {
50
 
    margin: 0;
51
 
    padding: 0;
 
110
    margin: -21px;
 
111
    margin-bottom: 20px;
 
112
}
 
113
.logo {
 
114
    margin: 0 0 15px 0;
52
115
}
53
116
.logo a {
54
117
    font-size: 1px;
56
119
    text-indent: -9999px;
57
120
    background: url(http://start.ubuntu.com/12.04/sprite.png) no-repeat;
58
121
    background-position: -10px -310px;
59
 
    margin: 0;
60
122
    padding: 0;
61
123
    height: 38px;
62
124
    width: 109px;
63
 
    margin-bottom: 15px;
64
 
    position: relative;
65
 
}
66
 
.wrapper input {
67
 
    /* allows styling in webkit */
68
 
    -webkit-appearance: textfield;
69
 
    display: inline-block;
70
 
    vertical-align: top;
71
 
    width: 384px;
72
 
    height: 32px;
73
 
    font-size: 18px;
74
 
    padding-left: 5px;
75
 
    padding-right: 5px;
76
 
    -webkit-box-sizing: border-box;
77
 
    -moz-box-sizing: border-box;
78
 
    -ms-box-sizing: border-box;
79
 
    -o-box-sizing: border-box;
80
 
    box-sizing: border-box;
81
 
    border: 1px solid #AEA79F;
82
 
}
83
 
.inner {
84
 
    display: inline-block;
85
 
    margin: 65px auto 100px auto;
86
 
}
87
 
.inner form {
88
 
    height: 32px;
 
125
    position: relative;
 
126
    -webkit-transition: margin 200ms ease;
 
127
    -moz-transition: margin 200ms ease;
 
128
    transition: margin 200ms ease;
 
129
}
 
130
.logo,
 
131
.search-form {
 
132
    max-width: 460px;
 
133
    margin-left: auto;
 
134
    margin-right: auto;
 
135
}
 
136
@media screen and (min-width: 665px) {
 
137
    .wrapper {
 
138
        max-width: 665px;
 
139
        margin: 0 auto;
 
140
    }
 
141
    .search-box {
 
142
        padding-bottom: 100px;
 
143
        margin-top: 65px;
 
144
    }
 
145
    .logo a {
 
146
        margin-top: 65px;
 
147
    }
 
148
    .search-form {
 
149
        text-align: center;
 
150
    }
 
151
}
 
152
.search-form {
 
153
    padding-right: 75px;
 
154
    position: relative;
 
155
    -moz-box-sizing: border-box;
 
156
    -webkit-box-sizing: border-box;
 
157
    box-sizing: border-box;
 
158
}
 
159
.search-input {
 
160
    -moz-box-sizing: border-box;
 
161
    -webkit-box-sizing: border-box;
 
162
    box-sizing: border-box;
 
163
    font-size: inherit;
 
164
}
 
165
.search-button {
 
166
    position: absolute;
 
167
    top: 0;
 
168
    right: 0;
 
169
    background: #4d90fe;
 
170
    background: -moz-linear-gradient(top, #4d90fe 0%, #4787ed 100%);
 
171
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4d90fe), color-stop(100%,#4787ed));
 
172
    background: -webkit-linear-gradient(top, #4d90fe 0%,#4787ed 100%);
 
173
    background: linear-gradient(to bottom, #4d90fe 0%,#4787ed 100%);
 
174
    border: 1px solid #3079ED;
 
175
    border-radius: 2px;
 
176
    color: #FFFFFF;
 
177
    cursor: default;
 
178
    font-weight: bold;
 
179
    height: 37px;
 
180
    line-height: 37px;
 
181
    width: 70px;
 
182
    margin-left: 0.5em;
 
183
    text-align: center;
 
184
    text-decoration: none;
 
185
    -moz-user-select: none;
 
186
    -webkit-box-sizing: border-box;
 
187
    -moz-box-sizing: border-box;
 
188
    box-sizing: border-box;
 
189
}
 
190
#sspan {
 
191
    background: url(http://start.ubuntu.com/12.04/sprite.png) no-repeat;
 
192
    background-position: -10px -692px;
 
193
    display: block;
 
194
    height: 17px;
 
195
    width: 14px;
 
196
    margin: auto;
 
197
    position: relative;
 
198
    top: 8px;
89
199
}
90
200
.external-links {
91
 
    text-align: center;
92
 
    padding-top: 20px;
93
 
    padding-left: 10px;
94
 
    padding-right: 10px;
 
201
    margin: 1em;
95
202
}
96
203
.external-links li {
97
 
    height: 30px;
98
 
    display: inline-block;
99
204
    text-align: left;
100
 
    padding-top: 8px;
101
 
    margin: 0 10px;
 
205
    display: block;
 
206
    margin: 0 1em 1em 1em;
 
207
    padding-bottom: 1em;
 
208
    border-bottom: 1px solid #ccc;
 
209
}
 
210
.external-links li:after {
 
211
    margin: 0;
102
212
}
103
213
.external-links a {
 
214
    display: block;
104
215
    text-decoration: none;
105
216
    color: gray;
106
 
    padding: 10px 0 10px 40px;
 
217
    height: 30px;
 
218
    line-height: 30px;
 
219
    padding-left: 35px;
107
220
}
108
221
.external-links a::after {
109
222
    content: " ›";
110
 
    font-size: 16px;
111
223
}
112
224
.external-links a:hover {
113
225
    color: #e24912;
114
226
}
115
 
.help-link, 
116
 
.shop-link, 
117
 
.community-link {
 
227
@media screen and (min-width: 665px) {
 
228
    .external-links {
 
229
        width: 595px;
 
230
        margin: auto;
 
231
        display: block;
 
232
        text-align: center;
 
233
    }
 
234
    .external-links li {
 
235
        display: inline-block;
 
236
        margin: 0 1em 0 0;
 
237
        padding: 0;
 
238
        border: none;
 
239
    }
 
240
    .external-links li:last-child {
 
241
        margin-right: 0;
 
242
        margin-bottom: 0;
 
243
    }
 
244
    .external-links li a {
 
245
        display: inline-block;
 
246
    }
 
247
}
 
248
.help-link a,
 
249
.shop-link a,
 
250
.community-link a {
118
251
    background: url(http://start.ubuntu.com/12.04/sprite.png) no-repeat;
119
252
}
120
 
.help-link {
 
253
.help-link a {
121
254
    background-position: -10px -450px;
122
255
}
123
 
.help-link:hover {
 
256
.help-link:hover a {
124
257
    background-position: -10px -490px;
125
258
}
126
 
.shop-link {
 
259
.shop-link a {
127
260
    background-position: -10px -368px;
128
261
}
129
 
.shop-link:hover {
 
262
.shop-link:hover a {
130
263
    background-position: -10px -410px;
131
264
}
132
 
.community-link {
 
265
.community-link a {
133
266
    background-position: -10px -528px;
134
267
}
135
 
.community-link:hover {
 
268
.community-link:hover a {
136
269
    background-position: -10px -568px;
137
270
}
138
 
#sbtn {
139
 
    margin: 0 3px;
140
 
    display: inline-block;
141
 
    vertical-align: top;
142
 
    background-color: #4D90FE;
143
 
    background: #4d90fe; /* Old browsers */
144
 
    background: -moz-linear-gradient(top, #4d90fe 0%, #4787ed 100%); /* FF3.6+ */
145
 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4d90fe), color-stop(100%,#4787ed)); /* Chrome,Safari4+ */
146
 
    background: -webkit-linear-gradient(top, #4d90fe 0%,#4787ed 100%); /* Chrome10+,Safari5.1+ */
147
 
    background: -o-linear-gradient(top, #4d90fe 0%,#4787ed 100%); /* Opera 11.10+ */
148
 
    background: -ms-linear-gradient(top, #4d90fe 0%,#4787ed 100%); /* IE10+ */
149
 
    background: linear-gradient(to bottom, #4d90fe 0%,#4787ed 100%); /* W3C */
150
 
    border: 1px solid #3079ED;
151
 
    border-radius: 2px;
152
 
    color: #FFFFFF;
153
 
    -moz-user-select: none;
154
 
    cursor: default;
155
 
    font-weight: bold;
156
 
    height: 32px;
157
 
    line-height: 32px;
158
 
    min-width: 54px;
159
 
    padding: 0 8px;
160
 
    text-align: center;
161
 
    text-decoration: none;
162
 
    -webkit-box-sizing: border-box;
163
 
    -moz-box-sizing: border-box;
164
 
    -ms-box-sizing: border-box;
165
 
    -o-box-sizing: border-box;
166
 
    box-sizing: border-box;
167
 
}
168
 
#sspan {
169
 
    background: url(http://start.ubuntu.com/12.04/sprite.png) no-repeat;
170
 
    background-position: -10px -692px;
171
 
    vertical-align: top;
172
 
    display: inline-block;
173
 
    height: 17px;
174
 
    margin: 5px 19px;
175
 
    width: 14px;
176
 
}
177
271
</style>
178
272
</head>
179
273
<body>
180
 
    <div class="search-box">
181
 
        <div class="ubuntu-branding"></div>
182
 
        <div class="wrapper">
183
 
            <div class="inner">
184
 
                <h1 class="logo"><a href="http://www.google.com">Google</a></h1>
185
 
                <form method="get" class="search-form" action="http://www.google.com/search" name="search">
186
 
                    <input type="search" name="q" value="" x-webkit-speech id="sbi" /><!-- eliminate whitespace
187
 
                    --><button id="sbtn" type="submit"><span id="sspan"></span><span class="acchide">Search</span></button>
188
 
                    <input type="hidden" name="ie" value="UTF-8" />
189
 
                    <input type="hidden" name="sa" value="Search" />
190
 
                    <input type="hidden" name="channel" value="fe">
191
 
                    <input type="hidden" name="client" value="browser-ubuntu">
192
 
                    <input title="search" type="hidden" name="hl" value="en-gb" />
193
 
                </form>
194
 
            </div>
195
 
        </div>
196
 
        <ul class="external-links">
197
 
            <li class="help-link"><a href="https://help.ubuntu.com">Ubuntu help</a></li>
198
 
            <li class="shop-link"><a href="http://shop.ubuntu.com">Ubuntu shop</a></li>
199
 
            <li class="community-link"><a href="http://www.ubuntu.com/community">Ubuntu community</a></li>
200
 
        </ul>
201
 
    </div><!-- close search-box -->
 
274
 
 
275
    <div class="wrapper">
 
276
 
 
277
        <div class="search-box one-box one-box-bordered">
 
278
 
 
279
            <div class="ubuntu-branding"></div>
 
280
 
 
281
            <h1 class="logo"><a href="http://www.google.com">Google</a></h1>
 
282
 
 
283
            <form method="get" class="search-form" action="http://www.google.com/search" name="search">
 
284
                <input type="search" class="search-input" name="q" value="" x-webkit-speech id="sbi" /><!-- eliminate whitespace
 
285
                --><button id="sbtn" class="search-button" type="submit"><span id="sspan"></span><span class="acchide">Search</span></button>
 
286
                <input type="hidden" name="ie" value="UTF-8" />
 
287
                <input type="hidden" name="sa" value="Search" />
 
288
                <input type="hidden" name="channel" value="fe">
 
289
                <input type="hidden" name="client" value="browser-ubuntu">
 
290
                <input title="search" type="hidden" name="hl" value="en-gb" />
 
291
            </form>
 
292
 
 
293
        </div><!-- close search-box -->
 
294
 
 
295
    </div><!-- close wrapper -->
 
296
 
 
297
    <ul class="external-links one-list-inline">
 
298
        <li class="help-link"><a href="https://help.ubuntu.com">Ubuntu help</a></li>
 
299
        <li class="shop-link"><a href="http://shop.ubuntu.com">Ubuntu shop</a></li>
 
300
        <li class="community-link"><a href="http://www.ubuntu.com/community">Ubuntu community</a></li>
 
301
    </ul>
 
302
 
202
303
<script type="text/javascript">
203
304
//<![CDATA[
204
305
(function focus_search() {