Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commitf394861

Browse files
committed
redo styling and add a blog
1 parent2622246 commitf394861

File tree

10 files changed

+354
-90
lines changed

10 files changed

+354
-90
lines changed

‎content/_index.md‎

Lines changed: 22 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,41 @@
11
+++
2+
title ="Home"
3+
template ="index.html"
24
+++
35

4-
<header>
5-
<imgsrc="logo.svg"alt="uutils"class="logo" />
6-
<h1class="title">uutils</h1>
7-
</header>
6+
<divclass="hero">
7+
<imgsrc="logo.svg">
8+
<div>uutils</div>
9+
</div>
810

911
The uutils project reimplements ubiquitous command line utilities in
1012
Rust. Our goal is to modernize the utils, while retaining full
1113
compatibility with the existing utilities.
1214

13-
##Projects
15+
#Projects
1416

1517
<divclass="projects">
1618
<aclass="project"href="/coreutils">
17-
<span aria-hidden="true">&gt;</span>
18-
coreutils
19+
<h2>coreutils</h2>
20+
<p>
21+
The commands you use everyday: <code>ls</code>, <code>cp</code>, etc.
22+
</p>
1923
</a>
2024
<aclass="project"href="/findutils">
21-
<span aria-hidden="true">&gt;</span>
22-
findutils
25+
<h2>findutils</h2>
26+
<p>
27+
Finding what you need: <code>find</code>, <code>locate</code>, <code>updatedb</code> &amp; <code>xargs</code>.
28+
</p>
2329
</a>
2430
<aclass="project"href="/diffutils">
25-
<span aria-hidden="true">&gt;</span>
26-
diffutils
31+
<h2>diffutils</h2>
32+
<p>
33+
Comparing text and files: <code>diff</code>, <code>cmp</code>, <code>diff3</code>, <code>sdiff</code>.
34+
</p>
2735
</a>
2836
</div>
2937

30-
##Crates
38+
#Crates
3139

3240
We maintain a variety of public crates to support our projects,
3341
which are published on[crates.io](https://crates.io/).
@@ -36,7 +44,7 @@ which are published on [crates.io](https://crates.io/).
3644
-[`parse_datetime`](https://github.com/uutils/parse_datetime)
3745
-[`uutils-term-grid`](https://github.com/uutils/uutils-term-grid)
3846

39-
##Contributing
47+
#Contributing
4048

4149
You can help us out by:
4250

@@ -48,7 +56,7 @@ You can help us out by:
4856

4957
You can join our[Discord server](https://discord.gg/wQVJbvJ) to discuss or ask anything concerning uutils. We're happy to help you get started with contributing!
5058

51-
##Friends of uutils
59+
#Friends of uutils
5260

5361
We collaborate with and build upon many other projects in the Rust
5462
community, either by using or providing crates. We highly recommend

‎content/blog/_index.md‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
+++
2+
template ="section.html"
3+
sort_by ="date"
4+
page_template ="post.html"
5+
title ="Blog"
6+
+++

‎content/blog/test.md‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
+++
2+
title ="Test post"
3+
draft =true
4+
date =2024-01-31
5+
authors = ["Terts Diepraam"]
6+
+++
7+
8+
This is a test post
9+
10+
#Heading 1

‎content/gsoc.md‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,7 @@
11
+++
2-
title ="GSOC"
2+
title ="Uutils atGSOC"
33
+++
44

5-
#Uutils at GSOC
6-
75
Google summer of code is:
86

97
>Google Summer of Code is a global, online program focused on bringing

‎static/style.css‎

Lines changed: 172 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,3 @@
1-
/* All these styles are adapted from oranda to match their look */
2-
@importurl("https://fonts.googleapis.com/css2?family=Fira+Sans:wght@400;700;900&display=swap");
31
:root {
42
--dark-fg-color:#fff;
53
--light-fg-color:#141414;
@@ -68,6 +66,8 @@ body {
6866
body {
6967
line-height: inherit;
7068
margin:0;
69+
display: flex;
70+
flex-direction: column;
7171
}
7272

7373
.container {
@@ -80,54 +80,129 @@ body {
8080
flex-grow:1;
8181
}
8282

83-
/* REPO BANNER */
84-
.repo_banner {
85-
background-color:var(--fg-color);
86-
color:var(--bg-color);
87-
padding-bottom:0.375rem;
88-
padding-top:0.375rem;
83+
/* HEADER */
84+
header {
85+
display: grid;
86+
grid-template-columns:repeat(2, max-content) max-content1fr max-content;
87+
column-gap:1em;
88+
align-items: center;
89+
justify-items: center;
90+
padding:0.5rem2rem;
91+
width:100%;
92+
border-bottom:1px solid#ddd;
93+
font-size:1.2rem;
94+
}
95+
96+
header .home {
97+
color: black;
98+
font-size:2rem;
99+
font-weight: bold;
89100
}
90101

91-
.repo_banner>a {
92-
align-items: flex-start;
102+
header .home:first-child {
93103
display: flex;
94-
gap:0.5rem;
95-
height:20px;
96-
justify-content: center;
104+
align-items: center;
105+
vertical-align: center;
97106
}
98-
.repo_banner>a,
99-
.repo_banner>a:hover {
100-
color:rgb(248250252);
107+
108+
header .homesvg {
109+
height:3rem;
110+
width:3rem;
101111
}
102-
.repo_banner>a:hover {
103-
text-decoration-color:#f8fafc;
104-
text-decoration-line: underline;
105-
text-underline-offset:1px;
112+
113+
headera {
114+
color: black;
115+
border-bottom:2px solid transparent;
106116
}
107117

108-
/* HEADER */
109-
.logo {
118+
headera:hover:not(.home) {
119+
color: black;
120+
border-bottom:2px solid#c04828;
121+
}
122+
123+
.navigation-block {
124+
display: flex;
125+
flex-direction: row;
126+
gap:1rem;
127+
}
128+
129+
header .icon {
130+
display: flex;
131+
align-items: center;
132+
}
133+
134+
#mobile-open-navigationbutton {
135+
display: none;
136+
}
137+
138+
#mobile-open-navigation {
139+
justify-self: right;
140+
}
141+
142+
@media (max-width:640px) {
143+
#mobile-open-navigationbutton {
144+
display: block;
145+
flex-direction: column;
146+
background-color: transparent;
147+
}
148+
149+
#mobile-open-navigationbuttondiv {
150+
margin:0.5em0;
151+
width:2em;
152+
border-bottom:0.25em solid black;
153+
}
154+
155+
header {
156+
grid-template-columns: max-content1fr;
157+
}
158+
159+
.spacer {
160+
display: none;
161+
}
162+
163+
.navigation-block {
164+
margin-top:0.5em;
165+
grid-column: auto/ span2;
166+
justify-self: left;
167+
}
168+
169+
header:not(.open) .spacer,
170+
header:not(.open) .navigation-block {
171+
display: none;
172+
}
173+
}
174+
175+
/* HERO */
176+
.hero {
177+
margin:2rem0;
178+
}
179+
180+
.heroimg {
110181
display: block;
111-
height:170px;
182+
height:14em;
112183
margin: auto;
113184
}
114-
.title {
185+
186+
.herodiv {
115187
font-size:3.75rem;
116188
line-height:1;
117189
text-align: center;
118190
padding-bottom:0.5rem;
191+
font-weight: bold;
119192
}
193+
120194
@media (min-width:640px) {
121-
.title {
195+
.herodiv {
122196
font-size:6rem;
123197
line-height:1;
124198
}
125199
}
126200

127201
/* MAIN */
128202
main {
129-
margin:6rem auto;
130-
max-width:80%;
203+
margin:1rem auto;
204+
width:80%;
205+
flex:1;
131206
}
132207

133208
@media (min-width:1024px) {
@@ -137,7 +212,7 @@ main {
137212
}
138213

139214
h1 {
140-
font-size:1.875rem;
215+
font-size:1.5rem;
141216
font-weight:900;
142217
line-height:2.25rem;
143218
line-height:1.25;
@@ -153,7 +228,7 @@ p {
153228

154229
@media (min-width:640px) {
155230
h1 {
156-
font-size:3.75rem;
231+
font-size:3rem;
157232
line-height:1;
158233
}
159234

@@ -216,35 +291,91 @@ footer {
216291
width:1.25rem;
217292
}
218293

294+
.github-icon-black {
295+
background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='000' d='M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12'/%3E%3C/svg%3E");
296+
height:1em;
297+
width:1em;
298+
}
299+
219300
.projects {
220301
display: flex;
221-
flex-direction:row;
302+
flex-direction:column;
222303
flex-wrap: wrap;
223304
justify-content: space-between;
224305
width:100%;
225-
gap:1rem;
306+
gap:2rem;
307+
margin-bottom:1.5rem;
226308
}
227309

228310
.project {
229-
flex-basis:20rem;
230-
flex-grow:1;
231-
border:3px solid#888;
232-
border-radius:6px;
233-
padding:2rem;
311+
border-left:0.3em solid gray;
312+
padding:1rem;
234313
text-decoration: none;
235314
color:var(--fg-color);
236-
font-size:2rem;
237-
font-weight:700;
238315
transition: text-decoration0.3s;
239316
transition: border-color0.3s;
240317
}
241-
.project>span {
318+
319+
.projecth2 {
320+
margin-top:0;
321+
font-family: monospace;
322+
}
323+
324+
.projectp {
325+
margin-bottom:0;
326+
}
327+
328+
.project>span {
242329
color: transparent;
243330
transition: color0.3s;
244331
}
245-
.project:hover>span {
332+
333+
.project:hover>span {
246334
color: black;
247335
}
336+
248337
.project:hover {
249-
border-color: black;
338+
border-color:#c04828;
339+
}
340+
341+
.title {
342+
font-size:3em;
343+
font-weight: bold;
344+
margin-bottom:0.5em;
345+
}
346+
347+
@media (min-width:640px) {
348+
.title {
349+
font-size:4rem;
350+
line-height:1;
351+
}
250352
}
353+
354+
.details {
355+
margin-bottom:1.5em;
356+
color:#333;
357+
}
358+
359+
.post-thingy {
360+
display: block;
361+
padding:1em;
362+
color: black;
363+
background:#e5e5e5;
364+
border-radius:0.3em;
365+
border:0.2em solid#e5e5e5;
366+
margin-bottom:0.5em;
367+
}
368+
369+
.post-thingy:hover {
370+
border-color:#c04828;
371+
background: transparent;
372+
}
373+
374+
.post-thingyh1 {
375+
margin-bottom:0.2em;
376+
}
377+
378+
blockquote {
379+
border-left:0.2em solid gray;
380+
padding-left:1em;
381+
}

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp