组件：辅助

subsidiary
workbunny · Dec 16, 2024 · be0ee9d · be0ee9d
1 parent 4633951
commit be0ee9d
Show file tree

Hide file tree

Showing 3 changed files with 80 additions and 0 deletions.
diff --git a/dist/bunny.css b/dist/bunny.css
@@ -1205,6 +1205,64 @@ menu.bny-menu[vertical] li:hover>menu {
     transform: translateX(0);
 }
 
+/* 引用 */
+blockquote {
+    margin: 0;
+    margin-bottom: 10px;
+    padding: 12px;
+    line-height: 1.8;
+    border: 2px solid var(--muted);
+    border-left: 5px solid var(--primary);
+    background-color: var(--muted);
+    color: var(--primary);
+}
+
+blockquote[type="border"] {
+    border: 2px solid var(--primary);
+    border-left-width: 5px;
+    background-color: var(--white);
+}
+
+/* 字段集 */
+fieldset.bny-fieldset {
+    border-color: var(--muted);
+    margin-bottom: 10px;
+    padding: 0;
+    border-width: 1px;
+    border-style: solid;
+}
+
+fieldset legend {
+    margin-left: 20px;
+    padding: 0 10px;
+    font-size: 20px;
+    color: var(--primary);
+    line-height: 1.8;
+}
+
+fieldset.bny-fieldset .bny-fieldset-box {
+    padding: 12px;
+}
+
+fieldset.bny-fieldset-title {
+    margin: 12px 0;
+    border-width: 0;
+    border-top-width: 1px;
+    border-color: var(--muted);
+}
+
+hr {
+    height: 0;
+    line-height: 0;
+    margin: 10px 0;
+    padding: 0;
+    border: none;
+    border-bottom: 1px solid var(--muted);
+    clear: both;
+    overflow: hidden;
+    background: 0 0;
+}
+
 /* 列表 */
 ol {
     list-style-type: decimal;

diff --git a/doc/subsidiary.html b/doc/subsidiary.html
@@ -0,0 +1,21 @@
+<div>
+    <p>引用：</p>
+    <blockquote>
+        引用内容，默认风格
+    </blockquote>
+    <blockquote type="border">
+        引用内容，边框风格
+    </blockquote>
+    <p>字段集：</p>
+    <fieldset class="bny-fieldset">
+        <legend>标题</legend>
+        <div class="bny-fieldset-box">
+            任意内容
+        </div>
+    </fieldset>
+    <fieldset class="bny-fieldset-title">
+        <legend>仅显示标题水平线</legend>
+    </fieldset>
+    <p>水平线：</p>
+    <hr>
+</div>
diff --git a/index.html b/index.html
@@ -42,6 +42,7 @@
                 <div class="bny-tab-item" hx-get="doc/typography.html">排版</div>
                 <div class="bny-tab-item" hx-get="doc/list.html">列表</div>
                 <div class="bny-tab-item" hx-get="doc/menu.html">菜单</div>
+                <div class="bny-tab-item" hx-get="doc/subsidiary.html">辅助</div>
             </div>
             <div class="bny-tab-body" hx-trigger="load"></div>
         </div>