Skip to content
This repository was archived by the owner on Jan 19, 2025. It is now read-only.

Commit 648e47c

Browse files
chiciochicio
committed
Various fixes 🚀
1 parent 3afb945 commit 648e47c

File tree

4 files changed

+45
-16
lines changed

4 files changed

+45
-16
lines changed

‎src/components/design-system/organism/blog-header.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ const BlogTitle = styled(Heading3)`
2121
margin: 0;
2222
font-weight: bold;
2323
display: block;
24+
line-height: 1.5;
2425
2526
@media (prefers-color-scheme: dark) {
2627
color: ${(props) => props.theme.dark.primaryTextColor};
@@ -39,6 +40,7 @@ const BlogDescription = styled.span`
3940
display: block;
4041
font-size: ${(props) => props.theme.fontSizes[4]};
4142
color: ${(props) => props.theme.light.secondaryTextColor};
43+
line-height: 1.5;
4244
4345
@media (prefers-color-scheme: dark) {
4446
color: ${(props) => props.theme.dark.secondaryTextColor};

‎src/components/design-system/organism/projects.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -318,8 +318,8 @@ export const Projects: React.FC = () => (
318318
<SpectralClaraLuxTracer />
319319
<SpectralBRDFExplorer />
320320
<ID3TagEditor />
321-
<RangeUISlider />
322321
<TabBarUIAction />
323322
<Mp3Id3Tagger />
323+
<RangeUISlider />
324324
</>
325325
);

‎src/components/head.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -189,7 +189,7 @@ export const Head: React.FC<HeadProps> = ({
189189
/>
190190
<style type="text/css">{`
191191
.cc-window{opacity:1;transition:opacity 1s ease}.cc-window.cc-invisible{opacity:0}.cc-animate.cc-revoke{transition:transform 1s ease}.cc-animate.cc-revoke.cc-top{transform:translateY(-2em)}.cc-animate.cc-revoke.cc-bottom{transform:translateY(2em)}.cc-animate.cc-revoke.cc-active.cc-bottom,.cc-animate.cc-revoke.cc-active.cc-top,.cc-revoke:hover{transform:translateY(0)}.cc-grower{max-height:0;overflow:hidden;transition:max-height 1s}
192-
.cc-link,.cc-revoke:hover{text-decoration:underline}.cc-revoke,.cc-window{position:fixed;overflow:hidden;box-sizing:border-box;font-family:Helvetica,Calibri,Arial,sans-serif;font-size:16px;line-height:1.5em;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;z-index:9999}.cc-window.cc-static{position:static}.cc-window.cc-floating{padding:2em;max-width:24em;-ms-flex-direction:column;flex-direction:column}.cc-window.cc-banner{padding:1em 1.8em;width:100%;-ms-flex-direction:row;flex-direction:row}.cc-revoke{padding:.5em}.cc-header{font-size:18px;font-weight:700}.cc-btn,.cc-close,.cc-link,.cc-revoke{cursor:pointer}.cc-link{opacity:.8;display:inline-block;padding:.2em}.cc-link:hover{opacity:1}.cc-link:active,.cc-link:visited{color:initial}.cc-btn{display:block;padding:.4em .8em;font-size:.9em;font-weight:700;border-width:2px;border-style:solid;text-align:center;white-space:nowrap}.cc-banner .cc-btn:last-child{min-width:140px}.cc-highlight .cc-btn:first-child{background-color:transparent;border-color:transparent}.cc-highlight .cc-btn:first-child:focus,.cc-highlight .cc-btn:first-child:hover{background-color:transparent;text-decoration:underline}.cc-close{display:block;position:absolute;top:.5em;right:.5em;font-size:1.6em;opacity:.9;line-height:.75}.cc-close:focus,.cc-close:hover{opacity:1}
192+
.cc-link,.cc-revoke:hover{text-decoration:none}.cc-revoke,.cc-window{position:fixed;overflow:hidden;box-sizing:border-box;font-family:Helvetica,Calibri,Arial,sans-serif;font-size:16px;line-height:1.5em;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;z-index:9999}.cc-window.cc-static{position:static}.cc-window.cc-floating{padding:2em;max-width:24em;-ms-flex-direction:column;flex-direction:column}.cc-window.cc-banner{padding:1em 1.8em;width:100%;-ms-flex-direction:row;flex-direction:row}.cc-revoke{padding:.5em}.cc-header{font-size:18px;font-weight:700}.cc-btn,.cc-close,.cc-link,.cc-revoke{cursor:pointer}.cc-link{opacity:.8;display:inline-block;padding:.2em}.cc-link:hover{opacity:1}.cc-link:active,.cc-link:visited{color:initial}.cc-btn{display:block;padding:.4em .8em;font-size:.9em;font-weight:700;border-width:2px;border-style:solid;text-align:center;white-space:nowrap}.cc-banner .cc-btn:last-child{min-width:140px}.cc-highlight .cc-btn:first-child{background-color:transparent;border-color:transparent}.cc-highlight .cc-btn:first-child:focus,.cc-highlight .cc-btn:first-child:hover{background-color:transparent;text-decoration:underline}.cc-close{display:block;position:absolute;top:.5em;right:.5em;font-size:1.6em;opacity:.9;line-height:.75}.cc-close:focus,.cc-close:hover{opacity:1}
193193
.cc-revoke.cc-top{top:0;left:3em;border-bottom-left-radius:.5em;border-bottom-right-radius:.5em}.cc-revoke.cc-bottom{bottom:0;left:3em;border-top-left-radius:.5em;border-top-right-radius:.5em}.cc-revoke.cc-left{left:3em;right:unset}.cc-revoke.cc-right{right:3em;left:unset}.cc-top{top:1em}.cc-left{left:1em}.cc-right{right:1em}.cc-bottom{bottom:1em}.cc-floating>.cc-link{margin-bottom:1em}.cc-floating .cc-message{display:block;margin-bottom:1em}.cc-window.cc-floating .cc-compliance{-ms-flex:1;flex:1}.cc-window.cc-banner{-ms-flex-align:center;align-items:center}.cc-banner.cc-top{left:0;right:0;top:0}.cc-banner.cc-bottom{left:0;right:0;bottom:0}.cc-banner .cc-message{-ms-flex:1;flex:1}.cc-compliance{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-line-pack:justify;align-content:space-between}.cc-compliance>.cc-btn{-ms-flex:1;flex:1}.cc-btn+.cc-btn{margin-left:.5em}
194194
@media print{.cc-revoke,.cc-window{display:none}}@media screen and (max-width:900px){.cc-btn{white-space:normal}}@media screen and (max-width:414px) and (orientation:portrait),screen and (max-width:736px) and (orientation:landscape){.cc-window.cc-top{top:0}.cc-window.cc-bottom{bottom:0}.cc-window.cc-banner,.cc-window.cc-left,.cc-window.cc-right{left:0;right:0}.cc-window.cc-banner{-ms-flex-direction:column;flex-direction:column}.cc-window.cc-banner .cc-compliance{-ms-flex:1;flex:1}.cc-window.cc-floating{max-width:none}.cc-window .cc-message{margin-bottom:1em}.cc-window.cc-banner{-ms-flex-align:unset;align-items:unset}}
195195
.cc-floating.cc-theme-classic{padding:1.2em;border-radius:5px}.cc-floating.cc-type-info.cc-theme-classic .cc-compliance{text-align:center;display:inline;-ms-flex:none;flex:none}.cc-theme-classic .cc-btn{border-radius:4px}.cc-theme-classic .cc-btn:last-child{min-width:140px}.cc-floating.cc-type-info.cc-theme-classic .cc-btn{display:inline-block}

‎src/components/post-content.tsx‎

Lines changed: 41 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -7,49 +7,68 @@ import { syntax } from "./design-system/atoms/syntax";
77

88
export const PostContentContainer = styled.div`
99
color: ${(props) => props.theme.light.primaryTextColor};
10-
line-height: ${(props) => props.theme.lineHeight};
11-
word-break: break-word;
12-
10+
line-height: 1.5;
11+
1312
& ul li {
1413
font-size: ${(props) => props.theme.fontSizes[2]};
14+
line-height: ${(props) => props.theme.lineHeight};
1515
}
1616
1717
& p {
1818
font-size: ${(props) => props.theme.fontSizes[2]};
19+
margin-left: 0;
20+
margin-right: 0;
21+
line-height: ${(props) => props.theme.lineHeight};
1922
}
2023
2124
& figure figcaption {
2225
font-size: ${(props) => props.theme.fontSizes[1]};
2326
text-align: center;
27+
line-height: ${(props) => props.theme.lineHeight};
2428
}
2529
2630
& h3 {
27-
${heading3Style}
31+
${heading3Style};
32+
margin-left: 0;
33+
margin-right: 0;
34+
line-height: ${(props) => props.theme.lineHeight};
2835
}
2936
3037
& h4 {
31-
${heading4Style}
38+
${heading4Style};
39+
margin-left: 0;
40+
margin-right: 0;
41+
line-height: ${(props) => props.theme.lineHeight};
3242
}
3343
3444
& a {
35-
${standardLinkStyle}
45+
${standardLinkStyle};
46+
line-height: ${(props) => props.theme.lineHeight};
3647
}
37-
48+
3849
& blockquote {
50+
line-height: ${(props) => props.theme.lineHeight};
3951
color: ${(props) => props.theme.light.secondaryTextColor};
4052
border-left: 5px solid ${(props) => props.theme.light.secondaryTextColor};
41-
padding: ${(props) => props.theme.spacing[4]} ${(props) =>
42-
props.theme.spacing[2]};
53+
margin-left: 0;
54+
margin-right: 0;
55+
padding: ${(props) => props.theme.spacing[4]}
56+
${(props) => props.theme.spacing[2]};
4357
}
4458
4559
& blockquote p {
46-
margin-bottom: 0
60+
line-height: ${(props) => props.theme.lineHeight};
61+
margin-bottom: 0;
62+
margin-top: 0;
4763
}
4864
4965
& hr {
50-
background-color: ${(props) => props.theme.light.dividerColor}
66+
color: ${(props) => props.theme.light.dividerColor};
67+
background-color: ${(props) => props.theme.light.dividerColor};
5168
width: 100%;
5269
margin: ${(props) => props.theme.spacing[4]} 0;
70+
border: 0;
71+
border-top: 1px solid rgba(0, 0, 0, 0.1);
5372
}
5473
5574
@media (prefers-color-scheme: dark) {
@@ -59,9 +78,10 @@ export const PostContentContainer = styled.div`
5978
color: ${(props) => props.theme.dark.secondaryTextColor};
6079
border-left: 5px solid ${(props) => props.theme.dark.secondaryTextColor};
6180
}
62-
81+
6382
& hr {
64-
background-color: ${(props) => props.theme.dark.dividerColor}
83+
color: ${(props) => props.theme.dark.dividerColor};
84+
background-color: ${(props) => props.theme.dark.dividerColor};
6585
}
6686
}
6787
@@ -74,7 +94,9 @@ export const PostContentContainer = styled.div`
7494
margin: ${(props) => props.theme.spacing[2]} 0;
7595
}
7696
77-
& .embedVideo-container iframe, .embedVideo-container object, .embedVideo-container embed {
97+
& .embedVideo-container iframe,
98+
.embedVideo-container object,
99+
.embedVideo-container embed {
78100
position: absolute;
79101
top: 0;
80102
left: 0;
@@ -88,6 +110,11 @@ export const PostContentContainer = styled.div`
88110
max-width: 100%;
89111
overflow-x: scroll;
90112
text-align: initial;
113+
line-height: ${(props) => props.theme.lineHeight};
114+
}
115+
116+
& .emoji-icon {
117+
top: 4px;
91118
}
92119
93120
${syntax}

0 commit comments

Comments
 (0)