~repos /website

#astro#js#html#css

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

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


fc99e86a pyrossh

2 months ago
update repo markdown
src/pages/repos/[...slug]/index.astro CHANGED
@@ -57,7 +57,108 @@ const { Content } = await render(Astro.props);
57
57
  <div class={styles.summary}>
58
58
  {latestCommits.map((commit) => <Commit {...commit} />)}
59
59
  </div>
60
- <div class={styles.markdown}>
60
+ <article>
61
61
  <Content />
62
- </div>
62
+ </article>
63
63
  </Layout>
64
+ <style>
65
+ article {
66
+ font-size: 1.1rem;
67
+ margin-top: 1rem;
68
+
69
+ h1, h2 {
70
+ font-size: 1.5rem;
71
+ font-weight: 700;
72
+ margin-top: 0.5rem;
73
+ margin-bottom: 0.5rem;
74
+ }
75
+
76
+ h3 {
77
+ font-size: 1.15rem;
78
+ font-weight: 700;
79
+ margin-top: 0.5rem;
80
+ margin-bottom: 0.5rem;
81
+ }
82
+
83
+ p {
84
+ font-size: 1.1rem;
85
+ padding-bottom: 1rem;
86
+ }
87
+
88
+ p,
89
+ li {
90
+ font-size: 1.1rem;
91
+ code {
92
+ color: var(--color-code-fg);
93
+ background-color: var(--color-box-bg);
94
+ word-wrap: break-word;
95
+ box-decoration-break: clone;
96
+ padding: 2px 4px;
97
+ border-radius: 0.2rem;
98
+ font-weight: 400;
99
+ font-size: 0.8rem;
100
+ }
101
+ }
102
+
103
+ ol {
104
+ list-style: decimal;
105
+ padding-left: 1.5rem;
106
+ margin-bottom: 1rem;
107
+ margin-left: 1rem;
108
+
109
+ a {
110
+ color: var(--color-link);
111
+ text-decoration: underline;
112
+ }
113
+ }
114
+
115
+ pre {
116
+ font-size: 0.8rem;
117
+ font-family: "monospace";
118
+ line-height: 1.6;
119
+ padding: 16px;
120
+ margin: 12px 0px;
121
+ background: var(--color-box-bg);
122
+ }
123
+
124
+ blockquote {
125
+ padding-left: 0.5rem;
126
+ border-left: 3px solid #aaa;
127
+ }
128
+
129
+ table {
130
+ width: 100%;
131
+ max-width: 100%;
132
+ margin-bottom: 1rem;
133
+ border-collapse: collapse;
134
+ text-indent: initial;
135
+ unicode-bidi: isolate;
136
+ border-spacing: 2px;
137
+ font-size: 1rem;
138
+
139
+ thead {
140
+ th {
141
+ color: var(--color-text);
142
+ padding: 0.1rem 0.75rem;
143
+ border: 1px solid var(--color-text);
144
+ background-color: var(--color-box-bg);
145
+ }
146
+ }
147
+
148
+ tbody {
149
+ td {
150
+ position: relative;
151
+ background-clip: padding-box;
152
+ vertical-align: middle;
153
+ padding: 0.1rem 0.75rem;
154
+ border: 1px solid var(--color-text);
155
+ /* background-color: var(--color-box-bg); */
156
+
157
+ label {
158
+ margin-bottom: 0;
159
+ }
160
+ }
161
+ }
162
+ }
163
+ }
164
+ </style>
src/pages/repos/[...slug]/index.module.css CHANGED
@@ -34,147 +34,6 @@ h5 {
34
34
  font-weight: bold;
35
35
  }
36
36
 
37
- .markdown {
38
- font-size: 12pt;
39
-
40
- h1 {
41
- text-align: left;
42
- font-size: 24pt;
43
- /* font-weight: 500; */
44
- line-height: 1;
45
- margin-top: 0.5rem;
46
- margin-bottom: 0.1rem;
47
- }
48
-
49
- table {
50
- width: 100%;
51
- max-width: 100%;
52
- margin-bottom: 1rem;
53
- border-collapse: collapse;
54
- text-indent: initial;
55
- unicode-bidi: isolate;
56
- border-spacing: 2px;
57
- border-color: gray;
58
- color: white;
59
- font-size: 1rem;
60
-
61
- thead {
62
- th {
63
- padding: 0.1rem 0.75rem;
64
- border: none;
65
- }
66
- }
67
-
68
- tbody {
69
- td {
70
- position: relative;
71
- background-clip: padding-box;
72
- vertical-align: middle;
73
- padding: 0.1rem 0.75rem;
74
- border: 1px solid var(--color-gray-400);
75
- background-color: white;
76
-
77
- label {
78
- margin-bottom: 0;
79
- }
80
- }
81
- }
82
- }
83
-
84
- table,
85
- table tbody tr,
86
- table tbody td,
87
- table thead th {
88
- /* background: var(--color-gray-800); */
89
- background: #343a40;
90
- }
91
-
92
- table tbody td {
93
- /* border: 1px solid var(--color-gray-900); */
94
- border: 1px solid #212529;
95
- }
96
-
97
- h1,
98
- h2,
99
- h3,
100
- h4,
101
- h5,
102
- h6 {
103
- position: relative;
104
- margin-top: 1em;
105
-
106
- &:first-child {
107
- margin-top: 0;
108
- }
109
-
110
- &>a:first-child {
111
- transition: opacity 0.15s linear;
112
- opacity: 0;
113
- position: absolute;
114
- font-size: inherit;
115
- left: -0.7em;
116
- }
117
-
118
- @media (prefers-reduced-motion) {
119
- &>a:first-child {
120
- transition: none;
121
- }
122
- }
123
-
124
- &:hover>a:first-child {
125
- opacity: 1;
126
- }
127
-
128
- img {
129
- margin: 0 0.2rem;
130
- max-width: 100%;
131
- }
132
- }
133
-
134
- blockquote {
135
- padding-left: 0.5rem;
136
- border-left: 3px solid #aaa;
137
- }
138
-
139
- pre {
140
- background: var(--color-box-bg);
141
- padding: 0.25rem;
142
- }
143
-
144
- code {
145
- margin: 0;
146
- background: transparent;
147
- color: white;
148
- font-size: 87.5%;
149
- /* color: #e83e8c; */
150
- word-break: break-word;
151
- }
152
-
153
- .alert {
154
- padding: 0.5rem;
155
- border-radius: 0;
156
-
157
- .form-group & {
158
- margin-top: 1rem;
159
- }
160
- }
161
-
162
- .text-centered {
163
- text-align: center;
164
- }
165
-
166
- .text-right {
167
- text-align: right;
168
- }
169
-
170
- .pull-left {
171
- float: left;
172
- }
173
-
174
- .pull-right {
175
- float: right;
176
- }
177
- }
178
37
 
179
38
  .header {
180
39
  display: flex;