main content max width set to 700px

components/graph.js

@@ -161,9 +161,12 @@ export const Network = ({ el, graphdata, current, router, allNodes }) => {
                 })
             }
         },
+        weighted:true,
         layoutAttr:{
-            linkDistance:160,
+            linkDistance:300,
-            charge:function(c){ return -280},
+            linkStrength:1.5,
+            friction:0.5,
+            charge:function(c){ return -80},
         },
         nodeStyle: {
             fill: function(d) { 
@@ -182,8 +185,11 @@ export const Network = ({ el, graphdata, current, router, allNodes }) => {
                 })
             }
         },
+
         edgeStyle:{
-            height:120
+            height:120,
+            strokeWidth:2,
+            stroke:"#999"
         }
     }, true);
     return G

lib/post.js

@@ -168,28 +168,6 @@ export function getPostListData() {
 	const fileNames = filePaths.map(f => Transformer.parseFileNameFromPath(f))
 	//console.log("filePaths", filePaths)
 
-	//var allPostsData = filePaths.map(filePath => {
-	//		//console.log("filePath", filePaths)
-	//		// Remove ".md" from file name to get id
-	//		const slug = Transformer.parseFileNameFromPath(filePath)
-	//		//console.log("slug", slug)
-//
-	//		// Read markdown file as string
-	//		var fileContent = Transformer.preprocessThreeDashes(Node.readFileSync(filePath))
-	//		//console.log("all backlinks fn")
-	//		// Use gray-matter to parse the post metadata section
-	//		const matterResult = Transformer.getFrontMatterData(fileContent) || [] // matter(fileContent).data
-	//		//console.log("all post fn....")
-//
-	//		//const permalink = matterResult.permalink
-	//		//const content = fileContent.split("---\n")[fileContent.split("---").length -1 ]
-//
-	//		// Combine the data with the slug
-	//		return {
-	//			id:slug.toLowerCase().split(" ").join("-"),
-	//			...matterResult,
-	//		}
-	//})
   
   return fileNames
 }

package.json

@@ -19,6 +19,7 @@
     "react": "16.13.1",
     "react-dom": "16.13.1",
     "remark": "^13.0.0",
+    "remark-collapse": "^0.1.2",
     "remark-external-links": "^8.0.0",
     "remark-highlight.js": "^6.0.0",
     "remark-html": "^13.0.1",

pages/_document.js

@@ -56,7 +56,7 @@ class MyDocument extends Document {
                     </div>
 
                     {/* CONTENT */}
-                    <main className="main">
+                    <main className="main parent-main">
                         <Main ppp="" />
                     </main>
                 </section>

pages/index.js

@@ -8,15 +8,22 @@ import { Network } from "../components/graph";
 
 
 export default function Home({ content, graphdata, filenames, ...props }) {
-    //console.log("Index Page Props: ", props /* backlinks, filenames*/)
+   //console.log("Index Page Props: ", content /* backlinks, filenames*/)
     const ref = useRef(null);
     const router = useRouter()
+
     //var G = jsnx.binomialGraph(filenames.length, 1)
     //var G = jsnx.completeGraph(filenames.length);
     useEffect(() => {
         if (ref && ref.current){
 
-            const G = Network({el:ref.current, graphdata, current:"index", router, allNodes:true})
+            const G = Network({
+                el:ref.current,
+                graphdata,
+                current:"index",
+                router,
+                allNodes:false // If true then shows every markdown file as node
+            })
         }
     }, [])
 

posts/.obsidian/workspace

@@ -6,12 +6,12 @@
       {
         "id": "ba2b426490a0a575",
         "type": "leaf",
-        "dimension": 58.15109343936382,
+        "dimension": 47.43589743589743,
         "active": true,
         "state": {
           "type": "markdown",
           "state": {
-            "file": "articles-tr/Articles (TR).md",
+            "file": "sidebar.md",
             "mode": "source"
           }
         },
@@ -20,11 +20,11 @@
       {
         "id": "7aa82793eba6e4fb",
         "type": "leaf",
-        "dimension": 41.84890656063619,
+        "dimension": 52.56410256410257,
         "state": {
           "type": "markdown",
           "state": {
-            "file": "articles-tr/Articles (TR).md",
+            "file": "sidebar.md",
             "mode": "preview"
           }
         },
@@ -84,7 +84,7 @@
             "state": {
               "type": "backlink",
               "state": {
-                "file": "articles-tr/Articles (TR).md",
+                "file": "sidebar.md",
                 "collapseAll": true,
                 "extraContext": true,
                 "sortOrder": "alphabetical",
@@ -101,15 +101,15 @@
     "collapsed": true
   },
   "lastOpenFiles": [
+    "sidebar.md",
+    "Code/Codesheet.md",
+    "index.md",
     "articles-tr/Articles (TR).md",
     "notes-tr/Iyzico Gereklilikler.md",
     "articles-tr/Sidekick Browser.md",
     "articles-tr/Obsidian.md",
     "articles-tr/Google-Search-Quality.md",
     "articles-tr/Ghost Blog Açma Rehberi.md",
-    "articles-tr/En İyi Blog Siteleri.md",
+    "articles-tr/En İyi Blog Siteleri.md"
-    "articles-tr/Clover Notes.md",
-    "articles-tr/Arama Motoru Optimizasyonu.md",
-    "articles-eng/Confluence Installation.md"
   ]
 }

posts/sidebar.md

@@ -5,3 +5,5 @@ title: "Sidebar"
 * [[Articles (TR)]]
 * [[Articles (ENG)]]
 * [[Codesheet]]
+
+

styles/webflow-layout.css

@@ -32,8 +32,8 @@ h2 {font-size: 1.9em;font-weight: bold; margin-top:64px; color:#333}
 h3 {font-size: 1.5em;font-weight: bold; margin-top:48px; color:#444}
 h4 {font-size: 1.3em;font-weight: bold; color:#444}
 p, li {
-    padding-bottom: 8px;
+    padding-bottom: 4px;
-    padding-top: 8px;
+    padding-top: 4px;
     box-sizing: inherit;
     font-family: "Work Sans", sans-serif;
     font-size: 20px;
@@ -105,7 +105,8 @@ a {text-decoration: none;color:#222 !important}
   min-height:400px;
   background-color: #dcdbdf;
   border-radius: 8px;
-  box-shadow: 0 4px 8px 1px rgba(0, 0, 0, 0.3);
+  box-shadow: 0 0px 4px -1px rgba(0, 0, 0, 0.9);
+  cursor: grab;
 }
 #side-graph-box {
   width: 100%;
@@ -116,18 +117,18 @@ a {text-decoration: none;color:#222 !important}
   */
   background-color: #29203d;
   border-radius: 8px;
-  box-shadow: 0 4px 8px 1px rgba(0, 0, 0, 0.3);
+  box-shadow: 0 0px 8px 1px rgba(0, 0, 0, 0.3);
 }
 
 #side-graph-box label {
   margin: 32px 0 !important;
 }
 
-.jsnx .node-node {fill: #476ed0 !important;}
+.jsnx .node-node {fill: #5547d0 !important;}
 .jsnx .node-node:hover {fill: blueviolet !important;}
 .jsnx .node-label { fill: #333333 !important;font-size:12px; font-weight: bold;}
 .jsnx g.node {height:60px !important;}
-
+.jsnx .nde-edge { fill:black; stroke-width:2; stroke:black; }
 
 pre code {padding:16px !important; border-radius: 8px;}
 img {width:100%; height:auto; margin-top:16px; margin-bottom:48px; border-radius: 8px; box-shadow: 0 4px 8px -1px rgba(0, 0, 0, 0.3);}
@@ -141,6 +142,7 @@ img {width:100%; height:auto; margin-top:16px; margin-bottom:48px; border-radius
 .sidebar li:hover {background-color: #fff;}
 .sidebar li a.internal {display:block; width: 100% !important;padding-left: 16px; padding-right: 16px;}
 
+main.main .main {max-width:800px;}
 
 blockquote {
     margin: 0;
@@ -222,10 +224,10 @@ blockquote {
   z-index: 0;
   width: 100%;
   min-height: 100vh;
-  padding: 32px 32px;
+  padding: 32px 1vw;
   overflow-wrap: break-word;
 }
-
+main.parent-main {display: flex;flex-direction: column;align-items: center; }
 
 .section {
   position: relative;
@@ -260,10 +262,6 @@ blockquote {
     left: 0px;
   }
 
-  .main {
-    padding-right: 32px;
-    padding-left: 32px;
-  }
 
   .navbar {
     display: none;
@@ -275,9 +273,11 @@ blockquote {
 
 @media screen and (min-width: 767px) { 
   .sidebar {left: 0 !important;}
-  .main {width: calc(100% - 250px);}
+  .main {width: calc(100% - 250px);  padding-left: 4vw; padding-right: 4vw;}
+}
+@media screen and (min-width: 991px) { 
+  .parent-main {width: calc(100% - 250px);  padding-left: 10vw !important; padding-right: 10vw;}
 }
-
   @media screen and (max-width: 767px) {
   .sidebar {
     position: fixed;

yarn.lock

@@ -2809,6 +2809,13 @@ mdast-util-frontmatter@^0.2.0:
   dependencies:
     micromark-extension-frontmatter "^0.2.0"
 
+mdast-util-heading-range@^2.0.1:
+  version "2.1.5"
+  resolved "https://registry.yarnpkg.com/mdast-util-heading-range/-/mdast-util-heading-range-2.1.5.tgz#9a8e07bd46d07d40ad1596b0b6ab8535337725c3"
+  integrity sha512-jXbFD0C+MfRkwsaze+btzG9CmVrxnc5kpcJLtx3SvSlPWnNdGMlDRHKDB9/TIPEq9nRHnkixppT8yvaUJ5agJg==
+  dependencies:
+    mdast-util-to-string "^1.0.0"
+
 mdast-util-heading-style@^1.0.2:
   version "1.0.6"
   resolved "https://registry.yarnpkg.com/mdast-util-heading-style/-/mdast-util-heading-style-1.0.6.tgz#6410418926fd5673d40f519406b35d17da10e3c5"
@@ -3758,6 +3765,14 @@ regex-parser@^2.2.11:
   resolved "https://registry.yarnpkg.com/regex-parser/-/regex-parser-2.2.11.tgz#3b37ec9049e19479806e878cabe7c1ca83ccfe58"
   integrity sha512-jbD/FT0+9MBU2XAZluI7w2OBs1RBi6p9M83nkoZayQXXU9e8Robt69FcZc7wU4eJD/YFTjn1JdCk3rbMJajz8Q==
 
+remark-collapse@^0.1.2:
+  version "0.1.2"
+  resolved "https://registry.yarnpkg.com/remark-collapse/-/remark-collapse-0.1.2.tgz#7ebf0b0e0932f39a8599a754906e0a097906070b"
+  integrity sha1-fr8LDgky85qFmadUkG4KCXkGBws=
+  dependencies:
+    mdast-util-heading-range "^2.0.1"
+    mdast-util-to-string "^1.0.2"
+
 remark-external-links@^8.0.0:
   version "8.0.0"
   resolved "https://registry.yarnpkg.com/remark-external-links/-/remark-external-links-8.0.0.tgz#308de69482958b5d1cd3692bc9b725ce0240f345"