Skip to content

Commit aaae36f

Browse files
committed
Add a light frontpage layout
1 parent ed760bd commit aaae36f

File tree

4 files changed

+146
-39
lines changed

4 files changed

+146
-39
lines changed

public/styles/common.css

+16
Original file line numberDiff line numberDiff line change
@@ -759,3 +759,19 @@ Individual DUB package CSS definitions
759759
#front-view-all-btn {
760760
text-align: right;
761761
}
762+
763+
/*Footer*/
764+
765+
#footer {
766+
padding-top: 2em;
767+
margin: 0 auto;
768+
width: 740px;
769+
}
770+
771+
#footer ul {
772+
list-style-type: none;
773+
}
774+
#footer li {
775+
float: left;
776+
padding: 16px;
777+
}

public/styles/top_p.css

+86-38
Original file line numberDiff line numberDiff line change
@@ -71,41 +71,89 @@ h2 {
7171

7272
/* Fontello icons */
7373

74-
.icon-category-desktop:before { content: '\e800'; }
75-
.icon-category-editor:before { content: '\e801'; }
76-
.icon-category-web:before { content: '\e802'; }
77-
.icon-category-audio:before { content: '\e803'; }
78-
.icon-category-network:before { content: '\e804'; }
79-
.icon-category-photo:before { content: '\e805'; }
80-
.icon-category-productivity:before { content: '\e806'; }
81-
.icon-category-unknown:before { content: '\e807'; }
82-
.icon-category-video:before { content: '\e808'; }
83-
.icon-category-i18n:before { content: '\e809'; }
84-
.icon-category-library:before { content: '\e80a'; }
85-
.icon-category-graphics:before { content: '\e80b'; }
86-
.icon-category-generic:before { content: '\e80c'; }
87-
.icon-category-auth:before { content: '\e80d'; }
88-
.icon-category-cpu:before { content: '\e80e'; }
89-
.icon-category-gc:before { content: '\e80f'; }
90-
.icon-category-mem:before { content: '\e810'; }
91-
.icon-category-data:before { content: '\e811'; }
92-
.icon-category-std:before { content: '\e812'; }
93-
.icon-category-mobile:before { content: '\e813'; }
94-
.icon-category-communication:before { content: '\e814'; }
95-
.icon-category-crypto:before { content: '\e82b'; }
96-
.icon-search:before { content: '\f002'; }
97-
.icon-category-scientific:before { content: '\f016'; }
98-
.icon-link-ext:before { content: '\f08e'; }
99-
.icon-category-binding:before { content: '\f097'; }
100-
.icon-github-circled:before { content: '\f09b'; }
101-
.icon-menu:before { content: '\f0c9'; }
102-
.icon-down-dir:before { content: '\f0d7'; }
103-
.icon-up-dir:before { content: '\f0d8'; }
104-
.icon-category-game:before { content: '\f11b'; }
105-
.icon-code:before { content: '\f121'; }
106-
.icon-bitbucket:before { content: '\f171'; }
107-
.icon-category-3d:before { content: '\f1b2'; }
108-
.icon-category-database:before { content: '\f1c0'; }
109-
.icon-category-server:before { content: '\f233'; }
110-
.icon-category-development:before { content: '\f275'; }
111-
.icon-gitlab:before { content: '\f296'; }
74+
.icon-category-desktop:before { content: '\e800'; } /* '' */
75+
.icon-category-editor:before { content: '\e801'; } /* '' */
76+
.icon-category-web:before { content: '\e802'; } /* '' */
77+
.icon-category-audio:before { content: '\e803'; } /* '' */
78+
.icon-category-network:before { content: '\e804'; } /* '' */
79+
.icon-category-photo:before { content: '\e805'; } /* '' */
80+
.icon-category-productivity:before { content: '\e806'; } /* '' */
81+
.icon-category-unknown:before { content: '\e807'; } /* '' */
82+
.icon-category-video:before { content: '\e808'; } /* '' */
83+
.icon-category-i18n:before { content: '\e809'; } /* '' */
84+
.icon-category-library:before { content: '\e80a'; } /* '' */
85+
.icon-category-graphics:before { content: '\e80b'; } /* '' */
86+
.icon-category-generic:before { content: '\e80c'; } /* '' */
87+
.icon-category-auth:before { content: '\e80d'; } /* '' */
88+
.icon-category-cpu:before { content: '\e80e'; } /* '' */
89+
.icon-category-gc:before { content: '\e80f'; } /* '' */
90+
.icon-category-mem:before { content: '\e810'; } /* '' */
91+
.icon-category-data:before { content: '\e811'; } /* '' */
92+
.icon-category-std:before { content: '\e812'; } /* '' */
93+
.icon-category-mobile:before { content: '\e813'; } /* '' */
94+
.icon-category-communication:before { content: '\e814'; } /* '' */
95+
.icon-download:before { content: '\e815'; } /* '' */
96+
.icon-help-circled:before { content: '\e816'; } /* '' */
97+
.icon-category-crypto:before { content: '\e82b'; } /* '' */
98+
.icon-search:before { content: '\f002'; } /* '' */
99+
.icon-category-scientific:before { content: '\f016'; } /* '' */
100+
.icon-link-ext:before { content: '\f08e'; } /* '' */
101+
.icon-category-binding:before { content: '\f097'; } /* '' */
102+
.icon-github-circled:before { content: '\f09b'; } /* '' */
103+
.icon-menu:before { content: '\f0c9'; } /* '' */
104+
.icon-down-dir:before { content: '\f0d7'; } /* '' */
105+
.icon-up-dir:before { content: '\f0d8'; } /* '' */
106+
.icon-github:before { content: '\f113'; } /* '' */
107+
.icon-category-game:before { content: '\f11b'; } /* '' */
108+
.icon-code:before { content: '\f121'; } /* '' */
109+
.icon-bitbucket:before { content: '\f171'; } /* '' */
110+
.icon-category-3d:before { content: '\f1b2'; } /* '' */
111+
.icon-category-database:before { content: '\f1c0'; } /* '' */
112+
.icon-category-server:before { content: '\f233'; } /* '' */
113+
.icon-category-development:before { content: '\f275'; } /* '' */
114+
.icon-gitlab:before { content: '\f296'; } /* '' */
115+
116+
117+
/* search box */
118+
119+
#light .search-container
120+
{
121+
font-size: 3em;
122+
}
123+
124+
#light .search-container.expand-container .expand-toggle
125+
{
126+
display: none;
127+
}
128+
#light .search-container.expand-container .expand-toggle::after
129+
{
130+
content: "\f002 \f0d7"; /* f002 = search; f0d7 = caret down */
131+
font-family: fontello;
132+
}
133+
134+
#light .search-container.expand-container .expand-toggle span
135+
{
136+
display: none;
137+
}
138+
139+
#light #search-box
140+
{
141+
display: block;
142+
padding-left: 1em;
143+
text-align: center;
144+
}
145+
146+
#light span#search-query {
147+
width: 100%;
148+
height: 3em;
149+
}
150+
151+
#light span#search-submit button {
152+
height: 1.5em;
153+
background: #969696;
154+
padding: 0 0.1em;
155+
}
156+
157+
#light span#search-query input, #light span#search-submit button {
158+
font-size: 2em;
159+
}

views/layout-light.dt

+43
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
!!! 5
2+
html
3+
head
4+
block css
5+
link(rel="stylesheet", type="text/css", href="#{req.rootDir}styles/common.css")
6+
link(rel="stylesheet", type="text/css", href="#{req.rootDir}styles/top.css")
7+
link(rel="stylesheet", type="text/css", href="#{req.rootDir}styles/top_p.css")
8+
9+
link(rel="shortcut icon", href="#{req.rootDir}favicon.ico")
10+
meta(name="viewport",content="width=device-width, initial-scale=1.0, minimum-scale=0.1, maximum-scale=10.0")
11+
block title
12+
title= title ~ " - DUB - The D package registry"
13+
body#Home.doc
14+
script document.body.className += ' have-javascript'
15+
#light
16+
.search-container.expand-container
17+
a.expand-toggle(href="search.html", title="Search")
18+
span Search
19+
#search-box
20+
form(method="GET", action="#{req.rootDir}search")
21+
span#search-query
22+
input#q(name="q", placeholder="Search for a package")
23+
span#search-submit
24+
button(type="submit")
25+
i.fa.fa-search
26+
27+
#content
28+
block body
29+
30+
#footer
31+
ul
32+
- import std.algorithm.searching : startsWith;
33+
- import std.range : empty;
34+
- import std.string : split;
35+
- import std.typecons : tuple;
36+
- auto listitems = [tuple("Documentation", "help-circled", "https://dub.pm"), tuple("Download", "download", "download"), tuple("GitHub (DUB)", "github-circled", "https://github.com/dlang/dub"),tuple("GitHub (DUB registry)", "github", "https://github.com/dlang/dub-registry")];
37+
- foreach(items; listitems)
38+
li
39+
i(class="fa icon-#{items[1]}")
40+
a(href="#{items[2]}")
41+
span=items[0]
42+
43+
script(type="application/javascript", src="/scripts/menu.js")

views/start.dt

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
extends layout
1+
extends layout-light
22

33
block title
44
- import dubregistry.viewutils;

0 commit comments

Comments
 (0)