Skip to content

Commit

Permalink
styles(enhanced-readabilities): fixed enhanced-readabilities style is…
Browse files Browse the repository at this point in the history 
…sues

Signed-off-by: Neko Ayaka <[email protected]>
  • Loading branch information
@nekomeowww
nekomeowww committed Jan 2, 2024
1 parent c942420 commit 5e6751b
Show file tree
Hide file tree
Showing 7 changed files with 657 additions and 963 deletions.
20 changes: 10 additions & 10 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,29 +29,29 @@
"cleanup:node_modules": "rimraf --glob **/node_modules"
},
"devDependencies": {
"@antfu/eslint-config": "^2.6.0",
"@antfu/eslint-config": "^2.6.1",
"@antfu/ni": "^0.21.12",
"@iconify-json/carbon": "^1.1.27",
"@iconify-json/icon-park-outline": "^1.1.15",
"@iconify-json/octicon": "^1.1.52",
"@iconify-json/svg-spinners": "^1.1.2",
"@types/node": "^20.10.5",
"@unocss/eslint-config": "^0.58.0",
"@unocss/eslint-plugin": "^0.58.0",
"@vitejs/plugin-vue": "^4.6.0",
"@vueuse/core": "^10.7.0",
"@types/node": "^20.10.6",
"@unocss/eslint-config": "^0.58.2",
"@unocss/eslint-plugin": "^0.58.2",
"@vitejs/plugin-vue": "^4.6.2",
"@vueuse/core": "^10.7.1",
"concurrently": "^8.2.2",
"eslint": "^8.56.0",
"less": "^4.2.0",
"rimraf": "^5.0.5",
"typescript": "^5.3.3",
"unbuild": "^2.0.0",
"unocss": "^0.57.7",
"unplugin-vue-macros": "^2.7.6",
"unplugin-vue-macros": "^2.7.7",
"vite": "^5.0.10",
"vitepress": "1.0.0-rc.32",
"vue": "^3.3.8",
"vue-tsc": "^1.8.26"
"vitepress": "1.0.0-rc.34",
"vue": "^3.4.3",
"vue-tsc": "^1.8.27"
},
"workspaces": [
"packages/*",
Expand Down
4 changes: 2 additions & 2 deletions packages/vitepress-plugin-enhanced-readabilities/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
"build:watch": "vite build --mode development --watch"
},
"peerDependencies": {
"vitepress": ">=1.0.0-rc.32",
"vue": ">=3.3.8"
"vitepress": ">=1.0.0-rc.34",
"vue": ">=3.3.0"
}
}
113 changes: 73 additions & 40 deletions packages/vitepress-plugin-enhanced-readabilities/src/components/LayoutSwitch.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -180,18 +180,30 @@ onMounted(() => {

<style less>
.VPNolebaseEnhancedReadabilitiesLayoutSwitchAnimated {
.VPNavBar.has-sidebar > .container > .title {
/* with sidebar */
.VPNavBar.has-sidebar > .wrapper > .container > .title {
transition: width 0.5s ease-in-out, padding-left 0.5s ease-in-out;
}
/* without sidebar */
.VPNavBar > .wrapper > .container > .title {
transition: width 0.5s ease-in-out, padding-left 0.5s ease-in-out;
}
.VPNavBar > .container {
.VPNavBar > .wrapper > .container {
transition: width 0.5s ease-in-out, max-width 0.5s ease-in-out;
}
.VPNavBar.has-sidebar > .container > .content {
/* with sidebar */
.VPNavBar.has-sidebar > .wrapper > .container > .content,
.VPNavBar > .wrapper > .container > .content {
transition: padding-right 0.5s ease-in-out, padding-left 0.5s ease-in-out;
}
/* line below the nav */
.VPNavBar.has-sidebar > .divider {
transition: padding-left 0.5s ease-in-out, width 0.5s ease-in-out;
}
.VPSidebar {
transition: width 0.5s ease-in-out, padding-left 0.5s ease-in-out;
}
Expand Down Expand Up @@ -226,22 +238,20 @@ onMounted(() => {
.VPNolebaseEnhancedReadabilitiesLayoutSwitchFullWidth {
@media (min-width: 1280px) {
/* Overriding styles of navbar section */
.VPNavBar.has-sidebar > .container > .title {
.VPNavBar.has-sidebar > .wrapper > .container > .title {
padding-left: max(32px, calc((100% - (var(--vp-nolebase-enhanced-readabilities-full-width-max-width) - 64px)) / 2)) !important;
width: calc((100% - (var(--vp-nolebase-enhanced-readabilities-full-width-max-width) - 64px)) / 2 + var(--vp-sidebar-width) - 32px) !important;
}
.VPNavBar > .container {
max-width: var(--vp-nolebase-enhanced-readabilities-full-width-max-width);
}
.VPNavBar.has-sidebar > .container > .content {
padding-right: calc((100vw - var(--vp-nolebase-enhanced-readabilities-full-width-max-width)) / 2 + 32px) !important;
padding-left: calc((100vw - var(--vp-nolebase-enhanced-readabilities-full-width-max-width)) / 2 + var(--vp-sidebar-width)) !important;
.VPNavBar > .wrapper > .container,
.VPNavBar.has-sidebar > .wrapper > .container {
max-width: var(--vp-nolebase-enhanced-readabilities-full-width-max-width) !important;
}
.VPNavBar.has-sidebar .curtain {
width: calc(100% - ((100vw - var(--vp-nolebase-enhanced-readabilities-full-width-max-width)) / 2 + var(--vp-sidebar-width)));
.VPNavBar.has-sidebar > .wrapper > .container > .content {
padding-left: max(32px, var(--vp-sidebar-width)) !important;
width: 100% !important;
padding-right: 32px !important;
}
/* Overriding styles of sidebar section */
Expand All @@ -252,8 +262,8 @@ onMounted(() => {
/* Overriding styles of document section */
.VPContent.has-sidebar {
padding-right: calc((100vw - var(--vp-nolebase-enhanced-readabilities-full-width-max-width)) / 2) !important;
padding-left: calc((100vw - var(--vp-nolebase-enhanced-readabilities-full-width-max-width)) / 2 + var(--vp-sidebar-width)) !important;
padding-right: calc((100vw - var(--vp-nolebase-enhanced-readabilities-full-width-max-width)) / 2) !important;
}
.VPDoc.has-aside .content-container {
Expand All @@ -270,12 +280,20 @@ onMounted(() => {
}
@media (min-width: 1440px) {
.VPNavBar.has-sidebar .curtain {
width: calc(100% - ((100vw - var(--vp-nolebase-enhanced-readabilities-full-width-max-width)) / 2 + var(--vp-sidebar-width)));
.VPNavBar > .wrapper > .container {
max-width: var(--vp-nolebase-enhanced-readabilities-full-width-max-width);
}
.VPNavBar.has-sidebar > .divider {
padding-left: calc((100vw - var(--vp-nolebase-enhanced-readabilities-full-width-max-width)) / 2 + var(--vp-sidebar-width)) !important;
}
}
@media (min-width: 1536px) {
.VPNavBar > .wrapper > .container {
max-width: var(--vp-nolebase-enhanced-readabilities-full-width-max-width);
}
.VPDoc .container {
max-width: var(--vp-nolebase-enhanced-readabilities-full-width-max-width);
}
Expand All @@ -285,18 +303,20 @@ onMounted(() => {
.VPNolebaseEnhancedReadabilitiesLayoutSwitchSidebarWidthAdjustableOnly {
@media (min-width: 1280px) {
/* Overriding styles of navbar section */
.VPNavBar.has-sidebar > .container > .title {
.VPNavBar.has-sidebar > .wrapper > .container > .title {
padding-left: max(32px, calc((100% - (var(--vp-nolebase-enhanced-readabilities-page-max-width) - 64px)) / 2)) !important;
width: calc((100% - (var(--vp-nolebase-enhanced-readabilities-page-max-width) - 64px)) / 2 + var(--vp-sidebar-width) - 32px) !important;
}
.VPNavBar > .container {
max-width: var(--vp-nolebase-enhanced-readabilities-page-max-width);
.VPNavBar > .wrapper > .container,
.VPNavBar.has-sidebar > .wrapper > .container {
max-width: var(--vp-nolebase-enhanced-readabilities-page-max-width) !important;
}
.VPNavBar.has-sidebar > .container > .content {
padding-right: calc((100vw - var(--vp-nolebase-enhanced-readabilities-page-max-width)) / 2 + 32px) !important;
padding-left: calc((100vw - var(--vp-nolebase-enhanced-readabilities-page-max-width)) / 2 + var(--vp-sidebar-width)) !important;
.VPNavBar.has-sidebar > .wrapper > .container > .content {
padding-left: max(32px, calc(var(--vp-sidebar-width))) !important;
width: 100% !important;
padding-right: 32px !important;
}
/* Overriding styles of sidebar section */
Expand All @@ -307,34 +327,39 @@ onMounted(() => {
}
@media (min-width: 1440px) {
.VPNavBar.has-sidebar .curtain {
width: calc(100% - ((100vw - var(--vp-nolebase-enhanced-readabilities-page-max-width)) / 2 + var(--vp-sidebar-width)));
.VPNavBar > .wrapper > .container,
.VPNavBar.has-sidebar > .wrapper > .container {
max-width: var(--vp-nolebase-enhanced-readabilities-page-max-width) !important;
}
.VPNavBar.has-sidebar > .divider {
padding-left: calc((100vw - var(--vp-nolebase-enhanced-readabilities-page-max-width)) / 2 + var(--vp-sidebar-width)) !important;
}
}
@media (min-width: 1440px) {
.VPContent.has-sidebar {
padding-right: calc((100vw - var(--vp-nolebase-enhanced-readabilities-content-max-width)) / 2);
padding-left: calc((100vw - var(--vp-nolebase-enhanced-readabilities-content-max-width)) / 2 + var(--vp-sidebar-width));
padding-left: calc((100vw - var(--vp-nolebase-enhanced-readabilities-content-max-width)) / 2 + var(--vp-sidebar-width)) !important;
padding-right: calc((100vw - var(--vp-nolebase-enhanced-readabilities-content-max-width)) / 2) !important;
}
}
}
.VPNolebaseEnhancedReadabilitiesLayoutSwitchBothWidthAdjustable {
@media (min-width: 1280px) {
/* Overriding styles of navbar section */
.VPNavBar.has-sidebar > .container > .title {
.VPNavBar.has-sidebar > .wrapper > .container > .title {
padding-left: max(32px, calc((100% - (var(--vp-nolebase-enhanced-readabilities-page-max-width) - 64px)) / 2)) !important;
width: calc((100% - (var(--vp-nolebase-enhanced-readabilities-page-max-width) - 64px)) / 2 + var(--vp-sidebar-width) - 32px) !important;
}
.VPNavBar > .container {
max-width: var(--vp-nolebase-enhanced-readabilities-page-max-width);
.VPNavBar > .wrapper > .container,
.VPNavBar.has-sidebar > .wrapper > .container {
max-width: var(--vp-nolebase-enhanced-readabilities-page-max-width) !important;
}
.VPNavBar.has-sidebar > .container > .content {
padding-right: calc((100vw - var(--vp-nolebase-enhanced-readabilities-page-max-width)) / 2 + 32px) !important;
padding-left: calc((100vw - var(--vp-nolebase-enhanced-readabilities-page-max-width)) / 2 + var(--vp-sidebar-width)) !important;
.VPNavBar.has-sidebar > .wrapper > .container > .content {
padding-left: max(32px, var(--vp-sidebar-width)) !important;
width: 100% !important;
padding-right: 32px !important;
}
/* Overriding styles of sidebar section */
Expand All @@ -357,19 +382,27 @@ onMounted(() => {
}
@media (min-width: 1440px) {
.VPNavBar.has-sidebar .curtain {
width: calc(100% - ((100vw - var(--vp-nolebase-enhanced-readabilities-page-max-width)) / 2 + var(--vp-sidebar-width)));
.VPNavBar > .wrapper > .container,
.VPNavBar.has-sidebar > .wrapper > .container {
max-width: var(--vp-nolebase-enhanced-readabilities-page-max-width) !important;
}
.VPNavBar.has-sidebar > .divider {
padding-left: calc((100vw - var(--vp-nolebase-enhanced-readabilities-page-max-width)) / 2 + var(--vp-sidebar-width)) !important;
}
}
@media (min-width: 1440px) {
.VPContent.has-sidebar {
padding-right: calc((100vw - var(--vp-nolebase-enhanced-readabilities-content-max-width)) / 2);
padding-left: calc((100vw - var(--vp-nolebase-enhanced-readabilities-content-max-width)) / 2 + var(--vp-sidebar-width));
padding-left: calc((100vw - var(--vp-nolebase-enhanced-readabilities-content-max-width)) / 2 + var(--vp-sidebar-width)) !important;
padding-right: calc((100vw - var(--vp-nolebase-enhanced-readabilities-content-max-width)) / 2) !important;
}
}
@media (min-width: 1536px) {
.VPNavBar > .wrapper > .container,
.VPNavBar.has-sidebar > .wrapper > .container {
max-width: var(--vp-nolebase-enhanced-readabilities-page-max-width) !important;
}
.VPDoc .container {
max-width: var(--vp-nolebase-enhanced-readabilities-content-max-width);
}
Expand Down
4 changes: 2 additions & 2 deletions packages/vitepress-plugin-git-changelog/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,8 +59,8 @@
"dayjs": ">=1.11.0",
"md5": ">=2.3.0",
"simple-git": ">=3.21.0",
"vitepress": ">=1.0.0-rc.32",
"vue": ">=3.3.8"
"vitepress": ">=1.0.0-rc.34",
"vue": ">=3.3.0"
},
"dependencies": {
"dayjs": "^1.11.10",
Expand Down
4 changes: 2 additions & 2 deletions packages/vitepress-plugin-highlight-targeted-heading/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
"build:watch": "vite build --mode development --watch"
},
"peerDependencies": {
"vitepress": ">=1.0.0-rc.32",
"vue": ">=3.3.8"
"vitepress": ">=1.0.0-rc.34",
"vue": ">=3.3.0"
}
}
4 changes: 2 additions & 2 deletions packages/vitepress-plugin-inline-link-preview/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
"build:watch": "vite build --mode development --watch"
},
"peerDependencies": {
"vitepress": ">=1.0.0-rc.32",
"vue": ">=3.3.8"
"vitepress": ">=1.0.0-rc.34",
"vue": ">=3.3.0"
}
}
Loading

0 comments on commit 5e6751b

Please sign in to comment.