1"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[6426],{68999:(e,t,n)=>{n.r(t),n.d(t,{assets:()=>l,contentTitle:()=>c,default:()=>h,frontMatter:()=>o,metadata:()=>s,toc:()=>a});var r=n(85893),i=n(11151);const o={sidebar_position:32,description:"Cover content with a rectangle of a specified color.",toc_max_heading_level:2},c="cover-with-rect",s={id:"reference/utils/cover-with-rect",title:"cover-with-rect",description:"Cover content with a rectangle of a specified color.",source:"@site/docs/reference/utils/cover-with-rect.mdx",sourceDirName:"reference/utils",slug:"/reference/utils/cover-with-rect",permalink:"/docs/reference/utils/cover-with-rect",draft:!1,unlisted:!1,tags:[],version:"current",sidebarPosition:32,frontMatter:{sidebar_position:32,description:"Cover content with a rectangle of a specified color.",toc_max_heading_level:2},sidebar:"tutorialSidebar",previous:{title:"is-block",permalink:"/docs/reference/utils/is-block"},next:{title:"update-alpha",permalink:"/docs/reference/utils/update-alpha"}},l={},a=[{value:"..cover-args : <TypeLink></TypeLink>",id:"cover-args",level:3},{value:"fill : <TypeLink></TypeLink> <Default><code>auto</code></Default>",id:"fill",level:3},{value:"inline : <TypeLink></TypeLink> <Default><code>auto</code></Default>",id:"inline",level:3},{value:"body : <TypeLink></TypeLink>",id:"body",level:3}];function d(e){const t={a:"a",code:"code",h1:"h1",h3:"h3",p:"p",strong:"strong",...(0,i.a)(),...e.components},{Default:n,Param:o,Parameters:c,Signature:s,SignatureName:l,SignatureParam:a,SourceLink:d,TypeLink:h}=t;return n||u("Default",!0),o||u("Param",!0),c||u("Parameters",!0),s||u("Signature",!0),l||u("SignatureName",!0),a||u("SignatureParam",!0),d||u("SourceLink",!0),h||u("TypeLink",!0),(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(t.h1,{id:"cover-with-rect",children:"cover-with-rect"}),"\n",(0,r.jsx)(s,{children:(0,r.jsxs)("code",{children:[(0,r.jsx)(l,{children:"cover-with-rect"}),"(",(0,r.jsxs)(a,{children:[(0,r.jsx)(t.a,{href:"#self",children:"self: none"}),", "]}),(0,r.jsxs)(a,{children:[(0,r.jsx)(t.a,{href:"#cover-args",children:"..cover-args"}),", "]}),(0,r.jsxs)(a,{children:[(0,r.jsx)(t.a,{href:"#fill",children:"fill: auto"}),", "]}),(0,r.jsxs)(a,{children:[(0,r.jsx)(t.a,{href:"#inline",children:"inline: auto"}),", "]}),(0,r.jsxs)(a,{children:[(0,r.jsx)(t.a,{href:"#is-first",children:"is-first: false"}),", "]}),(0,r.jsx)(a,{children:(0,r.jsx)(t.a,{href:"#body",children:"body"})}),")",(0,r.jsx)(d,{href:"https://github.com/touying-typ/touying/blob/main/src/utils.typ#L1308"})]})}),"\n",(0,r.jsx)(t.p,{children:"Cover content with a rectangle of a specified color. If you set the fill to the background color of the page, you can use this to create a semi-transparent overlay."}),"\n",(0,r.jsxs)(t.p,{children:["Example: ",(0,r.jsx)(t.code,{children:'#utils.cover-with-rect(fill: "red")[Hidden]'})]}),"\n",(0,r.jsxs)(c,{children:[(0,r.jsxs)(t.h3,{id:"cover-args",children:["..cover-args : ",(0,r.jsx)(h,{type:"args"})]}),(0,r.jsx)(o,{children:(0,r.jsx)(t.p,{children:"The arguments to pass to the rectangle."})}),(0,r.jsxs)(t.h3,{id:"fill",children:["fill : ",(0,r.jsx)(h,{type:"color"})," ",(0,r.jsx)(n,{children:(0,r.jsx)(t.code,{children:"auto"})})]}),(0,r.jsx)(o,{children:(0,r.jsx)(t.p,{children:"The color to fill the rectangle with."})}),(0,r.jsxs)(t.h3,{id:"inline",children:["inline : ",(0,r.jsx)(h,{type:"bool"})," ",(0,r.jsx)(n,{children:(0,r.jsx)(t.code,{children:"auto"})})]}),(0,r.jsx)(o,{children:(0,r.jsxs)(t.p,{children:["Indicates whether the content should be displayed inline. Default is ",(0,r.jsx)(t.code,{children:"auto"}),". It is determined based on content type, not inline for block content and inline for inline content."]})}),(0,r.jsxs)(t.h3,{id:"body",children:["body : ",(0,r.jsx)(h,{type:"content"})]}),(0,r.jsx)(o,{children:(0,r.jsx)(t.p,{children:"The content to cover."})})]}),"\n",(0,r.jsxs)(t.p,{children:[(0,r.jsx)(t.strong,{children:"Returns:"})," ",(0,r.jsx)(h,{type:"content"})]})]})}function h(e={}){const{wrapper:t}={...(0,i.a)(),...e.components};return t?(0,r.jsx)(t,{...e,children:(0,r.jsx)(d,{...e})}):d(e)}function u(e,t){throw new Error("Expected "+(t?"component":"object")+" `"+e+"` to be defined: you likely forgot to import, pass, or provide it.")}},11151:(e,t,n)=>{n.d(t,{Z:()=>s,a:()=>c});var r=n(67294);const i={},o=r.createContext(i);function c(e){const t=r.useContext(o);return r.useMemo((function(){return"function"==typeof e?e(t):{...t,...e}}),[t,e])}function s(e){let t;return t=e.disableParentContext?"function"==typeof e.components?e.components(i):e.components||i:c(e.components),r.createElement(o.Provider,{value:t},e.children)}}}]);
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.