UNPKG

bytefun-ai-mcp

Version:

ByteFun AI MCP服务 - 打通产品设计、UI设计、代码开发的服务平台，支持设计稿转代码和跨平台原生代码开发

www.bytefungo.com

425 lines (396 loc) • 81.2 kB

JavaScript

export const uiDesignPromptTemplate = ` # 你是前端开发专家和UI设计专家,现在需要你遵守以下规则和说明,根据用户需求描述,完成Html页面的编写 ## 一、设计规则 - 遵循iPhone 16 Pro尺寸规格(宽度393px高度852px) - 如用户没有明确描述说明页面背景色，只有闪屏页面的背景色允许设置primary主色或primary与secondary的渐变色，其他页面必须使用\`var(--page-bg-color)\`做页面背景色。 - 所有像素单位都是px，不能使用百分百、em、rem等单位 - 当需要icon图标时必须使用FontAwesome图标，比如："fab fa-weixin"，绝对不能使用emoji表情符号 - 当需要img图片时，图片地址需使用："https://oss.bytefungo.com/f1/showImg1.jpg"，其中结尾的'showImg1'可以换为从1到30的数字，1~30的数字必须随机挑选，不得每个页面每个图片都使用同一个数字。 - logo图片的图片是图片不是图标，因此必须是img标签，不能使用i标签 - 输入框如果需要展示文字label，尽量使用icon代替文字label，并且icon重叠在输入框的左侧，这样整个页面的空间利用率高。 - 禁止写任何@media相关的(响应式调整)css代码，因为已经明确是以393*852的分辨率设计APP移动端了 - 任何子页面都必须禁止添加底部导航栏节点到页面，因为子页面是从父页面跳转过来的，父页面已经有底部导航栏了，子页面不需要再添加底部导航栏。 ## 二、阅读并理解\`doc/uilib-components.css\`，理解以下总结的css样式使用规则 ### 1. 文本组件 - **样式类**: \`.uilib-primaryText\`, \`.uilib-infoText\`, \`.uilib-level1TitleText\`, \`.uilib-level2TitleText\`, \`.uilib-hintText\`, \`.uilib-errorText\`, \`.uilib-warningText\`, \`.uilib-successText\`, \`.uilib-linkText\` - **规则说明**: 文本组件用于显示不同类型的文本内容，包括主要文本、信息文本、标题文本、提示文本、状态文本和超链接文本。根据内容类型选择对应的样式类。 - **HTML示例**: \`\`\`html <h1 vtype="text" id="title" name="一级标题" class="uilib-level1TitleText">一级标题</h1> <h2 vtype="text" id="subtitle" name="二级标题" class="uilib-level2TitleText">二级标题</h2> <p vtype="text" id="mainText" name="主要文本内容" class="uilib-primaryText">这是主要文本内容</p> <span vtype="text" id="infoText" name="辅助信息" class="uilib-infoText">这是辅助信息</span> <small vtype="text" id="hintText" name="提示文本" class="uilib-hintText">这是提示文本</small> <span vtype="text" id="errorText" name="错误信息" class="uilib-errorText">错误信息</span> <span vtype="text" id="warningText" name="警告信息" class="uilib-warningText">警告信息</span> <span vtype="text" id="successText" name="成功信息" class="uilib-successText">成功信息</span> <a vtype="text" id="linkText" name="这是一个超链接" href="#" class="uilib-linkText">这是一个超链接</a> \`\`\` ### 2. 按钮组件 - **样式类**: \`.uilib-primaryButton\`, \`.uilib-secondaryButton\`, \`.uilib-textButton\`, \`.uilib-iconButton\`, \`.uilib-primaryIconTextButton\`, \`.uilib-secondaryIconTextButton\` - **尺寸类**: \`.small\`, \`.medium\`, \`.large\` - **规则说明**: 按钮组件支持多种样式和尺寸，图标文本按钮需要包含图标和文本元素。所有按钮都需要配合尺寸类使用。 - **布局说明**：\`.uilib-primaryIconTextButton\`和\`.uilib-secondaryIconTextButton\`里面的孩子节点不需要设置间距、坐标属性，因为这些间距已经在css文件里设置好了。 - **HTML示例**: \`\`\`html <button vtype="button" id="primaryButton" name="主要按钮" class="uilib-primaryButton medium">主要按钮</button> <button vtype="button" id="secondaryButton" name="次要按钮" class="uilib-secondaryButton medium">次要按钮</button> <button vtype="button" id="textButton" name="文本按钮" class="uilib-textButton medium">文本按钮</button> <button vtype="button" id="iconButton" name="图标按钮" class="uilib-iconButton medium"> <i vtype="icon" id="heartIcon" name="心形图标" class="fas fa-heart"></i> </button> <button vtype="button" id="primaryIconTextButton" name="主要图标文本按钮" class="uilib-primaryIconTextButton medium"> <i vtype="icon" id="plusIcon" name="加号图标" class="fas fa-plus"></i> <span vtype="text" id="plusText" name="添加文本">添加</span> </button> <button vtype="button" id="secondaryIconTextButton" name="次要图标文本按钮" class="uilib-secondaryIconTextButton medium"> <i vtype="icon" id="trashIcon" name="垃圾桶图标" class="fas fa-trash"></i> <span vtype="text" id="trashText" name="删除文本">删除</span> </button> <button vtype="button" id="secondaryIconTextButton" name="次要图标文本按钮" class="uilib-secondaryIconTextButton medium"> <i vtype="icon" id="trashIcon" name="垃圾桶图标" class="fas fa-trash"></i> <span vtype="text" id="trashText" name="删除文本">删除</span> </button> \`\`\` ### 3. 输入框组件 - **样式类**: \`.uilib-input\` - **容器类**: \`.uilib-inputContainer\` - **容器修饰类**: \`.has-left-icon\`, \`.has-right-icon\`, \`.has-button\` - **图标类**: \`.uilib-input-icon\` - **图标位置类**: \`.left\`, \`.right\` - **按钮类**: \`.uilib-input-button\` - **规则说明**: 输入框组件支持多种类型和布局。使用\`.uilib-inputContainer\`作为统一容器，通过修饰类控制图标和按钮的位置。支持左图标、右图标、左右图标、右按钮、左图标右按钮等多种组合。验证码输入框通常多个组合使用。 - **布局说明**：\`.uilib-inputContainer\`里面的孩子节点不需要设置间距、坐标属性，因为这些间距已经在css文件里设置好了。 - **HTML示例**: \`\`\`html  <input vtype="input" id="textInput" name="文本输入框" type="text" class="uilib-input" placeholder="请输入内容"> <input vtype="input" id="numberInput" name="数字输入框" type="number" class="uilib-numberInput" placeholder="请输入数字">  <div vtype="container" id="searchInputContainer" name="搜索输入框容器" class="uilib-inputContainer has-left-icon has-right-icon"> <i vtype="icon" id="searchIcon" name="搜索图标" class="fas fa-search uilib-input-icon left"></i> <input vtype="input" id="searchInput" name="搜索输入框" type="text" class="uilib-input" placeholder="搜索内容"> <i vtype="icon" id="clearIcon" name="清除图标" class="fas fa-times uilib-input-icon right"></i> </div>  <div vtype="container" id="verifyCodeContainer" name="验证码输入框容器" style="display: flex; gap: 8px;"> <input vtype="input" id="verifyCodeInput1" name="验证码输入框1" type="text" class="uilib-verifyCodeInput" maxlength="1"> <input vtype="input" id="verifyCodeInput2" name="验证码输入框2" type="text" class="uilib-verifyCodeInput" maxlength="1"> <input vtype="input" id="verifyCodeInput3" name="验证码输入框3" type="text" class="uilib-verifyCodeInput" maxlength="1"> <input vtype="input" id="verifyCodeInput4" name="验证码输入框4" type="text" class="uilib-verifyCodeInput" maxlength="1"> <input vtype="input" id="verifyCodeInput5" name="验证码输入框5" type="text" class="uilib-verifyCodeInput" maxlength="1"> <input vtype="input" id="verifyCodeInput6" name="验证码输入框6" type="text" class="uilib-verifyCodeInput" maxlength="1"> </div> \`\`\` ### 4. 标题栏组件 - **样式类**: \`.uilib-secondPageTitleBar\` - **规则说明**: 二级页面的标题栏，通常包含返回按钮、标题文本和操作按钮，操作按钮是可选的，并且必须放在标题栏的右边。 - **HTML示例**: \`\`\`html <div vtype="titleBar" id="titleBar" name="标题栏" class="uilib-secondPageTitleBar"> <button vtype="button" id="backButton" name="返回按钮" class="uilib-iconButton small"> <i vtype="icon" id="backIcon" name="返回图标" class="fas fa-arrow-left"></i> </button> <span vtype="text" id="titleText" name="页面标题" class="uilib-level2TitleText">页面标题</span> </div> \`\`\` ### 5. 图片组件 - **样式类**: \`.uilib-image\`, \`.uilib-smallLogoImage\`, \`.uilib-mediumLogoImage\`, \`.uilib-largeLogoImage\`, \`.uilib-avatarImage\` - **规则说明**: 图片组件提供不同用途和尺寸的图片样式，包括通用图片、不同尺寸的Logo和头像图片。 - **HTML示例**: \`\`\`html <img vtype="image" id="image1" name="图片1" src="xxx" alt="图片" class="uilib-image"> <img vtype="image" id="logoImage" name="Logo图片" src="xxx" alt="Logo" class="uilib-mediumLogoImage"> <img vtype="image" id="avatarImage" name="头像图片" src="xxx" alt="头像" class="uilib-avatarImage"> \`\`\` ### 6. 开关组件 - **样式类**: \`.uilib-iconSwitch\`, \`.uilib-sliderSwitch\` - **状态类**: \`.active\` - **规则说明**: 开关组件支持图标开关和滑块开关两种样式，通过添加或移除\`.active\`类来控制开关状态。 - **HTML示例**: \`\`\`html <div vtype="switch" id="iconSwitch" name="图标开关" class="uilib-iconSwitch"> <i vtype="icon" id="iconSwitchIcon" name="图标开关图标" class="fas fa-heart"></i> </div> <div vtype="switch" id="sliderSwitch" name="滑块开关" class="uilib-sliderSwitch"> <div vtype="slider" id="sliderSwitchSlider" name="滑块开关滑块" class="slider"></div> </div> \`\`\` ### 7. 单选和多选组件 - **容器类**: \`.uilib-radio-group\`、\`.uilib-checkbox-group\` - **样式类**: \`.uilib-iconRadio\`, \`.uilib-iconTextRadio\`, \`.uilib-iconCheckbox\`, \`.uilib-iconTextCheckbox\` - **状态类**: \`.checked\` - **子元素类**: \`.uilib-radio-icon\`, \`.uilib-checkbox-icon\`, \`.uilib-primaryText\` - **规则说明**: 单选和多选组件支持纯图标和图标文本两种形式，通过\`.checked\`类控制选中状态，多选框可使用容器类组合。 - **HTML示例**: \`\`\`html <div vtype="radioGroup" id="radioGroup" name="单选框组" class="uilib-radio-group"> <div vtype="radio" id="iconTextRadio1" name="图标文本单选项1" class="uilib-iconTextRadio"> <i vtype="icon" id="iconTextRadioIcon1" name="图标文本单选项图标1" class="uilib-radio-icon fas fa-circle"></i> <span vtype="text" id="iconTextRadioText1" name="图标文本单选项文本1" class="radio-text">选项1</span> </div> <div vtype="radio" id="iconTextRadio2" name="图标文本单选项2" class="uilib-iconTextRadio"> <i vtype="icon" id="iconTextRadioIcon2" name="图标文本单选项图标2" class="uilib-radio-icon fas fa-circle"></i> <span vtype="text" id="iconTextRadioText2" name="图标文本单选项文本2" class="radio-text">选项2</span> </div> </div> <div vtype="checkBoxGroup" id="checkboxGroup" name="多选框组" class="uilib-checkbox-group"> <div vtype="checkBox" id="iconTextCheckbox1" name="图标文本多选选项1" class="uilib-iconTextCheckbox"> <i vtype="icon" id="iconTextCheckboxIcon1" name="图标文本多选选项图标1" class="uilib-checkbox-icon fas fa-square"></i> <span vtype="text" id="iconTextCheckboxText1" name="图标文本多选选项文本1" class="uilib-primaryText">选项1</span> </div> <div vtype="checkBox" id="iconTextCheckbox2" name="图标文本多选选项2" class="uilib-iconTextCheckbox"> <i vtype="icon" id="iconTextCheckboxIcon2" name="图标文本多选选项图标2" class="uilib-checkbox-icon fas fa-square"></i> <span vtype="text" id="iconTextCheckboxText2" name="图标文本多选选项文本2" class="uilib-primaryText">选项2</span> </div> </div> \`\`\` ### 8. 列表组件 - **容器类**: \`.uilib-verticalListContainer\`、\`.uilib-horizontalListContainer\` - **子元素类**: \`.uilib-xxxListCard\` - **规则说明**: 列表容器使用 \`.uilib-verticalListContainer\`、\`.uilib-horizontalListContainer\`类标识，一个列表容器包含N个\`.uilib-xxxListCard\`列表卡片，需要在\`.bytefun/uilib-components.css\`中找到正确的\`.uilib-xxxListCard\`类样式。 - **HTML示例**: \`\`\`html <div vtype="verticalListView" id="verticalListContainer" name="垂直列表容器" class="uilib-verticalListContainer"> <div vtype="listItemCard" id="verticalListCard1" name="垂直列表卡片1" class="uilib-xxxListCard"> xxx（具体卡片的内容孩子元素节点） </div> <div vtype="listItemCard" id="verticalListCard2" name="垂直列表卡片2" class="uilib-xxxListCard"> xxx（具体卡片的内容孩子元素节点） </div> </div> <div vtype="horizontalListView" id="horizontalListContainer" name="水平列表容器" class="uilib-horizontalListContainer"> <div vtype="listItemCard" id="horizontalListCard1" name="水平列表卡片1" class="uilib-xxxListCard"> xxx（具体卡片的内容孩子元素节点） </div> <div vtype="listItemCard" id="horizontalListCard2" name="水平列表卡片2" class="uilib-xxxListCard"> xxx（具体卡片的内容孩子元素节点） </div> </div> \`\`\` ### 9. 轮播组件 - **容器类**: \`.uilib-viewPagerContent\`、\`.uilib-viewPagerIndicator\` - **子元素类**: \`.uilib-xxxViewPagerItemCard\`、\`.uilib-viewPagerIndicatorCircleItem\` - **状态类**: \`.active\` - **规则说明**: 轮播内容容器使用\`.uilib-viewPagerContent\`类标识，轮播指示器容器使用\`.uilib-viewPagerIndicator\`类标识，一个轮播内容容器包含N个\`.uilib-xxxViewPagerItemCard\`轮播卡片，一个轮播指示器容器包含N个\`.uilib-viewPagerIndicatorCircleItem\`指示器项，轮播内容容器与轮播指示器容器是兄弟节点，子元素通过\`.active\`类标识当前激活的项，需要在\`.bytefun/uilib-components.css\`中找到正确的\`.uilib-xxxViewPagerItemCard\`类样式。 - **HTML示例**: \`\`\`html <div vtype="viewPager" id="viewPagerContent" name="轮播内容容器" class="uilib-viewPagerContent"> <div vtype="oneViewPagerContent" id="viewPagerItem1" name="轮播卡片1" class="uilib-xxxViewPagerItemCard active"></div> <div vtype="oneViewPagerContent" id="viewPagerItem2" name="轮播卡片2" class="uilib-xxxViewPagerItemCard"></div> <div vtype="oneViewPagerContent" id="viewPagerItem3" name="轮播卡片3" class="uilib-xxxViewPagerItemCard"></div> </div> <div vtype="bottomTabNavigateBar" id="viewPagerIndicator" name="轮播指示器容器" class="uilib-viewPagerIndicator"> <div vtype="bottomTabNavigateBarItem" id="viewPagerIndicatorCircleItem1" name="轮播指示器项1" class="uilib-viewPagerIndicatorCircleItem active"></div> <div vtype="bottomTabNavigateBarItem" id="viewPagerIndicatorCircleItem2" name="轮播指示器项2" class="uilib-viewPagerIndicatorCircleItem"></div> <div vtype="bottomTabNavigateBarItem" id="viewPagerIndicatorCircleItem3" name="轮播指示器项3" class="uilib-viewPagerIndicatorCircleItem"></div> </div> \`\`\` ### 10. Tab组件 - **样式类**: \`.uilib-underlineTabMenuBarItem\`, \`.uilib-sliderTabMenuBarItem\` - **状态类**: \`.active\` - **子元素类**: \`.uilib-tab-text\`, \`.uilib-tab-line\` - **规则说明**: Tab组件支持下划线和滑块两种样式，通过\`.active\`类标识当前激活的Tab项。 - **HTML示例**: \`\`\`html <div vtype="tabMenuBar" id="underlineTabMenuBar" name="下划线Tab菜单栏" class="uilib-underlineTabMenuBar"> <div vtype="tabMenuBarItem" id="underlineTabMenuBarItem1" name="下划线Tab项1" class="uilib-underlineTabMenuBarItem active"> <span vtype="text" id="underlineTabMenuBarItem1Text" name="下划线Tab项1文本" class="uilib-tab-text">首页</span> <div vtype="line" id="underlineTabMenuBarItem1Line" name="下划线Tab项1下划线" class="uilib-tab-line"></div> </div> </div> <div vtype="tabMenuBar" id="sliderTabMenuBar" name="滑块Tab菜单栏" class="uilib-sliderTabMenuBar"> <div vtype="tabMenuBarItem" id="sliderTabMenuBarItem1" name="滑块Tab项1" class="uilib-sliderTabMenuBarItem active"> <span vtype="text" id="sliderTabMenuBarItem1Text" name="滑块Tab项1文本" class="uilib-tab-text">推荐</span> </div> </div> \`\`\` ### 11. dialog组件 - **样式类**: \`.uilib-dialog\` - **子元素类**: \`.uilib-dialogTitleContainer\`, \`.uilib-dialogContentContainer\`, \`.uilib-dialog-actions\` - **规则说明**: dialog组件用于显示弹窗或确认对话框，分为有标题和无标题两种类型。有标题的dialog使用\`.uilib-dialogTitleContainer\`包含标题内容，无标题的dialog直接使用\`.uilib-dialogContentContainer\`包含内容。操作按钮区域使用\`.uilib-dialog-actions\`，内部按钮会平分宽度并保持适当间距。 - **HTML示例**: \`\`\`html  <div vtype="dialog" id="dialog1" name="对话框1" class="uilib-dialog"> <div vtype="container" id="dialogTitleContainer1" name="对话框1标题容器" class="uilib-dialogTitleContainer"> <h3 vtype="text" id="dialogTitleContainer1Text" name="对话框1标题文本" class="uilib-level2TitleText">对话框标题</h3> </div> <div vtype="container" id="dialogContentContainer1" name="对话框1内容容器" class="uilib-dialogContentContainer"> <p vtype="text" id="dialogContentContainer1Text" name="对话框1内容文本" class="uilib-primaryText">这是对话框的内容文字</p> </div> <div vtype="container" id="dialogActions1" name="对话框1操作按钮容器" class="uilib-dialog-actions"> <button vtype="button" id="dialogActions1CancelButton" name="对话框1取消按钮" class="uilib-secondaryButton medium">取消</button> <button vtype="button" id="dialogActions1OkButton" name="对话框1确定按钮" class="uilib-primaryButton medium">确定</button> </div> </div>  <div vtype="dialog" id="dialog2" name="对话框2" class="uilib-dialog"> <div vtype="container" id="dialogContentContainer2" name="对话框2内容容器" class="uilib-dialogContentContainer"> <p vtype="text" id="dialogContentContainer2Text" name="对话框2内容文本" class="uilib-primaryText">确认删除吗？删除后将无法恢复</p> </div> <div vtype="container" id="dialogActions2" name="对话框2操作按钮容器" class="uilib-dialog-actions"> <button vtype="button" id="dialogActions2CancelButton" name="对话框2取消按钮" class="uilib-secondaryButton medium">取消</button> <button vtype="button" id="dialogActions2OkButton" name="对话框2确定按钮" class="uilib-primaryButton medium">确定</button> </div> </div> \`\`\` ### 12. toast提示组件 - **样式类**: \`.uilib-infoToast\`, \`.uilib-successToast\`, \`.uilib-warnToast\`, \`.uilib-errorToast\` - **子元素类**: \`.uilib-toast-text\` - **规则说明**: toast提示组件用于显示临时性的消息提示，支持信息、成功、警告、错误四种类型。每种类型都有对应的背景色和图标。toast组件通常包含图标和文本内容，使用\`.uilib-toast-text\`类来统一样式。 - **布局说明**: toast组件采用\`inline-flex\`布局，内部元素会自动居中对齐，图标和文本之间有8px的间距。组件宽度自适应内容，具有圆角和阴影效果。 - **HTML示例**: \`\`\`html  <div vtype="toast" id="successToast" name="成功Toast" class="uilib-successToast"> <i vtype="icon" id="successToastIcon" name="成功Toast图标" class="fas fa-check-circle uilib-toast-text"></i> <span vtype="text" id="successToastText" name="成功Toast文本" class="uilib-toast-text">操作成功</span> </div> \`\`\` ### 13. 下拉菜单组件 - **样式类**: \`.uilib-dropdownContainer\`, \`.uilib-dropdownTrigger\`, \`.uilib-dropDownMenu\`, \`.uilib-dropDownMenuItem\`, \`.uilib-dropDownMenuItemWithIcon\` - **子元素类**: \`.dropdown-icon\`, \`.dropdown-text\` - **规则说明**: 下拉菜单组件由容器、触发器和菜单项组成。支持纯文本菜单项和带图标的菜单项两种形式。触发器通常使用按钮样式，菜单项可以包含图标和文本。 - **HTML示例**: \`\`\`html  <div vtype="container" id="dropdown1" name="下拉菜单1" class="uilib-dropdownContainer"> <button vtype="button" id="dropdown1Trigger" name="下拉菜单1触发器" class="uilib-dropdownTrigger uilib-secondaryButton medium"> <span vtype="text" id="dropdown1TriggerText" name="下拉菜单1触发器文本">选择选项</span> <i vtype="icon" id="dropdown1TriggerIcon" name="下拉菜单1触发器图标" class="fas fa-chevron-down"></i> </button> <div vtype="dropDownMenu" id="dropdown1Menu" name="下拉菜单1菜单" class="uilib-dropDownMenu"> <div vtype="container" id="dropdown1MenuItem1" name="下拉菜单1选项1" class="uilib-dropDownMenuItem">选项1</div> <div vtype="container" id="dropdown1MenuItem2" name="下拉菜单1选项2" class="uilib-dropDownMenuItem">选项2</div> <div vtype="container" id="dropdown1MenuItem3" name="下拉菜单1选项3" class="uilib-dropDownMenuItem">选项3</div> </div> </div>  <div vtype="container" id="dropdown2" name="下拉菜单2" class="uilib-dropdownContainer"> <button vtype="button" id="dropdown2Trigger" name="下拉菜单2触发器" class="uilib-dropdownTrigger uilib-secondaryButton medium"> <span vtype="text" id="dropdown2TriggerText" name="下拉菜单2触发器文本">选择类别</span> <i vtype="icon" id="dropdown2TriggerIcon" name="下拉菜单2触发器图标" class="fas fa-chevron-down"></i> <button vtype="button" id="dropdown2Trigger2" name="下拉菜单2触发器2" class="uilib-dropdownTrigger uilib-secondaryButton medium"> <span vtype="text" id="dropdown2Trigger2Text" name="下拉菜单2触发器2文本">选择类别</span> <i vtype="icon" id="dropdown2Trigger2Icon" name="下拉菜单2触发器2图标" class="fas fa-chevron-down"></i> </button> <div vtype="dropDownMenu" id="dropdown2Menu" name="下拉菜单2菜单" class="uilib-dropDownMenu"> <div vtype="container" id="dropdown2MenuItem1" name="下拉菜单2选项1" class="uilib-dropDownMenuItem uilib-dropDownMenuItemWithIcon"> <i vtype="icon" id="dropdown2MenuItem1Icon" name="下拉菜单2选项1图标" class="fas fa-folder dropdown-icon"></i> <span vtype="text" id="dropdown2MenuItem1Text" name="下拉菜单2选项1文本" class="dropdown-text">文件夹</span> </div> <div vtype="container" id="dropdown2MenuItem2" name="下拉菜单2选项2" class="uilib-dropDownMenuItem uilib-dropDownMenuItemWithIcon"> <i vtype="icon" id="dropdown2MenuItem2Icon" name="下拉菜单2选项2图标" class="fas fa-file-alt dropdown-icon"></i> <span vtype="text" id="dropdown2MenuItem2Text" name="下拉菜单2选项2文本" class="dropdown-text">文档</span> </div> </div> </div> \`\`\` ### 14. tag标签组件 - **样式类**: \`.uilib-textFilledTag\`, \`.uilib-iconFilledTag\`, \`.uilib-textOutlineTag\`, \`.uilib-iconOutlineTag\` - **容器类**: \`.uilib-tagGroup\` - **子元素类**: \`.tag-icon\` - **颜色类**: \`blue\`, \`green\`, \`red\`, \`gray\`, \`orange\`, \`gold\` - **规则说明**: 标签组件支持填充和轮廓两种样式，每种样式都有文本和图标文本两种形式。标签使用容器类包裹，每个标签使用对应的样式类和颜色类。支持6种预定义颜色。 - **HTML示例**: \`\`\`html <div vtype="tagGroupContainer" id="tagGroup" name="标签组" class="uilib-tagGroup">  <div vtype="tagItem" id="tagTextFilledBlue" name="文本填充标签-蓝色" class="uilib-textFilledTag blue">蓝色标签</div> <div vtype="tagItem" id="tagTextFilledGreen" name="文本填充标签-绿色" class="uilib-textFilledTag green">绿色标签</div> <div vtype="tagItem" id="tagTextFilledRed" name="文本填充标签-红色" class="uilib-textFilledTag red">红色标签</div>  <div vtype="tagItem" id="tagIconFilledBlue" name="图文填充标签-蓝色" class="uilib-iconFilledTag blue"> <i vtype="icon" id="tagIconFilledBlueIcon" name="图文填充标签-蓝色图标" class="tag-icon fas fa-star"></i> <span vtype="text" id="tagIconFilledBlueText" name="图文填充标签-蓝色文本">蓝色标签</span> <div vtype="tagItem" id="tagIconFilledGreen" name="图文填充标签-绿色" class="uilib-textFilledTag green">绿色标签</div> <div vtype="tagItem" id="tagIconFilledRed" name="图文填充标签-红色" class="uilib-textFilledTag red">红色标签</div>  <div vtype="tagItem" id="tagIconFilledBlue2" name="图文填充标签-蓝色2" class="uilib-iconFilledTag blue"> <i vtype="icon" id="tagIconFilledBlue2Icon" name="图文填充标签-蓝色2图标" class="tag-icon fas fa-star"></i> <span vtype="text" id="tagIconFilledBlue2Text" name="图文填充标签-蓝色2文本">蓝色标签</span> </div>  <div vtype="tagItem" id="tagTextOutlineOrange" name="文本轮廓标签-橙色" class="uilib-textOutlineTag orange">橙色标签</div>  <div vtype="tagItem" id="tagIconOutlineGold" name="图文轮廓标签-金黄色" class="uilib-iconOutlineTag gold"> <i vtype="icon" id="tagIconOutlineGoldIcon" name="图文轮廓标签-金黄色图标" class="tag-icon fas fa-crown"></i> <span vtype="text" id="tagIconOutlineGoldText" name="图文轮廓标签-金黄色文本">金黄色标签</span> </div> </div> \`\`\` ### 15. 底部导航栏组件 - **样式类**: \`.uilib-bottomTabNavigateBarItem\`, \`.uilib-bottom-nav-container\` - **子元素类**: \`.uilib-bottom-tab-icon\`, \`.uilib-bottom-tab-text\` - **状态类**: \`active\` - **规则说明**: 底部导航栏组件用于应用的主要导航，每个导航项包含图标和文本。支持激活状态显示，通过active类来标识当前选中的导航项。 - **HTML示例**: \`\`\`html <div vtype="bottomTabNavigateBar" id="bottomNavContainer" name="底部导航栏容器" class="uilib-bottom-nav-container"> <div vtype="bottomTabNavigateBarItem" id="bottomNavItem1" name="底部导航栏项1" class="uilib-bottomTabNavigateBarItem active"> <div vtype="icon" id="bottomNavItem1Icon" name="底部导航栏项1图标" class="uilib-bottom-tab-icon"><i class="fas fa-home"></i></div> <div vtype="text" id="bottomNavItem1Text" name="底部导航栏项1文本" class="uilib-bottom-tab-text">首页</div> </div> <div vtype="bottomTabNavigateBarItem" id="bottomNavItem2" name="底部导航栏项2" class="uilib-bottomTabNavigateBarItem"> <div vtype="icon" id="bottomNavItem2Icon" name="底部导航栏项2图标" class="uilib-bottom-tab-icon"><i class="fas fa-search"></i></div> <div vtype="text" id="bottomNavItem2Text" name="底部导航栏项2文本" class="uilib-bottom-tab-text">发现</div> </div> <div vtype="bottomTabNavigateBarItem" id="bottomNavItem3" name="底部导航栏项3" class="uilib-bottomTabNavigateBarItem"> <div vtype="icon" id="bottomNavItem3Icon" name="底部导航栏项3图标" class="uilib-bottom-tab-icon"><i class="fas fa-bookmark"></i></div> <div vtype="text" id="bottomNavItem3Text" name="底部导航栏项3文本" class="uilib-bottom-tab-text">书架</div> </div> <div vtype="bottomTabNavigateBarItem" id="bottomNavItem4" name="底部导航栏项4" class="uilib-bottomTabNavigateBarItem"> <div vtype="icon" id="bottomNavItem4Icon" name="底部导航栏项4图标" class="uilib-bottom-tab-icon"><i class="fas fa-user"></i></div> <div vtype="text" id="bottomNavItem4Text" name="底部导航栏项4文本" class="uilib-bottom-tab-text">我的</div> </div> </div> \`\`\` ## 三、数据获取方式\`fromApiOrCacheData: true\`的设置条件： - vtype必须是\`verticalListView\`、\`horizontalListView\`、\`viewPager\`、\`tabContainer\`、\`radioGroup\`、\`checkBoxGroup\`、\`inlineBlockAndWrap\`类型的组件 - 该组件的数据是从网络或者本地持久化缓存拉取回来的，比如：热门商品列表组件\`verticalListView\`，该组件的数据是从网络或者本地持久化缓存拉取回来的 - 如果是一些不需要后端API联网或本地持久化缓存拉取获取的静态写死的数据，那么就不需要fromApiOrCacheData属性了，比如：个人中心列表项、设置列表项、菜单列表项，这些根本不需要经过后台API联网或本地持久化缓存拉取获取的，那么就不要fromApiOrCacheData属性 ## 四、必须添加节点显示和隐藏的切换js方法 - 如果一个节点需要显示和隐藏的切换，那么就必须添加一个js方法来实现显示和隐藏的切换，js方法的命名规则：\`switchTo\` + 节点id，并且该js方法不得带有任何参数。 - js方法的命名规则：\`switchTo\` + 节点id，比如：\`switchToAgeContainer\`、\`switchToPhoneContainer\` - 切换显示和隐藏的js方法不得带有任何参数，比如：\`switchToAgeContainer()\`、\`switchToPhoneContainer()\` ## 五、结合以上的一、二、三、四点规则说明进行思考与实现 - 每个组件都必须包含：id、name、vtype属性 - id属性必须是英文或数字，且不能以数字开头，并且整个页面id属性的值必须唯一 - name属性必须是中文或数字，并且不能包含特殊字符 - vtype属性的值必须是\`组件类型枚举 (vtype)\` 中的一个 - 注意引入\`doc/uilib-components.css\`文件，引入代码这样写： \`\`\`html <link rel="stylesheet" href="../../uilib-components.css"> \`\`\` - 思考该html页面有哪些模块section组成，并为每个模块section添加一个div容器，宽度必须是100%，然后根据以上规则和用户需求描述，完成具体的html页面的编写 - 注意标题栏绝对禁止创建模块section将标题栏包住，因为标题栏本身就是一个section，不能再嵌套一个section - 模块section使用div标签，容器的class必须是\`xxx-section\`，并且容器的宽度必须是100%，模块section只是一个布局容器，不得设置padding、background、border、color等任何UI相关属性 - 严格遵守以上规则，不能有任何违反规则的地方 - 模块section之间的上下间距尽量不要设置大，因为需要节省页面空间，让用户可以更方便地查看和操作，最大不能超过30px - 文本、按钮不得写死宽度值，不需要设置宽度，宽度由文字内容自动撑开 - toast提示和dialog对话框节点必须声明在body节点里，并且必须在body节点的最后面，并且不能添加div父亲容器将其包住，否则会导致toast提示和dialog对话框的显示位置错误 - 只能使用\`doc/uilib-components.css\`文件里面已经定义好的css样式，不能直接在html文件里写css样式，只能写div容器的布局样式 - \`doc/uilib-components.css\`里面的文本、按钮、图片、输入框、单选项、复选项、开关、tag标、功能或分类入口Item项、底部导航栏Item项等这些组件的孩子节点已经设定好了布局，它们的孩子节点不需要考虑布局属性，但是它们自身就必须在html的节点的style属性里设置正确的布局值，比如： \`\`\`html <div vtype="input" id="ageContainer" name="年龄" class="uilib-inputContainer xxx" style="margin-bottom: 16px;"> ... </div> <div vtype="input" id="phoneContainer" name="手机号" class="uilib-inputContainer xxx" style="margin-bottom: 16px;"> ... </div> \`\`\` - 只能使用\`uilib-components.css\`文件的\`root\`里已经定义好的字体变量，不能直接使用字体值或私自定义其他字体变量 ## 六组件类型枚举 (vtype) - 基础: \`text\`, \`button\`, \`textButton\`, \`iconButton\`, \`icon\`, \`image\`, \`rect\`, \`circle\`, \`line\`, \`container\` - 布局: \`multiStateContainer\`, \`oneStateContentContainer\`, \`inlineBlockAndWrap\`, \`blockItem\`, \`verticalLinearLayout\`, \`horizontalLinearLayout\` - 表单: \`input\`, \`switch\`, \`radio\`, \`checkBox\`, \`radioGroup\`, \`checkBoxGroup\` - 列表: \`verticalListView\`, \`horizontalListView\`, \`listItemCard\` - 轮播：\`viewPager\`, \`oneViewPagerContent\`, \`viewPagerIndicatorContainer\` - tab：\`tabContainer\`, \`oneTabContentContainer\`, \`tabMenuBar\`, \`tabMenuBarItem\` - 底部导航: \`bottomTabContentContainer\`, \`subPage\`, \`bottomTabNavigateBar\`, \`bottomTabNavigateBarItem\` - 操作栏：\`titleBar\`、\`topNavigateBar\`, \`bottomOperateBar\` - tag标签：\`tagGroupContainer\`、\`tagItem\` - 弹窗: \`dialog\`, \`dialogOverlay\`, \`toast\`, \`dropDownMenu\`, \`sideSlidePanel\` `; //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidWlEZXNpZ25YWFhYLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vc3JjL3VpRGVzaWduWFhYWC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxNQUFNLENBQUMsTUFBTSxzQkFBc0IsR0FBRzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0NBdWFyQyxDQUFBIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0IGNvbnN0IHVpRGVzaWduUHJvbXB0VGVtcGxhdGUgPSBgXG4jIOS9oOaYr+WJjeerr+W8gOWPkeS4k+WutuWSjFVJ6K6+6K6h5LiT5a62LOeOsOWcqOmcgOimgeS9oOmBteWuiOS7peS4i+inhOWImeWSjOivtOaYjizmoLnmja7nlKjmiLfpnIDmsYLmj4/ov7As5a6M5oiQSHRtbOmhtemdoueahOe8luWGmVxuXG4jIyDkuIDjgIHorr7orqHop4TliJlcbi0g6YG15b6qaVBob25lIDE2IFByb+WwuuWvuOinhOagvCjlrr3luqYzOTNweOmrmOW6pjg1MnB4KVxuLSDlpoLnlKjmiLfmsqHmnInmmI7noa7mj4/ov7Dor7TmmI7pobXpnaLog4zmma/oibLvvIzlj6rmnInpl6rlsY/pobXpnaLnmoTog4zmma/oibLlhYHorrjorr7nva5wcmltYXJ55Li76Imy5oiWcHJpbWFyeeS4jnNlY29uZGFyeeeahOa4kOWPmOiJsu+8jOWFtuS7lumhtemdouW/hemhu+S9v+eUqFxcYHZhcigtLXBhZ2UtYmctY29sb3IpXFxg5YGa6aG16Z2i6IOM5pmv6Imy44CCXG4tIOaJgOacieWDj+e0oOWNleS9jemDveaYr3B477yM5LiN6IO95L2/55So55m+5YiG55m+44CBZW3jgIFyZW3nrYnljZXkvY1cbi0g5b2T6ZyA6KaBaWNvbuWbvuagh+aXtuW/hemhu+S9v+eUqEZvbnRBd2Vzb21l5Zu+5qCH77yM5q+U5aaC77yaXCJmYWIgZmEtd2VpeGluXCLvvIznu53lr7nkuI3og73kvb/nlKhlbW9qaeihqOaDheespuWPt1xuLSDlvZPpnIDopoFpbWflm77niYfml7bvvIzlm77niYflnLDlnYDpnIDkvb/nlKjvvJpcImh0dHBzOi8vb3NzLmJ5dGVmdW5nby5jb20vZjEvc2hvd0ltZzEuanBnXCLvvIzlhbbkuK3nu5PlsL7nmoQnc2hvd0ltZzEn5Y+v5Lul5o2i5Li65LuOMeWIsDMw55qE5pWw5a2X77yMMX4zMOeahOaVsOWtl+W/hemhu+maj+acuuaMkemAie+8jOS4jeW+l+avj+S4qumhtemdouavj+S4quWbvueJh+mDveS9v+eUqOWQjOS4gOS4quaVsOWtl+OAglxuLSBsb2dv5Zu+54mH55qE5Zu+54mH5piv5Zu+54mH5LiN5piv5Zu+5qCH77yM5Zug5q2k5b+F6aG75pivaW1n5qCH562+77yM5LiN6IO95L2/55Soaeagh+etvlxuLSDovpPlhaXmoYblpoLmnpzpnIDopoHlsZXnpLrmloflrZdsYWJlbO+8jOWwvemHj+S9v+eUqGljb27ku6Pmm7/mloflrZdsYWJlbO+8jOW5tuS4lGljb27ph43lj6DlnKjovpPlhaXmoYbnmoTlt6bkvqfvvIzov5nmoLfmlbTkuKrpobXpnaLnmoTnqbrpl7TliKnnlKjnjofpq5jjgIJcbi0g56aB5q2i5YaZ5Lu75L2VQG1lZGlh55u45YWz55qEKOWTjeW6lOW8j+iwg+aVtCljc3Pku6PnoIHvvIzlm6DkuLrlt7Lnu4/mmI7noa7mmK/ku6UzOTMqODUy55qE5YiG6L6o546H6K6+6K6hQVBQ56e75Yqo56uv5LqGXG4tIOS7u+S9leWtkOmhtemdoumDveW/hemhu+emgeatoua3u+WKoOW6lemDqOWvvOiIquagj+iKgueCueWIsOmhtemdou+8jOWboOS4uuWtkOmhtemdouaYr+S7jueItumhtemdoui3s+i9rOi/h+adpeeahO+8jOeItumhtemdouW3sue7j+acieW6lemDqOWvvOiIquagj+S6hu+8jOWtkOmhtemdouS4jemcgOimgeWGjea3u+WKoOW6lemDqOWvvOiIquagj+OAglxuXG4jIyDkuozjgIHpmIXor7vlubbnkIbop6NcXGBkb2MvdWlsaWItY29tcG9uZW50cy5jc3NcXGDvvIznkIbop6Pku6XkuIvmgLvnu5PnmoRjc3PmoLflvI/kvb/nlKjop4TliJlcblxuIyMjIDEuIOaWh+acrOe7hOS7tlxuLSAqKuagt+W8j+exuyoqOiBcXGAudWlsaWItcHJpbWFyeVRleHRcXGAsIFxcYC51aWxpYi1pbmZvVGV4dFxcYCwgXFxgLnVpbGliLWxldmVsMVRpdGxlVGV4dFxcYCwgXFxgLnVpbGliLWxldmVsMlRpdGxlVGV4dFxcYCwgXFxgLnVpbGliLWhpbnRUZXh0XFxgLCBcXGAudWlsaWItZXJyb3JUZXh0XFxgLCBcXGAudWlsaWItd2FybmluZ1RleHRcXGAsIFxcYC51aWxpYi1zdWNjZXNzVGV4dFxcYCwgXFxgLnVpbGliLWxpbmtUZXh0XFxgXG4tICoq6KeE5YiZ6K+05piOKio6IOaWh+acrOe7hOS7tueUqOS6juaYvuekuuS4jeWQjOexu+Wei+eahOaWh+acrOWGheWuue+8jOWMheaLrOS4u+imgeaWh+acrOOAgeS/oeaBr+aWh+acrOOAgeagh+mimOaWh+acrOOAgeaPkOekuuaWh+acrOOAgeeKtuaAgeaWh+acrOWSjOi2hemTvuaOpeaWh+acrOOAguagueaNruWGheWuueexu+Wei+mAieaLqeWvueW6lOeahOagt+W8j+exu+OAglxuLSAqKkhUTUznpLrkvosqKjpcblxcYFxcYFxcYGh0bWxcbjxoMSB2dHlwZT1cInRleHRcIiBpZD1cInRpdGxlXCIgbmFtZT1cIuS4gOe6p+agh+mimFwiIGNsYXNzPVwidWlsaWItbGV2ZWwxVGl0bGVUZXh0XCI+5LiA57qn5qCH6aKYPC9oMT5cbjxoMiB2dHlwZT1cInRleHRcIiBpZD1cInN1YnRpdGxlXCIgbmFtZT1cIuS6jOe6p+agh+mimFwiIGNsYXNzPVwidWlsaWItbGV2ZWwyVGl0bGVUZXh0XCI+5LqM57qn5qCH6aKYPC9oMj5cbjxwIHZ0eXBlPVwidGV4dFwiIGlkPVwibWFpblRleHRcIiBuYW1lPVwi5Li76KaB5paH5pys5YaF5a65XCIgY2xhc3M9XCJ1aWxpYi1wcmltYXJ5VGV4dFwiPui/meaYr+S4u+imgeaWh+acrOWGheWuuTwvcD5cbjxzcGFuIHZ0eXBlPVwidGV4dFwiIGlkPVwiaW5mb1RleHRcIiBuYW1lPVwi6L6F5Yqp5L+h5oGvXCIgY2xhc3M9XCJ1aWxpYi1pbmZvVGV4dFwiPui/meaYr+i+heWKqeS/oeaBrzwvc3Bhbj5cbjxzbWFsbCB2dHlwZT1cInRleHRcIiBpZD1cImhpbnRUZXh0XCIgbmFtZT1cIuaPkOekuuaWh+acrFwiIGNsYXNzPVwidWlsaWItaGludFRleHRcIj7ov5nmmK/mj5DnpLrmlofmnKw8L3NtYWxsPlxuPHNwYW4gdnR5cGU9XCJ0ZXh0XCIgaWQ9XCJlcnJvclRleHRcIiBuYW1lPVwi6ZSZ6K+v5L+h5oGvXCIgY2xhc3M9XCJ1aWxpYi1lcnJvclRleHRcIj7plJnor6/kv6Hmga88L3NwYW4+XG48c3BhbiB2dHlwZT1cInRleHRcIiBpZD1cIndhcm5pbmdUZXh0XCIgbmFtZT1cIuitpuWRiuS/oeaBr1wiIGNsYXNzPVwidWlsaWItd2FybmluZ1RleHRcIj7orablkYrkv6Hmga88L3NwYW4+XG48c3BhbiB2dHlwZT1cInRleHRcIiBpZD1cInN1Y2Nlc3NUZXh0XCIgbmFtZT1cIuaIkOWKn+S/oeaBr1wiIGNsYXNzPVwidWlsaWItc3VjY2Vzc1RleHRcIj7miJDlip/kv6Hmga88L3NwYW4+XG48YSB2dHlwZT1cInRleHRcIiBpZD1cImxpbmtUZXh0XCIgbmFtZT1cIui/meaYr+S4gOS4qui2hemTvuaOpVwiIGhyZWY9XCIjXCIgY2xhc3M9XCJ1aWxpYi1saW5rVGV4dFwiPui/meaYr+S4gOS4qui2hemTvuaOpTwvYT5cblxcYFxcYFxcYFxuXG4jIyMgMi4g5oyJ6ZKu57uE5Lu2XG4tICoq5qC35byP57G7Kio6IFxcYC51aWxpYi1wcmltYXJ5QnV0dG9uXFxgLCBcXGAudWlsaWItc2Vjb25kYXJ5QnV0dG9uXFxgLCBcXGAudWlsaWItdGV4dEJ1dHRvblxcYCwgXFxgLnVpbGliLWljb25CdXR0b25cXGAsIFxcYC51aWxpYi1wcmltYXJ5SWNvblRleHRCdXR0b25cXGAsIFxcYC51aWxpYi1zZWNvbmRhcnlJY29uVGV4dEJ1dHRvblxcYFxuLSAqKuWwuuWvuOexuyoqOiBcXGAuc21hbGxcXGAsIFxcYC5tZWRpdW1cXGAsIFxcYC5sYXJnZVxcYFxuLSAqKuinhOWImeivtOaYjioqOiDmjInpkq7nu4Tku7bmlK/mjIHlpJrnp43moLflvI/lkozlsLrlr7jvvIzlm77moIfmlofmnKzmjInpkq7pnIDopoHljIXlkKvlm77moIflkozmlofmnKzlhYPntKDjgILmiYDmnInmjInpkq7pg73pnIDopoHphY3lkIjlsLrlr7jnsbvkvb/nlKjjgIJcbi0gKirluIPlsYDor7TmmI4qKu+8mlxcYC51aWxpYi1wcmltYXJ5SWNvblRleHRCdXR0b25cXGDlkoxcXGAudWlsaWItc2Vjb25kYXJ5SWNvblRleHRCdXR0b25cXGDph4zpnaLnmoTlranlrZDoioLngrnkuI3pnIDopoHorr7nva7pl7Tot53jgIHlnZDmoIflsZ7mgKfvvIzlm6DkuLrov5nkupvpl7Tot53lt7Lnu4/lnKhjc3Pmlofku7bph4zorr7nva7lpb3kuobjgIJcbi0gKipIVE1M56S65L6LKio6XG5cXGBcXGBcXGBodG1sXG48YnV0dG9uIHZ0eXBlPVwiYnV0dG9uXCIgaWQ9XCJwcmltYXJ5QnV0dG9uXCIgbmFtZT1cIuS4u+imgeaMiemSrlwiIGNsYXNzPVwidWlsaWItcHJpbWFyeUJ1dHRvbiBtZWRpdW1cIj7kuLvopoHmjInpkq48L2J1dHRvbj5cbjxidXR0b24gdnR5cGU9XCJidXR0b25cIiBpZD1cInNlY29uZGFyeUJ1dHRvblwiIG5hbWU9XCLmrKHopoHmjInpkq5cIiBjbGFzcz1cInVpbGliLXNlY29uZGFyeUJ1dHRvbiBtZWRpdW1cIj7mrKHopoHmjInpkq48L2J1dHRvbj5cbjxidXR0b24gdnR5cGU9XCJidXR0b25cIiBpZD1cInRleHRCdXR0b25cIiBuYW1lPVwi5paH5pys5oyJ6ZKuXCIgY2xhc3M9XCJ1aWxpYi10ZXh0QnV0dG9uIG1lZGl1bVwiPuaWh+acrOaMiemSrjwvYnV0dG9uPlxuPGJ1dHRvbiB2dHlwZT1cImJ1dHRvblwiIGlkPVwiaWNvbkJ1dHRvblwiIG5hbWU9XCLlm77moIfmjInpkq5cIiBjbGFzcz1cInVpbGliLWljb25CdXR0b24gbWVkaXVtXCI+XG4gICAgPGkgdnR5cGU9XCJpY29uXCIgaWQ9XCJoZWFydEljb25cIiBuYW1lPVwi5b+D5b2i5Zu+5qCHXCIgY2xhc3M9XCJmYXMgZmEtaGVhcnRcIj48L2k+XG48L2J1dHRvbj5cbjxidXR0b24gdnR5cGU9XCJidXR0b25cIiBpZD1cInByaW1hcnlJY29uVGV4dEJ1dHRvblwiIG5hbWU9XCLkuLvopoHlm77moIfmlofmnKzmjInpkq5cIiBjbGFzcz1cInVpbGliLXByaW1hcnlJY29uVGV4dEJ1dHRvbiBtZWRpdW1cIj5cbiAgICA8aSB2dHlwZT1cImljb25cIiBpZD1cInBsdXNJY29uXCIgbmFtZT1cIuWKoOWPt+Wbvuagh1wiIGNsYXNzPVwiZmFzIGZhLXBsdXNcIj48L2k+XG4gICAgPHNwYW4gdnR5cGU9XCJ0ZXh0XCIgaWQ9XCJwbHVzVGV4dFwiIG5hbWU9XCLmt7vliqDmlofmnKxcIj7mt7vliqA8L3NwYW4+XG48L2J1dHRvbj5cbjxidXR0b24gdnR5cGU9XCJidXR0b25cIiBpZD1cInNlY29uZGFyeUljb25UZXh0QnV0dG9uXCIgbmFtZT1cIuasoeimgeWbvuagh+aWh+acrOaMiemSrlwiIGNsYXNzPVwidWlsaWItc2Vjb25kYXJ5SWNvblRleHRCdXR0b24gbWVkaXVtXCI+XG4gICAgPGkgdnR5cGU9XCJpY29uXCIgaWQ9XCJ0cmFzaEljb25cIiBuYW1lPVwi5Z6D5Zy+5qG25Zu+5qCHXCIgY2xhc3M9XCJmYXMgZmEtdHJhc2hcIj48L2k+XG4gICAgPHNwYW4gdnR5cGU9XCJ0ZXh0XCIgaWQ9XCJ0cmFzaFRleHRcIiBuYW1lPVwi5Yig6Zmk5paH5pysXCI+5Yig6ZmkPC9zcGFuPlxuPC9idXR0b24+XG48YnV0dG9uIHZ0eXBlPVwiYnV0dG9uXCIgaWQ9XCJzZWNvbmRhcnlJY29uVGV4dEJ1dHRvblwiIG5hbWU9XCLmrKHopoHlm77moIfmlofmnKzmjInpkq5cIiBjbGFzcz1cInVpbGliLXNlY29uZGFyeUljb25UZXh0QnV0dG9uIG1lZGl1bVwiPlxuICAgIDxpIHZ0eXBlPVwiaWNvblwiIGlkPVwidHJhc2hJY29uXCIgbmFtZT1cIuWeg+WcvuahtuWbvuagh1wiIGNsYXNzPVwiZmFzIGZhLXRyYXNoXCI+PC9pPlxuICAgIDxzcGFuIHZ0eXBlPVwidGV4dFwiIGlkPVwidHJhc2hUZXh0XCIgbmFtZT1cIuWIoOmZpOaWh+acrFwiPuWIoOmZpDwvc3Bhbj5cbjwvYnV0dG9uPlxuXFxgXFxgXFxgXG5cbiMjIyAzLiDovpPlhaXmoYbnu4Tku7Zcbi0gKirmoLflvI/nsbsqKjogXFxgLnVpbGliLWlucHV0XFxgXG4tICoq5a655Zmo57G7Kio6IFxcYC51aWxpYi1pbnB1dENvbnRhaW5lclxcYFxuLSAqKuWuueWZqOS/rumlsOexuyoqOiBcXGAuaGFzLWxlZnQtaWNvblxcYCwgXFxgLmhhcy1yaWdodC1pY29uXFxgLCBcXGAuaGFzLWJ1dHRvblxcYFxuLSAqKuWbvuagh+exuyoqOiBcXGAudWlsaWItaW5wdXQtaWNvblxcYFxuLSAqKuWbvuagh+S9jee9ruexuyoqOiBcXGAubGVmdFxcYCwgXFxgLnJpZ2h0XFxgXG4tICoq5oyJ6ZKu57G7Kio6IFxcYC51aWxpYi1pbnB1dC1idXR0b25cXGBcbi0gKirop4TliJnor7TmmI4qKjog6L6T5YWl5qGG57uE5Lu25pSv5oyB5aSa56eN57G75Z6L5ZKM5biD5bGA44CC5L2/55SoXFxgLnVpbGliLWlucHV0Q29udGFpbmVyXFxg5L2c5Li657uf5LiA5a655Zmo77yM6YCa6L+H5L+u6aWw57G75o6n5Yi25Zu+5qCH5ZKM5oyJ6ZKu55qE5L2N572u44CC5pSv5oyB5bem5Zu+5qCH44CB5Y+z5Zu+5qCH44CB5bem5Y+z5Zu+5qCH44CB5Y+z5oyJ6ZKu44CB5bem5Zu+5qCH5Y+z5oyJ6ZKu562J5aSa56eN57uE5ZCI44CC6aqM6K+B56CB6L6T5YWl5qGG6YCa5bi45aSa5Liq57uE5ZCI5L2/55So44CCXG4tICoq5biD5bGA6K+05piOKirvvJpcXGAudWlsaWItaW5wdXRDb250YWluZXJcXGDph4zpnaLnmoTlranlrZDoioLngrnkuI3pnIDopoHorr7nva7pl7Tot53jgIHlnZDmoIflsZ7mgKfvvIzlm6DkuLrov5nkupvpl7Tot53lt7Lnu4/lnKhjc3Pmlofku7bph4zorr7nva7lpb3kuobjgIJcbi0gKipIVE1M56S65L6LKio6XG5cXGBcXGBcXGBodG1sXG48IS0tIOe6r+i+k+WFpeahhiAtLT5cbjxpbnB1dCB2dHlwZT1cImlucHV0XCIgaWQ9XCJ0ZXh0SW5wdXRcIiBuYW1lPVwi5paH5pys6L6T5YWl5qGGXCIgdHlwZT1cInRleHRcIiBjbGFzcz1cInVpbGliLWlucHV0XCIgcGxhY2Vob2xkZXI9XCLor7fovpPlhaXlhoXlrrlcIj5cbjxpbnB1dCB2dHlwZT1cImlucHV0XCIgaWQ9XCJudW1iZXJJbnB1dFwiIG5hbWU9XCLmlbDlrZfovpPlhaXmoYZcIiB0eXBlPVwibnVtYmVyXCIgY2xhc3M9XCJ1aWxpYi1udW1iZXJJbnB1dFwiIHBsYWNlaG9sZGVyPVwi6K+36L6T5YWl5pWw5a2XXCI+XG5cbjwhLS0g5bem5Y+z5bim5Zu+5qCH6L6T5YWl5qGGIC0tPlxuPGRpdiB2dHlwZT1cImNvbnRhaW5lclwiIGlkPVwic2VhcmNoSW5wdXRDb250YWluZXJcIiBuYW1lPVwi5pCc57Si6L6T5YWl5qGG5a655ZmoXCIgY2xhc3M9XCJ1aWxpYi1pbnB1dENvbnRhaW5lciBoYXMtbGVmdC1pY29uIGhhcy1yaWdodC1pY29uXCI+XG4gICAgPGkgdnR5cGU9XCJpY29uXCIgaWQ9XCJzZWFyY2hJY29uXCIgbmFtZT1cIuaQnOe0ouWbvuagh1wiIGNsYXNzPVwiZmFzIGZhLXNlYXJjaCB1aWxpYi1pbnB1dC1pY29uIGxlZnRcIj48L2k+XG4gICAgPGlucHV0IHZ0eXBlPVwiaW5wdXRcIiBpZD1cInNlYXJjaElucHV0XCIgbmFtZT1cIuaQnOe0oui+k+WFpeahhlwiIHR5cGU9XCJ0ZXh0XCIgY2xhc3M9XCJ1aWxpYi1pbnB1dFwiIHBsYWNlaG9sZGVyPVwi5pCc57Si5YaF5a65XCI+XG4gICAgPGkgdnR5cGU9XCJpY29uXCIgaWQ9XCJjbGVhckljb25cIiBuYW1lPVwi5riF6Zmk5Zu+5qCHXCIgY2xhc3M9XCJmYXMgZmEtdGltZXMgdWlsaWItaW5wdXQtaWNvbiByaWdodFwiPjwvaT5cbjwvZGl2PlxuXG48IS0tIOmqjOivgeeggei+k+WFpeahhiAtLT5cbjxkaXYgdnR5cGU9XCJjb250YWluZXJcIiBpZD1cInZlcmlmeUNvZGVDb250YWluZXJcIiBuYW1lPVwi6aqM6K+B56CB6L6T5YWl5qGG5a655ZmoXCIgc3R5bGU9XCJkaXNwbGF5OiBmbGV4OyBnYXA6IDhweDtcIj5cbiAgICA8aW5wdXQgdnR5cGU9XCJpbnB1dFwiIGlkPVwidmVyaWZ5Q29kZUlucHV0MVwiIG5hbWU9XCLpqozor4HnoIHovpPlhaXmoYYxXCIgdHlwZT1cInRleHRcIiBjbGFzcz1cInVpbGliLXZlcmlmeUNvZGVJbnB1dFwiIG1heGxlbmd0aD1cIjFcIj5cbiAgICA8aW5wdXQgdnR5cGU9XCJpbnB1dFwiIGlkPVwidmVyaWZ5Q29kZUlucHV0MlwiIG5hbWU9XCLpqozor4HnoIHovpPlhaXmoYYyXCIgdHlwZT1cInRleHRcIiBjbGFzcz1cInVpbGliLXZlcmlmeUNvZGVJbnB1dFwiIG1heGxlbmd0aD1cIjFcIj5cbiAgICA8aW5wdXQgdnR5cGU9XCJpbnB1dFwiIGlkPVwidmVyaWZ5Q29kZUlucHV0M1wiIG5hbWU9XCLpqozor4HnoIHovpPlhaXmoYYzXCIgdHlwZT1cInRleHRcIiBjbGFzcz1cInVpbGliLXZlcmlmeUNvZGVJbnB1dFwiIG1heGxlbmd0aD1cIjFcIj5cbiAgICA8aW5wdXQgdnR5cGU9XCJpbnB1dFwiIGlkPVwidmVyaWZ5Q29kZUlucHV0NFwiIG5hbWU9XCLpqozor4HnoIHovpPlhaXmoYY0XCIgdHlwZT1cInRleHRcIiBjbGFzcz1cInVpbGliLXZlcmlmeUNvZGVJbnB1dFwiIG1heGxlbmd0aD1cIjFcIj5cbiAgICA8aW5wdXQgdnR5cGU9XCJpbnB1dFwiIGlkPVwidmVyaWZ5Q29kZUlucHV0NVwiIG5hbWU9XCLpqozor4HnoIHovpPlhaXmoYY1XCIgdHlwZT1cInRleHRcIiBjbGFzcz1cInVpbGliLXZlcmlmeUNvZGVJbnB1dFwiIG1heGxlbmd0aD1cIjFcIj5cbiAgICA8aW5wdXQgdnR5cGU9XCJpbnB1dFwiIGlkPVwidmVyaWZ5Q29kZUlucHV0NlwiIG5hbWU9XCLpqozor4HnoIHovpPlhaXmoYY2XCIgdHlwZT1cInRleHRcIiBjbGFzcz1cInVpbGliLXZlcmlmeUNvZGVJbnB1dFwiIG1heGxlbmd0aD1cIjFcIj5cbjwvZGl2PlxuXFxgXFxgXFxgXG5cbiMjIyA0LiDmoIfpopjmoI/nu4Tku7Zcbi0gKirmoLflvI/nsbsqKjogXFxgLnVpbGliLXNlY29uZFBhZ2VUaXRsZUJhclxcYFxuLSAqKuinhOWImeivtOaYjioqOiDkuoznuqfpobXpnaLnmoTmoIfpopjmoI/vvIzpgJrluLjljIXlkKvov5Tlm57mjInpkq7jgIHmoIfpopjmlofmnKzlkozmk43kvZzmjInpkq7vvIzmk43kvZzmjInpkq7mmK/lj6/pgInnmoTvvIzlubbkuJTlv4XpobvmlL7lnKjmoIfpopjmoI/nmoTlj7PovrnjgIJcbi0gKipIVE1M56S65L6LKio6XG5cXGBcXGBcXGBodG1sXG48ZGl2IHZ0eXBlPVwidGl0bGVCYXJcIiBpZD1cInRpdGxlQmFyXCIgbmFtZT1cIuagh+mimOagj1wiIGNsYXNzPVwidWlsaWItc2Vjb25kUGFnZVRpdGxlQmFyXCI+XG4gICAgPGJ1dHRvbiB2dHlwZT1cImJ1dHRvblwiIGlkPVwiYmFja0J1dHRvblwiIG5hbWU9XCLov5Tlm57mjInpkq5cIiBjbGFzcz1cInVpbGliLWljb25CdXR0b24gc21hbGxcIj5cbiAgICAgICAgPGkgdnR5cGU9XCJpY29uXCIgaWQ9XCJiYWNrSWNvblwiIG5hbWU9XCLov5Tlm57lm77moIdcIiBjbGFzcz1cImZhcyBmYS1hcnJvdy1sZWZ0XCI+PC9pPlxuICAgIDwvYnV0dG9uPlxuICAgIDxzcGFuIHZ0eXBlPVwidGV4dFwiIGlkPVwidGl0bGVUZXh0XCIgbmFtZT1cIumhtemdouagh+mimFwiIGNsYXNzPVwidWlsaWItbGV2ZWwyVGl0bGVUZXh0XCI+6aG16Z2i5qCH6aKYPC9zcGFuPlxuPC9kaXY+XG5cXGBcXGBcXGBcblxuIyMjIDUuIOWbvueJh+e7hOS7tlxuLSAqKuagt+W8j+exuyoqOiBcXGAudWlsaWItaW1hZ2VcXGAsIFxcYC51aWxpYi1zbWFsbExvZ29JbWFnZVxcYCwgXFxgLnVpbGliLW1lZGl1bUxvZ29JbWFnZVxcYCwgXFxgLnVpbGliLWxhcmdlTG9nb0ltYWdlXFxgLCBcXGAudWlsaWItYXZhdGFySW1hZ2VcXGBcbi0gKirop4TliJnor7TmmI4qKjog5Zu+54mH57uE5Lu25o+Q5L6b5LiN5ZCM55So6YCU5ZKM5bC65a+455qE5Zu+54mH5qC35byP77yM5YyF5ous6YCa55So5Zu+54mH44CB5LiN5ZCM5bC65a+455qETG9nb+WSjOWktOWDj+WbvueJh+OAglxuLSAqKkhUTUznpLrkvosqKjpcblxcYFxcYFxcYGh0bWxcbjxpbWcgdnR5cGU9XCJpbWFnZVwiIGlkPVwiaW1hZ2UxXCIgbmFtZT1cIuWbvueJhzFcIiBzcmM9XCJ4eHhcIiBhbHQ9XCLlm77niYdcIiBjbGFzcz1cInVpbGliLWltYWdlXCI+XG48aW1nIHZ0eXBlPVwiaW1hZ2VcIiBpZD1cImxvZ29JbWFnZVwiIG5hbWU9XCJMb2dv5Zu+54mHXCIgc3JjPVwieHh4XCIgYWx0PVwiTG9nb1wiIGNsYXNzPVwidWlsaWItbWVkaXVtTG9nb0ltYWdlXCI+XG48aW1nIHZ0eXBlPVwiaW1hZ2VcIiBpZD1cImF2YXRhckltYWdlXCIgbmFtZT1cIuWktOWDj+WbvueJh1wiIHNyYz1cInh4eFwiIGFsdD1cIuWktOWDj1wiIGNsYXNzPVwidWlsaWItYXZhdGFySW1hZ2VcIj5cblxcYFxcYFxcYFxuXG4jIyMgNi4g5byA5YWz57uE5Lu2XG4tICoq5qC35byP57G7Kio6IFxcYC51aWxpYi1pY29uU3dpdGNoXFxgLCBcXGAudWlsaWItc2xpZGVyU3dpdGNoXFxgXG4tICoq54q25oCB57G7Kio6IFxcYC5hY3RpdmVcXGBcbi0gKirop4TliJnor7TmmI4qKjog5byA5YWz57uE5Lu25pSv5oyB5Zu+5qCH5byA5YWz5ZKM5ruR5Z2X5byA5YWz5Lik56eN5qC35byP77yM6YCa6L+H5re75Yqg5oiW56e76ZmkXFxgLmFjdGl2ZVxcYOexu+adpeaOp+WItuW8gOWFs+eKtuaAgeOAglxuLSAqKkhUTUznpLrkvosqKjpcblxcYFxcYFxcYGh0bWxcbjxkaXYgdnR5cGU9XCJzd2l0Y2hcIiBpZD1cImljb25Td2l0Y2hcIiBuYW1lPVwi5Zu+5qCH5byA5YWzXCIgY2xhc3M9XCJ1aWxpYi1pY29uU3dpdGNoXCI+XG4gICAgPGkgdnR5cGU9XCJpY29uXCIgaWQ9XCJpY29uU3dpdGNoSWNvblwiIG5hbWU9XCLlm77moIflvIDlhbPlm77moIdcIiBjbGFzcz1cImZhcyBmYS1oZWFydFwiPjwvaT5cbjwvZGl2PlxuPGRpdiB2dHlwZT1cInN3aXRjaFwiIGlkPVwic2xpZGVyU3dpdGNoXCIgbmFtZT1cIua7keWdl+W8gOWFs1wiIGNsYXNzPVwidWlsaWItc2xpZGVyU3dpdGNoXCI+XG4gICAgPGRpdiB2dHlwZT1cInNsaWRlclwiIGlkPVwic2xpZGVyU3dpdGNoU2xpZGVyXCIgbmFtZT1cIua7keWdl+W8gOWFs+a7keWdl1wiIGNsYXNzPVwic2xpZGVyXCI+PC9kaXY+XG48L2Rpdj5cblxcYFxcYFxcYFxuXG4jIyMgNy4g5Y2V6YCJ5ZKM5aSa6YCJ57uE5Lu2XG4tICoq5a655Zmo57G7Kio6IFxcYC51aWxpYi1yYWRpby1ncm91cFxcYOOAgVxcYC51aWxpYi1jaGVja2JveC1ncm91cFxcYFxuLSAqKuagt+W8j+exuyoqOiBcXGAudWlsaWItaWNvblJhZGlvXFxgLCBcXGAudWlsaWItaWNvblRleHRSYWRpb1xcYCwgXFxgLnVpbGliLWljb25DaGVja2JveFxcYCwgXFxgLnVpbGliLWljb25UZXh0Q2hlY2tib3hcXGBcbi0gKirnirbmgIHnsbsqKjogXFxgLmNoZWNrZWRcXGBcbi0gKirlrZDlhYPntKDnsbsqKjogXFxgLnVpbGliLXJhZGlvLWljb25cXGAsIFxcYC51aWxpYi1jaGVja2JveC1pY29uXFxgLCBcXGAudWlsaWItcHJpbWFyeVRleHRcXGBcbi0gKirop4TliJnor7TmmI4qKjog5Y2V6YCJ5ZKM5aSa6YCJ57uE5Lu25pSv5oyB57qv5Zu+5qCH5ZKM5Zu+5qCH5paH5pys5Lik56eN5b2i5byP77yM6YCa6L+HXFxgLmNoZWNrZWRcXGDnsbvmjqfliLbpgInkuK3nirbmgIHvvIzlpJrpgInmoYblj6/kvb/nlKjlrrnlmajnsbvnu4TlkIjjgIJcbi0gKipIVE1M56S65L6LKio6XG5cXGBcXGBcXGBodG1sXG48ZGl2IHZ0eXBlPVwicmFkaW9Hcm91cFwiIGlkPVwicmFkaW9Hcm91cFwiIG5hbWU9XCLljZXpgInmoYbnu4RcIiBjbGFzcz1cInVpbGliLXJhZGlvLWdyb3VwXCI+XG4gICAgPGRpdiB2dHlwZT1cInJhZGlvXCIgaWQ9XCJpY29uVGV4dFJhZGlvMVwiIG5hbWU9XCLlm77moIfmlofmnKzljZXpgInpobkxXCIgY2xhc3M9XCJ1aWxpYi1pY29uVGV4dFJhZGlvXCI+XG4gICAgICAgIDxpIHZ0eXBlPVwiaWNvblwiIGlkPVwiaWNvblRleHRSYWRpb0ljb24xXCIgbmFtZT1cIuWbvuagh+aWh+acrOWNlemAiemhueWbvuaghzFcIiBjbGFzcz1cInVpbGliLXJhZGlvLWljb24gZmFzIGZhLWNpcmNsZVwiPjwvaT5cbiAgICAgICAgPHNwYW4gdnR5cGU9XCJ0ZXh0XCIgaWQ9XCJpY29uVGV4dFJhZGlvVGV4dDFcIiBuYW1lPVwi5Zu+5qCH5paH5pys5Y2V6YCJ6aG55paH5pysMVwiIGNsYXNzPVwicmFkaW8tdGV4dFwiPumAiemhuTE8L3NwYW4+XG4gICAgPC9kaXY+XG4gICAgPGRpdiB2dHlwZT1cInJhZGlvXCIgaWQ9XCJpY29uVGV4dFJhZGlvMlwiIG5hbWU9XCLlm77moIfmlofmnKzljZXpgInpobkyXCIgY2xhc3M9XCJ1aWxpYi1pY29uVGV4dFJhZGlvXCI+XG4gICAgICAgIDxpIHZ0eXBlPVwiaWNvblwiIGlkPVwiaWNvblRleHRSYWRpb0ljb24yXCIgbmFtZT1cIuWbvuagh+aWh+acrOWNlemAiemhueWbvuaghzJcIiBjbGFzcz1cInVpbGliLXJhZGlvLWljb24gZmFzIGZhLWNpcmNsZVwiPjwvaT5cbiAgICAgICAgPHNwYW4gdnR5cGU9XCJ0ZXh0XCIgaWQ9XCJpY29uVGV4dFJhZGlvVGV4dDJcIiBuYW1lPVwi5Zu+5qCH5paH5pys5Y2V6YCJ6aG55paH5pysMlwiIGNsYXNzPVwicmFkaW8tdGV4dFwiPumAiemhuTI8L3NwYW4+XG4gICAgPC9kaXY+XG48L2Rpdj5cbjxkaXYgdnR5cGU9XCJjaGVja0JveEdyb3VwXCIgaWQ9XCJjaGVja2JveEdyb3VwXCIgbmFtZT1cIuWkmumAieahhue7hFwiIGNsYXNzPVwidWlsaWItY2hlY2tib3gtZ3JvdXBcIj5cbiAgICA8ZGl2IHZ0eXBlPVwiY2hlY2tCb3hcIiBpZD1cImljb25UZXh0Q2hlY2tib3gxXCIgbmFtZT1cIuWbvuagh+aWh+acrOWkmumAiemAiemhuTFcIiBjbGFzcz1cInVpbGliLWljb25UZXh0Q2hlY2tib3hcIj5cbiAgICAgICAgPGkgdnR5cGU9XCJpY29uXCIgaWQ9XCJpY29uVGV4dENoZWNrYm94SWNvbjFcIiBuYW1lPVwi5Zu+5qCH5paH5pys5aSa6YCJ6YCJ6aG55Zu+5qCHMVwiIGNsYXNzPVwidWlsaWItY2hlY2tib3gtaWNvbiBmYXMgZmEtc3F1YXJlXCI+PC9pPlxuICAgICAgICA8c3BhbiB2dHlwZT1cInRleHRcIiBpZD1cImljb25UZXh0Q2hlY2tib3hUZXh0MVwiIG5hbWU9XCLlm77moIfmlofmnKzlpJrpgInpgInpobnmlofmnKwxXCIgY2xhc3M9XCJ1aWxpYi1wcmltYXJ5VGV4dFwiPumAiemhuTE8L3NwYW4+XG4gICAgPC9kaXY+XG4gICAgPGRpdiB2dHlwZT1cImNoZWNrQm94XCIgaWQ9XCJpY29uVGV4dENoZWNrYm94MlwiIG5hbWU9XCLlm77moIfmlofmnKzlpJrpgInpgInpobkyXCIgY2xhc3M9XCJ1aWxpYi1pY29uVGV4dENoZWNrYm94XCI+XG4gICAgICAgIDxpIHZ0eXBlPVwiaWNvblwiIGlkPVwiaWNvblRleHRDaGVja2JveEljb24yXCIgbmFtZT1cIuWbvuagh+aWh+acrOWkmumAiemAiemhueWbvuaghzJcIiBjbGFzcz1cInVpbGliLWNoZWNrYm94LWljb24gZmFzIGZhLXNxdWFyZVwiPjwvaT5cbiAgICAgICAgPHNwYW4gdnR5cGU9XCJ0ZXh0XCIgaWQ9XCJpY29uVGV4dENoZWNrYm94VGV4dDJcIiBuYW1lPVwi5Zu+5qCH5paH5pys5aSa6YCJ6YCJ6aG55paH5pysMlwiIGNsYXNzPVwidWlsaWItcHJpbWFyeVRleHRcIj7pgInpobkyPC9zcGFuPlxuICAgIDwvZGl2PlxuPC9kaXY+XG5cXGBcXGBcXGBcblxuIyMjIDguIOWIl+ihqOe7hOS7tlxuLSAqKuWuueWZqOexuyoqOiBcXGAudWlsaWItdmVydGljYWxMaXN0Q29udGFpbmVyXFxg44CBXFxgLnVpbGliLWhvcml6b250YWxMaXN0Q29udGFpbmVyXFxgXG4tICoq5a2Q5YWD57Sg57G7Kio6IFxcYC51aWxpYi14eHhMaXN0Q2FyZFxcYFxuLSAqKuinhOWImeivtOaYjioqOiDliJfooajlrrnlmajkvb/nlKggXFxgLnVpbGliLXZlcnRpY2FsTGlzdENvbnRhaW5lclxcYOOAgVxcYC51aWxpYi1ob3Jpem9udGFsTGlzdENvbnRhaW5lclxcYOexu+agh+ivhu+8jOS4gOS4quWIl+ihqOWuueWZqOWMheWQq07kuKpcXGAudWlsaWIteHh4TGlzdENhcmRcXGDliJfooajljaHniYfvvIzpnIDopoHlnKhcXGAuYnl0ZWZ1bi91aWxpYi1jb21wb25lbnRzLmNzc1xcYOS4reaJvuWIsOato+ehrueahFxcYC51aWxpYi14eHhMaXN0Q2FyZFxcYOexu+agt+W8j+OAglxuLSAqKkhUTUznpLrkvosqKjpcblxcYFxcYFxcYGh0bWxcbjxkaXYgdnR5cGU9XCJ2ZXJ0aWNhbExpc3RWaWV3XCIgaWQ9XCJ2ZXJ0aWNhbExpc3RDb250YWluZXJcIiBuYW1lPVwi5Z6C55u05YiX6KGo5a655ZmoXCIgY2xhc3M9XCJ1aWxpYi12ZXJ0aWNhbExpc3RDb250YWluZXJcIj5cbiAgICA8ZGl2IHZ0eXBlPVwibGlzdEl0ZW1DYXJkXCIgaWQ9XCJ2ZXJ0aWNhbExpc3RDYXJkMVwiIG5hbWU9XCLlnoLnm7TliJfooajljaHniYcxXCIgY2xhc3M9XCJ1aWxpYi14eHhMaXN0Q2FyZFwiPlxuICAgICAgICB4eHjvvIjlhbfkvZPljaHniYfnmoTlhoXlrrnlranlrZDlhYPntKDoioLngrnvvIlcbiAgICA8L2Rpdj5cbiAgICA8ZGl2IHZ0eXBlPVwibGlzdEl0ZW1DYXJkXCIgaWQ9XCJ2ZXJ0aWNhbExpc3RDYXJkMlwiIG5hbWU9XCLlnoLnm7TliJfooajljaHniYcyXCIgY2xhc3M9XCJ1aWxpYi14eHhMaXN0Q2FyZFwiPlxuICAgICAgICB4eHjvvIjlhbfkvZPljaHniYfnmoTlhoXlrrnlranlrZDlhYPntKDoioLngrnvvIlcbiAgICA8L2Rpdj5cbjwvZGl2PlxuPGRpdiB2dHlwZT1cImhvcml6b250YWxMaXN0Vmlld1wiIGlkPVwiaG9yaXpvbnRhbExpc3RDb250YWluZXJcIiBuYW1lPVwi5rC05bmz5YiX6KGo5a655ZmoXCIgY2xhc3M9XCJ1aWxpYi1ob3Jpem9udGFsTGlzdENvbnRhaW5lclwiPlxuICAgIDxkaXYgdnR5cGU9XCJsaXN0SXRlbUNhcmRcIiBpZD1cImhvcml6b250YWxMaXN0Q2FyZDFcIiBuYW1lPVwi5rC05bmz5YiX6KGo5Y2h54mHMVwiIGNsYXNzPVwidWlsaWIteHh4TGlzdENhcmRcIj5cbiAgICAgICAgeHh477yI5YW35L2T5Y2h54mH55qE5YaF5a655a2p5a2Q5YWD57Sg6IqC54K577yJXG4gICAgPC9kaXY+XG4gICAgPGRpdiB2dHlwZT1cImxpc3RJdGVtQ2FyZFwiIGlkPVwiaG9yaXpvbnRhbExpc3RDYXJkMlwiIG5hbWU9XCLmsLTlubPliJfooajljaHniYcyXCIgY2xhc3M9XCJ1aWxpYi14eHhMaXN0Q2FyZFwiPlxuICAgICAgICB4eHjvvIjlhbfkvZPljaHniYfnmoTlhoXlrrnlranlrZDlhYPntKDoioLngrnvvIlcbiAgICA8L2Rpdj5cbjwvZGl2PlxuXFxgXFxgXFxgXG5cbiMjIyA5LiDova7mkq3nu4Tku7Zcbi0gKirlrrnlmajnsbsqKjogXFxgLnVpbGliLXZpZXdQYWdlckNvbnRlbnRcXGDjgIFcXGAudWlsaWItdmlld1BhZ2VySW5kaWNhdG9yXFxgXG4tICoq5a2Q5YWD57Sg57G7Kio6IFxcYC51aWxpYi14eHhWaWV3UGFnZXJJdGVtQ2FyZFxcYOOAgVxcYC51aWxpYi12aWV3UGFnZXJJbmRpY2F0b3JDaXJjbGVJdGVtXFxgXG4tICoq54q25oCB57G7Kio6IFxcYC5hY3RpdmVcXGBcbi0gKirop4TliJnor7TmmI4qKjog6L2u5pKt5YaF5a655a655Zmo5L2/55SoXFxgLnVpbGliLXZpZXdQYWdlckNvbnRlbnRcXGDnsbvmoIfor4bvvIzova7mkq3mjIfnpLrlmajlrrnlmajkvb/nlKhcXGAudWlsaWItdmlld1BhZ2VySW5kaWNhdG9yXFxg57G75qCH6K+G77yM5LiA5Liq6L2u5pKt5YaF5a655a655Zmo5YyF5ZCrTuS4qlxcYC51aWxpYi14eHhWaWV3UGFnZXJJdGVtQ2FyZFxcYOi9ruaSreWNoeeJh++8jOS4gOS4qui9ruaSreaMh+ekuuWZqOWuueWZqOWMheWQq07kuKpcXGAudWlsaWItdmlld1BhZ2VySW5kaWNhdG9yQ2lyY2xlSXRlbVxcYOaMh+ekuuWZqOmhue+8jOi9ruaSreWGheWuueWuueWZqOS4jui9ruaSreaMh+ekuuWZqOWuueWZqOaYr+WFhOW8n+iKgueCue+8jOWtkOWFg+e0oOmAmui/h1xcYC5hY3RpdmVcXGDnsbvmoIfor4blvZPliY3mv4DmtLvnmoTpobnvvIzpnIDopoHlnKhcXGAuYnl0ZWZ1bi91aWxpYi1jb21wb25lbnRzLmNzc1xcYOS4reaJvuWIsOato+ehrueahFxcYC51aWxpYi14eHhWaWV3UGFnZXJJdGVtQ2FyZFxcYOexu+agt+W8j+OAglxuLSAqKkhUTUznpLrkvosqKjpcblxcYFxcYFxcYGh0bWxcbjxkaXYgdnR5cGU9XCJ2aWV3UGFnZXJcIiBpZD1cInZpZXdQYWdlckNvbnRlbnRcIiBuYW1lPVwi6L2u5pKt5YaF5a655a655ZmoXCIgY2xhc3M9XCJ1aWxpYi12aWV3UGFnZXJDb250ZW50XCI+XG4gICAgPGRpdiB2dHlwZT1cIm9uZVZpZXdQYWdlckNvbnRlbnRcIiBpZD1cInZpZXdQYWdlckl0ZW0xXCIgbmFtZT1cIui9ruaSreWNoeeJhzFcIiBjbGFzcz1cInVpbGliLXh4eFZpZXdQYWdlckl0ZW1DYXJkIGFjdGl2ZVwiPjwvZGl2PlxuICAgIDxkaXYgdnR5cGU9XCJvbmVWaWV3UGFnZXJDb250ZW50XCIgaWQ9XCJ2aWV3UGFnZXJJdGVtMlwiIG5hbWU9XCLova7mkq3ljaHniYcyXCIgY2xhc3M9XCJ1aWxpYi14eHhWaWV3UGFnZXJJdGVtQ2FyZFwiPjwvZGl2PlxuICAgIDxkaXYgdnR5cGU9XCJvbmVWaWV3UGFnZXJDb250ZW50XCIgaWQ9XCJ2aWV3UGFnZXJJdGVtM1wiIG5hbWU9XCLova7mkq3ljaHniYczXCIgY2xhc3M9XCJ1aWxpYi14eHhWaWV3UGFnZXJJdGVtQ2FyZFwiPjwvZGl2PlxuPC9kaXY+XG48ZGl2IHZ0eXBlPVwiYm90dG9tVGFiTmF2aWdhdGVCYXJcIiBpZD1cInZpZXdQYWdlckluZGljYXRvclwiIG5hbWU9XCLova7mkq3mjIfnpLrlmajlrrnlmahcIiBjbGFzcz1cInVpbGliLXZpZXdQYWdlckluZGljYXRvclwiPlxuICAgIDxkaXYgdnR5cGU9XCJib3R0b21UYWJOYXZpZ2F0ZUJhckl0ZW1cIiBpZD1cInZpZXdQYWdlckluZGljYXRvckNpcmNsZUl0ZW0xXCIgbmFtZT1cIui9ruaSreaMh+ekuuWZqOmhuTFcIiBjbGFzcz1cInVpbGliLXZpZXdQYWdlckluZGljYXRvckNpcmNsZUl0ZW0gYWN0aXZlXCI+PC9kaXY+XG4gICAgPGRpdiB2dHlwZT1cImJvdHRvbVRhYk5hdmlnYXRlQmFySXRlbVwiIGlkPVwidmlld1BhZ2VySW5kaWNhdG9yQ2lyY2xlSXRlbTJcIiBuYW1lPVwi6L2u5pKt5oyH56S65Zmo6aG5MlwiIGNsYXNzPVwidWlsaWItdmlld1BhZ2VySW5kaWNhdG9yQ2lyY2xlSXRlbVwiPjwvZGl2PlxuICAgIDxkaXYgdnR5cGU9XCJib3R0b21UYWJOYXZpZ2F0ZUJhckl0ZW1cIiBpZD1cInZpZXdQYWdlckluZGljYXRvckNpcmNsZUl0ZW0zXCIgbmFtZT1cIui9ruaSreaMh+ekuuWZqOmhuTNcIiBjbGFzcz1cInVpbGliLXZpZXdQYWdlckluZGljYXRvckNpcmNsZUl0ZW1cIj48L2Rpdj5cbjwvZGl2PlxuXFxgXFxgXFxgXG5cbiMjIyAxMC4gVGFi57uE5Lu2XG4tICoq5qC35byP57G7Kio6IFxcYC51aWxpYi11bmRlcmxpbmVUYWJNZW51QmFySXRlbVxcYCwgXFxgLnVpbGliLXNsaWRlclRhYk1lbnVCYXJJdGVtXFxgXG4tICoq54q25oCB57G7Kio6IFxcYC5hY3RpdmVcXGBcbi0gKirlrZDlhYPntKDnsbsqKjogXFxgLnVpbGliLXRhYi10ZXh0XFxgLCBcXGAudWlsaWItdGFiLWxpbmVcXGBcbi0gKirop4TliJnor7TmmI4qKjogVGFi57uE5Lu25pSv5oyB5LiL5YiS57q/5ZKM5ruR5Z2X5Lik56eN5qC35byP77yM6YCa6L+HXFxgLmFjdGl2ZVxcYOexu+agh+ivhuW9k+WJjea/gOa0u+eahFRhYumhueOAglxuLSAqKkhUTUznpLrkvosqKjpcblxcYFxcYFxcYGh0bWxcbjxkaXYgdnR5cGU9XCJ0YWJNZW51QmFyXCIgaWQ9XCJ1bmRlcmxpbmVUYWJNZW51QmFyXCIgbmFtZT1cIuS4i+WIkue6v1RhYuiPnOWNleagj1wiIGNsYXNzPVwidWlsaWItdW5kZXJsaW5lVGFiTWVudUJhclwiPlxuICAgIDxkaXYgdnR5cGU9XCJ0YWJNZW51QmFySXRlbVwiIGlkPVwidW5kZXJsaW5lVGFiTWVudUJhckl0ZW0xXCIgbmFtZT1cIuS4i+WIkue6v1RhYumhuTFcIiBjbGFzcz1cInVpbGliLXVuZGVybGluZVRhYk1lbnVCYXJJdGVtIGFjdGl2ZVwiPlxuICAgICAgICA8c3BhbiB2dHlwZT1cInRleHRcIiBpZD1cInVuZGVybGluZVRhYk1lbnVCYXJJdGVtMVRleHRcIiBuYW1lPVwi5LiL5YiS57q/VGFi6aG5MeaWh+acrFwiIGNsYXNzPVwidWlsaWItdGFiLXRleHRcIj7pppbpobU8L3NwYW4+XG4gICAgICAgIDxkaXYgdnR5cGU9XCJsaW5lXCIgaWQ9XCJ1bmRlcmxpbmVUYWJNZW51QmFySXRlbTFMaW5lXCIgbmFtZT1cIuS4i+WIkue6v1RhYumhuTHkuIvliJLnur9cIiBjbGFzcz1cInVpbGliLXRhYi1saW5lXCI+PC9kaXY+XG4gICAgPC9kaXY+XG48L2Rpdj5cbjxkaXYgdnR5cGU9XCJ0YWJNZW51QmFyXCIgaWQ9XCJzbGlkZXJUYWJNZW51QmFyXCIgbmFtZT1cIua7keWdl1RhYuiPnOWNleagj1wiIGNsYXNzPVwidWlsaWItc2xpZGVyVGFiTWVudUJhclwiPlxuICAgIDxkaXYgdnR5cGU9XCJ0YWJNZW51QmFySXRlbVwiIGlkPVwic2xpZGVyVGFiTWVudUJhckl0ZW0xXCIgbmFtZT1cIua7keWdl1RhYumhuTFcIiBjbGFzcz1cInVpbGliLXNsaWRlclRhYk1lbnVCYXJJdGVtIGFjdGl2ZVwiPlxuICAgICAgICA8c3BhbiB2dHlwZT1cInRleHRcIiBpZD1cInNsaWRlclRhYk1lbnVCYXJJdGVtMVRleHRcIiBuYW1lPVwi5ruR5Z2XVGFi6aG5MeaWh+acrFwiIGNsYXNzPVwidWlsaWItdGFiLXRleHRcIj7mjqjojZA8L3NwYW4+XG4gICAgPC9kaXY+XG48L2Rpdj5cblxcYFxcYFxcYFxuXG4jIyMgMTEuIGRpYWxvZ+e7hOS7tlxuLSAqKuagt+W8j+exuyoqOiBcXGAudWlsaWItZGlhbG9nXFxgXG4tICoq5a2Q5YWD57Sg57G7Kio6IFxcYC51aWxpYi1kaWFsb2dUaXRsZUNvbnRhaW5lclxcYCwgXFxgLnVpbGliLWRpYWxvZ0NvbnRlbnRDb250YWluZXJcXGAsIFxcYC51aWxpYi1kaWFsb2ctYWN0aW9uc1xcYFxuLSAqKuinhOWImeivtOaYjioqOiBkaWFsb2fnu4Tku7bnlKjkuo7mmL7npLrlvLnnqpfmiJbnoa7orqTlr7nor53moYbvvIzliIbkuLrmnInmoIfpopjlkozml6DmoIfpopjkuKTnp43nsbvlnovjgILmnInmoIfpopjnmoRkaWFsb2fkvb/nlKhcXGAudWlsaWItZGlhbG9nVGl0bGVDb250YWluZXJcXGDljIXlkKvmoIfpopjlhoXlrrnvvIzml6DmoIfpopjnmoRkaWFsb2fnm7TmjqXkvb/nlKhcXGAudWlsaWItZGlh