From 1e4a2eca038b0a2fc49875abe0e0a018cf78ec37 Mon Sep 17 00:00:00 2001 From: Argo Date: Wed, 28 Dec 2022 02:24:37 +0000 Subject: [PATCH] =?UTF-8?q?!3693=20doc(#I67RTW):=20update=20site.css=20*?= =?UTF-8?q?=20doc:=20=E6=9B=B4=E6=96=B0=20vs=20=202019=20=E4=B8=BA=20vs=20?= =?UTF-8?q?2022=20*=20refactor:=20=E7=A7=BB=E5=8A=A8=20page-layout-demo=20?= =?UTF-8?q?=E6=A0=B7=E5=BC=8F=20*=20doc:=20=E7=A7=BB=E5=8A=A8=20page-layou?= =?UTF-8?q?t-demo-list=20=E5=88=B0=E6=A0=B7=E5=BC=8F=E9=9A=94=E7=A6=BB=20*?= =?UTF-8?q?=20doc:=20=E7=A7=BB=E5=8A=A8=20Menus=20=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/BootstrapBlazor.Shared/Locales/en.json | 6 +-- src/BootstrapBlazor.Shared/Locales/zh.json | 6 +-- .../Samples/LayoutPages.razor.css | 24 +++++++++ .../Samples/Layouts.razor.css | 8 +++ .../Samples/Menus.razor.css | 10 +++- .../Shared/PageLayout.razor.css | 19 +++++++ .../wwwroot/css/site.css | 49 ------------------- 7 files changed, 66 insertions(+), 56 deletions(-) create mode 100644 src/BootstrapBlazor.Shared/Samples/LayoutPages.razor.css diff --git a/src/BootstrapBlazor.Shared/Locales/en.json b/src/BootstrapBlazor.Shared/Locales/en.json index d6a532533..0c4f23387 100644 --- a/src/BootstrapBlazor.Shared/Locales/en.json +++ b/src/BootstrapBlazor.Shared/Locales/en.json @@ -987,7 +987,7 @@ "NugetP1": "Use nuget.org to install BootstrapBlazor components", "EnvBuildTitle": "Project Environment Construction", "EnvLi1": "Install .net core sdk Official Website", - "EnvLi2": "Install Visual Studio 2019 and above Official website", + "EnvLi2": "Install Visual Studio 2022 and above Official website", "EnvLi3": "Pull the project code BootstrapBlazor Warehouse URL" }, "BootstrapBlazor.Shared.Components.Video": { @@ -1125,7 +1125,7 @@ "P8": "After downloading and installing the extension, create a project through the extension", "P9": "Create a project with Visual Studio 1", "P10": "Step 1. Create a project", - "P11": "Open Visual Studio 2019 or Visual Studio 2022", + "P11": "Open Visual Studio 2022", "P12": "Create a new project", "P13": "choose", "P14": "and click", @@ -1342,7 +1342,7 @@ "Code10": "Bottom layout, with default style, any element can be nested under it", "P1": "The above components adopt flex layout, please make sure the target browser is compatible before using. In addition, the child element of Layout can only be the latter four, and the parent element of the latter four can only be Layout", "b1": "Matters needing attention", - "P2": "In order to make it easy for everyone to use this set of components to quickly build projects, the author has created Project Templates, using the dotnet new command line, and < code>Bootstrap Blazor App Extension extension plug-in Create a new project through Visual Studio 2019. For specific usage and steps, please click Portal", + "P2": "In order to make it easy for everyone to use this set of components to quickly build projects, the author has created Project Templates, using the dotnet new command line, and < code>Bootstrap Blazor App Extension extension plug-in Create a new project through Visual Studio 2022. For specific usage and steps, please click Portal", "H3": "Common page layout", "Block1Title": "Top, middle and bottom layout", "Block1Intro": "Commonly found in Internet website layout", diff --git a/src/BootstrapBlazor.Shared/Locales/zh.json b/src/BootstrapBlazor.Shared/Locales/zh.json index d6e2bc6f1..dea5ea73d 100644 --- a/src/BootstrapBlazor.Shared/Locales/zh.json +++ b/src/BootstrapBlazor.Shared/Locales/zh.json @@ -988,7 +988,7 @@ "NugetP1": "使用 nuget.org 进行 BootstrapBlazor 组件的安装", "EnvBuildTitle": "项目环境搭建", "EnvLi1": "安装 .net core sdk 官方网址", - "EnvLi2": "安装 Visual Studio 2019 以上 官方网址", + "EnvLi2": "安装 Visual Studio 2022 以上 官方网址", "EnvLi3": "拉取项目代码 BootstrapBlazor 仓库网址" }, "BootstrapBlazor.Shared.Components.Video": { @@ -1126,7 +1126,7 @@ "P8": "下载安装扩展后，通过扩展创建项目", "P9": "使用 Visual Studio 创建项目 1", "P10": "步骤一、创建项目", - "P11": "打开 Visual Studio 2019 或者 Visual Studio 2022", + "P11": "打开 Visual Studio 2022", "P12": "创建一个新项目", "P13": "选择", "P14": "并单击", @@ -1343,7 +1343,7 @@ "Code10": "底部布局，自带默认样式，其下可嵌套任何元素", "P1": " 以上组件采用了 flex 布局，使用前请确定目标浏览器是否兼容。此外，Layout 的子元素只能是后四者，后四者的父元素也只能是 Layout", "b1": "注意事项", - "P2": "为了方便大家利用这套组件快速搭建项目，作者制作了 项目模板（Project Templates），使用 dotnet new 命令行，与 Bootstrap Blazor App Extension 扩展插件 通过 Visual Studio 2019 新建项目创建，具体使用方法与步骤请点击 传送门", + "P2": "为了方便大家利用这套组件快速搭建项目，作者制作了 项目模板（Project Templates），使用 dotnet new 命令行，与 Bootstrap Blazor App Extension 扩展插件 通过 Visual Studio 2022/code> 新建项目创建，具体使用方法与步骤请点击 传送门", "H3": "常见页面布局", "Block1Title": "上中下布局", "Block1Intro": "常见于互联网网站布局", diff --git a/src/BootstrapBlazor.Shared/Samples/LayoutPages.razor.css b/src/BootstrapBlazor.Shared/Samples/LayoutPages.razor.css new file mode 100644 index 000000000..886a764cd --- /dev/null +++ b/src/BootstrapBlazor.Shared/Samples/LayoutPages.razor.css @@ -0,0 +1,24 @@ +.page-layout-demo-option { + margin-top: 1.5rem; + border: 1px solid rgba(0,0,0,.125); + border-radius: var(--bs-border-radius); + padding: 1.5rem 1rem 1rem 1rem; + position: relative; +} + + .page-layout-demo-option > p { + position: absolute; + top: -10px; + padding: 0 0.5rem; + background: #fff; + } + + .page-layout-demo-option .page-layout-demo-option-height { + display: flex; + align-items: center; + justify-content: space-between; + } + + .page-layout-demo-option .tabs-body-content { + margin: 0 -1rem -2rem -1rem; + } diff --git a/src/BootstrapBlazor.Shared/Samples/Layouts.razor.css b/src/BootstrapBlazor.Shared/Samples/Layouts.razor.css index 4783337d9..6e27c9a10 100644 --- a/src/BootstrapBlazor.Shared/Samples/Layouts.razor.css +++ b/src/BootstrapBlazor.Shared/Samples/Layouts.razor.css @@ -58,3 +58,11 @@ background-color: #dcdfe6; margin: 0 -1px; } + +.page-layout-demo-list { + margin: 0; +} + + .page-layout-demo-list li { + margin: 0.5rem 0; + } diff --git a/src/BootstrapBlazor.Shared/Samples/Menus.razor.css b/src/BootstrapBlazor.Shared/Samples/Menus.razor.css index 3c7b8c9a3..6fca5c50a 100644 --- a/src/BootstrapBlazor.Shared/Samples/Menus.razor.css +++ b/src/BootstrapBlazor.Shared/Samples/Menus.razor.css @@ -1,4 +1,12 @@ -::deep + .layout-menu-demo .layout-side { +.menu-demo-header { + background-color: #17a2b8; + line-height: 50px; + color: #fff; + flex: 1; + padding-left: 80px; +} + +::deep + .layout-menu-demo .layout-side { background-color: var(--bb-disabled-bg); color: #dcdfe6; height: 100%; diff --git a/src/BootstrapBlazor.Shared/Shared/PageLayout.razor.css b/src/BootstrapBlazor.Shared/Shared/PageLayout.razor.css index c8d41762d..ad42ef936 100644 --- a/src/BootstrapBlazor.Shared/Shared/PageLayout.razor.css +++ b/src/BootstrapBlazor.Shared/Shared/PageLayout.razor.css @@ -220,3 +220,22 @@ ::deep + .widget .dropdown-item:not(:nth-of-type(odd)):active { background-color: inherit; } + +.page-layout-demo-option { + margin-top: 1.5rem; + border: 1px solid rgba(0,0,0,.125); + border-radius: var(--bs-border-radius); + padding: 1.5rem 1rem 1rem 1rem; + position: relative; +} + + .page-layout-demo-option > p { + position: absolute; + top: -10px; + padding: 0 0.5rem; + background: #fff; + } + + .page-layout-demo-option .tabs-body-content { + margin: 0 -1rem -2rem -1rem; + } diff --git a/src/BootstrapBlazor.Shared/wwwroot/css/site.css b/src/BootstrapBlazor.Shared/wwwroot/css/site.css index d68426458..4664fe348 100644 --- a/src/BootstrapBlazor.Shared/wwwroot/css/site.css +++ b/src/BootstrapBlazor.Shared/wwwroot/css/site.css @@ -42,55 +42,6 @@ top: 0.5rem; } -.menu-demo-header { - background-color: #17a2b8; - line-height: 50px; - color: #fff; - flex: 1; - padding-left: 80px; -} - -.menu-demo-bar i { - transition: transform .3s linear; -} - -.menu-demo-bar.is-collapsed i { - transform: rotate(90deg); -} - -.page-layout-demo-list { - margin: 0; -} - - .page-layout-demo-list li { - margin: 0.5rem 0; - } - -.page-layout-demo-option { - margin-top: 1.5rem; - border: 1px solid rgba(0,0,0,.125); - border-radius: var(--bs-border-radius); - padding: 1.5rem 1rem 1rem 1rem; - position: relative; -} - - .page-layout-demo-option > p { - position: absolute; - top: -10px; - padding: 0 0.5rem; - background: #fff; - } - - .page-layout-demo-option .page-layout-demo-option-height { - display: flex; - align-items: center; - justify-content: space-between; - } - - .page-layout-demo-option .tabs-body-content { - margin: 0 -1rem -2rem -1rem; - } - .page-layout-demo-footer-link { color: #fff; }