From 39299a268c03ab968103508150ec9eb4955168c2 Mon Sep 17 00:00:00 2001 From: Peaceultime Date: Thu, 25 Jul 2024 13:24:44 +0200 Subject: [PATCH] Move visualiser to explorer folder and start working on account --- app.vue | 37 +- assets/common.css | 50 + assets/global.css | 70 +- components/LeftComponent.vue | 6 - components/MainComponent.vue | 16 - components/SearchView.client.vue | 4 +- components/{ => canvas}/CanvasEdge.vue | 0 components/{ => canvas}/CanvasNode.vue | 0 .../{ => canvas}/CanvasRenderer.client.vue | 0 components/content/prose/ProseA.vue | 9 +- components/{ => explorer}/NavigationLink.vue | 11 +- components/{ => explorer}/RightComponent.vue | 6 +- components/{ => explorer}/TocLink.vue | 0 nuxt.config.ts | 24 +- package-lock.json | 12414 ---------------- package.json | 25 - pages/[...slug].vue | 64 +- pages/explorer/[...slug].vue | 74 + pages/{ => explorer}/tags/[...slug].vue | 2 +- pages/user/login.vue | 1 + pages/user/logout.vue | 1 + pages/user/profile.vue | 1 + pages/user/signin.vue | 1 + 23 files changed, 242 insertions(+), 12574 deletions(-) create mode 100644 assets/common.css delete mode 100644 components/MainComponent.vue rename components/{ => canvas}/CanvasEdge.vue (100%) rename components/{ => canvas}/CanvasNode.vue (100%) rename components/{ => canvas}/CanvasRenderer.client.vue (100%) rename components/{ => explorer}/NavigationLink.vue (83%) rename components/{ => explorer}/RightComponent.vue (93%) rename components/{ => explorer}/TocLink.vue (100%) delete mode 100644 package-lock.json delete mode 100644 package.json create mode 100644 pages/explorer/[...slug].vue rename pages/{ => explorer}/tags/[...slug].vue (97%) create mode 100644 pages/user/login.vue create mode 100644 pages/user/logout.vue create mode 100644 pages/user/profile.vue create mode 100644 pages/user/signin.vue diff --git a/app.vue b/app.vue index a285e16..a62b46e 100644 --- a/app.vue +++ b/app.vue @@ -1,14 +1,45 @@ + + diff --git a/assets/common.css b/assets/common.css new file mode 100644 index 0000000..f888fcc --- /dev/null +++ b/assets/common.css @@ -0,0 +1,50 @@ +.ps-1 +{ + padding-left: 1em; +} +.pe-1 +{ + padding-right: 1em; +} +.pt-1 +{ + padding-top: 1em; +} +.pb-1 +{ + padding-bottom: 1em; +} + +.ps-2 +{ + padding-left: 2em; +} +.pe-2 +{ + padding-right: 2em; +} +.pt-2 +{ + padding-top: 2em; +} +.pb-2 +{ + padding-bottom: 2em; +} + +.ps-3 +{ + padding-left: 3em; +} +.pe-3 +{ + padding-right: 3em; +} +.pt-3 +{ + padding-top: 3em; +} +.pb-3 +{ + padding-bottom: 3em; +} \ No newline at end of file diff --git a/assets/global.css b/assets/global.css index 46f21dc..bea9be7 100644 --- a/assets/global.css +++ b/assets/global.css @@ -3316,9 +3316,8 @@ input[type='number'] { height: 18px; } -.site-header .search-view-outer { - width: 50%; - max-width: 240px; +.site-nav-bar .search-view-outer { + flex: 1 1 0; order: 1; } @@ -3332,7 +3331,7 @@ input[type='number'] { margin: 0; width: 0; flex-grow: 1; - padding-left: 30px; + padding-left: 14px; } .search-view-container .search-bar.has-no-results { @@ -3463,7 +3462,6 @@ input[type='number'] { } .site-body-left-column-site-theme-toggle { - padding: 0 0 12px 0; display: flex; position: relative; } @@ -3800,10 +3798,6 @@ body { -webkit-user-select: none; } -.published-container.has-navigation .site-header { - display: none; -} - .published-container .markdown-preview-view { user-select: text; } @@ -3852,11 +3846,11 @@ body { } @media screen and (min-width: 750px) { - .published-container.is-readable-line-width:not(.has-navigation).published-container.is-readable-line-width:not(.has-graph).published-container.is-readable-line-width:not(.has-outline) .site-header { + .published-container.is-readable-line-width:not(.has-navigation).published-container.is-readable-line-width:not(.has-graph).published-container.is-readable-line-width:not(.has-outline) .site-nav-bar { width: var(--page-width); margin: 0 auto; border-bottom: 0; - padding: 24px 48px; + padding: .5em 3em; } .published-container.is-readable-line-width:not(.has-navigation).published-container.is-readable-line-width:not(.has-graph).published-container.is-readable-line-width:not(.has-outline) .site-body-center-column { @@ -3926,8 +3920,7 @@ body { /* Nav view */ .nav-view-outer { overflow: auto; - padding-bottom: 32px; - padding-top: 10px; + padding: 12px 18px 0 36px; scrollbar-gutter: stable; } @@ -4147,7 +4140,6 @@ body { width: var(--sidebar-left-width); flex: 0 0 var(--sidebar-left-width); min-width: var(--sidebar-left-width); - padding: 32px 18px 0 36px; position: relative; display: flex; background-color: var(--sidebar-left-background); @@ -4192,19 +4184,18 @@ body { object-fit: contain; } -.site-body-left-column-site-name { +.site-name { color: var(--site-name-color); font-size: var(--site-name-size); font-weight: var(--site-name-weight); z-index: 1; cursor: pointer; line-height: 1.2; - padding: 4px 32px 32px 0; text-decoration: none; } @media (hover: hover) { - .site-body-left-column-site-name:hover { + .site-name:hover { color: var(--site-name-color-hover); text-decoration: none; } @@ -4277,26 +4268,15 @@ body { } } -.site-header { - display: flex; - font-size: var(--site-name-size); - line-height: 1.3; - height: var(--header-height); - padding: 12px 18px; - border-bottom: 1px solid var(--background-modifier-border); - align-items: center; - flex: 0 0 auto; -} - -.site-header .clickable-icon { +.site-nav-bar .clickable-icon { display: none; } -.site-header .clickable-icon svg { +.site-nav-bar .clickable-icon svg { vertical-align: middle; } -.site-header-logo img { +.site-nav-bar-logo img { border-radius: var(--logo-radius); max-height: calc(var(--header-height) - 10px); width: var(--logo-width); @@ -4306,7 +4286,7 @@ body { object-fit: contain; } -.site-header-text { +.site-nav-bar-text { color: var(--site-name-color); cursor: pointer; font-size: var(--site-name-size); @@ -4315,7 +4295,7 @@ body { text-decoration: none; } -.site-header-text:hover { +.site-nav-bar-text:hover { color: var(--site-name-color-hover); } @@ -4780,7 +4760,7 @@ body { z-index: -1; } - .published-container.has-navigation .site-header { + .published-container.has-navigation .site-nav-bar { display: flex; z-index: 90; background-color: var(--header-background); @@ -4789,7 +4769,7 @@ body { /* Hamburger menu icon */ } - .published-container.has-navigation .site-header .clickable-icon { + .published-container.has-navigation .site-nav-bar .clickable-icon { display: flex; align-items: center; color: var(--site-menu-icon-color); @@ -4798,7 +4778,7 @@ body { margin-right: 6px; } - .published-container.has-navigation .site-header .clickable-icon svg { + .published-container.has-navigation .site-nav-bar .clickable-icon svg { width: var(--site-menu-icon-size); height: var(--site-menu-icon-size); stroke-width: 1.2px; @@ -4985,3 +4965,21 @@ body { .callout.is-collapsed .fold { transform: rotate(-90deg); } + +.site-nav-bar { + border-bottom: 1px solid var(--background-modifier-border); + display: flex; + justify-content: space-between; + align-items: center; + padding: .5em 3em; +} + +.site-nav-bar > div { + flex: 1 1 0; + display: flex; + flex-direction: row; +} + +.site-nav-bar > div:last-child { + justify-content: end; +} \ No newline at end of file diff --git a/components/LeftComponent.vue b/components/LeftComponent.vue index 115cf9d..574faf0 100644 --- a/components/LeftComponent.vue +++ b/components/LeftComponent.vue @@ -1,15 +1,9 @@