1(self.webpackChunkpatternfly_org=self.webpackChunkpatternfly_org||[]).push([[3753],{51768:(e,t,a)=>{"use strict";a.r(t),a.d(t,{default:()=>m});var l=a(2784),n=a(66159),s=a(51437),o=a.n(s);const c={id:"Bullseye",section:"layouts",subsection:"",deprecated:!1,template:!1,beta:!1,demo:!1,newImplementationLink:!1,source:"design-guidelines",tabName:null,slug:"/layouts/bullseye/design-guidelines",sourceLink:"https://github.com/patternfly/patternfly-org/blob/main/packages/documentation-site/patternfly-docs/content/design-guidelines/layouts/bullseye.md",relPath:"packages/documentation-site/patternfly-docs/content/design-guidelines/layouts/bullseye.md",examples:{}},i=()=>l.createElement(l.Fragment,null,l.createElement("p",{className:"pf-v6-c-content--p pf-m-editorial ws-p "},"The ",l.createElement("strong",{className:""},"bullseye")," layout centers content, both vertically and horizontally within a container."),l.createElement(n.sg,{id:"elements",headingLevel:"h2",className:"ws-title ws-h2"},"Elements"),l.createElement("img",{src:o(),height:3330*o().height/o().width,alt:"PatternFly website screenshot showing modal created with bullseye layout.",width:"3330px",className:"ws-img "}),l.createElement("ol",{className:"pf-v6-c-content--ol pf-m-editorial ws-ol "},l.createElement("li",{className:"pf-v6-c-content--li pf-m-editorial ws-li "},l.createElement("strong",{className:""},"Bullseye:")," The bullseye container, which contains the bullseye item."),l.createElement("li",{className:"pf-v6-c-content--li pf-m-editorial ws-li "},l.createElement("strong",{className:""},"Bullseye item:")," An individual section of content to be placed in the bullseye container.")),l.createElement(n.sg,{id:"usage",headingLevel:"h2",className:"ws-title ws-h2"},"Usage"),l.createElement("p",{className:"pf-v6-c-content--p pf-m-editorial ws-p "},"A bullseye layout can only contain one section of content."),l.createElement("p",{className:"pf-v6-c-content--p pf-m-editorial ws-p "},"As an example, the bullseye layout is commonly used with the ",l.createElement(n.rU,{to:"/components/modal",className:""},"modal component")," to surface important information and place content on top of another layout."),l.createElement("p",{className:"pf-v6-c-content--p pf-m-editorial ws-p "},"If you need to center more than one section of content on a page, you should choose a different ",l.createElement(n.rU,{to:"/layouts/about-layouts",className:""},"PatternFly layout"),"."));i.displayName="LayoutsBullseyeDesignGuidelinesDocs",i.pageData=c;const m=i},51437:(e,t,a)=>{e.exports={srcSet:a.p+"images/bullseye-example.dcf87798fe3a4d9e.png 1818w",images:[{path:a.p+"images/bullseye-example.dcf87798fe3a4d9e.png",width:1818,height:934}],src:a.p+"images/bullseye-example.dcf87798fe3a4d9e.png",toString:function(){return a.p+"images/bullseye-example.dcf87798fe3a4d9e.png"},width:1818,height:934}}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.