yusufipek/teknolojirehberleri.xyz
1
0
Fork 0
mirror of https://github.com/yusufipk/teknolojirehberleri.xyz.git synced 2026-09-11 19:06:07 +00:00
Code Issues Packages Projects Releases Wiki Activity

markdown renderlamak için marked kütüphanesi eklendi.

Browse Source
This commit is contained in:
Yusuf İpek
2021-08-21 18:05:38 +03:00
parent ea37f2160a
commit 4421e20856
4 changed files with 48 additions and 851 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package-lock.json
Generated
+23 -849
View File
File diff suppressed because it is too large Load Diff
package.json
+1 -1
View File
@@ -10,10 +10,10 @@
}, },
"dependencies": { "dependencies": {
"contentful": "^8.4.2", "contentful": "^8.4.2",
"marked": "^3.0.0",
"next": "^11.1.0", "next": "^11.1.0",
"react": "17.0.2", "react": "17.0.2",
"react-dom": "17.0.2", "react-dom": "17.0.2",
"react-markdown": "^6.0.3",
"sass": "^1.36.0" "sass": "^1.36.0"
}, },
"devDependencies": { "devDependencies": {
pages/rehber/[slug].js
+6 -1
View File
@@ -1,6 +1,7 @@
import Head from "next/head"; import Head from "next/head";
import { createClient } from "contentful"; import { createClient } from "contentful";
import ReactMarkdown from "react-markdown"; import ReactMarkdown from "react-markdown";
import marked from "marked";
export default function PostDetails({ posts }) { export default function PostDetails({ posts }) {
if (!posts) if (!posts)
@@ -14,6 +15,10 @@ export default function PostDetails({ posts }) {
); );
const { title, rehber, description } = posts.fields; const { title, rehber, description } = posts.fields;
function createMarkup() {
return { __html: marked(rehber) };
}
return ( return (
<div className="markdown"> <div className="markdown">
<Head> <Head>
@@ -22,7 +27,7 @@ export default function PostDetails({ posts }) {
<meta property="og:title" content={`${title} - Teknoloji Rehberleri`} /> <meta property="og:title" content={`${title} - Teknoloji Rehberleri`} />
<meta property="og:description" content={description} /> <meta property="og:description" content={description} />
</Head> </Head>
<ReactMarkdown>{rehber}</ReactMarkdown> <div dangerouslySetInnerHTML={createMarkup()} />
</div> </div>
); );
} }
styles/pages/rehber.scss
+18
View File
@@ -58,11 +58,17 @@
margin-bottom: 1rem; margin-bottom: 1rem;
} }
ul,
ol {
margin-left: 5rem;
}
img { img {
margin: auto; margin: auto;
display: block; display: block;
min-width: 60%; min-width: 60%;
max-width: 60%; max-width: 60%;
margin-top: 1rem;
} }
@include media("<largest") { @include media("<largest") {
@@ -81,4 +87,16 @@
min-width: 100%; min-width: 100%;
} }
} }
@include media("<smaller") {
ul,
ol {
margin-left: 4rem;
}
}
@include media("<smallest") {
ul,
ol {
margin-left: 3rem;
}
}
} }