~repos /website

#astro#js#html#css

git clone https://pyrossh.dev/repos/website.git

木 Personal website of pyrossh. Built with astrojs, shiki, vite.


a2798549 pyrossh

1 month ago
update design
astro.config.mjs CHANGED
@@ -7,7 +7,7 @@ import expressiveCode from 'astro-expressive-code';
7
7
  // https://astro.build/config
8
8
  export default defineConfig({
9
9
  site: 'https://pyrossh.dev',
10
- trailingSlash: 'ignore',
10
+ trailingSlash: 'never',
11
11
  output: 'static',
12
12
  integrations: [icon(), sitemap(), expressiveCode()],
13
13
  experimental: {
infra/main.tf CHANGED
@@ -138,7 +138,7 @@ resource "aws_cloudfront_function" "html_redirector" {
138
138
 
139
139
  if (uri.endsWith('/')) {
140
140
  request.uri += 'index.html';
141
- } else if (!uri.includes('.')) {
141
+ } else if (!uri.startsWith('/_astro')) {
142
142
  request.uri += '/index.html';
143
143
  }
144
144
  return request;
src/pages/repos/[...slug]/files/[...file]/index.astro CHANGED
@@ -31,27 +31,44 @@ const { repo, file } = Astro.props;
31
31
  const contentBuffer = await fs.readFile(file.absolutePath);
32
32
  const name = path.basename(file.name);
33
33
  const ext = path.extname(file.name).replace(".", "");
34
+ const isBinary = ["apk", "dex", "ap_", "jar", "fnt"].includes(ext);
35
+ const isLarge = file.size > 1024 * 512; // 512KB
36
+ const isImage = [
37
+ "png",
38
+ "jpg",
39
+ "jpeg",
40
+ "gif",
41
+ "svg",
42
+ "webp",
43
+ "ico",
44
+ "icns",
45
+ "curve",
46
+ "atlas",
47
+ ].includes(ext);
34
48
  ---
35
49
 
36
50
  <RepoLayout data={repo.data}>
37
51
  {
38
- ["png", "jpg", "jpeg", "gif", "svg", "webp", "ico", "icns", "curve", 'atlas'].includes(ext) ? (
52
+ (
39
53
  <div>
54
+ <div class="title">
55
+ <span>file:</span>
40
- <h1>{name}</h1>
56
+ <h3>{file.name}</h3>
41
- <img
42
- src={`data:image/${ext};base64,${Buffer.from(contentBuffer).toString("base64")}`}
43
- alt={name}
44
- />
45
- </div>
57
+ </div>
46
- ) : (
47
- <div>
58
+ {isBinary || isLarge ? (
48
- <div class="name blob">{name}</div>
49
- {['apk', 'dex', 'ap_', 'jar', 'fnt'].includes(ext) || file.size > 512000 ? ( // Ignore files larger than 512KB
50
59
  <p>The file is too large to be displayed ({file.size} bytes).</p>
60
+ ) : isImage ? (
61
+ <img
62
+ src={`data:image/${ext};base64,${Buffer.from(contentBuffer).toString("base64")}`}
63
+ alt={file.name}
64
+ />
51
65
  ) : (
52
66
  <Code
67
+ code={
53
- code={Buffer.from(contentBuffer).toString("utf-8") || 'No content to display.'}
68
+ Buffer.from(contentBuffer).toString("utf-8") ||
69
+ "No content to display."
70
+ }
54
- lang={ext || 'txt'}
71
+ lang={ext || "txt"}
55
72
  wrap
56
73
  />
57
74
  )}
@@ -59,3 +76,19 @@ const ext = path.extname(file.name).replace(".", "");
59
76
  )
60
77
  }
61
78
  </RepoLayout>
79
+ <style>
80
+ .title {
81
+ display: flex;
82
+ align-items: center;
83
+ margin-top: 0.75rem;
84
+ margin-bottom: 0.5rem;
85
+ font-size: 1.1rem;
86
+ }
87
+ span {
88
+ font-weight: 600;
89
+ margin-right: 4px;
90
+ }
91
+ h3 {
92
+ text-decoration: underline;
93
+ }
94
+ </style>
src/pages/repos/[...slug]/files/index.astro CHANGED
@@ -22,11 +22,8 @@ const {
22
22
  {
23
23
  files.map((file) => (
24
24
  <li>
25
- <div class="mode">
26
- <span title="100644">-rw-r--r--</span>
27
- </div>
28
25
  <div class="name">
29
- <a href={`/repos/${title}/files/${file.name}/`} rel="nofollow">
26
+ <a href={`/repos/${title}/files/${file.name}`} rel="nofollow">
30
27
  {file.name}
31
28
  </a>
32
29
  </div>
@@ -67,22 +64,13 @@ const {
67
64
  }
68
65
  }
69
66
 
70
- .mode {
71
- margin-right: 1rem;
72
- /* color: rgb(var(--gray)); */
73
- }
74
-
75
67
  .name {
76
68
  flex: 1;
69
+ margin-left: 0.5rem;
77
70
  }
78
71
 
79
72
  .size {
73
+ margin-right: 0.5rem;
80
74
  /* background-color: var(--color-code-bg); */
81
75
  }
82
-
83
- .tree-list {
84
- display: grid;
85
- grid-template-columns: auto auto;
86
- font-size: 1rem;
87
- }
88
76
  </style>