Skip to content

Commit a1f21d6

Browse files
author
Github BUI Docs workflow
committed
BUI Docs build for backstage/backstage@d21fb9a 
1 parent df18ddf commit a1f21d6

447 files changed

Lines changed: 444 additions & 444 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎404.html‎

Lines changed: 1 addition & 1 deletion
Large diffs are not rendered by default.

‎__next.__PAGE__.txt‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
<span class="line"><span style="color:#E1E4E8;--shiki-dark:#B392F0"> &#x3C;</span><span style="color:#79B8FF;--shiki-dark:#79B8FF">Box</span><span style="color:#B392F0;--shiki-dark:#B392F0"> bg</span><span style="color:#F97583;--shiki-dark:#F97583">=</span><span style="color:#9ECBFF;--shiki-dark:#FFAB70">"neutral"</span><span style="color:#E1E4E8;--shiki-dark:#B392F0">></span></span>
1313
<span class="line"><span style="color:#E1E4E8;--shiki-dark:#B392F0"> &#x3C;</span><span style="color:#79B8FF;--shiki-dark:#79B8FF">Button</span><span style="color:#B392F0;--shiki-dark:#B392F0"> variant</span><span style="color:#F97583;--shiki-dark:#F97583">=</span><span style="color:#9ECBFF;--shiki-dark:#FFAB70">"secondary"</span><span style="color:#E1E4E8;--shiki-dark:#B392F0">>Hello World&#x3C;/</span><span style="color:#79B8FF;--shiki-dark:#79B8FF">Button</span><span style="color:#E1E4E8;--shiki-dark:#B392F0">></span></span>
1414
<span class="line"><span style="color:#E1E4E8;--shiki-dark:#B392F0"> &#x3C;/</span><span style="color:#79B8FF;--shiki-dark:#79B8FF">Box</span><span style="color:#E1E4E8;--shiki-dark:#B392F0">></span></span>
15-
<span class="line"><span style="color:#E1E4E8;--shiki-dark:#B392F0">&#x3C;/</span><span style="color:#79B8FF;--shiki-dark:#79B8FF">Flex</span><span style="color:#E1E4E8;--shiki-dark:#B392F0">></span></span></code></pre>0:{"rsc":["$","$1","c",{"children":[[["$","h1",null,{"className":"mdx-module__YUQVZa__h1","children":"Get Started with BUI"}],"\n",["$","p",null,{"className":"mdx-module__YUQVZa__p","children":"Backstage UI is a design system created specifically for Backstage, built with React, TypeScript, and vanilla CSS.\nThis open-source library is hosted in the Backstage monorepo. While it can be used in other projects, Backstage UI\nis designed to deliver a consistent, accessible, and extensible experience tailored to Backstage users."}],"\n",["$","p",null,{"className":"mdx-module__YUQVZa__p","children":["Backstage UI is installed by default on every instance of Backstage, so you can start using it right away.\nIf your setup doesn't include it yet, follow the ",["$","a",null,{"href":"/get-started/installation","className":"mdx-module__YUQVZa__a","children":"installation guide"}]," to get started."]}],"\n",["$","h2",null,{"id":"layout-containers","className":"mdx-module__YUQVZa__h2 mdx-module__YUQVZa__headingWithAnchor","children":["$","a",null,{"href":"#layout-containers","className":"mdx-module__YUQVZa__anchorLink","children":["Layout containers",["$","span",null,{"className":"mdx-module__YUQVZa__anchorHash","children":"#"}]]}]}],"\n",["$","p",null,{"className":"mdx-module__YUQVZa__p","children":[["$","a",null,{"href":"/components/box","className":"mdx-module__YUQVZa__a","children":["$","code",null,{"style":{"fontFamily":"var(--font-mono)","backgroundColor":"var(--bg)","padding":"0.2rem 0.375rem","borderRadius":"0.25rem","color":"var(--primary)","border":"1px solid var(--border)","fontSize":"0.875rem"},"children":"Box"}]}],", ",["$","a",null,{"href":"/components/flex","className":"mdx-module__YUQVZa__a","children":["$","code",null,{"style":{"fontFamily":"var(--font-mono)","backgroundColor":"var(--bg)","padding":"0.2rem 0.375rem","borderRadius":"0.25rem","color":"var(--primary)","border":"1px solid var(--border)","fontSize":"0.875rem"},"children":"Flex"}]}],", ",["$","a",null,{"href":"/components/grid","className":"mdx-module__YUQVZa__a","children":["$","code",null,{"style":{"fontFamily":"var(--font-mono)","backgroundColor":"var(--bg)","padding":"0.2rem 0.375rem","borderRadius":"0.25rem","color":"var(--primary)","border":"1px solid var(--border)","fontSize":"0.875rem"},"children":"Grid"}]}],", and ",["$","a",null,{"href":"/components/card","className":"mdx-module__YUQVZa__a","children":["$","code",null,{"style":{"fontFamily":"var(--font-mono)","backgroundColor":"var(--bg)","padding":"0.2rem 0.375rem","borderRadius":"0.25rem","color":"var(--primary)","border":"1px solid var(--border)","fontSize":"0.875rem"},"children":"Card"}]}]," are the foundation of every layout in Backstage UI.\nEach one offers a set of utility props that map directly to our design tokens, so you can build consistent\nlayouts without writing any CSS. When nested, they also act as surfaces and automatically increment the\nbackground depth so visual hierarchy is handled for you."]}],"\n",["$","$L2",null,{"out":"$3","title":"Nested surfaces with automatic styling"}],"\n","$L4","\n","$L5","\n","$L6","\n","$L7","\n","$L8","\n","$L9","\n","$La","\n","$Lb","\n","$Lc","\n","$Ld","\n","$Le","\n","$Lf","\n","$L10","\n","$L11","\n","$L12","\n","$L13","\n","$L14","\n","$L15","\n","$L16","\n","$L17","\n","$L18"],["$L19","$L1a","$L1b","$L1c"],"$L1d"]}],"isPartial":false,"staleTime":300,"varyParams":null,"buildId":"YLXEVWpZVafw8Uy9_75HP"}
15+
<span class="line"><span style="color:#E1E4E8;--shiki-dark:#B392F0">&#x3C;/</span><span style="color:#79B8FF;--shiki-dark:#79B8FF">Flex</span><span style="color:#E1E4E8;--shiki-dark:#B392F0">></span></span></code></pre>0:{"rsc":["$","$1","c",{"children":[[["$","h1",null,{"className":"mdx-module__YUQVZa__h1","children":"Get Started with BUI"}],"\n",["$","p",null,{"className":"mdx-module__YUQVZa__p","children":"Backstage UI is a design system created specifically for Backstage, built with React, TypeScript, and vanilla CSS.\nThis open-source library is hosted in the Backstage monorepo. While it can be used in other projects, Backstage UI\nis designed to deliver a consistent, accessible, and extensible experience tailored to Backstage users."}],"\n",["$","p",null,{"className":"mdx-module__YUQVZa__p","children":["Backstage UI is installed by default on every instance of Backstage, so you can start using it right away.\nIf your setup doesn't include it yet, follow the ",["$","a",null,{"href":"/get-started/installation","className":"mdx-module__YUQVZa__a","children":"installation guide"}]," to get started."]}],"\n",["$","h2",null,{"id":"layout-containers","className":"mdx-module__YUQVZa__h2 mdx-module__YUQVZa__headingWithAnchor","children":["$","a",null,{"href":"#layout-containers","className":"mdx-module__YUQVZa__anchorLink","children":["Layout containers",["$","span",null,{"className":"mdx-module__YUQVZa__anchorHash","children":"#"}]]}]}],"\n",["$","p",null,{"className":"mdx-module__YUQVZa__p","children":[["$","a",null,{"href":"/components/box","className":"mdx-module__YUQVZa__a","children":["$","code",null,{"style":{"fontFamily":"var(--font-mono)","backgroundColor":"var(--bg)","padding":"0.2rem 0.375rem","borderRadius":"0.25rem","color":"var(--primary)","border":"1px solid var(--border)","fontSize":"0.875rem"},"children":"Box"}]}],", ",["$","a",null,{"href":"/components/flex","className":"mdx-module__YUQVZa__a","children":["$","code",null,{"style":{"fontFamily":"var(--font-mono)","backgroundColor":"var(--bg)","padding":"0.2rem 0.375rem","borderRadius":"0.25rem","color":"var(--primary)","border":"1px solid var(--border)","fontSize":"0.875rem"},"children":"Flex"}]}],", ",["$","a",null,{"href":"/components/grid","className":"mdx-module__YUQVZa__a","children":["$","code",null,{"style":{"fontFamily":"var(--font-mono)","backgroundColor":"var(--bg)","padding":"0.2rem 0.375rem","borderRadius":"0.25rem","color":"var(--primary)","border":"1px solid var(--border)","fontSize":"0.875rem"},"children":"Grid"}]}],", and ",["$","a",null,{"href":"/components/card","className":"mdx-module__YUQVZa__a","children":["$","code",null,{"style":{"fontFamily":"var(--font-mono)","backgroundColor":"var(--bg)","padding":"0.2rem 0.375rem","borderRadius":"0.25rem","color":"var(--primary)","border":"1px solid var(--border)","fontSize":"0.875rem"},"children":"Card"}]}]," are the foundation of every layout in Backstage UI.\nEach one offers a set of utility props that map directly to our design tokens, so you can build consistent\nlayouts without writing any CSS. When nested, they also act as surfaces and automatically increment the\nbackground depth so visual hierarchy is handled for you."]}],"\n",["$","$L2",null,{"out":"$3","title":"Nested surfaces with automatic styling"}],"\n","$L4","\n","$L5","\n","$L6","\n","$L7","\n","$L8","\n","$L9","\n","$La","\n","$Lb","\n","$Lc","\n","$Ld","\n","$Le","\n","$Lf","\n","$L10","\n","$L11","\n","$L12","\n","$L13","\n","$L14","\n","$L15","\n","$L16","\n","$L17","\n","$L18"],["$L19","$L1a","$L1b","$L1c"],"$L1d"]}],"isPartial":false,"staleTime":300,"varyParams":null,"buildId":"iS-5s6RE3watJufq4AH7N"}
1616
4:["$","h2",null,{"id":"adaptive-components","className":"mdx-module__YUQVZa__h2 mdx-module__YUQVZa__headingWithAnchor","children":["$","a",null,{"href":"#adaptive-components","className":"mdx-module__YUQVZa__anchorLink","children":["Adaptive components",["$","span",null,{"className":"mdx-module__YUQVZa__anchorHash","children":"#"}]]}]}]
1717
5:["$","p",null,{"className":"mdx-module__YUQVZa__p","children":["Components like ",["$","a",null,{"href":"/components/card","className":"mdx-module__YUQVZa__a","children":["$","code",null,{"style":{"fontFamily":"var(--font-mono)","backgroundColor":"var(--bg)","padding":"0.2rem 0.375rem","borderRadius":"0.25rem","color":"var(--primary)","border":"1px solid var(--border)","fontSize":"0.875rem"},"children":"Card"}]}],", ",["$","a",null,{"href":"/components/button","className":"mdx-module__YUQVZa__a","children":["$","code",null,{"style":{"fontFamily":"var(--font-mono)","backgroundColor":"var(--bg)","padding":"0.2rem 0.375rem","borderRadius":"0.25rem","color":"var(--primary)","border":"1px solid var(--border)","fontSize":"0.875rem"},"children":"Button"}]}],", ",["$","a",null,{"href":"/components/text","className":"mdx-module__YUQVZa__a","children":["$","code",null,{"style":{"fontFamily":"var(--font-mono)","backgroundColor":"var(--bg)","padding":"0.2rem 0.375rem","borderRadius":"0.25rem","color":"var(--primary)","border":"1px solid var(--border)","fontSize":"0.875rem"},"children":"Text"}]}],", and others are ",["$","strong",null,{"children":"adaptive components"}],". They\nautomatically adjust their colors, borders, and backgrounds to match the surface they live on. Drop a\n",["$","a",null,{"href":"/components/button","className":"mdx-module__YUQVZa__a","children":["$","code",null,{"style":{"fontFamily":"var(--font-mono)","backgroundColor":"var(--bg)","padding":"0.2rem 0.375rem","borderRadius":"0.25rem","color":"var(--primary)","border":"1px solid var(--border)","fontSize":"0.875rem"},"children":"Button"}]}]," inside a ",["$","a",null,{"href":"/components/card","className":"mdx-module__YUQVZa__a","children":["$","code",null,{"style":{"fontFamily":"var(--font-mono)","backgroundColor":"var(--bg)","padding":"0.2rem 0.375rem","borderRadius":"0.25rem","color":"var(--primary)","border":"1px solid var(--border)","fontSize":"0.875rem"},"children":"Card"}]}]," inside a ",["$","a",null,{"href":"/components/box","className":"mdx-module__YUQVZa__a","children":["$","code",null,{"style":{"fontFamily":"var(--font-mono)","backgroundColor":"var(--bg)","padding":"0.2rem 0.375rem","borderRadius":"0.25rem","color":"var(--primary)","border":"1px solid var(--border)","fontSize":"0.875rem"},"children":"Box"}]}]," and each component styles itself appropriately\nwithout any extra configuration."]}]
1818
1e:T75f,<pre class="shiki shiki-themes github-dark min-dark" style="--shiki-dark-bg:#1f1f1f;color:#e1e4e8;--shiki-dark:#b392f0" tabindex="0"><code><span class="line"><span style="color:#E1E4E8;--shiki-dark:#B392F0">&#x3C;</span><span style="color:#79B8FF;--shiki-dark:#79B8FF">Box</span><span style="color:#B392F0;--shiki-dark:#B392F0"> bg</span><span style="color:#F97583;--shiki-dark:#F97583">=</span><span style="color:#9ECBFF;--shiki-dark:#FFAB70">"neutral"</span><span style="color:#E1E4E8;--shiki-dark:#B392F0">></span></span>

0 commit comments

Comments
 (0)