/* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* ---start:修改全局message样式---*/ .ant-message { z-index: 10000; } .ant-message-notice-content { padding: 0; border-radius: 42px; } .ant-message-custom-content { padding: 12px 16px 12px 12px; border-radius: 100px; color: #000000; font-size: 14px; line-height: 20px; display: flex; align-items: center; } .ant-message-custom-content svg { font-size: 20px; margin-top: -2px; } .ant-message-success { background-color: #e5fff2; } .ant-message-error { background-color: #fff1f0; } .ant-message-warning { background-color: #fff7e1; } .ant-message-loading { background-color: #e0f5ff; } /* ---end:修改全局message样式--- */ .anticon[tabindex] { cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* 下拉框select start */ .ant-select:not(.ant-select-customize-input) { background-color: #ffffff; color: #5e6b81; border: 1px solid #e8efff; border-radius: 4px; } .ant-select:not(.ant-select-customize-input):hover { border: 1px solid #a7b3ff; } .ant-select:not(.ant-select-customize-input):active { border: 1px solid #a7b3ff; } .ant-select:not(.ant-select-customize-input).ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) { border: 1px solid var(--theme-primary); } .ant-select:not(.ant-select-customize-input) .ant-select-selector { z-index: 1; border: none; background-color: transparent; box-shadow: none !important; } .ant-select:not(.ant-select-customize-input).ant-select-open .ant-select-selection-item { color: #5e6b81; } .ant-select:not(.ant-select-customize-input) .ant-select-arrow { top: 48%; opacity: 0.6; } .ant-select:not(.ant-select-customize-input) .ant-select-arrow svg { font-size: 14px; color: #5e6b81; } .ant-select-dropdown { padding: 8px; background-color: #ffffff; border: 1px solid #e8efff; box-shadow: 0px 8px 24px -4px rgba(27, 46, 94, 0.08); border-radius: 4px; } .ant-select-dropdown .ant-select-item { padding-left: 8px; background-color: #ffffff; color: #5e6b81; border-radius: 4px; } .ant-select-dropdown .ant-select-item.ant-select-item-option-active { background-color: #edeff5; } .ant-select-dropdown .ant-select-item.ant-select-item-option-selected { background-color: rgba(106, 127, 255, 0.08); font-weight: normal; color: var(--theme-primary); } .ant-select-dropdown .ant-select-item:last-child { margin-bottom: 0; } /* 下拉框select end */ /* 抽屉样式 start */ .ant-drawer-left.ant-drawer-open, .ant-drawer-right.ant-drawer-open { transition: transform 0.3s linear; } .ant-drawer { z-index: 1050; } /* 抽屉样式 end */ :root { --page-width: 100vw; --page-height: 100vh; --theme-primary: #6a7fff; --theme-dark: #5065e5; --selector-sprite-bg_primary: #d7e1ff; --menu-bar-bg-color: #6a7fff; --menu-bar-height: 44px; --stage-width: 360px; --stage-height: 270px; } [ide-theme='ide_jr'] { --page-width: 100vw; --page-height: 100vh; --theme-primary: #019ef6; --theme-dark: #019ef6; --selector-sprite-bg_primary: #e3eeff; --menu-bar-bg-color: #29cdff; --menu-bar-height: 3.75rem; --block-category-menu-width: 4.25rem; /* 276px / 376px */ --keyboard-bg-width: 376px; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .custom__flex-center__4HPWh { display: flex; align-items: center; justify-content: center; } .custom__full-filled__1Nzo7 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .custom__modal-mask__3GD82 { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .custom__modal-mask__3GD82 .custom__modal-wrap__1kspx { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .custom__modal-mask__3GD82 .custom__modal-wrap__1kspx .custom__modal-header-wrap__3xea8 { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .custom__modal-mask__3GD82 .custom__modal-wrap__1kspx .custom__modal-header-wrap__3xea8 .custom__modal-header-bg__2Z65H { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .custom__modal-mask__3GD82 .custom__modal-wrap__1kspx .custom__modal-header-wrap__3xea8 .custom__modal-header-label__1Wggp { flex-shrink: 0; font-size: 16px; font-weight: bold; } .custom__modal-mask__3GD82 .custom__modal-wrap__1kspx .custom__modal-header-wrap__3xea8 .custom__modal-header-close__1LW02 { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom__modal-mask__3GD82 .custom__modal-wrap__1kspx .custom__modal-header-wrap__3xea8 .custom__modal-header-close__1LW02:hover { color: #98a2b4; } .custom__modal-mask__3GD82 .custom__modal-wrap__1kspx .custom__modal-body-wrap__1FnVu { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .custom__modal-mask__3GD82 .custom__modal-wrap__1kspx .custom__modal-footer-wrap__2htKT { flex-shrink: 0; display: flex; } .custom__modal-header__1HIE4 { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .custom__modal-header__1HIE4 .custom__modal-header-upload__24MBk { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .custom__modal-header__1HIE4 .custom__modal-header-upload__24MBk:hover { background-color: #e0e9ff; } .custom__modal-header__1HIE4 .custom__modal-header-upload__24MBk:active { background-color: #ccdaff; } .custom__modal-header__1HIE4 .custom__modal-header-upload__24MBk .custom__upload-img__30a7_ { font-size: 16px; margin-right: calc(2px); } .custom__modal-header__1HIE4 .custom__modal-header-upload__24MBk .custom__upload-label__2VpAl { font-size: 14px; } .custom__modal-header__1HIE4 .custom__modal-header-upload__24MBk .custom__upload-input__26d08 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom__modal-header__1HIE4 .custom__modal-header-search__1QwG2 { position: relative; } .custom__modal-header__1HIE4 .custom__modal-header-search__1QwG2 .custom__search-input__tYAKJ { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .custom__modal-header__1HIE4 .custom__modal-header-search__1QwG2 .custom__search-input__tYAKJ::-webkit-input-placeholder { color: #98a2b4; } .custom__modal-header__1HIE4 .custom__modal-header-search__1QwG2 .custom__search-input__tYAKJ::-moz-placeholder { color: #98a2b4; } .custom__modal-header__1HIE4 .custom__modal-header-search__1QwG2 .custom__search-input__tYAKJ:-ms-input-placeholder { color: #98a2b4; } .custom__modal-header__1HIE4 .custom__modal-header-search__1QwG2 .custom__search-input__tYAKJ:hover { border-color: #d1d7e1; } .custom__modal-header__1HIE4 .custom__modal-header-search__1QwG2 .custom__search-input__tYAKJ:active { border-color: #d1d7e1; } .custom__modal-header__1HIE4 .custom__modal-header-search__1QwG2 .custom__search-img__33OP7 { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom__modal-body__JBuEM { flex-grow: 1; display: flex; } .custom__modal-body__JBuEM .custom__modal-body-left__1reCZ, .custom__modal-body__JBuEM .custom__modal-body-main__1n3TI { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .custom__modal-body__JBuEM .custom__modal-body-left__1reCZ { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .custom__modal-body__JBuEM .custom__modal-body-left__1reCZ .custom__modal-body-left-scroll__1Ab3N { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .custom__modal-body__JBuEM .custom__modal-body-left__1reCZ .custom__modal-body-left-scroll__1Ab3N .custom__modal-body-left-inner__uvFCi { width: 121px; padding: calc(12px); color: #5e6b81; } .custom__modal-body__JBuEM .custom__modal-body-left__1reCZ .custom__modal-body-left-scroll__1Ab3N .custom__modal-body-left-inner__uvFCi .custom__menu-item-current__3Y0YS { color: var(--theme-primary); background-color: #e0e9ff; } .custom__modal-body__JBuEM .custom__modal-body-left__1reCZ .custom__modal-body-left-scroll__1Ab3N .custom__modal-body-left-inner__uvFCi .custom__menu-item__sFIZ_ { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom__modal-body__JBuEM .custom__modal-body-left__1reCZ .custom__modal-body-left-scroll__1Ab3N .custom__modal-body-left-inner__uvFCi .custom__menu-item__sFIZ_:hover { background-color: #edeff5; } .custom__modal-body__JBuEM .custom__modal-body-left__1reCZ .custom__modal-body-left-scroll__1Ab3N .custom__modal-body-left-inner__uvFCi .custom__menu-item__sFIZ_ .custom__menu-item-img__2rV3v { flex-shrink: 0; width: 20px; margin-right: 8px; } .custom__modal-body__JBuEM .custom__modal-body-left__1reCZ .custom__modal-body-left-scroll__1Ab3N .custom__modal-body-left-inner__uvFCi .custom__menu-item__sFIZ_ .custom__menu-item-label__2itt1 { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .custom__modal-body__JBuEM .custom__modal-body-main__1n3TI { padding: calc(12px) 0; } .custom__modal-body__JBuEM .custom__modal-body-main__1n3TI .custom__modal-body-main-scroll__rDTbw { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .custom__modal-body__JBuEM .custom__modal-body-main__1n3TI .custom__modal-body-main-scroll__rDTbw .custom__modal-body-main-inner__1v7SJ { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .custom__modal-body__JBuEM .custom__modal-body-main__1n3TI .custom__modal-body-main-scroll__rDTbw .custom__modal-body-main-inner__1v7SJ .custom__selector-btn-add__2IOOb, .custom__modal-body__JBuEM .custom__modal-body-main__1n3TI .custom__modal-body-main-scroll__rDTbw .custom__modal-body-main-inner__1v7SJ .custom__selector-btn-item__1IJPT { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .custom__modal-body__JBuEM .custom__modal-body-main__1n3TI .custom__modal-body-main-scroll__rDTbw .custom__modal-body-main-inner__1v7SJ .custom__selector-btn-add__2IOOb:hover, .custom__modal-body__JBuEM .custom__modal-body-main__1n3TI .custom__modal-body-main-scroll__rDTbw .custom__modal-body-main-inner__1v7SJ .custom__selector-btn-item__1IJPT:hover { background-color: #e0e9ff; } .custom__modal-body__JBuEM .custom__modal-body-main__1n3TI .custom__modal-body-main-scroll__rDTbw .custom__modal-body-main-inner__1v7SJ .custom__selector-btn-add__2IOOb:active, .custom__modal-body__JBuEM .custom__modal-body-main__1n3TI .custom__modal-body-main-scroll__rDTbw .custom__modal-body-main-inner__1v7SJ .custom__selector-btn-item__1IJPT:active { background-color: #ccdaff; } .custom__modal-body__JBuEM .custom__modal-body-main__1n3TI .custom__modal-body-main-scroll__rDTbw .custom__modal-body-main-inner__1v7SJ .custom__selector-btn-add__2IOOb:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .custom__modal-body__JBuEM .custom__modal-body-main__1n3TI .custom__modal-body-main-scroll__rDTbw .custom__modal-body-main-inner__1v7SJ .custom__selector-btn-add__2IOOb:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .custom__modal-body__JBuEM .custom__modal-body-main__1n3TI .custom__modal-body-main-scroll__rDTbw .custom__modal-body-main-inner__1v7SJ .custom__selector-btn-add__2IOOb .custom__add-img__YukT6 { font-size: 28px; height: auto; margin-bottom: 8px; } .custom__modal-body__JBuEM .custom__modal-body-main__1n3TI .custom__modal-body-main-scroll__rDTbw .custom__modal-body-main-inner__1v7SJ .custom__selector-btn-add__2IOOb .custom__add-label__mV9KL { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .custom__modal-body__JBuEM .custom__modal-body-main__1n3TI .custom__modal-body-main-scroll__rDTbw .custom__modal-body-main-inner__1v7SJ .custom__selector-btn-item__1IJPT { justify-content: space-between; } .custom__modal-body__JBuEM .custom__modal-body-main__1n3TI .custom__modal-body-main-scroll__rDTbw .custom__modal-body-main-inner__1v7SJ .custom__selector-btn-item__1IJPT .custom__item-img__2Rm0d { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .custom__modal-body__JBuEM .custom__modal-body-main__1n3TI .custom__modal-body-main-scroll__rDTbw .custom__modal-body-main-inner__1v7SJ .custom__selector-btn-item__1IJPT .custom__item-img__2Rm0d img { width: auto; height: 105px; } .custom__modal-body__JBuEM .custom__modal-body-main__1n3TI .custom__modal-body-main-scroll__rDTbw .custom__modal-body-main-inner__1v7SJ .custom__selector-btn-item__1IJPT .custom__item-label__2KdUW { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .custom__modal-footer__VDVXz { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .custom__selector-btn-add__2IOOb, .custom__selector-btn-item__1IJPT { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .custom__selector-btn-add__2IOOb { background-color: var(--selector-sprite-bg_primary); } .custom__selector-btn-add__2IOOb:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .custom__selector-btn-add__2IOOb:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .custom__selector-btn-add__2IOOb .custom__add-img__YukT6 { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .custom__selector-btn-add__2IOOb .custom__add-label__mV9KL { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .custom__selector-btn-item__1IJPT { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .custom__selector-btn-item__1IJPT .custom__item-img__2Rm0d { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .custom__selector-btn-item__1IJPT .custom__item-img__2Rm0d img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .custom__selector-btn-item__1IJPT .custom__item-label__2KdUW { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .custom__selector-btn-item__1IJPT:hover { background-color: var(--selector-sprite-bg_primary); } .custom__selector-btn-item__1IJPT:hover .custom__item-img__2Rm0d { border-color: var(--selector-sprite-bg_primary); } .custom__selector-btn-item_selected__4xY9_ { background-color: var(--selector-sprite-bg_primary); } .custom__selector-btn-item_selected__4xY9_ .custom__item-img__2Rm0d { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .custom__menu-bar-btn__3-rrV { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .custom__menu-bar-btn_green__2OFY4, .custom__menu-bar-btn_create__1DlYf { background-color: #3cdc8f; } .custom__menu-bar-btn_green__2OFY4:hover, .custom__menu-bar-btn_create__1DlYf:hover { background-color: #00d374; } .custom__menu-bar-btn_green__2OFY4:active, .custom__menu-bar-btn_create__1DlYf:active { background-color: #00d374; } .custom__menu-bar-btn_save__2K42f, .custom__menu-bar-btn_reset__1Shky { background-color: #6ac8ff; } .custom__menu-bar-btn_save__2K42f:hover, .custom__menu-bar-btn_reset__1Shky:hover { background-color: #57bcfe; } .custom__menu-bar-btn_save__2K42f:active, .custom__menu-bar-btn_reset__1Shky:active { background-color: #4fb0fc; } .custom__menu-bar-btn_submit__dXjZX, .custom__menu-bar-btn_open__2cjJ5 { background-color: #ff9e23; } .custom__menu-bar-btn_submit__dXjZX:hover, .custom__menu-bar-btn_open__2cjJ5:hover { background-color: #f47b04; } .custom__menu-bar-btn_submit__dXjZX:active, .custom__menu-bar-btn_open__2cjJ5:active { background-color: #fe8f22; } .custom__menu-bar-btn_link__oKCwe { background-color: #e8efff; color: var(--theme-primary); } .custom__menu-bar-btn_link__oKCwe:hover { background-color: #b6c7ff; } .custom__menu-bar-btn_link__oKCwe:active { background-color: #cfdcff; } .custom__menu-bar-btn_disabled__39I3C { color: #565266; background-color: #e6e9ed; } .custom__menu-bar-btn_disabled__39I3C:hover { cursor: not-allowed; } .custom__menu-bar-btn_help__jmCei { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .custom__menu-bar-btn_help__jmCei:hover { background-color: #8398ff; } .custom__menu-bar-btn_help__jmCei:active { background-color: #8ca3ff; } .custom__menu-bar-separator___rg_2 { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ #confirm .confirm-wrap { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; z-index: 20000; } #confirm .confirm-wrap .modal-wrap { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } #confirm .confirm-wrap .modal-wrap .modal-header-wrap { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } #confirm .confirm-wrap .modal-wrap .modal-header-wrap .modal-header-bg { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } #confirm .confirm-wrap .modal-wrap .modal-header-wrap .modal-header-label { flex-shrink: 0; font-size: 16px; font-weight: bold; } #confirm .confirm-wrap .modal-wrap .modal-header-wrap .modal-header-close { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } #confirm .confirm-wrap .modal-wrap .modal-header-wrap .modal-header-close:hover { color: #98a2b4; } #confirm .confirm-wrap .modal-wrap .modal-body-wrap { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } #confirm .confirm-wrap .modal-wrap .modal-footer-wrap { flex-shrink: 0; display: flex; } #confirm .confirm-wrap .confirm-content { min-height: 165px; width: 448px; border-radius: 12px; position: relative; background-color: #ffffff; } #confirm .confirm-wrap .confirm-content .confirm-close-button { font-size: 20px; line-height: 20px; position: absolute; top: 12px; right: 12px; color: #565266; cursor: url(static/cursor/cursor-pointer.cur), pointer; transform: rotate(45deg); } #confirm .confirm-wrap .confirm-content .confirm-close-button:hover { color: #3d4554; } #confirm .confirm-wrap .confirm-content .confirm-header { display: flex; align-items: center; height: 40px; padding: 0 12px; } #confirm .confirm-wrap .confirm-content .confirm-body { display: flex; padding: 8px 24px 24px; } #confirm .confirm-wrap .confirm-content .confirm-body .confirm-body-icon { width: 26px; height: 26px; margin-right: 15px; } #confirm .confirm-wrap .confirm-content .confirm-body .confirm-body-message { color: #565266; font-size: 16px; line-height: 26px; } #confirm .confirm-wrap .confirm-content .confirm-body .confirm-body-icon-message { font-family: 'PingFang SC'; font-style: normal; font-weight: 600; font-size: 16px; color: #ffcd1c; } #confirm .confirm-wrap .confirm-content .confirm-footer { display: flex; align-items: center; justify-content: flex-end; padding: 8px 24px 24px; } #confirm .confirm-wrap .confirm-content .confirm-footer button + button { margin-left: 16px; } #confirm .confirm-wrap .confirm-content .confirm-footer .confirm-cancel-button, #confirm .confirm-wrap .confirm-content .confirm-footer .confirm-ok-button { display: flex; align-items: center; justify-content: center; width: 112px; height: 40px; border-radius: 35px; font-size: 16px; font-weight: 500; border: none; cursor: url(static/cursor/cursor-pointer.cur), pointer; } #confirm .confirm-wrap .confirm-content .confirm-footer .confirm-cancel-button { color: #565266; background-color: #e6e9ed; } #confirm .confirm-wrap .confirm-content .confirm-footer .confirm-ok-button { color: #ffffff; background-color: var(--theme-primary); } #confirm .confirm-wrap .confirm-content .confirm-footer .confirm-ok-button:hover { background-color: #505ed9; } html, body, #app { /* probably unecessary, transitional until layout is refactored */ width: 100%; height: 100%; margin: 0; cursor: url(static/cursor/cursor-auto.cur), auto; /* Setting min height/width makes the UI scroll below those sizes */ /* Min height to fit sprite/backdrop button */ font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; } /* @todo: move globally? Safe / side FX, for blocks particularly? */ * { box-sizing: border-box; -webkit-user-select: none; -ms-user-select: none; user-select: none; } button { border: none; background-color: none; cursor: url(static/cursor/cursor-pointer.cur), pointer; padding: 0; } @media screen and (orientation: portrait) { .custom__app__yUpNq { width: 100%; height: 100%; overflow: hidden; padding: 0; } } .paper-canvas__paper-canvas__3WZSr { top: 1px; /* leave room for the border */ left: 1px; width: calc(100% - 2px); height: calc(100% - 2px); margin: auto; position: absolute; background-color: #d9e3f2; } .scrollable-canvas__vertical-scrollbar__2Zrio, .scrollable-canvas__horizontal-scrollbar__hunt_ { background: rgba(190, 190, 190, 0.8); border-radius: calc(8px / 2); width: 100%; height: 100%; } .scrollable-canvas__vertical-scrollbar-wrapper__7r4AZ { position: absolute; width: calc(8px + 4px); right: 0; top: 4px; height: calc(100% - 8px - 2 * 4px); } .scrollable-canvas__horizontal-scrollbar-wrapper__3ILnY { position: absolute; height: calc(8px + 4px); left: 4px; bottom: 0; width: calc(100% - 8px - 2 * 4px); } .scrollable-canvas__vertical-scrollbar-hitbox__24Mwx, .scrollable-canvas__horizontal-scrollbar-hitbox__21zT8 { position: absolute; cursor: pointer; box-sizing: border-box; } .scrollable-canvas__vertical-scrollbar-hitbox__24Mwx { width: calc(8px + 4px); padding-right: 4px; } .scrollable-canvas__horizontal-scrollbar-hitbox__21zT8 { height: calc(8px + 4px); padding-bottom: 4px; } /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ .button__button__1lkrm { background: none; cursor: pointer; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .button__button__1lkrm:active { background-color: hsla(215, 100%, 65%, 0.2); } .button__highlighted__390Ox.button__button__1lkrm { background-color: hsla(215, 100%, 65%, 0.2); } .button__mod-disabled__1hdJm { cursor: auto; opacity: 0.5; } .button__mod-disabled__1hdJm:active { background: none; } /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ /* ACTUALLY, THIS IS EDITED ;) THIS WAS CHANGED ON 10/25/2017 BY @mewtaylor TO ADD A VARIABLE FOR THE SMALLEST GRID UNITS. ALSO EDITED ON 11/13/2017 TO ADD IN CONTANTS FOR LAYOUT FROM `layout-contents.js`*/ /* layout contants from `layout-constants.js`, minus 1px */ .tool-select-base__mod-tool-select__1NlUx { display: inline-block; margin: 0.25rem; border: none; border-radius: 0.25rem; outline: none; background: none; padding: 0.25rem; font-size: 0.85rem; transition: 0.2s; } .tool-select-base__mod-tool-select__1NlUx.tool-select-base__is-selected__3OQsR { background-color: #4c97ff; } .tool-select-base__mod-tool-select__1NlUx:focus { outline: none; } img.tool-select-base__tool-select-icon__3KRrE { width: 2rem; height: 2rem; flex-grow: 1; vertical-align: middle; } .tool-select-base__mod-tool-select__1NlUx.tool-select-base__is-selected__3OQsR .tool-select-base__tool-select-icon__3KRrE { /* Make the tool icons white while selected by making them black and inverting */ filter: brightness(0) invert(1); } @media only screen and (max-width: 1256px) { .tool-select-base__mod-tool-select__1NlUx { margin: 0; } } /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ /* ACTUALLY, THIS IS EDITED ;) THIS WAS CHANGED ON 10/25/2017 BY @mewtaylor TO ADD A VARIABLE FOR THE SMALLEST GRID UNITS. ALSO EDITED ON 11/13/2017 TO ADD IN CONTANTS FOR LAYOUT FROM `layout-contents.js`*/ /* layout contants from `layout-constants.js`, minus 1px */ .button-group__button-group__7ExCI { display: inline-flex; flex-direction: row; padding: 0 0.25rem; } .color-button__color-button__1A9kl { height: 2rem; width: 3rem; display: flex; } .color-button__color-button-swatch__2XN71 { position: relative; display: flex; cursor: pointer; flex-basis: 2rem; flex-shrink: 0; height: 100%; border: 1px solid rgba(0, 0, 0, 0.25); } [dir='ltr'] .color-button__color-button-swatch__2XN71 { border-top-left-radius: 4px; border-bottom-left-radius: 4px; } [dir='rtl'] .color-button__color-button-swatch__2XN71 { border-top-right-radius: 4px; border-bottom-right-radius: 4px; } .color-button__color-button-arrow__3pUgX { display: flex; -webkit-user-select: none; -ms-user-select: none; user-select: none; cursor: pointer; flex-basis: 1rem; flex-shrink: 0; height: 100%; border: 1px solid rgba(0, 0, 0, 0.25); align-items: center; justify-content: center; color: #575e75; font-size: 0.75rem; } [dir='ltr'] .color-button__color-button-arrow__3pUgX { border-top-right-radius: 4px; border-bottom-right-radius: 4px; border-left: none; } [dir='rtl'] .color-button__color-button-arrow__3pUgX { border-top-left-radius: 4px; border-bottom-left-radius: 4px; border-right: none; } .color-button__swatch-icon__wj_Cv { width: 1.75rem; margin: auto; /* Make sure it appears above the outline box */ z-index: 2; } .color-button__outline-swatch__iH1qw:after { content: ''; position: absolute; top: calc(0.5rem); left: calc(0.5rem); width: 0.75rem; height: 0.75rem; background: white; border: 1px solid rgba(0, 0, 0, 0.25); /* Make sure it appears below the transparent icon */ z-index: 1; } .slider__container__26ges { margin: 8px; height: 22px; width: 150px; position: relative; outline: none; border-radius: 11px; margin-bottom: 20px; } .slider__last__1U3N6 { margin-bottom: 4px; } .slider__handle__3gTEt { left: 100px; width: 26px; height: 26px; margin-top: -2px; position: absolute; background-color: white; border-radius: 100%; box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.15); touch-action: none; } /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ /* ACTUALLY, THIS IS EDITED ;) THIS WAS CHANGED ON 10/25/2017 BY @mewtaylor TO ADD A VARIABLE FOR THE SMALLEST GRID UNITS. ALSO EDITED ON 11/13/2017 TO ADD IN CONTANTS FOR LAYOUT FROM `layout-contents.js`*/ /* layout contants from `layout-constants.js`, minus 1px */ .labeled-icon-button__mod-edit-field__2gWPX { background: none; border: none; display: inline-block; padding: 0.25rem 0.325rem; outline: none; border-radius: 0.25rem; min-width: 3rem; font-size: 0.85rem; text-align: center; } .labeled-icon-button__edit-field-icon__1eOvX { width: 1.5rem; height: 1.5rem; flex-grow: 1; vertical-align: middle; } .labeled-icon-button__edit-field-title__8HUKo { display: block; margin-top: 0.125rem; font-size: 0.625rem; } /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ /* ACTUALLY, THIS IS EDITED ;) THIS WAS CHANGED ON 10/25/2017 BY @mewtaylor TO ADD A VARIABLE FOR THE SMALLEST GRID UNITS. ALSO EDITED ON 11/13/2017 TO ADD IN CONTANTS FOR LAYOUT FROM `layout-contents.js`*/ /* layout contants from `layout-constants.js`, minus 1px */ /* Popover styles */ .Popover-body { background: white; border: 1px solid #ddd; padding: 4px; border-radius: 4px; padding: 4px; box-shadow: 0px 0px 8px 1px rgba(0, 0, 0, 0.3); } .Popover-tipShape { fill: white; stroke: #ddd; } .color-picker__clickable__1c_t6 { cursor: pointer; } .color-picker__swatch-row__2OdLa { display: flex; flex-direction: row; justify-content: space-between; } .color-picker__row-header__6JpXB { font-family: 'Helvetica Neue', Helvetica, sans-serif; font-size: 0.65rem; color: #575e75; margin: 8px; } [dir='ltr'] .color-picker__label-readout__KQzJU { margin-left: 10px; } [dir='rtl'] .color-picker__label-readout__KQzJU { margin-right: 10px; } .color-picker__label-name__3Bi5K { font-weight: bold; } .color-picker__divider__aL-CP { border-top: 1px solid #ddd; margin: 8px; } .color-picker__swap-button__2Zhib { margin-left: 8px; margin-right: 8px; } .color-picker__swatches__T5ec0 { margin: 8px; } .color-picker__swatch__3CIvk { width: 1.5rem; height: 1.5rem; border: 1px solid #ddd; border-radius: 4px; box-sizing: content-box; display: flex; align-items: center; } .color-picker__large-swatch-icon__yikF9 { width: 1.75rem; margin: auto; } .color-picker__large-swatch__12hcD { width: 2rem; height: 2rem; } .color-picker__active-swatch__19rky { border: 1px solid #4c97ff; box-shadow: 0px 0px 0px 3px hsla(215, 100%, 65%, 0.2); } .color-picker__swatch-icon__B68X4 { width: 1.5rem; height: 1.5rem; } .color-picker__inactive-gradient__3xxEL { filter: saturate(0%); } .color-picker__gradient-picker-row__1ovIM { align-items: center; display: flex; flex-direction: row; justify-content: center; margin: 8px; -webkit-user-select: none; -ms-user-select: none; user-select: none; } [dir='ltr'] .color-picker__gradient-picker-row__1ovIM > img + img { margin-left: calc(2 * 0.25rem); } [dir='rtl'] .color-picker__gradient-picker-row__1ovIM > img + img { margin-right: calc(2 * 0.25rem); } [dir='rtl'] .color-picker__gradient-swatches-row__3TWpw { flex-direction: row-reverse; } /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ /* ACTUALLY, THIS IS EDITED ;) THIS WAS CHANGED ON 10/25/2017 BY @mewtaylor TO ADD A VARIABLE FOR THE SMALLEST GRID UNITS. ALSO EDITED ON 11/13/2017 TO ADD IN CONTANTS FOR LAYOUT FROM `layout-contents.js`*/ /* layout contants from `layout-constants.js`, minus 1px */ .input-group__input-group__2nCiX { display: inline-flex; flex-direction: row; align-items: center; } [dir='ltr'] .input-group__input-group__2nCiX + .input-group__input-group__2nCiX { margin-left: calc(2 * 0.25rem); } [dir='rtl'] .input-group__input-group__2nCiX + .input-group__input-group__2nCiX { margin-right: calc(2 * 0.25rem); } .input-group__disabled__2ZU3q { opacity: 0.3; /* Prevent any user actions */ pointer-events: none; } /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ /* ACTUALLY, THIS IS EDITED ;) THIS WAS CHANGED ON 10/25/2017 BY @mewtaylor TO ADD A VARIABLE FOR THE SMALLEST GRID UNITS. ALSO EDITED ON 11/13/2017 TO ADD IN CONTANTS FOR LAYOUT FROM `layout-contents.js`*/ /* layout contants from `layout-constants.js`, minus 1px */ /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ .label__input-group__2yuHV { display: inline-flex; flex-direction: row; align-items: center; } [dir='ltr'] .label__input-group__2yuHV + .label__input-group__2yuHV { margin-left: calc(2 * 0.25rem); } [dir='rtl'] .label__input-group__2yuHV + .label__input-group__2yuHV { margin-right: calc(2 * 0.25rem); } .label__disabled__2rODX { opacity: 0.3; /* Prevent any user actions */ pointer-events: none; } .label__input-label__23Udi, .label__input-label-secondary__1G_Is { font-size: 0.625rem; -webkit-user-select: none; -ms-user-select: none; user-select: none; cursor: default; } [dir='ltr'] .label__input-label__23Udi, [dir='ltr'] .label__input-label-secondary__1G_Is { margin-right: calc(2 * 0.25rem); } [dir='rtl'] .label__input-label__23Udi, [dir='ltr'] .label__input-label-secondary__1G_Is { margin-left: calc(2 * 0.25rem); } .label__input-label__23Udi { font-weight: bold; } @media only screen and (max-width: 1256px) { .label__input-group__2yuHV { display: flex; flex-direction: column; align-items: flex-start; margin-top: -1rem; /* To align with the non-labeled inputs */ } .label__input-label__23Udi { font-weight: normal; margin-bottom: 0.25rem; } } .loupe__eye-dropper__230D0 { position: absolute; border-radius: 100%; border: 1px solid #222; } /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ .dropdown__dropdown__2IcAk { border: 1px solid #e9eef2; border-radius: 5px; overflow: visible; min-width: 3.5rem; color: #4c97ff; padding: 0.5rem; } .dropdown__mod-open__3P1qz { background-color: #e9eef2; } .dropdown__dropdown-icon__1VwPs { width: 0.5rem; height: 0.5rem; vertical-align: middle; padding-bottom: 0.2rem; } [dir='ltr'] .dropdown__dropdown-icon__1VwPs { margin-left: 0.5rem; } [dir='rtl'] .dropdown__dropdown-icon__1VwPs { margin-right: 0.5rem; } .dropdown__mod-caret-up__1c4ZZ { transform: rotate(180deg); padding-bottom: 0; padding-top: 0.2rem; } /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ /* NOTE: Edited to add input-range-small */ /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ /* ACTUALLY, THIS IS EDITED ;) THIS WAS CHANGED ON 10/25/2017 BY @mewtaylor TO ADD A VARIABLE FOR THE SMALLEST GRID UNITS. ALSO EDITED ON 11/13/2017 TO ADD IN CONTANTS FOR LAYOUT FROM `layout-contents.js`*/ /* layout contants from `layout-constants.js`, minus 1px */ /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ .input__input-form__2nzfY { height: 2rem; padding: 0 0.75rem; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 0.75rem; font-weight: bold; color: #575e75; border-width: 1px; border-style: solid; border-color: #e9eef2; border-radius: 2rem; outline: none; cursor: text; transition: 0.25s ease-out; /* @todo: standardize with var */ box-shadow: none; /* For truncating overflowing text gracefully Min-width is for a bug: https://css-tricks.com/flexbox-truncated-text @todo: move this out into a mixin or a helper component */ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; } .input__input-form__2nzfY:focus { border-color: #4c97ff; box-shadow: 0 0 0 0.25rem hsla(215, 100%, 65%, 0.2); } .input__input-small__ZODdI { width: 3rem; text-align: center; } .input__input-small-range__3PzRp { width: 4rem; text-align: center; } /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ /* ACTUALLY, THIS IS EDITED ;) THIS WAS CHANGED ON 10/25/2017 BY @mewtaylor TO ADD A VARIABLE FOR THE SMALLEST GRID UNITS. ALSO EDITED ON 11/13/2017 TO ADD IN CONTANTS FOR LAYOUT FROM `layout-contents.js`*/ /* layout contants from `layout-constants.js`, minus 1px */ .fixed-tools__row__1u3ap { display: flex; flex-direction: row; align-items: center; } .fixed-tools__costume-input__mlsES { width: 8rem; } [dir='ltr'] .fixed-tools__mod-dashed-border__3Zf6v { border-right: 1px dashed #d9d9d9; padding-right: calc(2 * 0.25rem); } [dir='rtl'] .fixed-tools__mod-dashed-border__3Zf6v { border-left: 1px dashed #d9d9d9; padding-left: calc(2 * 0.25rem); } .fixed-tools__mod-unselect__30zfN { -webkit-user-select: none; -ms-user-select: none; user-select: none; } .fixed-tools__button-group-button__umFm3 { display: inline-block; border: 1px solid #d9d9d9; border-radius: 0; padding: 0.35rem; } [dir='ltr'] .fixed-tools__button-group-button__umFm3 { border-left: none; } [dir='rtl'] .fixed-tools__button-group-button__umFm3 { border-right: none; } [dir='ltr'] .fixed-tools__button-group-button__umFm3:last-of-type { border-top-right-radius: 0.25rem; border-bottom-right-radius: 0.25rem; } [dir='ltr'] .fixed-tools__button-group-button__umFm3:first-of-type { border-left: 1px solid #d9d9d9; border-top-left-radius: 0.25rem; border-bottom-left-radius: 0.25rem; } [dir='rtl'] .fixed-tools__button-group-button__umFm3:last-of-type { border-top-left-radius: 0.25rem; border-bottom-left-radius: 0.25rem; } [dir='rtl'] .fixed-tools__button-group-button__umFm3:first-of-type { border-right: 1px solid #d9d9d9; border-top-right-radius: 0.25rem; border-bottom-right-radius: 0.25rem; } [dir='ltr'] .fixed-tools__button-group-button__umFm3.fixed-tools__mod-start-border__1yXmr { border-left: 1px solid #d9d9d9; } [dir='rtl'] .fixed-tools__button-group-button__umFm3.fixed-tools__mod-start-border__1yXmr { border-right: 1px solid #d9d9d9; } [dir='ltr'] .fixed-tools__button-group-button__umFm3.fixed-tools__mod-no-end-border__1vIcw { border-right: none; } [dir='rtl'] .fixed-tools__button-group-button__umFm3.fixed-tools__mod-no-end-border__1vIcw { border-left: none; } .fixed-tools__button-group-button-icon__hc0-X { width: 1.25rem; height: 1.25rem; vertical-align: middle; } [dir='rtl'] .fixed-tools__button-group-button-icon__hc0-X { transform: scaleX(-1); } .fixed-tools__mod-context-menu__3kO62 { display: flex; flex-direction: column; } .fixed-tools__mod-top-divider__1kGsP { border-top: 1px solid #d9d9d9; } .fixed-tools__mod-menu-item__3weBf { display: flex; margin: 0 -0.25rem; min-width: 6.25rem; padding: calc(3 * 0.25rem); white-space: nowrap; cursor: pointer; transition: 0.1s ease; align-items: center; font-family: 'Helvetica Neue', Helvetica, sans-serif; } .fixed-tools__mod-disabled__28GQc { cursor: auto; } .fixed-tools__mod-menu-item__3weBf:hover { background: hsla(215, 100%, 65%, 0.2); } .fixed-tools__mod-disabled__28GQc:hover { background-color: transparent; } .fixed-tools__menu-item-icon__2w6pw { margin-right: calc(2 * 0.25rem); } [dir='rtl'] .fixed-tools__menu-item-icon__2w6pw { margin-right: 0; margin-left: calc(2 * 0.25rem); } /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ /* ACTUALLY, THIS IS EDITED ;) THIS WAS CHANGED ON 10/25/2017 BY @mewtaylor TO ADD A VARIABLE FOR THE SMALLEST GRID UNITS. ALSO EDITED ON 11/13/2017 TO ADD IN CONTANTS FOR LAYOUT FROM `layout-contents.js`*/ /* layout contants from `layout-constants.js`, minus 1px */ .font-dropdown__mod-menu-item__2qSFQ { display: flex; margin: 0 -0.25rem; min-width: 6.25rem; padding: calc(2 * 0.25rem); padding-left: calc(3 * 0.25rem); padding-right: calc(3 * 0.25rem); white-space: nowrap; width: 8.5rem; cursor: pointer; transition: 0.1s ease; align-items: center; } .font-dropdown__mod-menu-item__2qSFQ:hover { background: #4c97ff; color: white; } .font-dropdown__mod-context-menu__2YntC { display: flex; flex-direction: column; } .font-dropdown__mod-unselect__2gZ_6 { -webkit-user-select: none; -ms-user-select: none; user-select: none; } .font-dropdown__displayed-font-name__2fb-F { font-size: 0.8rem; } .font-dropdown__font-dropdown__2Sj-y { align-items: center; color: #575e75; display: flex; font-size: 1rem; justify-content: space-between; width: 8.5rem; height: 2rem; } .font-dropdown__serif__Ts5-J { font-family: 'Serif'; } .font-dropdown__sans-serif__3DwKN { font-family: 'Sans Serif'; } .font-dropdown__serif__Ts5-J { font-family: 'Serif'; } .font-dropdown__handwriting__16Idr { font-family: 'Handwriting'; } .font-dropdown__marker__19L8B { font-family: 'Marker'; } .font-dropdown__curly__1QBx7 { font-family: 'Curly'; } .font-dropdown__pixel__3t_MN { font-family: 'Pixel'; } .font-dropdown__chinese__3ki6h { font-family: 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', STXihei, '\534E\6587\7EC6\9ED1'; } .font-dropdown__japanese__2zkOV { font-family: '\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3', 'Hiragino Kaku Gothic Pro', Osaka, '\30E1\30A4\30EA\30AA', Meiryo, '\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF', 'MS PGothic'; } .font-dropdown__korean__1FHCv { font-family: 'Malgun Gothic'; } /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ /* ACTUALLY, THIS IS EDITED ;) THIS WAS CHANGED ON 10/25/2017 BY @mewtaylor TO ADD A VARIABLE FOR THE SMALLEST GRID UNITS. ALSO EDITED ON 11/13/2017 TO ADD IN CONTANTS FOR LAYOUT FROM `layout-contents.js`*/ /* layout contants from `layout-constants.js`, minus 1px */ .mode-tools__mode-tools__2bOJe { display: flex; min-height: 3rem; align-items: center; } .mode-tools__mode-tools-icon__3_Iyq { margin-right: calc(2 * 0.25rem); width: 2rem; height: 2rem; } [dir='ltr'] .mode-tools__mod-dashed-border__euL_Y { border-right: 1px dashed #d9d9d9; padding-right: calc(3 * 0.25rem); } [dir='rtl'] .mode-tools__mod-dashed-border__euL_Y { border-left: 1px dashed #d9d9d9; padding-left: calc(3 * 0.25rem); } .mode-tools__mod-labeled-icon-height__3_S9D { display: flex; height: 2.85rem; /* for the second row so the dashed borders are equal in size */ align-items: center; } /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ /* DO NOT EDIT @todo This file is copied from GUI and should be pulled out into a shared library. See https://github.com/LLK/scratch-paint/issues/13 */ /* ACTUALLY, THIS IS EDITED ;) THIS WAS CHANGED ON 10/25/2017 BY @mewtaylor TO ADD A VARIABLE FOR THE SMALLEST GRID UNITS. ALSO EDITED ON 11/13/2017 TO ADD IN CONTANTS FOR LAYOUT FROM `layout-contents.js`*/ /* layout contants from `layout-constants.js`, minus 1px */ .paint-editor__editor-container__3zTtr { width: 100%; height: 100%; display: flex; flex-direction: column; padding: calc(3 * 0.25rem); } .paint-editor__row__1BOGY { display: flex; flex-direction: row; align-items: center; } .paint-editor__editor-container-top__knFm6 { border-bottom: 1px dashed #d9d9d9; padding-bottom: calc(2 * 0.25rem); } .paint-editor__top-align-row__1Tb5V { display: flex; flex-direction: row; height: 100%; padding-top: calc(5 * 0.25rem); min-width: 524px; } .paint-editor__row__1BOGY + .paint-editor__row__1BOGY { margin-top: calc(2 * 0.25rem); } [dir='ltr'] .paint-editor__mod-dashed-border__CwrlQ { border-right: 1px dashed #d9d9d9; padding-right: calc(2 * 0.25rem); } [dir='rtl'] .paint-editor__mod-dashed-border__CwrlQ { border-left: 1px dashed #d9d9d9; padding-left: calc(2 * 0.25rem); } .paint-editor__mod-labeled-icon-height__2SscK { height: 2.85rem; /* for the second row so the dashed borders are equal in size */ } .paint-editor__button-group-button__1fsoT { display: inline-block; border: 1px solid #d9d9d9; border-radius: 0; padding: 0.35rem; } [dir='ltr'] .paint-editor__button-group-button__1fsoT { border-left: none; } [dir='rtl'] .paint-editor__button-group-button__1fsoT { border-right: none; } [dir='ltr'] .paint-editor__button-group-button__1fsoT:last-of-type { border-top-right-radius: 0.25rem; border-bottom-right-radius: 0.25rem; } [dir='ltr'] .paint-editor__button-group-button__1fsoT:first-of-type { border-left: 1px solid #d9d9d9; border-top-left-radius: 0.25rem; border-bottom-left-radius: 0.25rem; } [dir='rtl'] .paint-editor__button-group-button__1fsoT:last-of-type { border-top-left-radius: 0.25rem; border-bottom-left-radius: 0.25rem; } [dir='rtl'] .paint-editor__button-group-button__1fsoT:first-of-type { border-right: 1px solid #d9d9d9; border-top-right-radius: 0.25rem; border-bottom-right-radius: 0.25rem; } [dir='ltr'] .paint-editor__button-group-button__1fsoT.paint-editor__mod-start-border__1dR5O { border-left: 1px solid #d9d9d9; } [dir='rtl'] .paint-editor__button-group-button__1fsoT.paint-editor__mod-start-border__1dR5O { border-right: 1px solid #d9d9d9; } [dir='ltr'].paint-editor__button-group-button__1fsoT.paint-editor__mod-no-end-border__34rL0 { border-right: none; } [dir='rtl'].paint-editor__button-group-button__1fsoT.paint-editor__mod-no-end-border__34rL0 { border-left: none; } .paint-editor__button-group-button-icon__3WVva { width: 1.25rem; height: 1.25rem; vertical-align: middle; } .paint-editor__mod-mode-tools__3kWyH { margin-left: calc(2 * 0.25rem); } [dir='ltr'] .paint-editor__mod-margin-after__VMWV5 { margin-right: calc(2 * 0.25rem); } [dir='rtl'] .paint-editor__mod-margin-after__VMWV5 { margin-left: calc(2 * 0.25rem); } .paint-editor__controls-container__2-q7o { width: 100%; display: flex; flex-flow: column; flex-grow: 1; margin-left: calc(2 * 0.25rem); margin-right: calc(2 * 0.25rem); } .paint-editor__canvas-container__flu82 { width: 100%; flex-grow: 1; min-width: 402px; /* Leave room for the border */ box-sizing: content-box; border: 1px solid #e8edf1; border-radius: 0.25rem; position: relative; overflow: visible; } .paint-editor__mode-selector__31hlV { display: flex; max-width: 7.5rem; flex-direction: row; flex-wrap: wrap; align-items: flex-start; align-content: flex-start; justify-content: space-between; } .paint-editor__zoom-controls__2N3rp { display: flex; flex-direction: row-reverse; } .paint-editor__color-picker-wrapper__11DnF { position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; } .paint-editor__canvas-controls___-W62 { display: flex; height: 36px; margin-top: 0.25rem; justify-content: space-between; } .paint-editor__bitmap-button__1B4ux { display: flex; border-radius: 5px; background-color: #4c97ff; padding: calc(2 * 0.25rem); line-height: 1.5rem; font-size: calc(3 * 0.25rem); font-weight: bold; color: white; justify-content: center; } [dir='ltr'] .paint-editor__bitmap-button-icon__CPVtD { margin-right: calc(2 * 0.25rem); } [dir='rtl'] .paint-editor__bitmap-button-icon__CPVtD { margin-left: calc(2 * 0.25rem); } @media only screen and (max-width: 1256px) { .paint-editor__editor-container__3zTtr { padding: calc(3 * 0.25rem) 0.25rem; } .paint-editor__mode-selector__31hlV { flex-direction: column; justify-content: flex-start; } .paint-editor__controls-container__2-q7o { margin-right: 0.25rem; margin-left: 0.25rem; } } .paint-editor__text-area__19Mji { background: transparent; border: none; display: none; margin: 0px; opacity: 0.8; outline: none; overflow: hidden; padding: 0px; position: absolute; resize: none; -webkit-text-fill-color: transparent; text-fill-color: transparent; } .paint-editor__button-text__3kmnb { width: 100%; /* Fixes button text wrapping in Edge */ } .box__box__3goQX { display: block; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .button__outlined-button__2srYd { cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: calc(4px); font-weight: bold; display: flex; flex-direction: row; align-items: center; padding-left: 0.75rem; padding-right: 0.75rem; } .button__icon__3Z7BP { height: 1.5rem; } [dir='ltr'] .button__icon__3Z7BP { margin-right: 0.5rem; } [dir='rtl'] .button__icon__3Z7BP { margin-left: 0.5rem; } .button__content__8RYuD { white-space: nowrap; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .close-button__close-button__9fMlN { display: flex; align-items: center; justify-content: center; overflow: hidden; /* Mask the icon animation */ background-color: #e8efff; border-radius: 50%; font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; transition: all 0.15s ease-out; } .close-button__close-button__9fMlN.close-button__large__1hebi:hover { transform: scale(1.1, 1.1); box-shadow: 0 0 0 4px #e8efff; } .close-button__close-button__9fMlN.close-button__large__1hebi.close-button__orange__2C76Z:hover { transform: scale(1.1, 1.1); box-shadow: 0px 0px 0px 4px rgba(255, 134, 20, 0.2); } .close-button__small__3npAp { width: 0.825rem; height: 0.825rem; background-color: var(--theme-primary); color: #ffffff; } .close-button__large__1hebi { width: 1.75rem; height: 1.75rem; box-shadow: 0 0 0 2px #e8efff; } .close-button__large__1hebi.close-button__orange__2C76Z { background-color: rgba(255, 134, 20, 0.2); box-shadow: 0px 0px 0px 2px rgba(255, 134, 20, 0.2); } .close-button__close-icon__2Gd4I { position: relative; margin: 0.25rem; transform-origin: 50%; transform: rotate(45deg); } .close-button__close-icon__2Gd4I.close-button__orange__2C76Z { transform: rotate(45deg); transform: scale(1.4); } .close-button__small__3npAp .close-button__close-icon__2Gd4I { width: 50%; } .close-button__large__1hebi .close-button__close-icon__2Gd4I { width: 0.75rem; height: 0.75rem; } .close-button__back-icon__PQ83m { position: relative; margin: 0.25rem; } .close-button__small__3npAp .close-button__back-icon__PQ83m { width: 50%; } .close-button__large__1hebi .close-button__back-icon__PQ83m { width: 2rem; height: 2rem; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .modal__flex-center__3o2r8 { display: flex; align-items: center; justify-content: center; } .modal__full-filled__Xrbel { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .modal__modal-mask__3cn-5 { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .modal__modal-mask__3cn-5 .modal__modal-wrap__QFx2a { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .modal__modal-mask__3cn-5 .modal__modal-wrap__QFx2a .modal__modal-header-wrap__HKgHv { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .modal__modal-mask__3cn-5 .modal__modal-wrap__QFx2a .modal__modal-header-wrap__HKgHv .modal__modal-header-bg__fG-pq { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .modal__modal-mask__3cn-5 .modal__modal-wrap__QFx2a .modal__modal-header-wrap__HKgHv .modal__modal-header-label__Mywya { flex-shrink: 0; font-size: 16px; font-weight: bold; } .modal__modal-mask__3cn-5 .modal__modal-wrap__QFx2a .modal__modal-header-wrap__HKgHv .modal__modal-header-close__3Hwze { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .modal__modal-mask__3cn-5 .modal__modal-wrap__QFx2a .modal__modal-header-wrap__HKgHv .modal__modal-header-close__3Hwze:hover { color: #98a2b4; } .modal__modal-mask__3cn-5 .modal__modal-wrap__QFx2a .modal__modal-body-wrap__2AV_W { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .modal__modal-mask__3cn-5 .modal__modal-wrap__QFx2a .modal__modal-footer-wrap__OaOcS { flex-shrink: 0; display: flex; } .modal__modal-header__3ln1t { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .modal__modal-header__3ln1t .modal__modal-header-upload___LOxM { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .modal__modal-header__3ln1t .modal__modal-header-upload___LOxM:hover { background-color: #e0e9ff; } .modal__modal-header__3ln1t .modal__modal-header-upload___LOxM:active { background-color: #ccdaff; } .modal__modal-header__3ln1t .modal__modal-header-upload___LOxM .modal__upload-img__2bdvm { font-size: 16px; margin-right: calc(2px); } .modal__modal-header__3ln1t .modal__modal-header-upload___LOxM .modal__upload-label__1wNVc { font-size: 14px; } .modal__modal-header__3ln1t .modal__modal-header-upload___LOxM .modal__upload-input__2B5A4 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .modal__modal-header__3ln1t .modal__modal-header-search__2Drot { position: relative; } .modal__modal-header__3ln1t .modal__modal-header-search__2Drot .modal__search-input__1g4wc { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .modal__modal-header__3ln1t .modal__modal-header-search__2Drot .modal__search-input__1g4wc::-webkit-input-placeholder { color: #98a2b4; } .modal__modal-header__3ln1t .modal__modal-header-search__2Drot .modal__search-input__1g4wc::-moz-placeholder { color: #98a2b4; } .modal__modal-header__3ln1t .modal__modal-header-search__2Drot .modal__search-input__1g4wc:-ms-input-placeholder { color: #98a2b4; } .modal__modal-header__3ln1t .modal__modal-header-search__2Drot .modal__search-input__1g4wc:hover { border-color: #d1d7e1; } .modal__modal-header__3ln1t .modal__modal-header-search__2Drot .modal__search-input__1g4wc:active { border-color: #d1d7e1; } .modal__modal-header__3ln1t .modal__modal-header-search__2Drot .modal__search-img__qPJVL { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .modal__modal-body__3RyP- { flex-grow: 1; display: flex; } .modal__modal-body__3RyP- .modal__modal-body-left__qk1ZO, .modal__modal-body__3RyP- .modal__modal-body-main__2GB9V { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .modal__modal-body__3RyP- .modal__modal-body-left__qk1ZO { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .modal__modal-body__3RyP- .modal__modal-body-left__qk1ZO .modal__modal-body-left-scroll__3yfEg { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .modal__modal-body__3RyP- .modal__modal-body-left__qk1ZO .modal__modal-body-left-scroll__3yfEg .modal__modal-body-left-inner__20rJ- { width: 121px; padding: calc(12px); color: #5e6b81; } .modal__modal-body__3RyP- .modal__modal-body-left__qk1ZO .modal__modal-body-left-scroll__3yfEg .modal__modal-body-left-inner__20rJ- .modal__menu-item-current__2j8A4 { color: var(--theme-primary); background-color: #e0e9ff; } .modal__modal-body__3RyP- .modal__modal-body-left__qk1ZO .modal__modal-body-left-scroll__3yfEg .modal__modal-body-left-inner__20rJ- .modal__menu-item__3GEPG { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .modal__modal-body__3RyP- .modal__modal-body-left__qk1ZO .modal__modal-body-left-scroll__3yfEg .modal__modal-body-left-inner__20rJ- .modal__menu-item__3GEPG:hover { background-color: #edeff5; } .modal__modal-body__3RyP- .modal__modal-body-left__qk1ZO .modal__modal-body-left-scroll__3yfEg .modal__modal-body-left-inner__20rJ- .modal__menu-item__3GEPG .modal__menu-item-img__2xvq7 { flex-shrink: 0; width: 20px; margin-right: 8px; } .modal__modal-body__3RyP- .modal__modal-body-left__qk1ZO .modal__modal-body-left-scroll__3yfEg .modal__modal-body-left-inner__20rJ- .modal__menu-item__3GEPG .modal__menu-item-label__33K5g { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .modal__modal-body__3RyP- .modal__modal-body-main__2GB9V { padding: calc(12px) 0; } .modal__modal-body__3RyP- .modal__modal-body-main__2GB9V .modal__modal-body-main-scroll__2FNaY { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .modal__modal-body__3RyP- .modal__modal-body-main__2GB9V .modal__modal-body-main-scroll__2FNaY .modal__modal-body-main-inner__2zuzy { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .modal__modal-body__3RyP- .modal__modal-body-main__2GB9V .modal__modal-body-main-scroll__2FNaY .modal__modal-body-main-inner__2zuzy .modal__selector-btn-add__3XUml, .modal__modal-body__3RyP- .modal__modal-body-main__2GB9V .modal__modal-body-main-scroll__2FNaY .modal__modal-body-main-inner__2zuzy .modal__selector-btn-item__1LEZC { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .modal__modal-body__3RyP- .modal__modal-body-main__2GB9V .modal__modal-body-main-scroll__2FNaY .modal__modal-body-main-inner__2zuzy .modal__selector-btn-add__3XUml:hover, .modal__modal-body__3RyP- .modal__modal-body-main__2GB9V .modal__modal-body-main-scroll__2FNaY .modal__modal-body-main-inner__2zuzy .modal__selector-btn-item__1LEZC:hover { background-color: #e0e9ff; } .modal__modal-body__3RyP- .modal__modal-body-main__2GB9V .modal__modal-body-main-scroll__2FNaY .modal__modal-body-main-inner__2zuzy .modal__selector-btn-add__3XUml:active, .modal__modal-body__3RyP- .modal__modal-body-main__2GB9V .modal__modal-body-main-scroll__2FNaY .modal__modal-body-main-inner__2zuzy .modal__selector-btn-item__1LEZC:active { background-color: #ccdaff; } .modal__modal-body__3RyP- .modal__modal-body-main__2GB9V .modal__modal-body-main-scroll__2FNaY .modal__modal-body-main-inner__2zuzy .modal__selector-btn-add__3XUml:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .modal__modal-body__3RyP- .modal__modal-body-main__2GB9V .modal__modal-body-main-scroll__2FNaY .modal__modal-body-main-inner__2zuzy .modal__selector-btn-add__3XUml:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .modal__modal-body__3RyP- .modal__modal-body-main__2GB9V .modal__modal-body-main-scroll__2FNaY .modal__modal-body-main-inner__2zuzy .modal__selector-btn-add__3XUml .modal__add-img__3lWEU { font-size: 28px; height: auto; margin-bottom: 8px; } .modal__modal-body__3RyP- .modal__modal-body-main__2GB9V .modal__modal-body-main-scroll__2FNaY .modal__modal-body-main-inner__2zuzy .modal__selector-btn-add__3XUml .modal__add-label__3-gsq { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .modal__modal-body__3RyP- .modal__modal-body-main__2GB9V .modal__modal-body-main-scroll__2FNaY .modal__modal-body-main-inner__2zuzy .modal__selector-btn-item__1LEZC { justify-content: space-between; } .modal__modal-body__3RyP- .modal__modal-body-main__2GB9V .modal__modal-body-main-scroll__2FNaY .modal__modal-body-main-inner__2zuzy .modal__selector-btn-item__1LEZC .modal__item-img__IahpQ { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .modal__modal-body__3RyP- .modal__modal-body-main__2GB9V .modal__modal-body-main-scroll__2FNaY .modal__modal-body-main-inner__2zuzy .modal__selector-btn-item__1LEZC .modal__item-img__IahpQ img { width: auto; height: 105px; } .modal__modal-body__3RyP- .modal__modal-body-main__2GB9V .modal__modal-body-main-scroll__2FNaY .modal__modal-body-main-inner__2zuzy .modal__selector-btn-item__1LEZC .modal__item-label__bewJy { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .modal__modal-footer__XYxAq { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .modal__selector-btn-add__3XUml, .modal__selector-btn-item__1LEZC { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .modal__selector-btn-add__3XUml { background-color: var(--selector-sprite-bg_primary); } .modal__selector-btn-add__3XUml:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .modal__selector-btn-add__3XUml:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .modal__selector-btn-add__3XUml .modal__add-img__3lWEU { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .modal__selector-btn-add__3XUml .modal__add-label__3-gsq { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .modal__selector-btn-item__1LEZC { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .modal__selector-btn-item__1LEZC .modal__item-img__IahpQ { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .modal__selector-btn-item__1LEZC .modal__item-img__IahpQ img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .modal__selector-btn-item__1LEZC .modal__item-label__bewJy { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .modal__selector-btn-item__1LEZC:hover { background-color: var(--selector-sprite-bg_primary); } .modal__selector-btn-item__1LEZC:hover .modal__item-img__IahpQ { border-color: var(--selector-sprite-bg_primary); } .modal__selector-btn-item_selected__1VIlk { background-color: var(--selector-sprite-bg_primary); } .modal__selector-btn-item_selected__1VIlk .modal__item-img__IahpQ { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .modal__menu-bar-btn__3uEGo { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .modal__menu-bar-btn_green__3eIFO, .modal__menu-bar-btn_create__21nzI { background-color: #3cdc8f; } .modal__menu-bar-btn_green__3eIFO:hover, .modal__menu-bar-btn_create__21nzI:hover { background-color: #00d374; } .modal__menu-bar-btn_green__3eIFO:active, .modal__menu-bar-btn_create__21nzI:active { background-color: #00d374; } .modal__menu-bar-btn_save__25zLs, .modal__menu-bar-btn_reset__D3XOp { background-color: #6ac8ff; } .modal__menu-bar-btn_save__25zLs:hover, .modal__menu-bar-btn_reset__D3XOp:hover { background-color: #57bcfe; } .modal__menu-bar-btn_save__25zLs:active, .modal__menu-bar-btn_reset__D3XOp:active { background-color: #4fb0fc; } .modal__menu-bar-btn_submit__2cS66, .modal__menu-bar-btn_open__gX-Uu { background-color: #ff9e23; } .modal__menu-bar-btn_submit__2cS66:hover, .modal__menu-bar-btn_open__gX-Uu:hover { background-color: #f47b04; } .modal__menu-bar-btn_submit__2cS66:active, .modal__menu-bar-btn_open__gX-Uu:active { background-color: #fe8f22; } .modal__menu-bar-btn_link__2lEl0 { background-color: #e8efff; color: var(--theme-primary); } .modal__menu-bar-btn_link__2lEl0:hover { background-color: #b6c7ff; } .modal__menu-bar-btn_link__2lEl0:active { background-color: #cfdcff; } .modal__menu-bar-btn_disabled__2-BVp { color: #565266; background-color: #e6e9ed; } .modal__menu-bar-btn_disabled__2-BVp:hover { cursor: not-allowed; } .modal__menu-bar-btn_help__1C19A { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .modal__menu-bar-btn_help__1C19A:hover { background-color: #8398ff; } .modal__menu-bar-btn_help__1C19A:active { background-color: #8ca3ff; } .modal__menu-bar-separator__10MX7 { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .modal__modal-overlay__2RDmW { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .modal__modal-overlay__2RDmW .modal__modal-wrap__QFx2a { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .modal__modal-overlay__2RDmW .modal__modal-wrap__QFx2a .modal__modal-header-wrap__HKgHv { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .modal__modal-overlay__2RDmW .modal__modal-wrap__QFx2a .modal__modal-header-wrap__HKgHv .modal__modal-header-bg__fG-pq { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .modal__modal-overlay__2RDmW .modal__modal-wrap__QFx2a .modal__modal-header-wrap__HKgHv .modal__modal-header-label__Mywya { flex-shrink: 0; font-size: 16px; font-weight: bold; } .modal__modal-overlay__2RDmW .modal__modal-wrap__QFx2a .modal__modal-header-wrap__HKgHv .modal__modal-header-close__3Hwze { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .modal__modal-overlay__2RDmW .modal__modal-wrap__QFx2a .modal__modal-header-wrap__HKgHv .modal__modal-header-close__3Hwze:hover { color: #98a2b4; } .modal__modal-overlay__2RDmW .modal__modal-wrap__QFx2a .modal__modal-body-wrap__2AV_W { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .modal__modal-overlay__2RDmW .modal__modal-wrap__QFx2a .modal__modal-footer-wrap__OaOcS { flex-shrink: 0; display: flex; } .modal__modal-content__aQnMP * { box-sizing: border-box; } .modal__modal-content__aQnMP { margin: 100px auto; outline: none; border: 4px solid rgba(255, 255, 255, 0.25); padding: 0; border-radius: calc(4px); font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; color: #565266; overflow: hidden; } .modal__modal-content__aQnMP.modal__full-screen__2VH01 { position: absolute; display: flex; height: 100%; width: 100%; overflow-y: auto; -webkit-overflow-scrolling: 'touch'; background-color: #e9f1fc; /* Default modal resets */ margin: 0; border: none; border-radius: 0; } /* Modal header has 3 items: |filter title x| Use the same width for both side item containers, so that title remains centered */ .modal__header__pMofr { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; height: 3.125rem; box-sizing: border-box; width: 100%; background-color: var(--theme-primary); font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-size: 1rem; font-weight: normal; } .modal__header-item__2-otG { display: flex; align-items: center; padding: 1rem; text-decoration: none; color: #ffffff; } [dir='ltr'] .modal__header-image__1r-_m { margin-right: 0.5rem; } [dir='rtl'] .modal__header-image__1r-_m { margin-left: 0.5rem; } .modal__header-item-filter__1m8aM { display: flex; flex-basis: 20rem; justify-content: flex-start; } .modal__header-item-title__n37_W { flex-grow: 1; flex-shrink: 0; justify-content: center; letter-spacing: 0.4px; cursor: url(static/cursor/cursor-auto.cur), auto; } [dir='ltr'] .modal__header-item-title__n37_W { margin: 0 -20rem 0 0; } [dir='rtl'] .modal__header-item-title__n37_W { margin: 0 0 0 -20rem; } .modal__full-screen__2VH01 [dir='ltr'] .modal__header-item-title__n37_W { margin: 0 0 0 -20rem; } .modal__full-screen__2VH01 [dir='rtl'] .modal__header-item-title__n37_W { margin: 0 -20rem 0 0; } .modal__header-item-close__tsmXt { flex-basis: 20rem; justify-content: flex-end; z-index: 1; } .modal__full-screen__2VH01 .modal__header-item-close__tsmXt { order: -1; justify-content: flex-start; } .modal__back-button__3mGUE { font-weight: normal; padding-right: 0; padding-left: 0; } [dir='rtl'] .modal__back-button__3mGUE img { transform: scaleX(-1); } .modal__header-item-help__2-azT { padding: 0; z-index: 1; } [dir='ltr'] .modal__header-item-help__2-azT { margin-right: -4.75rem; } [dir='rtl'] .modal__header-item-help__2-azT { margin-left: -4.75rem; } .modal__help-button__2bBpa { font-weight: normal; font-size: 0.75rem; } [dir='ltr'] .modal__help-button__2bBpa { padding-right: 0; } [dir='rtl'] .modal__help-button__2bBpa { padding-left: 0; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .prompt__modal-content__2ny0O { width: 360px; } .prompt__body__13Toz { background: #ffffff; padding: 1.5rem 2.25rem; } .prompt__body__13Toz input[type='checkbox'], .prompt__body__13Toz input[type='radio'] { margin: 3px; } .prompt__label__3zgoz { font-weight: 500; margin: 0 0 0.75rem; } .prompt__disabled-label__2hLD9 { opacity: 0.5; } .prompt__variable-name-text-input__32j5z { margin-bottom: 1.5rem; width: 100%; border: 1px solid #e8efff; border-radius: 5px; padding: 0 1rem; height: 3rem; color: rgba(87, 94, 117, 0.75); font-size: 0.875rem; } .prompt__info-message__CMRbA { font-weight: normal; font-size: 0.875rem; margin-bottom: 1.5rem; text-align: center; } .prompt__options-row__1ZBCg { display: flex; font-weight: normal; justify-content: space-between; margin-bottom: 1.5rem; } .prompt__margin-bttom16__OMcqM { margin-bottom: 1rem; } .prompt__button-row__3A8O8 { font-weight: bolder; text-align: right; } .prompt__button-row__3A8O8 button { padding: 0.75rem 1rem; border-radius: 0.25rem; background: white; border: 1px solid #e8efff; font-weight: 600; font-size: 0.85rem; } .prompt__button-row__3A8O8 button.prompt__ok-button__3NWpW { background: var(--theme-primary); border: var(--theme-primary); color: white; } [dir='ltr'] .prompt__button-row__3A8O8 button + button { margin-left: 0.5rem; } [dir='rtl'] .prompt__button-row__3A8O8 button + button { margin-right: 0.5rem; } .prompt__cloud-option__18KQV { display: flex; border-top: 1px dashed rgba(0, 0, 0, 0.25); overflow: visible; padding: 1rem 0; text-align: center; width: 100%; margin: 0 auto; } .prompt__cloud-option-text__aGuCC { opacity: 0.5; } .prompt__file-selected__ZFDGM { font-size: 0.875rem; } .prompt__file-selected__ZFDGM .ant-checkbox-wrapper { color: #3d4554; } .prompt__file-selected__ZFDGM .ant-checkbox-wrapper .ant-checkbox .ant-checkbox-inner { border: 1.5px solid #d1d7e1; border-radius: 2px; width: 0.875rem; height: 0.875rem; } .prompt__file-selected__ZFDGM .ant-checkbox-wrapper .ant-checkbox.ant-checkbox-checked .ant-checkbox-inner { border: 1px solid #6a7fff; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .blocks__blocks__34z1w { height: 100%; } .blocks__drag-over__2ZR1u:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.75; background-color: #8abbff; transition: all 0.25s ease; } .blocks__blocks__34z1w .injectionDiv { position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-top: 1px solid #ccdcff; } [dir='rtl'] .blocks__blocks__34z1w .injectionDiv { border-top-right-radius: 0; border-bottom-right-radius: 0; border-top-left-radius: 0.5rem; border-bottom-left-radius: 0.5rem; } .blocks__blocks__34z1w .blocklyMainBackground { stroke: none; } .blocks__blocks__34z1w .blocklyToolboxDiv { border-bottom: 1px solid #e8efff; box-sizing: content-box; /* height: calc(100% - 3.25rem) !important; */ /* @TrumanGao 隐藏外部扩展 */ height: 100% !important; /* For now, the layout cannot support scrollbars in the category menu. The line below works for Edge, the `::-webkit-scrollbar` line below that is for webkit browsers. It isn't possible to do the same for Firefox, so a different solution may be needed for them. */ -ms-overflow-style: none; transition: background-color 0.3s; color: var(--color); background-size: 0% 0%; background-color: #f7f7ff; } .blocks__blocks__34z1w .blocklyToolboxDiv::before, .blocks__blocks__34z1w .blocklyToolboxDiv::after { content: ''; position: fixed; top: 85px; /* left: 0; */ width: 50px; height: calc(100% - 85px); pointer-events: none; transition: 0.3s; background-repeat: no-repeat; background-position: 50% calc(50% - 14px), 50% 50%; background-image: inherit; opacity: 0; z-index: 44; } .blocks__blocks__34z1w .blocklyToolboxDiv::before { z-index: 44; background-size: 28px 10px, 0; } .blocks__blocks__34z1w .blocklyToolboxDiv::after { z-index: 43; background-color: rgba(0, 0, 0, 0.5); background-size: 0, 21px 21px; } .blocks__blocks__34z1w .blocklyToolboxDiv:hover::before { transition: all 0.5s, opacity 0.5s 0.2s; background-position: 50% calc(50% - 35px), 50% 50%; opacity: 0 !important; } .blocks__blocks__34z1w .blocklyToolboxDiv.blocklyToolboxDelete::before, .blocks__blocks__34z1w .blocklyToolboxDiv.blocklyToolboxDelete::after { opacity: 1; } .blocks__blocks__34z1w .blocklyToolboxDiv.blocklyToolboxDelete .scratchCategoryMenuItem { pointer-events: none; } .blocks__blocks__34z1w .blocklyToolboxDiv.blocklyToolboxDelete .scratchCategoryMenuItem::before, .blocks__blocks__34z1w .blocklyToolboxDiv.blocklyToolboxDelete .scratchCategoryMenuItem::after { transition: opacity 0.3s 0s; visibility: hidden; opacity: 0; } .blocks__blocks__34z1w .blocklyToolboxDiv.blocklyToolboxDelete .scratchCategoryMenuItem .scratchCategoryMenuItemWrapper { opacity: 0; } [dir='rtl'] .blocks__blocks__34z1w .blocklyToolboxDiv { border-right: none; border-left: 1px solid #e8efff; } .blocks__blocks__34z1w .blocklyToolboxDiv::-webkit-scrollbar { display: none; } .blocks__blocks__34z1w .scratchCategoryMenu { width: 50px; padding-bottom: calc(58px); min-height: calc(92%); background-color: #f7f7ff; } .blocks__blocks__34z1w .scratchCategoryMenuRow { margin: 8px 0 0 4px; position: relative; } .blocks__blocks__34z1w .scratchCategoryMenuItem { padding-right: 2px; border-radius: 6px 0 0 6px; } .blocks__blocks__34z1w .scratchCategoryMenuItem:hover { background-color: #e7eaff; position: relative; z-index: 1; } .blocks__blocks__34z1w .scratchCategoryMenuItem:hover .scratchCategoryItemImg { background-color: transparent !important; } .blocks__blocks__34z1w .scratchCategoryMenuItem:active { background-color: #e7eaff; } .blocks__blocks__34z1w .scratchCategoryMenuItem.categorySelected { background-color: #e7eaff; } .blocks__blocks__34z1w .scratchCategoryMenuItem.categorySelected .scratchCategoryItemImg { background-color: transparent !important; } .blocks__blocks__34z1w .scratchCategoryMenuItem.categorySelected .scratchCategoryMenuItemWrapper { position: absolute; top: -8px; right: -1px; width: 20px; height: calc(100% + 18px); background-color: #e7eaff; -webkit-clip-path: polygon(50% 0, 100% 0, 100% 100%, 50% 100%); clip-path: polygon(50% 0, 100% 0, 100% 100%, 50% 100%); } .blocks__blocks__34z1w .scratchCategoryMenuItem.categorySelected::after, .blocks__blocks__34z1w .scratchCategoryMenuItem.categorySelected::before { content: ''; display: block; position: absolute; height: 20px; width: 20px; right: 0; background-color: #f7f7ff; border-radius: 50%; z-index: 1; opacity: 1; transition: opacity 0s 0.3s; } .blocks__blocks__34z1w .scratchCategoryMenuItem.categorySelected::before { top: 100%; -webkit-clip-path: inset(0 0 50% 50%); clip-path: inset(0 0 50% 50%); } .blocks__blocks__34z1w .scratchCategoryMenuItem.categorySelected::after { top: -20px; -webkit-clip-path: inset(60% 0 0 50%); clip-path: inset(60% 0 0 50%); } .blocks__blocks__34z1w .blocklyFlyout { border-right: none; box-sizing: content-box; } [dir='rtl'] .blocks__blocks__34z1w .blocklyFlyout { border-right: none; border-left: 1px solid #e8efff; } .blocks__blocks__34z1w .blocklyBlockDragSurface { /* Fix an issue where the drag surface was preventing hover events for sharing blocks. This does not prevent user interaction on the blocks themselves. */ pointer-events: none; z-index: 1000; /* make blocks match gui drag layer */ } .blocks__blocks__34z1w .scratchCategoryItemImg { width: 24px; height: 24px; margin: 0 auto 4px; position: relative; background-size: 24px 24px; background-position: cover; border-radius: 8px; } /* Shrink category font to fit "My Blocks" for now. Probably will need different solutions for language support later, so make the change here instead of in scratch-blocks. */ .blocks__blocks__34z1w .scratchCategoryMenuItemLabel { /* font-size: 0.65rem; */ /* @TrumanGao 修改字体大小 */ font-size: 13px; position: relative; z-index: 2; } .blocks__blocks__34z1w .categorySelected > .scratchCategoryMenuItemLabel { color: var(--theme-primary); } .blocks__blocks__34z1w .blocklyMinimalBody { min-width: auto; min-height: auto; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .blocks_jr__blocks__11Ug0 { height: 100%; } .blocks_jr__drag-over__2q1gH:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.75; background-color: #8abbff; transition: all 0.25s ease; } .blocks_jr__blocks__11Ug0 .injectionDiv { position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-left: 1px solid #d7e5fc; } [dir='rtl'] .blocks_jr__blocks__11Ug0 .injectionDiv { border-top-right-radius: 0; border-bottom-right-radius: 0; border-top-left-radius: 0.5rem; border-bottom-left-radius: 0.5rem; } .blocks_jr__blocks__11Ug0 .blocklyMainBackground { stroke: none; } .blocks_jr__blocks__11Ug0 .blocklyToolboxDiv { border-bottom: 1px solid #e8efff; box-sizing: content-box; /* height: calc(100% - 3.25rem) !important; */ /* @TrumanGao 隐藏外部扩展 */ height: 100% !important; /* For now, the layout cannot support scrollbars in the category menu. The line below works for Edge, the `::-webkit-scrollbar` line below that is for webkit browsers. It isn't possible to do the same for Firefox, so a different solution may be needed for them. */ -ms-overflow-style: none; transition: background-color 0.3s; color: var(--color); background-size: 0% 0%; background-color: #f7f7ff; } .blocks_jr__blocks__11Ug0 .blocklyToolboxDiv::before, .blocks_jr__blocks__11Ug0 .blocklyToolboxDiv::after { content: ''; position: fixed; top: var(--menu-bar-height); /* left: 0; */ width: var(--block-category-menu-width); height: calc(100% - var(--menu-bar-height)); pointer-events: none; transition: 0.3s; background-repeat: no-repeat; background-position: 50% calc(50% - 14px), 50% 50%; background-image: inherit; opacity: 0; z-index: 44; } .blocks_jr__blocks__11Ug0 .blocklyToolboxDiv::before { z-index: 44; background-size: 28px 10px, 0; } .blocks_jr__blocks__11Ug0 .blocklyToolboxDiv::after { z-index: 43; background-color: rgba(0, 0, 0, 0.5); background-size: 0, 21px 21px; } .blocks_jr__blocks__11Ug0 .blocklyToolboxDiv:hover::before { transition: all 0.5s, opacity 0.5s 0.2s; background-position: 50% calc(50% - 35px), 50% 50%; opacity: 0 !important; } .blocks_jr__blocks__11Ug0 .blocklyToolboxDiv.blocklyToolboxDelete::before, .blocks_jr__blocks__11Ug0 .blocklyToolboxDiv.blocklyToolboxDelete::after { opacity: 1; } .blocks_jr__blocks__11Ug0 .blocklyToolboxDiv.blocklyToolboxDelete .scratchCategoryMenuItem { pointer-events: none; } .blocks_jr__blocks__11Ug0 .blocklyToolboxDiv.blocklyToolboxDelete .scratchCategoryMenuItem::before, .blocks_jr__blocks__11Ug0 .blocklyToolboxDiv.blocklyToolboxDelete .scratchCategoryMenuItem::after { transition: opacity 0.3s 0s; visibility: hidden; opacity: 0; } .blocks_jr__blocks__11Ug0 .blocklyToolboxDiv.blocklyToolboxDelete .scratchCategoryMenuItem .scratchCategoryMenuItemWrapper { opacity: 0; } [dir='rtl'] .blocks_jr__blocks__11Ug0 .blocklyToolboxDiv { border-right: none; border-left: 1px solid #e8efff; } .blocks_jr__blocks__11Ug0 .blocklyToolboxDiv::-webkit-scrollbar { display: none; } .blocks_jr__blocks__11Ug0 .scratchCategoryMenu { width: var(--block-category-menu-width); min-height: calc(92%); background-color: #f6fafe; } .blocks_jr__blocks__11Ug0 .scratchCategoryMenuRow { margin: 8px 0 0 4px; position: relative; } .blocks_jr__blocks__11Ug0 .scratchCategoryMenuItem { padding-right: 2px; border-radius: 6px 0 0 6px; } .blocks_jr__blocks__11Ug0 .scratchCategoryMenuItem:hover { background-color: #e7eaff; position: relative; z-index: 1; } .blocks_jr__blocks__11Ug0 .scratchCategoryMenuItem:hover .scratchCategoryItemImg { background-color: transparent !important; } .blocks_jr__blocks__11Ug0 .scratchCategoryMenuItem:active { background-color: #e7eaff; } .blocks_jr__blocks__11Ug0 .scratchCategoryMenuItem.categorySelected { background-color: #e7eaff; } .blocks_jr__blocks__11Ug0 .scratchCategoryMenuItem.categorySelected .scratchCategoryItemImg { background-color: transparent !important; } .blocks_jr__blocks__11Ug0 .scratchCategoryMenuItem.categorySelected .scratchCategoryMenuItemWrapper { position: absolute; top: -8px; right: -1px; width: 20px; height: calc(100% + 18px); background-color: #e7eaff; -webkit-clip-path: polygon(50% 0, 100% 0, 100% 100%, 50% 100%); clip-path: polygon(50% 0, 100% 0, 100% 100%, 50% 100%); } .blocks_jr__blocks__11Ug0 .scratchCategoryMenuItem.categorySelected::after, .blocks_jr__blocks__11Ug0 .scratchCategoryMenuItem.categorySelected::before { content: ''; display: block; position: absolute; height: 20px; width: 20px; right: 0; background-color: #f7f7ff; border-radius: 50%; z-index: 1; opacity: 1; transition: opacity 0s 0.3s; } .blocks_jr__blocks__11Ug0 .scratchCategoryMenuItem.categorySelected::before { top: 100%; -webkit-clip-path: inset(0 0 50% 50%); clip-path: inset(0 0 50% 50%); } .blocks_jr__blocks__11Ug0 .scratchCategoryMenuItem.categorySelected::after { top: -20px; -webkit-clip-path: inset(60% 0 0 50%); clip-path: inset(60% 0 0 50%); } .blocks_jr__blocks__11Ug0 .blocklyFlyout { border-right: none; box-sizing: content-box; transition: none; } [dir='rtl'] .blocks_jr__blocks__11Ug0 .blocklyFlyout { border-right: none; border-left: 1px solid #e8efff; } .blocks_jr__blocks__11Ug0 .blocklyBlockDragSurface { /* Fix an issue where the drag surface was preventing hover events for sharing blocks. This does not prevent user interaction on the blocks themselves. */ pointer-events: none; z-index: 1000; /* make blocks match gui drag layer */ } .blocks_jr__blocks__11Ug0 .scratchCategoryItemImg { width: 2.25rem; height: 2.25rem; margin: 0 auto 4px; position: relative; background-size: 2.25rem 2.25rem; background-position: cover; border-radius: 8px; } /* Shrink category font to fit "My Blocks" for now. Probably will need different solutions for language support later, so make the change here instead of in scratch-blocks. */ .blocks_jr__blocks__11Ug0 .scratchCategoryMenuItemLabel { /* font-size: 0.65rem; */ /* @TrumanGao 修改字体大小 */ font-size: 13px; position: relative; z-index: 2; } .blocks_jr__blocks__11Ug0 .categorySelected > .scratchCategoryMenuItemLabel { color: var(--theme-primary); } .blocks_jr__blocks__11Ug0 .blocklyMinimalBody { min-width: auto; min-height: auto; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .custom-procedures__modal-content__2HyVj { width: 700px; margin: 50px auto; /* This modal is taller than most, reduce top margin */ } .custom-procedures__body__tB-uO { background: #ffffff; padding: 1.5rem 2.25rem; } .custom-procedures__body__tB-uO input[type='checkbox'], .custom-procedures__body__tB-uO input[type='radio'] { margin: 3px; } /* Blocks workspace for custom procedure declaration editor */ .custom-procedures__workspace__1lnaX { min-height: 200px; position: relative; } .custom-procedures__workspace__1lnaX .injectionDiv { position: absolute; top: 0; right: 0; bottom: 0; left: 0; } .custom-procedures__workspace__1lnaX .blocklySvg { background-color: #e6ebff; } /* Row of "card" buttons for modifying custom procedures */ .custom-procedures__options-row__JDPpZ { display: flex; justify-content: space-between; } .custom-procedures__option-card__3Ns6K { background: white; border: 2px solid #e8efff; border-radius: calc(4px); padding: calc(1rem); text-align: center; flex-grow: 1; cursor: pointer; transition: all 0.2s; flex-basis: 100px; } .custom-procedures__option-card__3Ns6K:hover { border: 2px solid var(--theme-primary); box-shadow: 0px 0px 0px 4px rgba(77, 151, 255, 0.35); } .custom-procedures__option-card__3Ns6K + .custom-procedures__option-card__3Ns6K { margin-left: 1rem; } .custom-procedures__option-icon__TcXS8 { height: 48px; margin-bottom: 0.5rem; } .custom-procedures__option-title__2in2i { font-weight: bold; } /* "Run without screen refresh" row */ .custom-procedures__checkbox-row__3E-Dp { margin-top: 1rem; } /* Confirmation buttons at the bottom of the modal */ .custom-procedures__button-row__3kb7k { margin-top: 1rem; font-weight: bolder; text-align: right; } .custom-procedures__button-row__3kb7k button { border: 1px solid #e8efff; border-radius: 0.25rem; padding: 0.75rem 1rem; background: white; font-weight: bold; font-size: 0.85rem; } .custom-procedures__button-row__3kb7k button.custom-procedures__ok-button__1HSko { background: var(--theme-primary); border: var(--theme-primary); color: white; } [dir='ltr'] .custom-procedures__button-row__3kb7k button + button { margin-left: 0.5rem; } [dir='rtl'] .custom-procedures__button-row__3kb7k button + button { margin-right: 0.5rem; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* typography start */ body { font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; } h2 { font-size: 1.5rem; font-weight: bold; } p { font-size: 1rem; line-height: 1.5em; } input, button, select, optgroup, textarea { line-height: normal; } /* typography end */ .browser-modal__modal-overlay__36Z8G { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 1050; background-color: rgba(0, 0, 0, 0.64); } .browser-modal__modal-content__jT65L { margin: 100px auto; outline: none; border: 0.25rem solid rgba(255, 255, 255, 0.25); padding: 0; border-radius: calc(4px); width: 500px; color: #565266; overflow: hidden; } .browser-modal__illustration__3DSWr { display: flex; align-items: center; justify-content: center; width: 100%; height: 100px; background-color: #ffab1a; } [dir='rtl'] .browser-modal__illustration__3DSWr { transform: scaleX(-1); } .browser-modal__illustration__3DSWr img { height: 80%; width: auto; } .browser-modal__body__3cN0R { background: #ffffff; padding: 1.5rem 2.25rem; text-align: center; } /* Confirmation buttons at the bottom of the modal */ .browser-modal__button-row__mYkhP { margin: 1.5rem 0; font-weight: bolder; text-align: right; display: flex; justify-content: center; } .browser-modal__button-row__mYkhP button { border: 1px solid var(--theme-primary); border-radius: 0.25rem; padding: 0.5rem 2rem; background: var(--theme-primary); color: white; font-weight: bold; font-size: 0.875rem; cursor: pointer; } .browser-modal__faq-link-text__2YAZr { margin: 2rem 0 0.5rem 0; font-size: 0.875rem; color: #565266; } .browser-modal__faq-link__2aXpq { color: var(--theme-primary); text-decoration: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* typography start */ body { font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; } h2 { font-size: 1.5rem; font-weight: bold; } p { font-size: 1rem; line-height: 1.5em; } input, button, select, optgroup, textarea { line-height: normal; } /* typography end */ .crash-message__crash-wrapper__3WgTi { background-color: var(--theme-primary); width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; } .crash-message__body__2vqX_ { width: 35%; color: white; text-align: center; } .crash-message__reloadButton__1H0kN { border: 1px solid var(--theme-primary); border-radius: 0.25rem; padding: 0.5rem 2rem; background: white; color: var(--theme-primary); font-weight: bold; font-size: 0.875rem; cursor: pointer; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .library__flex-center__onqtR { display: flex; align-items: center; justify-content: center; } .library__full-filled__1ZMCw { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .library__modal-mask__35SKK { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .library__modal-mask__35SKK .library__modal-wrap__31DEg { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .library__modal-mask__35SKK .library__modal-wrap__31DEg .library__modal-header-wrap__2txdx { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .library__modal-mask__35SKK .library__modal-wrap__31DEg .library__modal-header-wrap__2txdx .library__modal-header-bg__ZLSZS { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .library__modal-mask__35SKK .library__modal-wrap__31DEg .library__modal-header-wrap__2txdx .library__modal-header-label__JDtjf { flex-shrink: 0; font-size: 16px; font-weight: bold; } .library__modal-mask__35SKK .library__modal-wrap__31DEg .library__modal-header-wrap__2txdx .library__modal-header-close__3uAuF { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .library__modal-mask__35SKK .library__modal-wrap__31DEg .library__modal-header-wrap__2txdx .library__modal-header-close__3uAuF:hover { color: #98a2b4; } .library__modal-mask__35SKK .library__modal-wrap__31DEg .library__modal-body-wrap__7EpTP { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .library__modal-mask__35SKK .library__modal-wrap__31DEg .library__modal-footer-wrap__3FMaK { flex-shrink: 0; display: flex; } .library__modal-header__2A45q { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .library__modal-header__2A45q .library__modal-header-upload__2VHKY { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .library__modal-header__2A45q .library__modal-header-upload__2VHKY:hover { background-color: #e0e9ff; } .library__modal-header__2A45q .library__modal-header-upload__2VHKY:active { background-color: #ccdaff; } .library__modal-header__2A45q .library__modal-header-upload__2VHKY .library__upload-img__3wo0- { font-size: 16px; margin-right: calc(2px); } .library__modal-header__2A45q .library__modal-header-upload__2VHKY .library__upload-label__3itAp { font-size: 14px; } .library__modal-header__2A45q .library__modal-header-upload__2VHKY .library__upload-input__TwwWM { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .library__modal-header__2A45q .library__modal-header-search__1sJgJ { position: relative; } .library__modal-header__2A45q .library__modal-header-search__1sJgJ .library__search-input__1xlXm { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .library__modal-header__2A45q .library__modal-header-search__1sJgJ .library__search-input__1xlXm::-webkit-input-placeholder { color: #98a2b4; } .library__modal-header__2A45q .library__modal-header-search__1sJgJ .library__search-input__1xlXm::-moz-placeholder { color: #98a2b4; } .library__modal-header__2A45q .library__modal-header-search__1sJgJ .library__search-input__1xlXm:-ms-input-placeholder { color: #98a2b4; } .library__modal-header__2A45q .library__modal-header-search__1sJgJ .library__search-input__1xlXm:hover { border-color: #d1d7e1; } .library__modal-header__2A45q .library__modal-header-search__1sJgJ .library__search-input__1xlXm:active { border-color: #d1d7e1; } .library__modal-header__2A45q .library__modal-header-search__1sJgJ .library__search-img__2PEci { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .library__modal-body__17YMr { flex-grow: 1; display: flex; } .library__modal-body__17YMr .library__modal-body-left__3Eil1, .library__modal-body__17YMr .library__modal-body-main__3C1BO { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .library__modal-body__17YMr .library__modal-body-left__3Eil1 { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .library__modal-body__17YMr .library__modal-body-left__3Eil1 .library__modal-body-left-scroll__2Rvne { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .library__modal-body__17YMr .library__modal-body-left__3Eil1 .library__modal-body-left-scroll__2Rvne .library__modal-body-left-inner__3-uac { width: 121px; padding: calc(12px); color: #5e6b81; } .library__modal-body__17YMr .library__modal-body-left__3Eil1 .library__modal-body-left-scroll__2Rvne .library__modal-body-left-inner__3-uac .library__menu-item-current__14XXB { color: var(--theme-primary); background-color: #e0e9ff; } .library__modal-body__17YMr .library__modal-body-left__3Eil1 .library__modal-body-left-scroll__2Rvne .library__modal-body-left-inner__3-uac .library__menu-item__3W8m1 { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .library__modal-body__17YMr .library__modal-body-left__3Eil1 .library__modal-body-left-scroll__2Rvne .library__modal-body-left-inner__3-uac .library__menu-item__3W8m1:hover { background-color: #edeff5; } .library__modal-body__17YMr .library__modal-body-left__3Eil1 .library__modal-body-left-scroll__2Rvne .library__modal-body-left-inner__3-uac .library__menu-item__3W8m1 .library__menu-item-img__Y2uVJ { flex-shrink: 0; width: 20px; margin-right: 8px; } .library__modal-body__17YMr .library__modal-body-left__3Eil1 .library__modal-body-left-scroll__2Rvne .library__modal-body-left-inner__3-uac .library__menu-item__3W8m1 .library__menu-item-label__3XRdz { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .library__modal-body__17YMr .library__modal-body-main__3C1BO { padding: calc(12px) 0; } .library__modal-body__17YMr .library__modal-body-main__3C1BO .library__modal-body-main-scroll__1l45k { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .library__modal-body__17YMr .library__modal-body-main__3C1BO .library__modal-body-main-scroll__1l45k .library__modal-body-main-inner__19Xeh { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .library__modal-body__17YMr .library__modal-body-main__3C1BO .library__modal-body-main-scroll__1l45k .library__modal-body-main-inner__19Xeh .library__selector-btn-add__3ae1S, .library__modal-body__17YMr .library__modal-body-main__3C1BO .library__modal-body-main-scroll__1l45k .library__modal-body-main-inner__19Xeh .library__selector-btn-item__3klD6 { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .library__modal-body__17YMr .library__modal-body-main__3C1BO .library__modal-body-main-scroll__1l45k .library__modal-body-main-inner__19Xeh .library__selector-btn-add__3ae1S:hover, .library__modal-body__17YMr .library__modal-body-main__3C1BO .library__modal-body-main-scroll__1l45k .library__modal-body-main-inner__19Xeh .library__selector-btn-item__3klD6:hover { background-color: #e0e9ff; } .library__modal-body__17YMr .library__modal-body-main__3C1BO .library__modal-body-main-scroll__1l45k .library__modal-body-main-inner__19Xeh .library__selector-btn-add__3ae1S:active, .library__modal-body__17YMr .library__modal-body-main__3C1BO .library__modal-body-main-scroll__1l45k .library__modal-body-main-inner__19Xeh .library__selector-btn-item__3klD6:active { background-color: #ccdaff; } .library__modal-body__17YMr .library__modal-body-main__3C1BO .library__modal-body-main-scroll__1l45k .library__modal-body-main-inner__19Xeh .library__selector-btn-add__3ae1S:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .library__modal-body__17YMr .library__modal-body-main__3C1BO .library__modal-body-main-scroll__1l45k .library__modal-body-main-inner__19Xeh .library__selector-btn-add__3ae1S:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .library__modal-body__17YMr .library__modal-body-main__3C1BO .library__modal-body-main-scroll__1l45k .library__modal-body-main-inner__19Xeh .library__selector-btn-add__3ae1S .library__add-img__2obPD { font-size: 28px; height: auto; margin-bottom: 8px; } .library__modal-body__17YMr .library__modal-body-main__3C1BO .library__modal-body-main-scroll__1l45k .library__modal-body-main-inner__19Xeh .library__selector-btn-add__3ae1S .library__add-label__Lonvk { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .library__modal-body__17YMr .library__modal-body-main__3C1BO .library__modal-body-main-scroll__1l45k .library__modal-body-main-inner__19Xeh .library__selector-btn-item__3klD6 { justify-content: space-between; } .library__modal-body__17YMr .library__modal-body-main__3C1BO .library__modal-body-main-scroll__1l45k .library__modal-body-main-inner__19Xeh .library__selector-btn-item__3klD6 .library__item-img__24AdM { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .library__modal-body__17YMr .library__modal-body-main__3C1BO .library__modal-body-main-scroll__1l45k .library__modal-body-main-inner__19Xeh .library__selector-btn-item__3klD6 .library__item-img__24AdM img { width: auto; height: 105px; } .library__modal-body__17YMr .library__modal-body-main__3C1BO .library__modal-body-main-scroll__1l45k .library__modal-body-main-inner__19Xeh .library__selector-btn-item__3klD6 .library__item-label__1H3yR { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .library__modal-footer__1Mkzu { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .library__selector-btn-add__3ae1S, .library__selector-btn-item__3klD6 { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .library__selector-btn-add__3ae1S { background-color: var(--selector-sprite-bg_primary); } .library__selector-btn-add__3ae1S:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .library__selector-btn-add__3ae1S:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .library__selector-btn-add__3ae1S .library__add-img__2obPD { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .library__selector-btn-add__3ae1S .library__add-label__Lonvk { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .library__selector-btn-item__3klD6 { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .library__selector-btn-item__3klD6 .library__item-img__24AdM { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .library__selector-btn-item__3klD6 .library__item-img__24AdM img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .library__selector-btn-item__3klD6 .library__item-label__1H3yR { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .library__selector-btn-item__3klD6:hover { background-color: var(--selector-sprite-bg_primary); } .library__selector-btn-item__3klD6:hover .library__item-img__24AdM { border-color: var(--selector-sprite-bg_primary); } .library__selector-btn-item_selected__3lsva { background-color: var(--selector-sprite-bg_primary); } .library__selector-btn-item_selected__3lsva .library__item-img__24AdM { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .library__menu-bar-btn__3ingo { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .library__menu-bar-btn_green__3AfiC, .library__menu-bar-btn_create__Ems2e { background-color: #3cdc8f; } .library__menu-bar-btn_green__3AfiC:hover, .library__menu-bar-btn_create__Ems2e:hover { background-color: #00d374; } .library__menu-bar-btn_green__3AfiC:active, .library__menu-bar-btn_create__Ems2e:active { background-color: #00d374; } .library__menu-bar-btn_save__12MJp, .library__menu-bar-btn_reset__2mQkq { background-color: #6ac8ff; } .library__menu-bar-btn_save__12MJp:hover, .library__menu-bar-btn_reset__2mQkq:hover { background-color: #57bcfe; } .library__menu-bar-btn_save__12MJp:active, .library__menu-bar-btn_reset__2mQkq:active { background-color: #4fb0fc; } .library__menu-bar-btn_submit__1XCvW, .library__menu-bar-btn_open__2ZQoU { background-color: #ff9e23; } .library__menu-bar-btn_submit__1XCvW:hover, .library__menu-bar-btn_open__2ZQoU:hover { background-color: #f47b04; } .library__menu-bar-btn_submit__1XCvW:active, .library__menu-bar-btn_open__2ZQoU:active { background-color: #fe8f22; } .library__menu-bar-btn_link__C2oR6 { background-color: #e8efff; color: var(--theme-primary); } .library__menu-bar-btn_link__C2oR6:hover { background-color: #b6c7ff; } .library__menu-bar-btn_link__C2oR6:active { background-color: #cfdcff; } .library__menu-bar-btn_disabled__1iH6t { color: #565266; background-color: #e6e9ed; } .library__menu-bar-btn_disabled__1iH6t:hover { cursor: not-allowed; } .library__menu-bar-btn_help__3lOcZ { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .library__menu-bar-btn_help__3lOcZ:hover { background-color: #8398ff; } .library__menu-bar-btn_help__3lOcZ:active { background-color: #8ca3ff; } .library__menu-bar-separator__16MAw { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .device-modal { height: 624px !important; } .device-modal > *:first-child > img:first-child { display: none; } .library__del-icon__2PyaZ { color: #ff6666; font-size: 21px; object-fit: contain; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .library__del-icon__2PyaZ:hover { color: #ff4747; } .library__del-icon__2PyaZ:active { color: #f64b4b; } @keyframes library__fadeIn_img__1wMeU { 0% { opacity: 0; } to { opacity: 1; } } @keyframes library__fadeIn_outline__138dX { 0% { outline: 2px solid transparent; } to { outline: 2px solid var(--theme-primary); } } .library__modal-body__17YMr { display: flex; height: 100%; width: 100%; box-sizing: border-box; background-color: var(--theme-primary); } .library__modal-body__17YMr > section { height: 100%; position: relative; } .library__modal-body__17YMr > section:first-child { flex: 0 0 490px; display: flex; flex-direction: column; background-color: #ffffff; padding: 10px 0px 0px 13px; border-right: 1px solid #e8efff; box-sizing: inherit; } .library__modal-body__17YMr > section:first-child .library__tabs__1PUZ1 { flex: 0 0 44px; display: flex; overflow: visible; align-items: center; list-style: none; justify-content: space-between; height: 44px; border-radius: 8px; margin-bottom: 10px; padding: 0; } .library__modal-body__17YMr > section:first-child .library__tabs__1PUZ1 li { background-color: transparent; white-space: nowrap; overflow: visible; height: 36px; line-height: 36px; margin: 0 10px; display: block; text-align: center; box-sizing: content-box; flex: 1 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; font-size: 14px; color: #5e6b81; position: relative; font-weight: 400; } .library__modal-body__17YMr > section:first-child .library__tabs__1PUZ1 li:hover { color: var(--theme-primary); font-weight: 400; } .library__modal-body__17YMr > section:first-child .library__tabs__1PUZ1 li.library__selected__2EWt_ { color: var(--theme-primary); font-weight: 600; } .library__modal-body__17YMr > section:first-child .library__tabs__1PUZ1 li.library__selected__2EWt_::after { content: ''; display: block; position: absolute; top: 24px; left: 50%; transform: translate(-50%, 8px); width: 16px; height: 3px; border-radius: 12px; background-color: var(--theme-primary); } .library__modal-body__17YMr > section:first-child .library__list-wrapper__qS6wx { flex: 1 0; align-content: flex-start; overflow-x: hidden; overflow-y: visible; background-color: #ffffff; display: flex; flex-wrap: wrap; border-radius: 10px; justify-content: flex-start; } .library__modal-body__17YMr > section:first-child .library__list-wrapper__qS6wx .library__item__2gFxf { box-sizing: border-box; display: flex; flex-wrap: wrap; margin: 0; padding: 2px; outline-offset: 1px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .library__modal-body__17YMr > section:first-child .library__list-wrapper__qS6wx .library__item__2gFxf.library__selected__2EWt_ .library__item-wrapper-selected__ruvID { visibility: visible !important; } .library__modal-body__17YMr > section:first-child .library__list-wrapper__qS6wx .library__item__2gFxf.library__selected__2EWt_ .library__item-wrapper__T5bnh { outline: 2px solid var(--theme-primary); } .library__modal-body__17YMr > section:first-child .library__list-wrapper__qS6wx .library__item__2gFxf.library__flash__1CyM_ .library__item-wrapper-unselected__R0FnD { visibility: visible !important; animation: library__fadeIn_img__1wMeU ease 0.4s infinite alternate; } .library__modal-body__17YMr > section:first-child .library__list-wrapper__qS6wx .library__item__2gFxf.library__flash__1CyM_ .library__item-wrapper__T5bnh { outline: 2px solid var(--theme-primary); animation: library__fadeIn_outline__138dX ease 0.4s infinite alternate; } .library__modal-body__17YMr > section:first-child .library__list-wrapper__qS6wx .library__item__2gFxf .library__item-wrapper__T5bnh { border: 1px solid #e6e8eb; border-radius: 7px; margin: 10px 0; width: 146px; } .library__modal-body__17YMr > section:first-child .library__list-wrapper__qS6wx .library__item__2gFxf .library__item-wrapper__T5bnh:hover { outline: 2px solid var(--theme-primary); } .library__modal-body__17YMr > section:first-child .library__list-wrapper__qS6wx .library__item__2gFxf .library__item-wrapper__T5bnh:hover .library__item-wrapper-unselected__R0FnD { visibility: visible !important; } .library__modal-body__17YMr > section:first-child .library__list-wrapper__qS6wx .library__item__2gFxf .library__item-wrapper__T5bnh .library__item-img__24AdM { height: 98px; width: 100%; background: #9dd4ff; flex: 1 0 100%; display: flex; justify-content: center; align-items: center; border-top-left-radius: 7px; border-top-right-radius: 7px; position: relative; } .library__modal-body__17YMr > section:first-child .library__list-wrapper__qS6wx .library__item__2gFxf .library__item-wrapper__T5bnh .library__item-img__24AdM .library__item-wrapper-bg__2idLb { height: 72px; width: 72px; object-fit: contain; } .library__modal-body__17YMr > section:first-child .library__list-wrapper__qS6wx .library__item__2gFxf .library__item-wrapper__T5bnh .library__item-img__24AdM .library__item-wrapper-unselected__R0FnD, .library__modal-body__17YMr > section:first-child .library__list-wrapper__qS6wx .library__item__2gFxf .library__item-wrapper__T5bnh .library__item-img__24AdM .library__item-wrapper-selected__ruvID { height: 19px; width: 19px; object-fit: contain; visibility: hidden; position: absolute; top: 7px; right: 11px; } .library__modal-body__17YMr > section:first-child .library__list-wrapper__qS6wx .library__item__2gFxf .library__item-wrapper__T5bnh .library__item-img__24AdM .library__item-wrapper-unselected__R0FnD { border: 2px solid #ffffff; background-color: rgba(255, 255, 255, 0.6); border-radius: 50%; } .library__modal-body__17YMr > section:first-child .library__list-wrapper__qS6wx .library__item__2gFxf .library__item-wrapper__T5bnh .library__item-text__2G8Uh { box-sizing: border-box; height: 72px; padding: 8px 10px 10px; overflow: hidden; } .library__modal-body__17YMr > section:first-child .library__list-wrapper__qS6wx .library__item__2gFxf .library__item-wrapper__T5bnh .library__item-text__2G8Uh .library__item-label__1H3yR { flex: 1 0 100%; display: block; width: 100%; color: #5e6b81; font-size: 14px; line-height: 14px; font-weight: 600; } .library__modal-body__17YMr > section:first-child .library__list-wrapper__qS6wx .library__item__2gFxf .library__item-wrapper__T5bnh .library__item-text__2G8Uh p { color: #828da3; font-size: 12px; line-height: 17px; font-weight: 400; margin-top: 8px; height: 36px; overflow: hidden; } .library__modal-body__17YMr > section:last-child { flex: 1 0 310px; background-color: #ffffff; } .library__modal-body__17YMr > section:last-child .library__no-device__3zXQ0 { height: 293px; object-fit: contain; display: block; position: relative; left: 50%; transform: translate(-50%, 0px); top: 74px; } .library__modal-body__17YMr > section:last-child header { margin-top: 20px; margin-left: 16px; position: relative; } .library__modal-body__17YMr > section:last-child header h2 { font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-size: 14px; font-style: normal; font-weight: 600; line-height: 14px; letter-spacing: 0em; text-align: left; margin: 0; padding: 0; color: #565266; } .library__modal-body__17YMr > section:last-child header .library__reset-btn__G9wjQ { position: absolute; top: -4px; right: 16px; color: #98a2b4; font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-size: 14px; font-style: normal; font-weight: 400; line-height: 12px; cursor: url(static/cursor/cursor-pointer.cur), pointer; transition: none; } .library__modal-body__17YMr > section:last-child header .library__reset-btn__G9wjQ:hover { color: #5e6b81; } .library__modal-body__17YMr > section:last-child header .library__reset-btn__G9wjQ:active { color: #3d4554; } .library__modal-body__17YMr > section:last-child header .library__reset-btn__G9wjQ span { margin-top: 1px; margin-right: 2px; font-size: 18px; display: inline-block; vertical-align: text-top; } .library__modal-body__17YMr > section:last-child header .library__reset-btn__G9wjQ img { height: 12px; object-fit: contain; margin-right: 2px; } .library__modal-body__17YMr > section:last-child .library__mother-board__3PDXB { height: 100px; width: 290px; border-radius: 8px; position: relative; left: 50%; margin: 16px 0 10px 0px; transform: translate(-50%, 0); background-color: #f0f4ff; } .library__modal-body__17YMr > section:last-child .library__mother-board__3PDXB .library__mother-board-item__1hiJV { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; flex-direction: column; position: relative; } .library__modal-body__17YMr > section:last-child .library__mother-board__3PDXB .library__mother-board-item__1hiJV .library__mother-board-del__1E_G6 { color: #ff6666; font-size: 21px; object-fit: contain; cursor: url(static/cursor/cursor-pointer.cur), pointer; position: absolute; top: -6px; right: -6px; } .library__modal-body__17YMr > section:last-child .library__mother-board__3PDXB .library__mother-board-item__1hiJV .library__mother-board-del__1E_G6:hover { color: #ff4747; } .library__modal-body__17YMr > section:last-child .library__mother-board__3PDXB .library__mother-board-item__1hiJV .library__mother-board-del__1E_G6:active { color: #f64b4b; } .library__modal-body__17YMr > section:last-child .library__mother-board__3PDXB .library__mother-board-item__1hiJV .library__mother-board-img__3y7eL { height: 48px; object-fit: contain; } .library__modal-body__17YMr > section:last-child .library__mother-board__3PDXB .library__mother-board-item__1hiJV .library__mother-board-label__fvfEK { display: block; font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-size: 14px; font-style: normal; font-weight: 400; line-height: 12px; color: #595f73; margin-top: 16px; } .library__modal-body__17YMr > section:last-child .library__widgets__9RvFP { width: 100%; height: 335px; display: flex; flex-wrap: wrap; overflow-x: hidden; overflow-y: visible; align-content: flex-start; padding: 6px 0 16px 16px; } .library__modal-body__17YMr > section:last-child .library__widgets__9RvFP .library__widget-item__28Y_Y { flex: 0 0 33%; max-width: 33%; height: 100px; margin-bottom: 16px; } .library__modal-body__17YMr > section:last-child .library__widgets__9RvFP .library__widget-item__28Y_Y .library__widget-item-wrapper__3vFqj { border-radius: 8px; height: 100%; width: 86px; background-color: #f0f4ff; display: flex; flex-direction: column; justify-content: center; align-items: center; position: relative; } .library__modal-body__17YMr > section:last-child .library__widgets__9RvFP .library__widget-item__28Y_Y .library__widget-item-wrapper__3vFqj .library__widget-item-del__29z8o { color: #ff6666; font-size: 21px; object-fit: contain; cursor: url(static/cursor/cursor-pointer.cur), pointer; position: absolute; top: -6px; right: -6px; } .library__modal-body__17YMr > section:last-child .library__widgets__9RvFP .library__widget-item__28Y_Y .library__widget-item-wrapper__3vFqj .library__widget-item-del__29z8o:hover { color: #ff4747; } .library__modal-body__17YMr > section:last-child .library__widgets__9RvFP .library__widget-item__28Y_Y .library__widget-item-wrapper__3vFqj .library__widget-item-del__29z8o:active { color: #f64b4b; } .library__modal-body__17YMr > section:last-child .library__widgets__9RvFP .library__widget-item__28Y_Y .library__widget-item-wrapper__3vFqj .library__widget-item-img__3zZFT { height: 48px; object-fit: contain; } .library__modal-body__17YMr > section:last-child .library__widgets__9RvFP .library__widget-item__28Y_Y .library__widget-item-wrapper__3vFqj .library__widget-item-label__YyX4l { font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-size: 12px; font-style: normal; font-weight: 400; line-height: 12px; color: #565266; margin-top: 16px; } .library__modal-body__17YMr > section:last-child .library__connect-btn__gUU1X { height: 40px; width: 290px; position: absolute; left: 50%; bottom: 16px; transform: translate(-50%, 0); } .library__modal-body__17YMr > section:last-child .library__connect-btn__gUU1X button { border: none; outline: none; height: 100%; width: 100%; background-color: var(--theme-primary); font-size: 14px; color: #fff; font-weight: 600; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .library__modal-body__17YMr > section:last-child .library__connect-btn__gUU1X button:hover { background-color: #4250d3; } .library__modal-body__17YMr > section:last-child .library__connect-btn__gUU1X button:active { background-color: #222ba6; } .library__modal-body__17YMr > section:last-child .library__connect-btn__gUU1X button:disabled { background-color: #b3beff; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .modal__flex-center__329PV { display: flex; align-items: center; justify-content: center; } .modal__full-filled__ssrV6 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .modal__modal-mask__2_1-X { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .modal__modal-mask__2_1-X .modal__modal-wrap__194yQ { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .modal__modal-mask__2_1-X .modal__modal-wrap__194yQ .modal__modal-header-wrap__1Jf07 { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .modal__modal-mask__2_1-X .modal__modal-wrap__194yQ .modal__modal-header-wrap__1Jf07 .modal__modal-header-bg__3rz-C { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .modal__modal-mask__2_1-X .modal__modal-wrap__194yQ .modal__modal-header-wrap__1Jf07 .modal__modal-header-label__2REbs { flex-shrink: 0; font-size: 16px; font-weight: bold; } .modal__modal-mask__2_1-X .modal__modal-wrap__194yQ .modal__modal-header-wrap__1Jf07 .modal__modal-header-close__mUATm { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .modal__modal-mask__2_1-X .modal__modal-wrap__194yQ .modal__modal-header-wrap__1Jf07 .modal__modal-header-close__mUATm:hover { color: #98a2b4; } .modal__modal-mask__2_1-X .modal__modal-wrap__194yQ .modal__modal-body-wrap__1dUHn { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .modal__modal-mask__2_1-X .modal__modal-wrap__194yQ .modal__modal-footer-wrap__LbY88 { flex-shrink: 0; display: flex; } .modal__modal-header__3UpOo { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .modal__modal-header__3UpOo .modal__modal-header-upload__TDg3M { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .modal__modal-header__3UpOo .modal__modal-header-upload__TDg3M:hover { background-color: #e0e9ff; } .modal__modal-header__3UpOo .modal__modal-header-upload__TDg3M:active { background-color: #ccdaff; } .modal__modal-header__3UpOo .modal__modal-header-upload__TDg3M .modal__upload-img__3mRBi { font-size: 16px; margin-right: calc(2px); } .modal__modal-header__3UpOo .modal__modal-header-upload__TDg3M .modal__upload-label__3Qz2N { font-size: 14px; } .modal__modal-header__3UpOo .modal__modal-header-upload__TDg3M .modal__upload-input__1e840 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .modal__modal-header__3UpOo .modal__modal-header-search__2igl5 { position: relative; } .modal__modal-header__3UpOo .modal__modal-header-search__2igl5 .modal__search-input__KfzF7 { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .modal__modal-header__3UpOo .modal__modal-header-search__2igl5 .modal__search-input__KfzF7::-webkit-input-placeholder { color: #98a2b4; } .modal__modal-header__3UpOo .modal__modal-header-search__2igl5 .modal__search-input__KfzF7::-moz-placeholder { color: #98a2b4; } .modal__modal-header__3UpOo .modal__modal-header-search__2igl5 .modal__search-input__KfzF7:-ms-input-placeholder { color: #98a2b4; } .modal__modal-header__3UpOo .modal__modal-header-search__2igl5 .modal__search-input__KfzF7:hover { border-color: #d1d7e1; } .modal__modal-header__3UpOo .modal__modal-header-search__2igl5 .modal__search-input__KfzF7:active { border-color: #d1d7e1; } .modal__modal-header__3UpOo .modal__modal-header-search__2igl5 .modal__search-img__R_ZBX { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .modal__modal-body__3Crc2 { flex-grow: 1; display: flex; } .modal__modal-body__3Crc2 .modal__modal-body-left__2LAG5, .modal__modal-body__3Crc2 .modal__modal-body-main__2NWUT { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .modal__modal-body__3Crc2 .modal__modal-body-left__2LAG5 { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .modal__modal-body__3Crc2 .modal__modal-body-left__2LAG5 .modal__modal-body-left-scroll__3n2Io { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .modal__modal-body__3Crc2 .modal__modal-body-left__2LAG5 .modal__modal-body-left-scroll__3n2Io .modal__modal-body-left-inner__3Nkvq { width: 121px; padding: calc(12px); color: #5e6b81; } .modal__modal-body__3Crc2 .modal__modal-body-left__2LAG5 .modal__modal-body-left-scroll__3n2Io .modal__modal-body-left-inner__3Nkvq .modal__menu-item-current__1O6Ra { color: var(--theme-primary); background-color: #e0e9ff; } .modal__modal-body__3Crc2 .modal__modal-body-left__2LAG5 .modal__modal-body-left-scroll__3n2Io .modal__modal-body-left-inner__3Nkvq .modal__menu-item__YOFzd { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .modal__modal-body__3Crc2 .modal__modal-body-left__2LAG5 .modal__modal-body-left-scroll__3n2Io .modal__modal-body-left-inner__3Nkvq .modal__menu-item__YOFzd:hover { background-color: #edeff5; } .modal__modal-body__3Crc2 .modal__modal-body-left__2LAG5 .modal__modal-body-left-scroll__3n2Io .modal__modal-body-left-inner__3Nkvq .modal__menu-item__YOFzd .modal__menu-item-img__1l1a_ { flex-shrink: 0; width: 20px; margin-right: 8px; } .modal__modal-body__3Crc2 .modal__modal-body-left__2LAG5 .modal__modal-body-left-scroll__3n2Io .modal__modal-body-left-inner__3Nkvq .modal__menu-item__YOFzd .modal__menu-item-label__3C5Do { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .modal__modal-body__3Crc2 .modal__modal-body-main__2NWUT { padding: calc(12px) 0; } .modal__modal-body__3Crc2 .modal__modal-body-main__2NWUT .modal__modal-body-main-scroll__y6Ojp { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .modal__modal-body__3Crc2 .modal__modal-body-main__2NWUT .modal__modal-body-main-scroll__y6Ojp .modal__modal-body-main-inner__9PVNh { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .modal__modal-body__3Crc2 .modal__modal-body-main__2NWUT .modal__modal-body-main-scroll__y6Ojp .modal__modal-body-main-inner__9PVNh .modal__selector-btn-add__2tLh8, .modal__modal-body__3Crc2 .modal__modal-body-main__2NWUT .modal__modal-body-main-scroll__y6Ojp .modal__modal-body-main-inner__9PVNh .modal__selector-btn-item__1OIT5 { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .modal__modal-body__3Crc2 .modal__modal-body-main__2NWUT .modal__modal-body-main-scroll__y6Ojp .modal__modal-body-main-inner__9PVNh .modal__selector-btn-add__2tLh8:hover, .modal__modal-body__3Crc2 .modal__modal-body-main__2NWUT .modal__modal-body-main-scroll__y6Ojp .modal__modal-body-main-inner__9PVNh .modal__selector-btn-item__1OIT5:hover { background-color: #e0e9ff; } .modal__modal-body__3Crc2 .modal__modal-body-main__2NWUT .modal__modal-body-main-scroll__y6Ojp .modal__modal-body-main-inner__9PVNh .modal__selector-btn-add__2tLh8:active, .modal__modal-body__3Crc2 .modal__modal-body-main__2NWUT .modal__modal-body-main-scroll__y6Ojp .modal__modal-body-main-inner__9PVNh .modal__selector-btn-item__1OIT5:active { background-color: #ccdaff; } .modal__modal-body__3Crc2 .modal__modal-body-main__2NWUT .modal__modal-body-main-scroll__y6Ojp .modal__modal-body-main-inner__9PVNh .modal__selector-btn-add__2tLh8:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .modal__modal-body__3Crc2 .modal__modal-body-main__2NWUT .modal__modal-body-main-scroll__y6Ojp .modal__modal-body-main-inner__9PVNh .modal__selector-btn-add__2tLh8:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .modal__modal-body__3Crc2 .modal__modal-body-main__2NWUT .modal__modal-body-main-scroll__y6Ojp .modal__modal-body-main-inner__9PVNh .modal__selector-btn-add__2tLh8 .modal__add-img__3tLGu { font-size: 28px; height: auto; margin-bottom: 8px; } .modal__modal-body__3Crc2 .modal__modal-body-main__2NWUT .modal__modal-body-main-scroll__y6Ojp .modal__modal-body-main-inner__9PVNh .modal__selector-btn-add__2tLh8 .modal__add-label__3izNR { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .modal__modal-body__3Crc2 .modal__modal-body-main__2NWUT .modal__modal-body-main-scroll__y6Ojp .modal__modal-body-main-inner__9PVNh .modal__selector-btn-item__1OIT5 { justify-content: space-between; } .modal__modal-body__3Crc2 .modal__modal-body-main__2NWUT .modal__modal-body-main-scroll__y6Ojp .modal__modal-body-main-inner__9PVNh .modal__selector-btn-item__1OIT5 .modal__item-img__1bTOM { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .modal__modal-body__3Crc2 .modal__modal-body-main__2NWUT .modal__modal-body-main-scroll__y6Ojp .modal__modal-body-main-inner__9PVNh .modal__selector-btn-item__1OIT5 .modal__item-img__1bTOM img { width: auto; height: 105px; } .modal__modal-body__3Crc2 .modal__modal-body-main__2NWUT .modal__modal-body-main-scroll__y6Ojp .modal__modal-body-main-inner__9PVNh .modal__selector-btn-item__1OIT5 .modal__item-label__s9jLw { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .modal__modal-footer__3j2OC { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .modal__selector-btn-add__2tLh8, .modal__selector-btn-item__1OIT5 { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .modal__selector-btn-add__2tLh8 { background-color: var(--selector-sprite-bg_primary); } .modal__selector-btn-add__2tLh8:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .modal__selector-btn-add__2tLh8:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .modal__selector-btn-add__2tLh8 .modal__add-img__3tLGu { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .modal__selector-btn-add__2tLh8 .modal__add-label__3izNR { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .modal__selector-btn-item__1OIT5 { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .modal__selector-btn-item__1OIT5 .modal__item-img__1bTOM { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .modal__selector-btn-item__1OIT5 .modal__item-img__1bTOM img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .modal__selector-btn-item__1OIT5 .modal__item-label__s9jLw { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .modal__selector-btn-item__1OIT5:hover { background-color: var(--selector-sprite-bg_primary); } .modal__selector-btn-item__1OIT5:hover .modal__item-img__1bTOM { border-color: var(--selector-sprite-bg_primary); } .modal__selector-btn-item_selected__sxSQp { background-color: var(--selector-sprite-bg_primary); } .modal__selector-btn-item_selected__sxSQp .modal__item-img__1bTOM { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .modal__menu-bar-btn__pyhgI { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .modal__menu-bar-btn_green__1yvcM, .modal__menu-bar-btn_create__L12Sc { background-color: #3cdc8f; } .modal__menu-bar-btn_green__1yvcM:hover, .modal__menu-bar-btn_create__L12Sc:hover { background-color: #00d374; } .modal__menu-bar-btn_green__1yvcM:active, .modal__menu-bar-btn_create__L12Sc:active { background-color: #00d374; } .modal__menu-bar-btn_save__1TJMF, .modal__menu-bar-btn_reset__350BD { background-color: #6ac8ff; } .modal__menu-bar-btn_save__1TJMF:hover, .modal__menu-bar-btn_reset__350BD:hover { background-color: #57bcfe; } .modal__menu-bar-btn_save__1TJMF:active, .modal__menu-bar-btn_reset__350BD:active { background-color: #4fb0fc; } .modal__menu-bar-btn_submit__2oYLk, .modal__menu-bar-btn_open__NnOHi { background-color: #ff9e23; } .modal__menu-bar-btn_submit__2oYLk:hover, .modal__menu-bar-btn_open__NnOHi:hover { background-color: #f47b04; } .modal__menu-bar-btn_submit__2oYLk:active, .modal__menu-bar-btn_open__NnOHi:active { background-color: #fe8f22; } .modal__menu-bar-btn_link__3uXE5 { background-color: #e8efff; color: var(--theme-primary); } .modal__menu-bar-btn_link__3uXE5:hover { background-color: #b6c7ff; } .modal__menu-bar-btn_link__3uXE5:active { background-color: #cfdcff; } .modal__menu-bar-btn_disabled__oROzA { color: #565266; background-color: #e6e9ed; } .modal__menu-bar-btn_disabled__oROzA:hover { cursor: not-allowed; } .modal__menu-bar-btn_help__334i4 { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .modal__menu-bar-btn_help__334i4:hover { background-color: #8398ff; } .modal__menu-bar-btn_help__334i4:active { background-color: #8ca3ff; } .modal__menu-bar-separator__27kMs { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .input__input-form__wE4XI { height: 2rem; padding: 0 0.75rem; background-color: transparent; /* font-size: 0.625rem; */ /* @TrumanGao 修改字体大小 */ font-size: 0.9rem; /* font-weight: bold; */ color: #565266; border-width: 1px; border-style: solid; border-color: #ccdcff; border-radius: 2rem; outline: none; cursor: text; /* transition: 0.25s ease-out; @todo: standardize with var */ box-shadow: none; -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; /* For truncating overflowing text gracefully Min-width is for a bug: https://css-tricks.com/flexbox-truncated-text @todo: move this out into a mixin or a helper component */ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; -webkit-appearance: none; } .input__input-form__wE4XI:hover { border-color: #8899ff; } .input__input-form__wE4XI:focus { border-color: #8899ff; } .input__input-form__wE4XI:disabled { cursor: url(static/cursor/cursor-auto.cur), auto; border-color: #e8efff !important; box-shadow: none !important; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .input__input-small__3QqII { width: 3rem; text-overflow: clip; text-align: center; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .dial__container__GZJuV { padding: 1rem; display: flex; justify-content: center; align-items: center; } .dial__dial-container__1TZb9 { position: relative; } .dial__dial-face__3wzAK, .dial__dial-handle__o3SNc, .dial__gauge__dd0SY { position: absolute; top: 0; left: 0; overflow: visible; } .dial__dial-face__3wzAK { width: 100%; } .dial__dial-handle__o3SNc { cursor: pointer; width: 40px; height: 40px; /* Use margin to make positioning via top/left easier */ margin-left: calc(-20px); margin-top: calc(-20px); } .dial__gauge-path__3fqb2 { fill: rgba(77, 151, 255, 0.35); stroke: var(--theme-primary); stroke-width: 1px; } .direction-picker__button-row__CzXbv { display: flex; flex-direction: row; justify-content: center; } .direction-picker__icon-button__Vu_aO { margin: 0.25rem; border: none; background: none; outline: none; cursor: pointer; } .direction-picker__icon-button__Vu_aO:active > img { width: 20px; height: 20px; transform: scale(1.15); } .direction-picker__icon-button__Vu_aO > img { transition: transform 0.1s; filter: grayscale(100%); } .direction-picker__icon-button__Vu_aO.direction-picker__active__2rRIe > img { filter: none; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .sprite-info__flex-center__3DdRi { display: flex; align-items: center; justify-content: center; } .sprite-info__full-filled__1aWLs { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .sprite-info__modal-mask__18iZY { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .sprite-info__modal-mask__18iZY .sprite-info__modal-wrap__2hJQf { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .sprite-info__modal-mask__18iZY .sprite-info__modal-wrap__2hJQf .sprite-info__modal-header-wrap__3t9m_ { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .sprite-info__modal-mask__18iZY .sprite-info__modal-wrap__2hJQf .sprite-info__modal-header-wrap__3t9m_ .sprite-info__modal-header-bg__3H3-_ { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .sprite-info__modal-mask__18iZY .sprite-info__modal-wrap__2hJQf .sprite-info__modal-header-wrap__3t9m_ .sprite-info__modal-header-label__20jsx { flex-shrink: 0; font-size: 16px; font-weight: bold; } .sprite-info__modal-mask__18iZY .sprite-info__modal-wrap__2hJQf .sprite-info__modal-header-wrap__3t9m_ .sprite-info__modal-header-close__1q3Kk { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .sprite-info__modal-mask__18iZY .sprite-info__modal-wrap__2hJQf .sprite-info__modal-header-wrap__3t9m_ .sprite-info__modal-header-close__1q3Kk:hover { color: #98a2b4; } .sprite-info__modal-mask__18iZY .sprite-info__modal-wrap__2hJQf .sprite-info__modal-body-wrap__gkmvo { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .sprite-info__modal-mask__18iZY .sprite-info__modal-wrap__2hJQf .sprite-info__modal-footer-wrap__3R5Uf { flex-shrink: 0; display: flex; } .sprite-info__modal-header__SuRuh { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .sprite-info__modal-header__SuRuh .sprite-info__modal-header-upload__3_bFp { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .sprite-info__modal-header__SuRuh .sprite-info__modal-header-upload__3_bFp:hover { background-color: #e0e9ff; } .sprite-info__modal-header__SuRuh .sprite-info__modal-header-upload__3_bFp:active { background-color: #ccdaff; } .sprite-info__modal-header__SuRuh .sprite-info__modal-header-upload__3_bFp .sprite-info__upload-img__Fwtfs { font-size: 16px; margin-right: calc(2px); } .sprite-info__modal-header__SuRuh .sprite-info__modal-header-upload__3_bFp .sprite-info__upload-label__3s4ML { font-size: 14px; } .sprite-info__modal-header__SuRuh .sprite-info__modal-header-upload__3_bFp .sprite-info__upload-input__O8qKB { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .sprite-info__modal-header__SuRuh .sprite-info__modal-header-search__qPDTY { position: relative; } .sprite-info__modal-header__SuRuh .sprite-info__modal-header-search__qPDTY .sprite-info__search-input__39smM { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .sprite-info__modal-header__SuRuh .sprite-info__modal-header-search__qPDTY .sprite-info__search-input__39smM::-webkit-input-placeholder { color: #98a2b4; } .sprite-info__modal-header__SuRuh .sprite-info__modal-header-search__qPDTY .sprite-info__search-input__39smM::-moz-placeholder { color: #98a2b4; } .sprite-info__modal-header__SuRuh .sprite-info__modal-header-search__qPDTY .sprite-info__search-input__39smM:-ms-input-placeholder { color: #98a2b4; } .sprite-info__modal-header__SuRuh .sprite-info__modal-header-search__qPDTY .sprite-info__search-input__39smM:hover { border-color: #d1d7e1; } .sprite-info__modal-header__SuRuh .sprite-info__modal-header-search__qPDTY .sprite-info__search-input__39smM:active { border-color: #d1d7e1; } .sprite-info__modal-header__SuRuh .sprite-info__modal-header-search__qPDTY .sprite-info__search-img__OZEPD { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .sprite-info__modal-body__1dmpd { flex-grow: 1; display: flex; } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-left__3o0SF, .sprite-info__modal-body__1dmpd .sprite-info__modal-body-main__1dnBk { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-left__3o0SF { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-left__3o0SF .sprite-info__modal-body-left-scroll__2_f5L { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-left__3o0SF .sprite-info__modal-body-left-scroll__2_f5L .sprite-info__modal-body-left-inner__3FJe- { width: 121px; padding: calc(12px); color: #5e6b81; } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-left__3o0SF .sprite-info__modal-body-left-scroll__2_f5L .sprite-info__modal-body-left-inner__3FJe- .sprite-info__menu-item-current__ZnDnQ { color: var(--theme-primary); background-color: #e0e9ff; } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-left__3o0SF .sprite-info__modal-body-left-scroll__2_f5L .sprite-info__modal-body-left-inner__3FJe- .sprite-info__menu-item__2SvY5 { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-left__3o0SF .sprite-info__modal-body-left-scroll__2_f5L .sprite-info__modal-body-left-inner__3FJe- .sprite-info__menu-item__2SvY5:hover { background-color: #edeff5; } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-left__3o0SF .sprite-info__modal-body-left-scroll__2_f5L .sprite-info__modal-body-left-inner__3FJe- .sprite-info__menu-item__2SvY5 .sprite-info__menu-item-img__Njut2 { flex-shrink: 0; width: 20px; margin-right: 8px; } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-left__3o0SF .sprite-info__modal-body-left-scroll__2_f5L .sprite-info__modal-body-left-inner__3FJe- .sprite-info__menu-item__2SvY5 .sprite-info__menu-item-label__1RFDB { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-main__1dnBk { padding: calc(12px) 0; } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-main__1dnBk .sprite-info__modal-body-main-scroll__32x1B { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-main__1dnBk .sprite-info__modal-body-main-scroll__32x1B .sprite-info__modal-body-main-inner__3OLhv { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-main__1dnBk .sprite-info__modal-body-main-scroll__32x1B .sprite-info__modal-body-main-inner__3OLhv .sprite-info__selector-btn-add__20Erx, .sprite-info__modal-body__1dmpd .sprite-info__modal-body-main__1dnBk .sprite-info__modal-body-main-scroll__32x1B .sprite-info__modal-body-main-inner__3OLhv .sprite-info__selector-btn-item__30zM5 { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-main__1dnBk .sprite-info__modal-body-main-scroll__32x1B .sprite-info__modal-body-main-inner__3OLhv .sprite-info__selector-btn-add__20Erx:hover, .sprite-info__modal-body__1dmpd .sprite-info__modal-body-main__1dnBk .sprite-info__modal-body-main-scroll__32x1B .sprite-info__modal-body-main-inner__3OLhv .sprite-info__selector-btn-item__30zM5:hover { background-color: #e0e9ff; } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-main__1dnBk .sprite-info__modal-body-main-scroll__32x1B .sprite-info__modal-body-main-inner__3OLhv .sprite-info__selector-btn-add__20Erx:active, .sprite-info__modal-body__1dmpd .sprite-info__modal-body-main__1dnBk .sprite-info__modal-body-main-scroll__32x1B .sprite-info__modal-body-main-inner__3OLhv .sprite-info__selector-btn-item__30zM5:active { background-color: #ccdaff; } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-main__1dnBk .sprite-info__modal-body-main-scroll__32x1B .sprite-info__modal-body-main-inner__3OLhv .sprite-info__selector-btn-add__20Erx:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-main__1dnBk .sprite-info__modal-body-main-scroll__32x1B .sprite-info__modal-body-main-inner__3OLhv .sprite-info__selector-btn-add__20Erx:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-main__1dnBk .sprite-info__modal-body-main-scroll__32x1B .sprite-info__modal-body-main-inner__3OLhv .sprite-info__selector-btn-add__20Erx .sprite-info__add-img__2UJt5 { font-size: 28px; height: auto; margin-bottom: 8px; } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-main__1dnBk .sprite-info__modal-body-main-scroll__32x1B .sprite-info__modal-body-main-inner__3OLhv .sprite-info__selector-btn-add__20Erx .sprite-info__add-label__gv_z_ { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-main__1dnBk .sprite-info__modal-body-main-scroll__32x1B .sprite-info__modal-body-main-inner__3OLhv .sprite-info__selector-btn-item__30zM5 { justify-content: space-between; } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-main__1dnBk .sprite-info__modal-body-main-scroll__32x1B .sprite-info__modal-body-main-inner__3OLhv .sprite-info__selector-btn-item__30zM5 .sprite-info__item-img__2XRWM { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-main__1dnBk .sprite-info__modal-body-main-scroll__32x1B .sprite-info__modal-body-main-inner__3OLhv .sprite-info__selector-btn-item__30zM5 .sprite-info__item-img__2XRWM img { width: auto; height: 105px; } .sprite-info__modal-body__1dmpd .sprite-info__modal-body-main__1dnBk .sprite-info__modal-body-main-scroll__32x1B .sprite-info__modal-body-main-inner__3OLhv .sprite-info__selector-btn-item__30zM5 .sprite-info__item-label__1KL_O { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .sprite-info__modal-footer__1yDam { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .sprite-info__selector-btn-add__20Erx, .sprite-info__selector-btn-item__30zM5 { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .sprite-info__selector-btn-add__20Erx { background-color: var(--selector-sprite-bg_primary); } .sprite-info__selector-btn-add__20Erx:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .sprite-info__selector-btn-add__20Erx:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .sprite-info__selector-btn-add__20Erx .sprite-info__add-img__2UJt5 { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .sprite-info__selector-btn-add__20Erx .sprite-info__add-label__gv_z_ { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .sprite-info__selector-btn-item__30zM5 { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .sprite-info__selector-btn-item__30zM5 .sprite-info__item-img__2XRWM { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .sprite-info__selector-btn-item__30zM5 .sprite-info__item-img__2XRWM img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .sprite-info__selector-btn-item__30zM5 .sprite-info__item-label__1KL_O { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .sprite-info__selector-btn-item__30zM5:hover { background-color: var(--selector-sprite-bg_primary); } .sprite-info__selector-btn-item__30zM5:hover .sprite-info__item-img__2XRWM { border-color: var(--selector-sprite-bg_primary); } .sprite-info__selector-btn-item_selected__1FScJ { background-color: var(--selector-sprite-bg_primary); } .sprite-info__selector-btn-item_selected__1FScJ .sprite-info__item-img__2XRWM { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .sprite-info__menu-bar-btn__13Nme { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .sprite-info__menu-bar-btn_green__3I-sA, .sprite-info__menu-bar-btn_create__3DjQQ { background-color: #3cdc8f; } .sprite-info__menu-bar-btn_green__3I-sA:hover, .sprite-info__menu-bar-btn_create__3DjQQ:hover { background-color: #00d374; } .sprite-info__menu-bar-btn_green__3I-sA:active, .sprite-info__menu-bar-btn_create__3DjQQ:active { background-color: #00d374; } .sprite-info__menu-bar-btn_save__pzbyd, .sprite-info__menu-bar-btn_reset__2_vvh { background-color: #6ac8ff; } .sprite-info__menu-bar-btn_save__pzbyd:hover, .sprite-info__menu-bar-btn_reset__2_vvh:hover { background-color: #57bcfe; } .sprite-info__menu-bar-btn_save__pzbyd:active, .sprite-info__menu-bar-btn_reset__2_vvh:active { background-color: #4fb0fc; } .sprite-info__menu-bar-btn_submit__3McXh, .sprite-info__menu-bar-btn_open__F7QpT { background-color: #ff9e23; } .sprite-info__menu-bar-btn_submit__3McXh:hover, .sprite-info__menu-bar-btn_open__F7QpT:hover { background-color: #f47b04; } .sprite-info__menu-bar-btn_submit__3McXh:active, .sprite-info__menu-bar-btn_open__F7QpT:active { background-color: #fe8f22; } .sprite-info__menu-bar-btn_link__1UmLM { background-color: #e8efff; color: var(--theme-primary); } .sprite-info__menu-bar-btn_link__1UmLM:hover { background-color: #b6c7ff; } .sprite-info__menu-bar-btn_link__1UmLM:active { background-color: #cfdcff; } .sprite-info__menu-bar-btn_disabled__17bAh { color: #565266; background-color: #e6e9ed; } .sprite-info__menu-bar-btn_disabled__17bAh:hover { cursor: not-allowed; } .sprite-info__menu-bar-btn_help__3mMyX { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .sprite-info__menu-bar-btn_help__3mMyX:hover { background-color: #8398ff; } .sprite-info__menu-bar-btn_help__3mMyX:active { background-color: #8ca3ff; } .sprite-info__menu-bar-separator__2GOLL { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .sprite-info__sprite-info__3CQKX { width: 260px; padding-top: 8px; display: flex; margin: 0 auto; } .sprite-info__sprite-info__3CQKX.sprite-info__sprite-info_large__ThVX3 { width: 360px; } .sprite-info__sprite-info__3CQKX.sprite-info__sprite-info_large__ThVX3 .sprite-info__sprite-info-position__2de51 { width: 60px; } .sprite-info__sprite-info__3CQKX .sprite-info__input-label__wNZ09 { flex-shrink: 0; font-size: 12px; color: #828da3; line-height: 20px; white-space: nowrap; } .sprite-info__sprite-info__3CQKX .sprite-info__input-form__3cxlw { flex-shrink: 0; flex-grow: 1; font-size: 12px; color: #3d4554; height: 20px; line-height: 20px; text-align: justify; padding: 0 8px; white-space: nowrap; } .sprite-info__sprite-info__3CQKX .sprite-info__sprite-info-position__2de51, .sprite-info__sprite-info__3CQKX .sprite-info__sprite-info-direction__1XFCs, .sprite-info__sprite-info__3CQKX .sprite-info__sprite-info-size__2VoBG { display: flex; align-items: center; flex-grow: 1; overflow: hidden; } .sprite-info__sprite-info__3CQKX .sprite-info__sprite-info-position__2de51 { width: 50px; position: relative; margin-right: calc(4px); } .sprite-info__sprite-info__3CQKX .sprite-info__sprite-info-position__2de51 .sprite-info__input-label__wNZ09 { position: absolute; left: 8px; } .sprite-info__sprite-info__3CQKX .sprite-info__sprite-info-position__2de51 .sprite-info__input-form__3cxlw { width: 100%; padding-left: 18px; } .sprite-info__sprite-info__3CQKX .sprite-info__sprite-info-direction__1XFCs { width: 72px; margin-right: calc(4px); } .sprite-info__sprite-info__3CQKX .sprite-info__sprite-info-direction__1XFCs .sprite-info__input-label__wNZ09 { margin-right: calc(4px); } .sprite-info__sprite-info__3CQKX .sprite-info__sprite-info-direction__1XFCs .sprite-info__input-form__3cxlw { width: 45px; } .sprite-info__sprite-info__3CQKX .sprite-info__sprite-info-size__2VoBG { width: 64px; } .sprite-info__sprite-info__3CQKX .sprite-info__sprite-info-size__2VoBG .sprite-info__input-label__wNZ09 { margin-right: calc(4px); } .sprite-info__sprite-info__3CQKX .sprite-info__sprite-info-size__2VoBG .sprite-info__input-form__3cxlw { width: 36px; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .sprite-list-item__flex-center__13LMl { display: flex; align-items: center; justify-content: center; } .sprite-list-item__full-filled__1oTcl { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .sprite-list-item__modal-mask__2Oj2y { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .sprite-list-item__modal-mask__2Oj2y .sprite-list-item__modal-wrap__27-7D { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .sprite-list-item__modal-mask__2Oj2y .sprite-list-item__modal-wrap__27-7D .sprite-list-item__modal-header-wrap__1kVvV { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .sprite-list-item__modal-mask__2Oj2y .sprite-list-item__modal-wrap__27-7D .sprite-list-item__modal-header-wrap__1kVvV .sprite-list-item__modal-header-bg__1Wens { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .sprite-list-item__modal-mask__2Oj2y .sprite-list-item__modal-wrap__27-7D .sprite-list-item__modal-header-wrap__1kVvV .sprite-list-item__modal-header-label__25lhK { flex-shrink: 0; font-size: 16px; font-weight: bold; } .sprite-list-item__modal-mask__2Oj2y .sprite-list-item__modal-wrap__27-7D .sprite-list-item__modal-header-wrap__1kVvV .sprite-list-item__modal-header-close__12SyO { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .sprite-list-item__modal-mask__2Oj2y .sprite-list-item__modal-wrap__27-7D .sprite-list-item__modal-header-wrap__1kVvV .sprite-list-item__modal-header-close__12SyO:hover { color: #98a2b4; } .sprite-list-item__modal-mask__2Oj2y .sprite-list-item__modal-wrap__27-7D .sprite-list-item__modal-body-wrap__D-Axh { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .sprite-list-item__modal-mask__2Oj2y .sprite-list-item__modal-wrap__27-7D .sprite-list-item__modal-footer-wrap__3kbPL { flex-shrink: 0; display: flex; } .sprite-list-item__modal-header__1yohI { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .sprite-list-item__modal-header__1yohI .sprite-list-item__modal-header-upload__2g0xR { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .sprite-list-item__modal-header__1yohI .sprite-list-item__modal-header-upload__2g0xR:hover { background-color: #e0e9ff; } .sprite-list-item__modal-header__1yohI .sprite-list-item__modal-header-upload__2g0xR:active { background-color: #ccdaff; } .sprite-list-item__modal-header__1yohI .sprite-list-item__modal-header-upload__2g0xR .sprite-list-item__upload-img__2qo3E { font-size: 16px; margin-right: calc(2px); } .sprite-list-item__modal-header__1yohI .sprite-list-item__modal-header-upload__2g0xR .sprite-list-item__upload-label__3YXEn { font-size: 14px; } .sprite-list-item__modal-header__1yohI .sprite-list-item__modal-header-upload__2g0xR .sprite-list-item__upload-input__1oxOx { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .sprite-list-item__modal-header__1yohI .sprite-list-item__modal-header-search__fdJ-o { position: relative; } .sprite-list-item__modal-header__1yohI .sprite-list-item__modal-header-search__fdJ-o .sprite-list-item__search-input__1sU63 { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .sprite-list-item__modal-header__1yohI .sprite-list-item__modal-header-search__fdJ-o .sprite-list-item__search-input__1sU63::-webkit-input-placeholder { color: #98a2b4; } .sprite-list-item__modal-header__1yohI .sprite-list-item__modal-header-search__fdJ-o .sprite-list-item__search-input__1sU63::-moz-placeholder { color: #98a2b4; } .sprite-list-item__modal-header__1yohI .sprite-list-item__modal-header-search__fdJ-o .sprite-list-item__search-input__1sU63:-ms-input-placeholder { color: #98a2b4; } .sprite-list-item__modal-header__1yohI .sprite-list-item__modal-header-search__fdJ-o .sprite-list-item__search-input__1sU63:hover { border-color: #d1d7e1; } .sprite-list-item__modal-header__1yohI .sprite-list-item__modal-header-search__fdJ-o .sprite-list-item__search-input__1sU63:active { border-color: #d1d7e1; } .sprite-list-item__modal-header__1yohI .sprite-list-item__modal-header-search__fdJ-o .sprite-list-item__search-img__1Fzbf { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .sprite-list-item__modal-body__1oOW0 { flex-grow: 1; display: flex; } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-left__9AMMD, .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-main__V9PvC { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-left__9AMMD { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-left__9AMMD .sprite-list-item__modal-body-left-scroll__fLygn { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-left__9AMMD .sprite-list-item__modal-body-left-scroll__fLygn .sprite-list-item__modal-body-left-inner__3yL2P { width: 121px; padding: calc(12px); color: #5e6b81; } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-left__9AMMD .sprite-list-item__modal-body-left-scroll__fLygn .sprite-list-item__modal-body-left-inner__3yL2P .sprite-list-item__menu-item-current__v7H1W { color: var(--theme-primary); background-color: #e0e9ff; } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-left__9AMMD .sprite-list-item__modal-body-left-scroll__fLygn .sprite-list-item__modal-body-left-inner__3yL2P .sprite-list-item__menu-item__R-NUi { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-left__9AMMD .sprite-list-item__modal-body-left-scroll__fLygn .sprite-list-item__modal-body-left-inner__3yL2P .sprite-list-item__menu-item__R-NUi:hover { background-color: #edeff5; } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-left__9AMMD .sprite-list-item__modal-body-left-scroll__fLygn .sprite-list-item__modal-body-left-inner__3yL2P .sprite-list-item__menu-item__R-NUi .sprite-list-item__menu-item-img__38N9i { flex-shrink: 0; width: 20px; margin-right: 8px; } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-left__9AMMD .sprite-list-item__modal-body-left-scroll__fLygn .sprite-list-item__modal-body-left-inner__3yL2P .sprite-list-item__menu-item__R-NUi .sprite-list-item__menu-item-label__1fO6K { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-main__V9PvC { padding: calc(12px) 0; } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-main__V9PvC .sprite-list-item__modal-body-main-scroll__pbet- { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-main__V9PvC .sprite-list-item__modal-body-main-scroll__pbet- .sprite-list-item__modal-body-main-inner__A0ntA { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-main__V9PvC .sprite-list-item__modal-body-main-scroll__pbet- .sprite-list-item__modal-body-main-inner__A0ntA .sprite-list-item__selector-btn-add__NeS8r, .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-main__V9PvC .sprite-list-item__modal-body-main-scroll__pbet- .sprite-list-item__modal-body-main-inner__A0ntA .sprite-list-item__selector-btn-item__UEt_J { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-main__V9PvC .sprite-list-item__modal-body-main-scroll__pbet- .sprite-list-item__modal-body-main-inner__A0ntA .sprite-list-item__selector-btn-add__NeS8r:hover, .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-main__V9PvC .sprite-list-item__modal-body-main-scroll__pbet- .sprite-list-item__modal-body-main-inner__A0ntA .sprite-list-item__selector-btn-item__UEt_J:hover { background-color: #e0e9ff; } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-main__V9PvC .sprite-list-item__modal-body-main-scroll__pbet- .sprite-list-item__modal-body-main-inner__A0ntA .sprite-list-item__selector-btn-add__NeS8r:active, .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-main__V9PvC .sprite-list-item__modal-body-main-scroll__pbet- .sprite-list-item__modal-body-main-inner__A0ntA .sprite-list-item__selector-btn-item__UEt_J:active { background-color: #ccdaff; } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-main__V9PvC .sprite-list-item__modal-body-main-scroll__pbet- .sprite-list-item__modal-body-main-inner__A0ntA .sprite-list-item__selector-btn-add__NeS8r:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-main__V9PvC .sprite-list-item__modal-body-main-scroll__pbet- .sprite-list-item__modal-body-main-inner__A0ntA .sprite-list-item__selector-btn-add__NeS8r:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-main__V9PvC .sprite-list-item__modal-body-main-scroll__pbet- .sprite-list-item__modal-body-main-inner__A0ntA .sprite-list-item__selector-btn-add__NeS8r .sprite-list-item__add-img__sBCI5 { font-size: 28px; height: auto; margin-bottom: 8px; } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-main__V9PvC .sprite-list-item__modal-body-main-scroll__pbet- .sprite-list-item__modal-body-main-inner__A0ntA .sprite-list-item__selector-btn-add__NeS8r .sprite-list-item__add-label__25tje { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-main__V9PvC .sprite-list-item__modal-body-main-scroll__pbet- .sprite-list-item__modal-body-main-inner__A0ntA .sprite-list-item__selector-btn-item__UEt_J { justify-content: space-between; } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-main__V9PvC .sprite-list-item__modal-body-main-scroll__pbet- .sprite-list-item__modal-body-main-inner__A0ntA .sprite-list-item__selector-btn-item__UEt_J .sprite-list-item__item-img__8MSGV { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-main__V9PvC .sprite-list-item__modal-body-main-scroll__pbet- .sprite-list-item__modal-body-main-inner__A0ntA .sprite-list-item__selector-btn-item__UEt_J .sprite-list-item__item-img__8MSGV img { width: auto; height: 105px; } .sprite-list-item__modal-body__1oOW0 .sprite-list-item__modal-body-main__V9PvC .sprite-list-item__modal-body-main-scroll__pbet- .sprite-list-item__modal-body-main-inner__A0ntA .sprite-list-item__selector-btn-item__UEt_J .sprite-list-item__item-label__2mrTx { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .sprite-list-item__modal-footer__1NnXF { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .sprite-list-item__selector-btn-add__NeS8r, .sprite-list-item__selector-btn-item__UEt_J { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .sprite-list-item__selector-btn-add__NeS8r { background-color: var(--selector-sprite-bg_primary); } .sprite-list-item__selector-btn-add__NeS8r:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .sprite-list-item__selector-btn-add__NeS8r:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .sprite-list-item__selector-btn-add__NeS8r .sprite-list-item__add-img__sBCI5 { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .sprite-list-item__selector-btn-add__NeS8r .sprite-list-item__add-label__25tje { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .sprite-list-item__selector-btn-item__UEt_J { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .sprite-list-item__selector-btn-item__UEt_J .sprite-list-item__item-img__8MSGV { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .sprite-list-item__selector-btn-item__UEt_J .sprite-list-item__item-img__8MSGV img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .sprite-list-item__selector-btn-item__UEt_J .sprite-list-item__item-label__2mrTx { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .sprite-list-item__selector-btn-item__UEt_J:hover { background-color: var(--selector-sprite-bg_primary); } .sprite-list-item__selector-btn-item__UEt_J:hover .sprite-list-item__item-img__8MSGV { border-color: var(--selector-sprite-bg_primary); } .sprite-list-item__selector-btn-item_selected__3e4nj { background-color: var(--selector-sprite-bg_primary); } .sprite-list-item__selector-btn-item_selected__3e4nj .sprite-list-item__item-img__8MSGV { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .sprite-list-item__menu-bar-btn__2DlhG { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .sprite-list-item__menu-bar-btn_green__1_tpq, .sprite-list-item__menu-bar-btn_create__S1iiQ { background-color: #3cdc8f; } .sprite-list-item__menu-bar-btn_green__1_tpq:hover, .sprite-list-item__menu-bar-btn_create__S1iiQ:hover { background-color: #00d374; } .sprite-list-item__menu-bar-btn_green__1_tpq:active, .sprite-list-item__menu-bar-btn_create__S1iiQ:active { background-color: #00d374; } .sprite-list-item__menu-bar-btn_save__3PCjq, .sprite-list-item__menu-bar-btn_reset__3t4Gh { background-color: #6ac8ff; } .sprite-list-item__menu-bar-btn_save__3PCjq:hover, .sprite-list-item__menu-bar-btn_reset__3t4Gh:hover { background-color: #57bcfe; } .sprite-list-item__menu-bar-btn_save__3PCjq:active, .sprite-list-item__menu-bar-btn_reset__3t4Gh:active { background-color: #4fb0fc; } .sprite-list-item__menu-bar-btn_submit__1fJ-u, .sprite-list-item__menu-bar-btn_open__3jfd4 { background-color: #ff9e23; } .sprite-list-item__menu-bar-btn_submit__1fJ-u:hover, .sprite-list-item__menu-bar-btn_open__3jfd4:hover { background-color: #f47b04; } .sprite-list-item__menu-bar-btn_submit__1fJ-u:active, .sprite-list-item__menu-bar-btn_open__3jfd4:active { background-color: #fe8f22; } .sprite-list-item__menu-bar-btn_link__159ul { background-color: #e8efff; color: var(--theme-primary); } .sprite-list-item__menu-bar-btn_link__159ul:hover { background-color: #b6c7ff; } .sprite-list-item__menu-bar-btn_link__159ul:active { background-color: #cfdcff; } .sprite-list-item__menu-bar-btn_disabled__3hn85 { color: #565266; background-color: #e6e9ed; } .sprite-list-item__menu-bar-btn_disabled__3hn85:hover { cursor: not-allowed; } .sprite-list-item__menu-bar-btn_help__1Tqgi { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .sprite-list-item__menu-bar-btn_help__1Tqgi:hover { background-color: #8398ff; } .sprite-list-item__menu-bar-btn_help__1Tqgi:active { background-color: #8ca3ff; } .sprite-list-item__menu-bar-separator__3bYlV { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .sprite-list-item__selector-btn-item__UEt_J { position: relative; } .sprite-list-item__selector-btn-item__UEt_J.sprite-list-item__selector-btn-item_selected__3e4nj { background-color: var(--selector-sprite-bg_primary); } .sprite-list-item__selector-btn-item__UEt_J.sprite-list-item__selector-btn-item_selected__3e4nj .sprite-list-item__item-img__8MSGV { border-color: var(--theme-primary); } @media (any-hover: hover) { .sprite-list-item__selector-btn-item__UEt_J:hover .sprite-list-item__item-img__8MSGV .sprite-list-item__visibility-button__4OCYb { display: block; background-color: var(--selector-sprite-bg_primary); } .sprite-list-item__selector-btn-item__UEt_J:hover .sprite-list-item__item-img__8MSGV .sprite-list-item__visibility-button__4OCYb .sprite-list-item__visibility-button-icon__ARuHG { color: #b4bfff; } } .sprite-list-item__selector-btn-item__UEt_J.sprite-list-item__selector-btn-item_disabled__1qgPW { cursor: url(static/cursor/cursor-auto.cur), auto; } .sprite-list-item__selector-btn-item__UEt_J.sprite-list-item__selector-btn-item_disabled__1qgPW .sprite-list-item__item-img__8MSGV .sprite-list-item__visibility-button__4OCYb { display: none; } .sprite-list-item__selector-btn-item__UEt_J .sprite-list-item__item-img__8MSGV { position: relative; } .sprite-list-item__selector-btn-item__UEt_J .sprite-list-item__item-img__8MSGV .sprite-list-item__item-index__3EA2S { position: absolute; top: calc(4px); left: calc(4px); font-size: 12px; line-height: 12px; color: #565266; } .sprite-list-item__selector-btn-item__UEt_J .sprite-list-item__item-img__8MSGV .sprite-list-item__visibility-button__4OCYb { display: flex; align-items: center; justify-content: center; width: 20px; height: 15px; line-height: 13px; position: absolute; left: -2px; bottom: -2px; z-index: 999; border-radius: 0 6px 0 6px; display: none; text-align: center; } .sprite-list-item__selector-btn-item__UEt_J .sprite-list-item__item-img__8MSGV .sprite-list-item__visibility-button__4OCYb.sprite-list-item__visibility-button_invisible__7DgX2 { display: block; background-color: transparent; } .sprite-list-item__selector-btn-item__UEt_J .sprite-list-item__item-img__8MSGV .sprite-list-item__visibility-button__4OCYb.sprite-list-item__visibility-button_invisible__7DgX2 .sprite-list-item__visibility-button-icon__ARuHG { color: #b4bfff; } .sprite-list-item__selector-btn-item__UEt_J .sprite-list-item__item-img__8MSGV .sprite-list-item__visibility-button__4OCYb.sprite-list-item__visibility-button_selected__3TJ3B { display: block; background-color: var(--theme-primary); } .sprite-list-item__selector-btn-item__UEt_J .sprite-list-item__item-img__8MSGV .sprite-list-item__visibility-button__4OCYb.sprite-list-item__visibility-button_selected__3TJ3B .sprite-list-item__visibility-button-icon__ARuHG { color: #ffffff; } .sprite-list-item__selector-btn-item__UEt_J .sprite-list-item__item-img__8MSGV .sprite-list-item__visibility-button__4OCYb .sprite-list-item__visibility-button-icon__ARuHG { font-size: 12px; } .sprite-list-item__selector-btn-item__UEt_J .sprite-list-item__item-subtitle__By-iu { position: absolute; top: 3px; left: 8px; color: #d6e2ff; display: inline-block; } .sprite-list-item__selector-btn-item__UEt_J .sprite-list-item__item-label__2mrTx .sprite-list-item__item-label-input__2Jklb { width: calc(100% - 2px); height: calc(100% - 2px); font-size: 14px; border: 1px solid transparent; border-radius: calc(4px); text-align: center; padding: 0; background-color: var(--selector-sprite-bg_primary); } .sprite-list-item__selector-btn-item__UEt_J .sprite-list-item__item-label__2mrTx .sprite-list-item__item-label-input__2Jklb:hover { border-color: #adb9ff; } .sprite-list-item__selector-btn-item__UEt_J .sprite-list-item__item-label__2mrTx .sprite-list-item__item-label-input__2Jklb:focus { background-color: #ffffff; } .sprite-list-item__selector-btn-item__UEt_J .sprite-list-item__delete-button__I8dkJ { display: flex; align-items: center; justify-content: center; font-size: 12px; position: absolute; top: -4px; right: -4px; z-index: 999; color: #ffffff; width: 16px; height: 16px; border-radius: 50%; background-color: #ff7070; } .sprite-list-item__selector-btn-item__UEt_J .sprite-list-item__delete-button__I8dkJ:hover { background-color: #f66464; } .sprite-list-item__selector-btn-item__UEt_J .sprite-list-item__number-label__3VZ50 { position: absolute; top: 0.15rem; font-size: 0.9rem; font-weight: bold; z-index: 2; left: 0.15rem; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .context-menu__context-menu__1aMAd { min-width: 130px; padding: 5px 0; /* The white strip at the top and bottom of the menu */ margin: 2px 0 0; /* To keep the menu below the cursor comfortably */ font-size: 0.85rem; text-align: left; background-color: #ffffff; border: 1px solid #e8efff; border-radius: calc(4px); box-shadow: 0px 0px 5px 1px #e8efff; pointer-events: none; transition: opacity 0.2s ease; z-index: 10000; } .context-menu__menu-item__2M42A { padding: 8px 12px; white-space: nowrap; cursor: pointer; transition: 0.1s ease; } .context-menu__menu-item__2M42A:hover { background: var(--theme-primary); color: white; } .context-menu__menu-item-bordered__1UZA5 { border-top: 1px solid #e8efff; } .context-menu__menu-item-danger__21kLL:hover { background: #ff8c1a; } .context-menu__disabled__34Z7p { color: #b5bccb !important; cursor: not-allowed !important; background-color: white !important; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .sprite-list__flex-center__1Hjwk { display: flex; align-items: center; justify-content: center; } .sprite-list__full-filled__16S5Z { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .sprite-list__modal-mask__dTxDE { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .sprite-list__modal-mask__dTxDE .sprite-list__modal-wrap__3mjhJ { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .sprite-list__modal-mask__dTxDE .sprite-list__modal-wrap__3mjhJ .sprite-list__modal-header-wrap__3CG00 { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .sprite-list__modal-mask__dTxDE .sprite-list__modal-wrap__3mjhJ .sprite-list__modal-header-wrap__3CG00 .sprite-list__modal-header-bg__3s9yK { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .sprite-list__modal-mask__dTxDE .sprite-list__modal-wrap__3mjhJ .sprite-list__modal-header-wrap__3CG00 .sprite-list__modal-header-label__jkbHO { flex-shrink: 0; font-size: 16px; font-weight: bold; } .sprite-list__modal-mask__dTxDE .sprite-list__modal-wrap__3mjhJ .sprite-list__modal-header-wrap__3CG00 .sprite-list__modal-header-close__1z7Mp { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .sprite-list__modal-mask__dTxDE .sprite-list__modal-wrap__3mjhJ .sprite-list__modal-header-wrap__3CG00 .sprite-list__modal-header-close__1z7Mp:hover { color: #98a2b4; } .sprite-list__modal-mask__dTxDE .sprite-list__modal-wrap__3mjhJ .sprite-list__modal-body-wrap__wOZ8T { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .sprite-list__modal-mask__dTxDE .sprite-list__modal-wrap__3mjhJ .sprite-list__modal-footer-wrap__cVV50 { flex-shrink: 0; display: flex; } .sprite-list__modal-header__2u3U5 { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .sprite-list__modal-header__2u3U5 .sprite-list__modal-header-upload__3Yp0o { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .sprite-list__modal-header__2u3U5 .sprite-list__modal-header-upload__3Yp0o:hover { background-color: #e0e9ff; } .sprite-list__modal-header__2u3U5 .sprite-list__modal-header-upload__3Yp0o:active { background-color: #ccdaff; } .sprite-list__modal-header__2u3U5 .sprite-list__modal-header-upload__3Yp0o .sprite-list__upload-img__2csZ2 { font-size: 16px; margin-right: calc(2px); } .sprite-list__modal-header__2u3U5 .sprite-list__modal-header-upload__3Yp0o .sprite-list__upload-label__2V5Qa { font-size: 14px; } .sprite-list__modal-header__2u3U5 .sprite-list__modal-header-upload__3Yp0o .sprite-list__upload-input__aiw2h { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .sprite-list__modal-header__2u3U5 .sprite-list__modal-header-search__2m7uE { position: relative; } .sprite-list__modal-header__2u3U5 .sprite-list__modal-header-search__2m7uE .sprite-list__search-input__3JzXb { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .sprite-list__modal-header__2u3U5 .sprite-list__modal-header-search__2m7uE .sprite-list__search-input__3JzXb::-webkit-input-placeholder { color: #98a2b4; } .sprite-list__modal-header__2u3U5 .sprite-list__modal-header-search__2m7uE .sprite-list__search-input__3JzXb::-moz-placeholder { color: #98a2b4; } .sprite-list__modal-header__2u3U5 .sprite-list__modal-header-search__2m7uE .sprite-list__search-input__3JzXb:-ms-input-placeholder { color: #98a2b4; } .sprite-list__modal-header__2u3U5 .sprite-list__modal-header-search__2m7uE .sprite-list__search-input__3JzXb:hover { border-color: #d1d7e1; } .sprite-list__modal-header__2u3U5 .sprite-list__modal-header-search__2m7uE .sprite-list__search-input__3JzXb:active { border-color: #d1d7e1; } .sprite-list__modal-header__2u3U5 .sprite-list__modal-header-search__2m7uE .sprite-list__search-img__1wmjo { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .sprite-list__modal-body__251CO { flex-grow: 1; display: flex; } .sprite-list__modal-body__251CO .sprite-list__modal-body-left__2lHf7, .sprite-list__modal-body__251CO .sprite-list__modal-body-main__2d-wh { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .sprite-list__modal-body__251CO .sprite-list__modal-body-left__2lHf7 { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .sprite-list__modal-body__251CO .sprite-list__modal-body-left__2lHf7 .sprite-list__modal-body-left-scroll__Id3z7 { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .sprite-list__modal-body__251CO .sprite-list__modal-body-left__2lHf7 .sprite-list__modal-body-left-scroll__Id3z7 .sprite-list__modal-body-left-inner__m4RR- { width: 121px; padding: calc(12px); color: #5e6b81; } .sprite-list__modal-body__251CO .sprite-list__modal-body-left__2lHf7 .sprite-list__modal-body-left-scroll__Id3z7 .sprite-list__modal-body-left-inner__m4RR- .sprite-list__menu-item-current__3AV16 { color: var(--theme-primary); background-color: #e0e9ff; } .sprite-list__modal-body__251CO .sprite-list__modal-body-left__2lHf7 .sprite-list__modal-body-left-scroll__Id3z7 .sprite-list__modal-body-left-inner__m4RR- .sprite-list__menu-item__ju78k { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .sprite-list__modal-body__251CO .sprite-list__modal-body-left__2lHf7 .sprite-list__modal-body-left-scroll__Id3z7 .sprite-list__modal-body-left-inner__m4RR- .sprite-list__menu-item__ju78k:hover { background-color: #edeff5; } .sprite-list__modal-body__251CO .sprite-list__modal-body-left__2lHf7 .sprite-list__modal-body-left-scroll__Id3z7 .sprite-list__modal-body-left-inner__m4RR- .sprite-list__menu-item__ju78k .sprite-list__menu-item-img__2dNyH { flex-shrink: 0; width: 20px; margin-right: 8px; } .sprite-list__modal-body__251CO .sprite-list__modal-body-left__2lHf7 .sprite-list__modal-body-left-scroll__Id3z7 .sprite-list__modal-body-left-inner__m4RR- .sprite-list__menu-item__ju78k .sprite-list__menu-item-label__ZaCVn { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .sprite-list__modal-body__251CO .sprite-list__modal-body-main__2d-wh { padding: calc(12px) 0; } .sprite-list__modal-body__251CO .sprite-list__modal-body-main__2d-wh .sprite-list__modal-body-main-scroll__QEzb8 { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .sprite-list__modal-body__251CO .sprite-list__modal-body-main__2d-wh .sprite-list__modal-body-main-scroll__QEzb8 .sprite-list__modal-body-main-inner__3vp4q { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .sprite-list__modal-body__251CO .sprite-list__modal-body-main__2d-wh .sprite-list__modal-body-main-scroll__QEzb8 .sprite-list__modal-body-main-inner__3vp4q .sprite-list__selector-btn-add__3QfhD, .sprite-list__modal-body__251CO .sprite-list__modal-body-main__2d-wh .sprite-list__modal-body-main-scroll__QEzb8 .sprite-list__modal-body-main-inner__3vp4q .sprite-list__selector-btn-item__2MyLY { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .sprite-list__modal-body__251CO .sprite-list__modal-body-main__2d-wh .sprite-list__modal-body-main-scroll__QEzb8 .sprite-list__modal-body-main-inner__3vp4q .sprite-list__selector-btn-add__3QfhD:hover, .sprite-list__modal-body__251CO .sprite-list__modal-body-main__2d-wh .sprite-list__modal-body-main-scroll__QEzb8 .sprite-list__modal-body-main-inner__3vp4q .sprite-list__selector-btn-item__2MyLY:hover { background-color: #e0e9ff; } .sprite-list__modal-body__251CO .sprite-list__modal-body-main__2d-wh .sprite-list__modal-body-main-scroll__QEzb8 .sprite-list__modal-body-main-inner__3vp4q .sprite-list__selector-btn-add__3QfhD:active, .sprite-list__modal-body__251CO .sprite-list__modal-body-main__2d-wh .sprite-list__modal-body-main-scroll__QEzb8 .sprite-list__modal-body-main-inner__3vp4q .sprite-list__selector-btn-item__2MyLY:active { background-color: #ccdaff; } .sprite-list__modal-body__251CO .sprite-list__modal-body-main__2d-wh .sprite-list__modal-body-main-scroll__QEzb8 .sprite-list__modal-body-main-inner__3vp4q .sprite-list__selector-btn-add__3QfhD:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .sprite-list__modal-body__251CO .sprite-list__modal-body-main__2d-wh .sprite-list__modal-body-main-scroll__QEzb8 .sprite-list__modal-body-main-inner__3vp4q .sprite-list__selector-btn-add__3QfhD:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .sprite-list__modal-body__251CO .sprite-list__modal-body-main__2d-wh .sprite-list__modal-body-main-scroll__QEzb8 .sprite-list__modal-body-main-inner__3vp4q .sprite-list__selector-btn-add__3QfhD .sprite-list__add-img__30Jd4 { font-size: 28px; height: auto; margin-bottom: 8px; } .sprite-list__modal-body__251CO .sprite-list__modal-body-main__2d-wh .sprite-list__modal-body-main-scroll__QEzb8 .sprite-list__modal-body-main-inner__3vp4q .sprite-list__selector-btn-add__3QfhD .sprite-list__add-label__1lYFo { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .sprite-list__modal-body__251CO .sprite-list__modal-body-main__2d-wh .sprite-list__modal-body-main-scroll__QEzb8 .sprite-list__modal-body-main-inner__3vp4q .sprite-list__selector-btn-item__2MyLY { justify-content: space-between; } .sprite-list__modal-body__251CO .sprite-list__modal-body-main__2d-wh .sprite-list__modal-body-main-scroll__QEzb8 .sprite-list__modal-body-main-inner__3vp4q .sprite-list__selector-btn-item__2MyLY .sprite-list__item-img__toH2T { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .sprite-list__modal-body__251CO .sprite-list__modal-body-main__2d-wh .sprite-list__modal-body-main-scroll__QEzb8 .sprite-list__modal-body-main-inner__3vp4q .sprite-list__selector-btn-item__2MyLY .sprite-list__item-img__toH2T img { width: auto; height: 105px; } .sprite-list__modal-body__251CO .sprite-list__modal-body-main__2d-wh .sprite-list__modal-body-main-scroll__QEzb8 .sprite-list__modal-body-main-inner__3vp4q .sprite-list__selector-btn-item__2MyLY .sprite-list__item-label__sC189 { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .sprite-list__modal-footer__1W-2x { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .sprite-list__selector-btn-add__3QfhD, .sprite-list__selector-btn-item__2MyLY { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .sprite-list__selector-btn-add__3QfhD { background-color: var(--selector-sprite-bg_primary); } .sprite-list__selector-btn-add__3QfhD:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .sprite-list__selector-btn-add__3QfhD:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .sprite-list__selector-btn-add__3QfhD .sprite-list__add-img__30Jd4 { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .sprite-list__selector-btn-add__3QfhD .sprite-list__add-label__1lYFo { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .sprite-list__selector-btn-item__2MyLY { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .sprite-list__selector-btn-item__2MyLY .sprite-list__item-img__toH2T { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .sprite-list__selector-btn-item__2MyLY .sprite-list__item-img__toH2T img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .sprite-list__selector-btn-item__2MyLY .sprite-list__item-label__sC189 { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .sprite-list__selector-btn-item__2MyLY:hover { background-color: var(--selector-sprite-bg_primary); } .sprite-list__selector-btn-item__2MyLY:hover .sprite-list__item-img__toH2T { border-color: var(--selector-sprite-bg_primary); } .sprite-list__selector-btn-item_selected__1xCYO { background-color: var(--selector-sprite-bg_primary); } .sprite-list__selector-btn-item_selected__1xCYO .sprite-list__item-img__toH2T { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .sprite-list__menu-bar-btn__2sPSF { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .sprite-list__menu-bar-btn_green__32rIH, .sprite-list__menu-bar-btn_create__1zzIs { background-color: #3cdc8f; } .sprite-list__menu-bar-btn_green__32rIH:hover, .sprite-list__menu-bar-btn_create__1zzIs:hover { background-color: #00d374; } .sprite-list__menu-bar-btn_green__32rIH:active, .sprite-list__menu-bar-btn_create__1zzIs:active { background-color: #00d374; } .sprite-list__menu-bar-btn_save__1yaZB, .sprite-list__menu-bar-btn_reset__2qG2X { background-color: #6ac8ff; } .sprite-list__menu-bar-btn_save__1yaZB:hover, .sprite-list__menu-bar-btn_reset__2qG2X:hover { background-color: #57bcfe; } .sprite-list__menu-bar-btn_save__1yaZB:active, .sprite-list__menu-bar-btn_reset__2qG2X:active { background-color: #4fb0fc; } .sprite-list__menu-bar-btn_submit__wns_j, .sprite-list__menu-bar-btn_open__e68no { background-color: #ff9e23; } .sprite-list__menu-bar-btn_submit__wns_j:hover, .sprite-list__menu-bar-btn_open__e68no:hover { background-color: #f47b04; } .sprite-list__menu-bar-btn_submit__wns_j:active, .sprite-list__menu-bar-btn_open__e68no:active { background-color: #fe8f22; } .sprite-list__menu-bar-btn_link__t3kMm { background-color: #e8efff; color: var(--theme-primary); } .sprite-list__menu-bar-btn_link__t3kMm:hover { background-color: #b6c7ff; } .sprite-list__menu-bar-btn_link__t3kMm:active { background-color: #cfdcff; } .sprite-list__menu-bar-btn_disabled__1fO4o { color: #565266; background-color: #e6e9ed; } .sprite-list__menu-bar-btn_disabled__1fO4o:hover { cursor: not-allowed; } .sprite-list__menu-bar-btn_help__1N4Dn { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .sprite-list__menu-bar-btn_help__1N4Dn:hover { background-color: #8398ff; } .sprite-list__menu-bar-btn_help__1N4Dn:active { background-color: #8ca3ff; } .sprite-list__menu-bar-separator__8NXyY { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .sprite-list__sprite-list__2-r9i { flex-grow: 1; padding: 8px; overflow-y: auto; overflow-x: hidden; position: relative; width: 276px; margin: 0 auto; } .sprite-list__sprite-list__2-r9i.sprite-list__sprite-list_large__35cO8 { width: 376px; } .sprite-list__sprite-list__2-r9i.sprite-list__sprite-list_large__35cO8 .sprite-list__sprite-list-scroll__1DCBJ { width: calc(360px); } .sprite-list__sprite-list__2-r9i .sprite-list__sprite-list-scroll__1DCBJ { width: calc(260px); position: absolute; display: flex; flex-wrap: wrap; } .sprite-list__sprite-list__2-r9i .sprite-list__sprite-list-scroll__1DCBJ .sprite-list__selector-btn-add__3QfhD, .sprite-list__sprite-list__2-r9i .sprite-list__sprite-list-scroll__1DCBJ .sprite-list__sortable-asset-item__2wWyz { margin-right: 8px; margin-bottom: 8px; } .sprite-list__sprite-list__2-r9i .sprite-list__sprite-list-scroll__1DCBJ .sprite-list__sortable-asset-item__2wWyz.sprite-list__sortable-asset-item_placeholder__2SDyH .sprite-list__selector-btn-item__2MyLY { background: black; filter: opacity(15%) brightness(0%); } .sprite-list__sprite-list__2-r9i .sprite-list__sprite-list-scroll__1DCBJ .sprite-list__sortable-asset-item__2wWyz.sprite-list__sortable-asset-item_last-in-line__1GNbv { margin-right: 0; } .sprite-list__sprite-list__2-r9i .sprite-list__sprite-list-scroll__1DCBJ .sprite-list__sortable-asset-item__2wWyz .sprite-list__selector-btn-item_raised__3qI5x { background-color: #8abbff; transition: all 0.25s ease; } @keyframes sprite-list__wiggle__26dGn { 0% { transform: rotate(3deg) scale(1.05); } 25% { transform: rotate(-3deg) scale(1.05); } 50% { transform: rotate(5deg) scale(1.05); } 75% { transform: rotate(-2deg) scale(1.05); } 100% { transform: rotate(0deg) scale(1.05); } } .sprite-list__sprite-list__2-r9i .sprite-list__sprite-list-scroll__1DCBJ .sprite-list__sortable-asset-item__2wWyz .sprite-list__selector-btn-item_raised__3qI5x:hover { transform: scale(1.05); animation-name: sprite-list__wiggle__26dGn; animation-duration: 500ms; animation-iteration-count: 1; animation-timing-function: ease-in-out; background-color: #8abbff; } .sprite-list__sprite-list__2-r9i .sprite-list__sprite-list-scroll__1DCBJ .sprite-list__sortable-asset-item__2wWyz .sprite-list__selector-btn-item_received-blocks__1jkxx { animation: sprite-list__glowing__2Yw6y 250ms; } @keyframes sprite-list__glowing__2Yw6y { 10% { box-shadow: 0 0 10px #7fff1e; } 90% { box-shadow: 0 0 10px #7fff1e; } 100% { box-shadow: none; } } .sprite-list__scroll-list_dragging__3JRNl { background-color: #8abbff; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .sprite-list_mobile__flex-center__2NUmE { display: flex; align-items: center; justify-content: center; } .sprite-list_mobile__full-filled__12DG3 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .sprite-list_mobile__modal-mask__1CKak { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .sprite-list_mobile__modal-mask__1CKak .sprite-list_mobile__modal-wrap__32DGf { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .sprite-list_mobile__modal-mask__1CKak .sprite-list_mobile__modal-wrap__32DGf .sprite-list_mobile__modal-header-wrap__179mz { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .sprite-list_mobile__modal-mask__1CKak .sprite-list_mobile__modal-wrap__32DGf .sprite-list_mobile__modal-header-wrap__179mz .sprite-list_mobile__modal-header-bg__3Hts- { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .sprite-list_mobile__modal-mask__1CKak .sprite-list_mobile__modal-wrap__32DGf .sprite-list_mobile__modal-header-wrap__179mz .sprite-list_mobile__modal-header-label__5lL6V { flex-shrink: 0; font-size: 16px; font-weight: bold; } .sprite-list_mobile__modal-mask__1CKak .sprite-list_mobile__modal-wrap__32DGf .sprite-list_mobile__modal-header-wrap__179mz .sprite-list_mobile__modal-header-close__1aBfP { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .sprite-list_mobile__modal-mask__1CKak .sprite-list_mobile__modal-wrap__32DGf .sprite-list_mobile__modal-header-wrap__179mz .sprite-list_mobile__modal-header-close__1aBfP:hover { color: #98a2b4; } .sprite-list_mobile__modal-mask__1CKak .sprite-list_mobile__modal-wrap__32DGf .sprite-list_mobile__modal-body-wrap__2LRQ3 { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .sprite-list_mobile__modal-mask__1CKak .sprite-list_mobile__modal-wrap__32DGf .sprite-list_mobile__modal-footer-wrap__1pPlu { flex-shrink: 0; display: flex; } .sprite-list_mobile__modal-header__QPzQE { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .sprite-list_mobile__modal-header__QPzQE .sprite-list_mobile__modal-header-upload__3_Fat { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .sprite-list_mobile__modal-header__QPzQE .sprite-list_mobile__modal-header-upload__3_Fat:hover { background-color: #e0e9ff; } .sprite-list_mobile__modal-header__QPzQE .sprite-list_mobile__modal-header-upload__3_Fat:active { background-color: #ccdaff; } .sprite-list_mobile__modal-header__QPzQE .sprite-list_mobile__modal-header-upload__3_Fat .sprite-list_mobile__upload-img__1j_S2 { font-size: 16px; margin-right: calc(2px); } .sprite-list_mobile__modal-header__QPzQE .sprite-list_mobile__modal-header-upload__3_Fat .sprite-list_mobile__upload-label__1tGlG { font-size: 14px; } .sprite-list_mobile__modal-header__QPzQE .sprite-list_mobile__modal-header-upload__3_Fat .sprite-list_mobile__upload-input__2kAM4 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .sprite-list_mobile__modal-header__QPzQE .sprite-list_mobile__modal-header-search__18AvH { position: relative; } .sprite-list_mobile__modal-header__QPzQE .sprite-list_mobile__modal-header-search__18AvH .sprite-list_mobile__search-input__taSby { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .sprite-list_mobile__modal-header__QPzQE .sprite-list_mobile__modal-header-search__18AvH .sprite-list_mobile__search-input__taSby::-webkit-input-placeholder { color: #98a2b4; } .sprite-list_mobile__modal-header__QPzQE .sprite-list_mobile__modal-header-search__18AvH .sprite-list_mobile__search-input__taSby::-moz-placeholder { color: #98a2b4; } .sprite-list_mobile__modal-header__QPzQE .sprite-list_mobile__modal-header-search__18AvH .sprite-list_mobile__search-input__taSby:-ms-input-placeholder { color: #98a2b4; } .sprite-list_mobile__modal-header__QPzQE .sprite-list_mobile__modal-header-search__18AvH .sprite-list_mobile__search-input__taSby:hover { border-color: #d1d7e1; } .sprite-list_mobile__modal-header__QPzQE .sprite-list_mobile__modal-header-search__18AvH .sprite-list_mobile__search-input__taSby:active { border-color: #d1d7e1; } .sprite-list_mobile__modal-header__QPzQE .sprite-list_mobile__modal-header-search__18AvH .sprite-list_mobile__search-img__1bsbq { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .sprite-list_mobile__modal-body__3CM4- { flex-grow: 1; display: flex; } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-left__3pr7y, .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-main__2vanw { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-left__3pr7y { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-left__3pr7y .sprite-list_mobile__modal-body-left-scroll___b9pV { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-left__3pr7y .sprite-list_mobile__modal-body-left-scroll___b9pV .sprite-list_mobile__modal-body-left-inner__UUiQD { width: 121px; padding: calc(12px); color: #5e6b81; } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-left__3pr7y .sprite-list_mobile__modal-body-left-scroll___b9pV .sprite-list_mobile__modal-body-left-inner__UUiQD .sprite-list_mobile__menu-item-current__S4oiJ { color: var(--theme-primary); background-color: #e0e9ff; } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-left__3pr7y .sprite-list_mobile__modal-body-left-scroll___b9pV .sprite-list_mobile__modal-body-left-inner__UUiQD .sprite-list_mobile__menu-item__231Sj { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-left__3pr7y .sprite-list_mobile__modal-body-left-scroll___b9pV .sprite-list_mobile__modal-body-left-inner__UUiQD .sprite-list_mobile__menu-item__231Sj:hover { background-color: #edeff5; } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-left__3pr7y .sprite-list_mobile__modal-body-left-scroll___b9pV .sprite-list_mobile__modal-body-left-inner__UUiQD .sprite-list_mobile__menu-item__231Sj .sprite-list_mobile__menu-item-img__2n-az { flex-shrink: 0; width: 20px; margin-right: 8px; } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-left__3pr7y .sprite-list_mobile__modal-body-left-scroll___b9pV .sprite-list_mobile__modal-body-left-inner__UUiQD .sprite-list_mobile__menu-item__231Sj .sprite-list_mobile__menu-item-label__YFcBJ { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-main__2vanw { padding: calc(12px) 0; } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-main__2vanw .sprite-list_mobile__modal-body-main-scroll__3GxCa { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-main__2vanw .sprite-list_mobile__modal-body-main-scroll__3GxCa .sprite-list_mobile__modal-body-main-inner__Jw1ku { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-main__2vanw .sprite-list_mobile__modal-body-main-scroll__3GxCa .sprite-list_mobile__modal-body-main-inner__Jw1ku .sprite-list_mobile__selector-btn-add__GgWQs, .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-main__2vanw .sprite-list_mobile__modal-body-main-scroll__3GxCa .sprite-list_mobile__modal-body-main-inner__Jw1ku .sprite-list_mobile__selector-btn-item__1Vcsq { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-main__2vanw .sprite-list_mobile__modal-body-main-scroll__3GxCa .sprite-list_mobile__modal-body-main-inner__Jw1ku .sprite-list_mobile__selector-btn-add__GgWQs:hover, .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-main__2vanw .sprite-list_mobile__modal-body-main-scroll__3GxCa .sprite-list_mobile__modal-body-main-inner__Jw1ku .sprite-list_mobile__selector-btn-item__1Vcsq:hover { background-color: #e0e9ff; } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-main__2vanw .sprite-list_mobile__modal-body-main-scroll__3GxCa .sprite-list_mobile__modal-body-main-inner__Jw1ku .sprite-list_mobile__selector-btn-add__GgWQs:active, .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-main__2vanw .sprite-list_mobile__modal-body-main-scroll__3GxCa .sprite-list_mobile__modal-body-main-inner__Jw1ku .sprite-list_mobile__selector-btn-item__1Vcsq:active { background-color: #ccdaff; } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-main__2vanw .sprite-list_mobile__modal-body-main-scroll__3GxCa .sprite-list_mobile__modal-body-main-inner__Jw1ku .sprite-list_mobile__selector-btn-add__GgWQs:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-main__2vanw .sprite-list_mobile__modal-body-main-scroll__3GxCa .sprite-list_mobile__modal-body-main-inner__Jw1ku .sprite-list_mobile__selector-btn-add__GgWQs:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-main__2vanw .sprite-list_mobile__modal-body-main-scroll__3GxCa .sprite-list_mobile__modal-body-main-inner__Jw1ku .sprite-list_mobile__selector-btn-add__GgWQs .sprite-list_mobile__add-img__3iZm8 { font-size: 28px; height: auto; margin-bottom: 8px; } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-main__2vanw .sprite-list_mobile__modal-body-main-scroll__3GxCa .sprite-list_mobile__modal-body-main-inner__Jw1ku .sprite-list_mobile__selector-btn-add__GgWQs .sprite-list_mobile__add-label__1J8Hd { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-main__2vanw .sprite-list_mobile__modal-body-main-scroll__3GxCa .sprite-list_mobile__modal-body-main-inner__Jw1ku .sprite-list_mobile__selector-btn-item__1Vcsq { justify-content: space-between; } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-main__2vanw .sprite-list_mobile__modal-body-main-scroll__3GxCa .sprite-list_mobile__modal-body-main-inner__Jw1ku .sprite-list_mobile__selector-btn-item__1Vcsq .sprite-list_mobile__item-img__3QOUs { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-main__2vanw .sprite-list_mobile__modal-body-main-scroll__3GxCa .sprite-list_mobile__modal-body-main-inner__Jw1ku .sprite-list_mobile__selector-btn-item__1Vcsq .sprite-list_mobile__item-img__3QOUs img { width: auto; height: 105px; } .sprite-list_mobile__modal-body__3CM4- .sprite-list_mobile__modal-body-main__2vanw .sprite-list_mobile__modal-body-main-scroll__3GxCa .sprite-list_mobile__modal-body-main-inner__Jw1ku .sprite-list_mobile__selector-btn-item__1Vcsq .sprite-list_mobile__item-label__13zvk { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .sprite-list_mobile__modal-footer__3K1Ll { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .sprite-list_mobile__selector-btn-add__GgWQs, .sprite-list_mobile__selector-btn-item__1Vcsq { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .sprite-list_mobile__selector-btn-add__GgWQs { background-color: var(--selector-sprite-bg_primary); } .sprite-list_mobile__selector-btn-add__GgWQs:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .sprite-list_mobile__selector-btn-add__GgWQs:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .sprite-list_mobile__selector-btn-add__GgWQs .sprite-list_mobile__add-img__3iZm8 { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .sprite-list_mobile__selector-btn-add__GgWQs .sprite-list_mobile__add-label__1J8Hd { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .sprite-list_mobile__selector-btn-item__1Vcsq { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .sprite-list_mobile__selector-btn-item__1Vcsq .sprite-list_mobile__item-img__3QOUs { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .sprite-list_mobile__selector-btn-item__1Vcsq .sprite-list_mobile__item-img__3QOUs img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .sprite-list_mobile__selector-btn-item__1Vcsq .sprite-list_mobile__item-label__13zvk { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .sprite-list_mobile__selector-btn-item__1Vcsq:hover { background-color: var(--selector-sprite-bg_primary); } .sprite-list_mobile__selector-btn-item__1Vcsq:hover .sprite-list_mobile__item-img__3QOUs { border-color: var(--selector-sprite-bg_primary); } .sprite-list_mobile__selector-btn-item_selected__1GfWK { background-color: var(--selector-sprite-bg_primary); } .sprite-list_mobile__selector-btn-item_selected__1GfWK .sprite-list_mobile__item-img__3QOUs { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .sprite-list_mobile__menu-bar-btn__iL-Bo { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .sprite-list_mobile__menu-bar-btn_green__2GhrE, .sprite-list_mobile__menu-bar-btn_create__1pvVf { background-color: #3cdc8f; } .sprite-list_mobile__menu-bar-btn_green__2GhrE:hover, .sprite-list_mobile__menu-bar-btn_create__1pvVf:hover { background-color: #00d374; } .sprite-list_mobile__menu-bar-btn_green__2GhrE:active, .sprite-list_mobile__menu-bar-btn_create__1pvVf:active { background-color: #00d374; } .sprite-list_mobile__menu-bar-btn_save__2iVeT, .sprite-list_mobile__menu-bar-btn_reset__3NAh4 { background-color: #6ac8ff; } .sprite-list_mobile__menu-bar-btn_save__2iVeT:hover, .sprite-list_mobile__menu-bar-btn_reset__3NAh4:hover { background-color: #57bcfe; } .sprite-list_mobile__menu-bar-btn_save__2iVeT:active, .sprite-list_mobile__menu-bar-btn_reset__3NAh4:active { background-color: #4fb0fc; } .sprite-list_mobile__menu-bar-btn_submit__1cI_2, .sprite-list_mobile__menu-bar-btn_open__3lCAe { background-color: #ff9e23; } .sprite-list_mobile__menu-bar-btn_submit__1cI_2:hover, .sprite-list_mobile__menu-bar-btn_open__3lCAe:hover { background-color: #f47b04; } .sprite-list_mobile__menu-bar-btn_submit__1cI_2:active, .sprite-list_mobile__menu-bar-btn_open__3lCAe:active { background-color: #fe8f22; } .sprite-list_mobile__menu-bar-btn_link__3YbOs { background-color: #e8efff; color: var(--theme-primary); } .sprite-list_mobile__menu-bar-btn_link__3YbOs:hover { background-color: #b6c7ff; } .sprite-list_mobile__menu-bar-btn_link__3YbOs:active { background-color: #cfdcff; } .sprite-list_mobile__menu-bar-btn_disabled__2vUZQ { color: #565266; background-color: #e6e9ed; } .sprite-list_mobile__menu-bar-btn_disabled__2vUZQ:hover { cursor: not-allowed; } .sprite-list_mobile__menu-bar-btn_help__3C4CY { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .sprite-list_mobile__menu-bar-btn_help__3C4CY:hover { background-color: #8398ff; } .sprite-list_mobile__menu-bar-btn_help__3C4CY:active { background-color: #8ca3ff; } .sprite-list_mobile__menu-bar-separator__1No1q { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .sprite-list_mobile__sprite-list__2TcG2 { flex: 1 0; position: relative; padding: 0.26rem 0; margin-top: 0.5rem; overflow-y: auto; } .sprite-list_mobile__sprite-list__2TcG2 .sprite-list_mobile__sprite-list-scroll__AJolz { position: absolute; display: flex; flex-wrap: wrap; padding-left: 3.67rem; } .sprite-list_mobile__sprite-list__2TcG2 .sprite-list_mobile__sprite-list-scroll__AJolz .sprite-list_mobile__selector-btn-add__GgWQs, .sprite-list_mobile__sprite-list__2TcG2 .sprite-list_mobile__sprite-list-scroll__AJolz .sprite-list_mobile__sortable-asset-item__3uys- { margin-right: 8px; margin-bottom: 8px; } .sprite-list_mobile__sprite-list__2TcG2 .sprite-list_mobile__sprite-list-scroll__AJolz .sprite-list_mobile__selector-btn-add__GgWQs .sprite-list_mobile__add-img__3iZm8 { font-size: 1.75rem; margin-bottom: 0; } .sprite-list_mobile__sprite-list__2TcG2 .sprite-list_mobile__sprite-list-scroll__AJolz .sprite-list_mobile__sortable-asset-item__3uys-.sprite-list_mobile__sortable-asset-item_placeholder__3ifSn .sprite-list_mobile__selector-btn-item__1Vcsq { background: black; filter: opacity(15%) brightness(0%); } .sprite-list_mobile__sprite-list__2TcG2 .sprite-list_mobile__sprite-list-scroll__AJolz .sprite-list_mobile__sortable-asset-item__3uys-.sprite-list_mobile__sortable-asset-item_last-in-line__3FvtQ { margin-right: 0; } .sprite-list_mobile__sprite-list__2TcG2 .sprite-list_mobile__sprite-list-scroll__AJolz .sprite-list_mobile__sortable-asset-item__3uys- .sprite-list_mobile__selector-btn-item_raised__29vFn { background-color: #8abbff; transition: all 0.25s ease; } @keyframes sprite-list_mobile__wiggle__O_XQv { 0% { transform: rotate(3deg) scale(1.05); } 25% { transform: rotate(-3deg) scale(1.05); } 50% { transform: rotate(5deg) scale(1.05); } 75% { transform: rotate(-2deg) scale(1.05); } 100% { transform: rotate(0deg) scale(1.05); } } .sprite-list_mobile__sprite-list__2TcG2 .sprite-list_mobile__sprite-list-scroll__AJolz .sprite-list_mobile__sortable-asset-item__3uys- .sprite-list_mobile__selector-btn-item_raised__29vFn:hover { transform: scale(1.05); animation-name: sprite-list_mobile__wiggle__O_XQv; animation-duration: 500ms; animation-iteration-count: 1; animation-timing-function: ease-in-out; background-color: #8abbff; } .sprite-list_mobile__sprite-list__2TcG2 .sprite-list_mobile__sprite-list-scroll__AJolz .sprite-list_mobile__sortable-asset-item__3uys- .sprite-list_mobile__selector-btn-item_received-blocks__1dr3Q { animation: sprite-list_mobile__glowing__SmlTY 250ms; } @keyframes sprite-list_mobile__glowing__SmlTY { 10% { box-shadow: 0 0 10px #7fff1e; } 90% { box-shadow: 0 0 10px #7fff1e; } 100% { box-shadow: none; } } .sprite-list_mobile__scroll-list_dragging__1YIpd { background-color: #8abbff; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .library__flex-center__3whhq { display: flex; align-items: center; justify-content: center; } .library__full-filled__3Uo6O { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .library__modal-mask__3cFyb { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .library__modal-mask__3cFyb .library__modal-wrap__3nw4M { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .library__modal-mask__3cFyb .library__modal-wrap__3nw4M .library__modal-header-wrap__3UTwv { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .library__modal-mask__3cFyb .library__modal-wrap__3nw4M .library__modal-header-wrap__3UTwv .library__modal-header-bg__3n8B2 { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .library__modal-mask__3cFyb .library__modal-wrap__3nw4M .library__modal-header-wrap__3UTwv .library__modal-header-label__3eJlv { flex-shrink: 0; font-size: 16px; font-weight: bold; } .library__modal-mask__3cFyb .library__modal-wrap__3nw4M .library__modal-header-wrap__3UTwv .library__modal-header-close__3eZJP { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .library__modal-mask__3cFyb .library__modal-wrap__3nw4M .library__modal-header-wrap__3UTwv .library__modal-header-close__3eZJP:hover { color: #98a2b4; } .library__modal-mask__3cFyb .library__modal-wrap__3nw4M .library__modal-body-wrap__3-qLn { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .library__modal-mask__3cFyb .library__modal-wrap__3nw4M .library__modal-footer-wrap__wEuCx { flex-shrink: 0; display: flex; } .library__modal-header__2ywTF { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .library__modal-header__2ywTF .library__modal-header-upload__2b6dc { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .library__modal-header__2ywTF .library__modal-header-upload__2b6dc:hover { background-color: #e0e9ff; } .library__modal-header__2ywTF .library__modal-header-upload__2b6dc:active { background-color: #ccdaff; } .library__modal-header__2ywTF .library__modal-header-upload__2b6dc .library__upload-img__iWU_Z { font-size: 16px; margin-right: calc(2px); } .library__modal-header__2ywTF .library__modal-header-upload__2b6dc .library__upload-label__3Qhml { font-size: 14px; } .library__modal-header__2ywTF .library__modal-header-upload__2b6dc .library__upload-input__1FbCd { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .library__modal-header__2ywTF .library__modal-header-search__3LcuE { position: relative; } .library__modal-header__2ywTF .library__modal-header-search__3LcuE .library__search-input__1Sy_B { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .library__modal-header__2ywTF .library__modal-header-search__3LcuE .library__search-input__1Sy_B::-webkit-input-placeholder { color: #98a2b4; } .library__modal-header__2ywTF .library__modal-header-search__3LcuE .library__search-input__1Sy_B::-moz-placeholder { color: #98a2b4; } .library__modal-header__2ywTF .library__modal-header-search__3LcuE .library__search-input__1Sy_B:-ms-input-placeholder { color: #98a2b4; } .library__modal-header__2ywTF .library__modal-header-search__3LcuE .library__search-input__1Sy_B:hover { border-color: #d1d7e1; } .library__modal-header__2ywTF .library__modal-header-search__3LcuE .library__search-input__1Sy_B:active { border-color: #d1d7e1; } .library__modal-header__2ywTF .library__modal-header-search__3LcuE .library__search-img__Z3k7U { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .library__modal-body__3I79G { flex-grow: 1; display: flex; } .library__modal-body__3I79G .library__modal-body-left__1Cvcz, .library__modal-body__3I79G .library__modal-body-main__12Ufa { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .library__modal-body__3I79G .library__modal-body-left__1Cvcz { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .library__modal-body__3I79G .library__modal-body-left__1Cvcz .library__modal-body-left-scroll__31Cdf { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .library__modal-body__3I79G .library__modal-body-left__1Cvcz .library__modal-body-left-scroll__31Cdf .library__modal-body-left-inner__1HB0D { width: 121px; padding: calc(12px); color: #5e6b81; } .library__modal-body__3I79G .library__modal-body-left__1Cvcz .library__modal-body-left-scroll__31Cdf .library__modal-body-left-inner__1HB0D .library__menu-item-current__3tTyp { color: var(--theme-primary); background-color: #e0e9ff; } .library__modal-body__3I79G .library__modal-body-left__1Cvcz .library__modal-body-left-scroll__31Cdf .library__modal-body-left-inner__1HB0D .library__menu-item__3T7CO { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .library__modal-body__3I79G .library__modal-body-left__1Cvcz .library__modal-body-left-scroll__31Cdf .library__modal-body-left-inner__1HB0D .library__menu-item__3T7CO:hover { background-color: #edeff5; } .library__modal-body__3I79G .library__modal-body-left__1Cvcz .library__modal-body-left-scroll__31Cdf .library__modal-body-left-inner__1HB0D .library__menu-item__3T7CO .library__menu-item-img__1ttcp { flex-shrink: 0; width: 20px; margin-right: 8px; } .library__modal-body__3I79G .library__modal-body-left__1Cvcz .library__modal-body-left-scroll__31Cdf .library__modal-body-left-inner__1HB0D .library__menu-item__3T7CO .library__menu-item-label__1PiG7 { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .library__modal-body__3I79G .library__modal-body-main__12Ufa { padding: calc(12px) 0; } .library__modal-body__3I79G .library__modal-body-main__12Ufa .library__modal-body-main-scroll__3DXpn { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .library__modal-body__3I79G .library__modal-body-main__12Ufa .library__modal-body-main-scroll__3DXpn .library__modal-body-main-inner__2DAJD { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .library__modal-body__3I79G .library__modal-body-main__12Ufa .library__modal-body-main-scroll__3DXpn .library__modal-body-main-inner__2DAJD .library__selector-btn-add__as5CA, .library__modal-body__3I79G .library__modal-body-main__12Ufa .library__modal-body-main-scroll__3DXpn .library__modal-body-main-inner__2DAJD .library__selector-btn-item__svVXc { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .library__modal-body__3I79G .library__modal-body-main__12Ufa .library__modal-body-main-scroll__3DXpn .library__modal-body-main-inner__2DAJD .library__selector-btn-add__as5CA:hover, .library__modal-body__3I79G .library__modal-body-main__12Ufa .library__modal-body-main-scroll__3DXpn .library__modal-body-main-inner__2DAJD .library__selector-btn-item__svVXc:hover { background-color: #e0e9ff; } .library__modal-body__3I79G .library__modal-body-main__12Ufa .library__modal-body-main-scroll__3DXpn .library__modal-body-main-inner__2DAJD .library__selector-btn-add__as5CA:active, .library__modal-body__3I79G .library__modal-body-main__12Ufa .library__modal-body-main-scroll__3DXpn .library__modal-body-main-inner__2DAJD .library__selector-btn-item__svVXc:active { background-color: #ccdaff; } .library__modal-body__3I79G .library__modal-body-main__12Ufa .library__modal-body-main-scroll__3DXpn .library__modal-body-main-inner__2DAJD .library__selector-btn-add__as5CA:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .library__modal-body__3I79G .library__modal-body-main__12Ufa .library__modal-body-main-scroll__3DXpn .library__modal-body-main-inner__2DAJD .library__selector-btn-add__as5CA:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .library__modal-body__3I79G .library__modal-body-main__12Ufa .library__modal-body-main-scroll__3DXpn .library__modal-body-main-inner__2DAJD .library__selector-btn-add__as5CA .library__add-img__37hDW { font-size: 28px; height: auto; margin-bottom: 8px; } .library__modal-body__3I79G .library__modal-body-main__12Ufa .library__modal-body-main-scroll__3DXpn .library__modal-body-main-inner__2DAJD .library__selector-btn-add__as5CA .library__add-label__18fkK { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .library__modal-body__3I79G .library__modal-body-main__12Ufa .library__modal-body-main-scroll__3DXpn .library__modal-body-main-inner__2DAJD .library__selector-btn-item__svVXc { justify-content: space-between; } .library__modal-body__3I79G .library__modal-body-main__12Ufa .library__modal-body-main-scroll__3DXpn .library__modal-body-main-inner__2DAJD .library__selector-btn-item__svVXc .library__item-img__2Ehao { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .library__modal-body__3I79G .library__modal-body-main__12Ufa .library__modal-body-main-scroll__3DXpn .library__modal-body-main-inner__2DAJD .library__selector-btn-item__svVXc .library__item-img__2Ehao img { width: auto; height: 105px; } .library__modal-body__3I79G .library__modal-body-main__12Ufa .library__modal-body-main-scroll__3DXpn .library__modal-body-main-inner__2DAJD .library__selector-btn-item__svVXc .library__item-label__osQe2 { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .library__modal-footer__3UfQM { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .library__selector-btn-add__as5CA, .library__selector-btn-item__svVXc { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .library__selector-btn-add__as5CA { background-color: var(--selector-sprite-bg_primary); } .library__selector-btn-add__as5CA:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .library__selector-btn-add__as5CA:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .library__selector-btn-add__as5CA .library__add-img__37hDW { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .library__selector-btn-add__as5CA .library__add-label__18fkK { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .library__selector-btn-item__svVXc { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .library__selector-btn-item__svVXc .library__item-img__2Ehao { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .library__selector-btn-item__svVXc .library__item-img__2Ehao img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .library__selector-btn-item__svVXc .library__item-label__osQe2 { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .library__selector-btn-item__svVXc:hover { background-color: var(--selector-sprite-bg_primary); } .library__selector-btn-item__svVXc:hover .library__item-img__2Ehao { border-color: var(--selector-sprite-bg_primary); } .library__selector-btn-item_selected__pP8Ep { background-color: var(--selector-sprite-bg_primary); } .library__selector-btn-item_selected__pP8Ep .library__item-img__2Ehao { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .library__menu-bar-btn__3vj9X { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .library__menu-bar-btn_green__1Bs5-, .library__menu-bar-btn_create__3t1hN { background-color: #3cdc8f; } .library__menu-bar-btn_green__1Bs5-:hover, .library__menu-bar-btn_create__3t1hN:hover { background-color: #00d374; } .library__menu-bar-btn_green__1Bs5-:active, .library__menu-bar-btn_create__3t1hN:active { background-color: #00d374; } .library__menu-bar-btn_save__7D_ai, .library__menu-bar-btn_reset__3cZ3P { background-color: #6ac8ff; } .library__menu-bar-btn_save__7D_ai:hover, .library__menu-bar-btn_reset__3cZ3P:hover { background-color: #57bcfe; } .library__menu-bar-btn_save__7D_ai:active, .library__menu-bar-btn_reset__3cZ3P:active { background-color: #4fb0fc; } .library__menu-bar-btn_submit__BZLmC, .library__menu-bar-btn_open__1heXR { background-color: #ff9e23; } .library__menu-bar-btn_submit__BZLmC:hover, .library__menu-bar-btn_open__1heXR:hover { background-color: #f47b04; } .library__menu-bar-btn_submit__BZLmC:active, .library__menu-bar-btn_open__1heXR:active { background-color: #fe8f22; } .library__menu-bar-btn_link__2w9zv { background-color: #e8efff; color: var(--theme-primary); } .library__menu-bar-btn_link__2w9zv:hover { background-color: #b6c7ff; } .library__menu-bar-btn_link__2w9zv:active { background-color: #cfdcff; } .library__menu-bar-btn_disabled__2kN5r { color: #565266; background-color: #e6e9ed; } .library__menu-bar-btn_disabled__2kN5r:hover { cursor: not-allowed; } .library__menu-bar-btn_help__3WssW { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .library__menu-bar-btn_help__3WssW:hover { background-color: #8398ff; } .library__menu-bar-btn_help__3WssW:active { background-color: #8ca3ff; } .library__menu-bar-separator__2i_hJ { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .library__modal-body__3I79G .library__modal-body-main__12Ufa .library__modal-body-main-scroll__3DXpn .library__modal-body-main-inner__2DAJD .library__selector-btn-item__svVXc .library__item-img__2Ehao .library__item-img-icon__3jg8I { width: 50px; height: auto; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .library_mobile__flex-center__1yIdf { display: flex; align-items: center; justify-content: center; } .library_mobile__full-filled__1I7VW { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .library_mobile__modal-mask__2xroX { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .library_mobile__modal-mask__2xroX .library_mobile__modal-wrap__2bBn3 { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .library_mobile__modal-mask__2xroX .library_mobile__modal-wrap__2bBn3 .library_mobile__modal-header-wrap__1UuAh { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .library_mobile__modal-mask__2xroX .library_mobile__modal-wrap__2bBn3 .library_mobile__modal-header-wrap__1UuAh .library_mobile__modal-header-bg__1C5gs { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .library_mobile__modal-mask__2xroX .library_mobile__modal-wrap__2bBn3 .library_mobile__modal-header-wrap__1UuAh .library_mobile__modal-header-label__8xY5a { flex-shrink: 0; font-size: 16px; font-weight: bold; } .library_mobile__modal-mask__2xroX .library_mobile__modal-wrap__2bBn3 .library_mobile__modal-header-wrap__1UuAh .library_mobile__modal-header-close__jaheC { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .library_mobile__modal-mask__2xroX .library_mobile__modal-wrap__2bBn3 .library_mobile__modal-header-wrap__1UuAh .library_mobile__modal-header-close__jaheC:hover { color: #98a2b4; } .library_mobile__modal-mask__2xroX .library_mobile__modal-wrap__2bBn3 .library_mobile__modal-body-wrap__3qgqa { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .library_mobile__modal-mask__2xroX .library_mobile__modal-wrap__2bBn3 .library_mobile__modal-footer-wrap__3A8Nn { flex-shrink: 0; display: flex; } .library_mobile__modal-header__prSvl { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .library_mobile__modal-header__prSvl .library_mobile__modal-header-upload__3MGGX { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .library_mobile__modal-header__prSvl .library_mobile__modal-header-upload__3MGGX:hover { background-color: #e0e9ff; } .library_mobile__modal-header__prSvl .library_mobile__modal-header-upload__3MGGX:active { background-color: #ccdaff; } .library_mobile__modal-header__prSvl .library_mobile__modal-header-upload__3MGGX .library_mobile__upload-img__2W-b_ { font-size: 16px; margin-right: calc(2px); } .library_mobile__modal-header__prSvl .library_mobile__modal-header-upload__3MGGX .library_mobile__upload-label__1txsl { font-size: 14px; } .library_mobile__modal-header__prSvl .library_mobile__modal-header-upload__3MGGX .library_mobile__upload-input__2iVwb { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .library_mobile__modal-header__prSvl .library_mobile__modal-header-search__3RNHj { position: relative; } .library_mobile__modal-header__prSvl .library_mobile__modal-header-search__3RNHj .library_mobile__search-input__2mAsa { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .library_mobile__modal-header__prSvl .library_mobile__modal-header-search__3RNHj .library_mobile__search-input__2mAsa::-webkit-input-placeholder { color: #98a2b4; } .library_mobile__modal-header__prSvl .library_mobile__modal-header-search__3RNHj .library_mobile__search-input__2mAsa::-moz-placeholder { color: #98a2b4; } .library_mobile__modal-header__prSvl .library_mobile__modal-header-search__3RNHj .library_mobile__search-input__2mAsa:-ms-input-placeholder { color: #98a2b4; } .library_mobile__modal-header__prSvl .library_mobile__modal-header-search__3RNHj .library_mobile__search-input__2mAsa:hover { border-color: #d1d7e1; } .library_mobile__modal-header__prSvl .library_mobile__modal-header-search__3RNHj .library_mobile__search-input__2mAsa:active { border-color: #d1d7e1; } .library_mobile__modal-header__prSvl .library_mobile__modal-header-search__3RNHj .library_mobile__search-img__3R54- { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .library_mobile__modal-body__1D7pj { flex-grow: 1; display: flex; } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-left__28zkJ, .library_mobile__modal-body__1D7pj .library_mobile__modal-body-main__2h6zd { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-left__28zkJ { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-left__28zkJ .library_mobile__modal-body-left-scroll__h5xSB { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-left__28zkJ .library_mobile__modal-body-left-scroll__h5xSB .library_mobile__modal-body-left-inner__1fxuE { width: 121px; padding: calc(12px); color: #5e6b81; } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-left__28zkJ .library_mobile__modal-body-left-scroll__h5xSB .library_mobile__modal-body-left-inner__1fxuE .library_mobile__menu-item-current__2nAIj { color: var(--theme-primary); background-color: #e0e9ff; } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-left__28zkJ .library_mobile__modal-body-left-scroll__h5xSB .library_mobile__modal-body-left-inner__1fxuE .library_mobile__menu-item__1rd0- { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-left__28zkJ .library_mobile__modal-body-left-scroll__h5xSB .library_mobile__modal-body-left-inner__1fxuE .library_mobile__menu-item__1rd0-:hover { background-color: #edeff5; } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-left__28zkJ .library_mobile__modal-body-left-scroll__h5xSB .library_mobile__modal-body-left-inner__1fxuE .library_mobile__menu-item__1rd0- .library_mobile__menu-item-img__jcXrL { flex-shrink: 0; width: 20px; margin-right: 8px; } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-left__28zkJ .library_mobile__modal-body-left-scroll__h5xSB .library_mobile__modal-body-left-inner__1fxuE .library_mobile__menu-item__1rd0- .library_mobile__menu-item-label__2jvgz { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-main__2h6zd { padding: calc(12px) 0; } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-main__2h6zd .library_mobile__modal-body-main-scroll__NNoS- { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-main__2h6zd .library_mobile__modal-body-main-scroll__NNoS- .library_mobile__modal-body-main-inner__1-VEh { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-main__2h6zd .library_mobile__modal-body-main-scroll__NNoS- .library_mobile__modal-body-main-inner__1-VEh .library_mobile__selector-btn-add__3kppt, .library_mobile__modal-body__1D7pj .library_mobile__modal-body-main__2h6zd .library_mobile__modal-body-main-scroll__NNoS- .library_mobile__modal-body-main-inner__1-VEh .library_mobile__selector-btn-item__1Igul { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-main__2h6zd .library_mobile__modal-body-main-scroll__NNoS- .library_mobile__modal-body-main-inner__1-VEh .library_mobile__selector-btn-add__3kppt:hover, .library_mobile__modal-body__1D7pj .library_mobile__modal-body-main__2h6zd .library_mobile__modal-body-main-scroll__NNoS- .library_mobile__modal-body-main-inner__1-VEh .library_mobile__selector-btn-item__1Igul:hover { background-color: #e0e9ff; } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-main__2h6zd .library_mobile__modal-body-main-scroll__NNoS- .library_mobile__modal-body-main-inner__1-VEh .library_mobile__selector-btn-add__3kppt:active, .library_mobile__modal-body__1D7pj .library_mobile__modal-body-main__2h6zd .library_mobile__modal-body-main-scroll__NNoS- .library_mobile__modal-body-main-inner__1-VEh .library_mobile__selector-btn-item__1Igul:active { background-color: #ccdaff; } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-main__2h6zd .library_mobile__modal-body-main-scroll__NNoS- .library_mobile__modal-body-main-inner__1-VEh .library_mobile__selector-btn-add__3kppt:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-main__2h6zd .library_mobile__modal-body-main-scroll__NNoS- .library_mobile__modal-body-main-inner__1-VEh .library_mobile__selector-btn-add__3kppt:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-main__2h6zd .library_mobile__modal-body-main-scroll__NNoS- .library_mobile__modal-body-main-inner__1-VEh .library_mobile__selector-btn-add__3kppt .library_mobile__add-img__3h0aC { font-size: 28px; height: auto; margin-bottom: 8px; } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-main__2h6zd .library_mobile__modal-body-main-scroll__NNoS- .library_mobile__modal-body-main-inner__1-VEh .library_mobile__selector-btn-add__3kppt .library_mobile__add-label__3-nGi { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-main__2h6zd .library_mobile__modal-body-main-scroll__NNoS- .library_mobile__modal-body-main-inner__1-VEh .library_mobile__selector-btn-item__1Igul { justify-content: space-between; } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-main__2h6zd .library_mobile__modal-body-main-scroll__NNoS- .library_mobile__modal-body-main-inner__1-VEh .library_mobile__selector-btn-item__1Igul .library_mobile__item-img__u2SKT { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-main__2h6zd .library_mobile__modal-body-main-scroll__NNoS- .library_mobile__modal-body-main-inner__1-VEh .library_mobile__selector-btn-item__1Igul .library_mobile__item-img__u2SKT img { width: auto; height: 105px; } .library_mobile__modal-body__1D7pj .library_mobile__modal-body-main__2h6zd .library_mobile__modal-body-main-scroll__NNoS- .library_mobile__modal-body-main-inner__1-VEh .library_mobile__selector-btn-item__1Igul .library_mobile__item-label__1_UHD { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .library_mobile__modal-footer__1BM3B { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .library_mobile__selector-btn-add__3kppt, .library_mobile__selector-btn-item__1Igul { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .library_mobile__selector-btn-add__3kppt { background-color: var(--selector-sprite-bg_primary); } .library_mobile__selector-btn-add__3kppt:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .library_mobile__selector-btn-add__3kppt:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .library_mobile__selector-btn-add__3kppt .library_mobile__add-img__3h0aC { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .library_mobile__selector-btn-add__3kppt .library_mobile__add-label__3-nGi { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .library_mobile__selector-btn-item__1Igul { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .library_mobile__selector-btn-item__1Igul .library_mobile__item-img__u2SKT { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .library_mobile__selector-btn-item__1Igul .library_mobile__item-img__u2SKT img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .library_mobile__selector-btn-item__1Igul .library_mobile__item-label__1_UHD { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .library_mobile__selector-btn-item__1Igul:hover { background-color: var(--selector-sprite-bg_primary); } .library_mobile__selector-btn-item__1Igul:hover .library_mobile__item-img__u2SKT { border-color: var(--selector-sprite-bg_primary); } .library_mobile__selector-btn-item_selected__3GXv1 { background-color: var(--selector-sprite-bg_primary); } .library_mobile__selector-btn-item_selected__3GXv1 .library_mobile__item-img__u2SKT { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .library_mobile__menu-bar-btn__3lSH7 { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .library_mobile__menu-bar-btn_green__20g9v, .library_mobile__menu-bar-btn_create__3oVvl { background-color: #3cdc8f; } .library_mobile__menu-bar-btn_green__20g9v:hover, .library_mobile__menu-bar-btn_create__3oVvl:hover { background-color: #00d374; } .library_mobile__menu-bar-btn_green__20g9v:active, .library_mobile__menu-bar-btn_create__3oVvl:active { background-color: #00d374; } .library_mobile__menu-bar-btn_save__POgic, .library_mobile__menu-bar-btn_reset__T_4PP { background-color: #6ac8ff; } .library_mobile__menu-bar-btn_save__POgic:hover, .library_mobile__menu-bar-btn_reset__T_4PP:hover { background-color: #57bcfe; } .library_mobile__menu-bar-btn_save__POgic:active, .library_mobile__menu-bar-btn_reset__T_4PP:active { background-color: #4fb0fc; } .library_mobile__menu-bar-btn_submit__2IdZa, .library_mobile__menu-bar-btn_open__4QcHR { background-color: #ff9e23; } .library_mobile__menu-bar-btn_submit__2IdZa:hover, .library_mobile__menu-bar-btn_open__4QcHR:hover { background-color: #f47b04; } .library_mobile__menu-bar-btn_submit__2IdZa:active, .library_mobile__menu-bar-btn_open__4QcHR:active { background-color: #fe8f22; } .library_mobile__menu-bar-btn_link__1xDIc { background-color: #e8efff; color: var(--theme-primary); } .library_mobile__menu-bar-btn_link__1xDIc:hover { background-color: #b6c7ff; } .library_mobile__menu-bar-btn_link__1xDIc:active { background-color: #cfdcff; } .library_mobile__menu-bar-btn_disabled__OtuMF { color: #565266; background-color: #e6e9ed; } .library_mobile__menu-bar-btn_disabled__OtuMF:hover { cursor: not-allowed; } .library_mobile__menu-bar-btn_help__22OD9 { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .library_mobile__menu-bar-btn_help__22OD9:hover { background-color: #8398ff; } .library_mobile__menu-bar-btn_help__22OD9:active { background-color: #8ca3ff; } .library_mobile__menu-bar-separator__2hD5T { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* 弹窗遮罩层样式 start */ .library_mobile__modal-wrap_mobile__Zd8AJ { position: fixed; width: var(--page-width); height: var(--page-height); left: 0; top: 0; right: 0; bottom: 0; margin: auto; z-index: 1050; background-color: #ffffff; display: flex; flex-direction: column; } .library_mobile__modal-wrap_mobile__Zd8AJ .library_mobile__modal-header_mobile__3M-OJ { display: flex; align-items: center; justify-content: center; flex-shrink: 0; position: relative; width: 100%; height: var(--menu-bar-height); background-position: left; background-size: auto var(--menu-bar-height); background-repeat: repeat; background-color: var(--menu-bar-bg-color); /* 搜索输入框 */ } .library_mobile__modal-wrap_mobile__Zd8AJ .library_mobile__modal-header_mobile__3M-OJ .library_mobile__modal-header-close-wrap__2obrX { display: flex; align-items: center; justify-content: center; width: 2.33rem; height: 2.33rem; flex-shrink: 0; position: absolute; left: 3.67rem; background-color: #00a6ec; border-radius: 50%; } .library_mobile__modal-wrap_mobile__Zd8AJ .library_mobile__modal-header_mobile__3M-OJ .library_mobile__modal-header-close-wrap__2obrX .library_mobile__modal-header-close__jaheC { font-size: 1.33rem; color: #ffffff; } .library_mobile__modal-wrap_mobile__Zd8AJ .library_mobile__modal-header_mobile__3M-OJ .library_mobile__modal-header-label__8xY5a { flex-shrink: 0; color: #ffffff; font-size: 1.17rem; font-weight: 600; } .library_mobile__modal-wrap_mobile__Zd8AJ .library_mobile__modal-header_mobile__3M-OJ .library_mobile__modal-header-search__3RNHj { position: absolute; right: 3.67rem; } .library_mobile__modal-wrap_mobile__Zd8AJ .library_mobile__modal-header_mobile__3M-OJ .library_mobile__modal-header-search__3RNHj .library_mobile__search-input__2mAsa { width: 10rem; height: 2.33rem; border: 1px solid #edeff5; outline: none; font-size: 1rem; border-radius: calc(1.165rem); padding: 0 1.8rem 0 8px; -webkit-user-select: text !important; } .library_mobile__modal-wrap_mobile__Zd8AJ .library_mobile__modal-header_mobile__3M-OJ .library_mobile__modal-header-search__3RNHj .library_mobile__search-input__2mAsa::-webkit-input-placeholder { color: #98a2b4; } .library_mobile__modal-wrap_mobile__Zd8AJ .library_mobile__modal-header_mobile__3M-OJ .library_mobile__modal-header-search__3RNHj .library_mobile__search-input__2mAsa::-moz-placeholder { color: #98a2b4; } .library_mobile__modal-wrap_mobile__Zd8AJ .library_mobile__modal-header_mobile__3M-OJ .library_mobile__modal-header-search__3RNHj .library_mobile__search-input__2mAsa:-ms-input-placeholder { color: #98a2b4; } .library_mobile__modal-wrap_mobile__Zd8AJ .library_mobile__modal-header_mobile__3M-OJ .library_mobile__modal-header-search__3RNHj .library_mobile__search-img__3R54- { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 1rem; color: #98a2b4; } .library_mobile__modal-wrap_mobile__Zd8AJ .library_mobile__modal-body_mobile__1-cYe { display: flex; flex: 1 0; overflow: hidden; } .library_mobile__modal-wrap_mobile__Zd8AJ .library_mobile__modal-body_mobile__1-cYe .library_mobile__modal-body-left_mobile__RKP44 { width: 11.25rem; flex-shrink: 0; overflow-y: auto; background-color: #f6fafe; } .library_mobile__modal-wrap_mobile__Zd8AJ .library_mobile__modal-body_mobile__1-cYe .library_mobile__modal-body-left_mobile__RKP44 .library_mobile__menu-item__1rd0- { display: flex; justify-content: flex-end; align-items: center; width: 11.25rem; height: 3.67rem; border-right: 0.33rem solid transparent; padding-right: 1.92rem; } .library_mobile__modal-wrap_mobile__Zd8AJ .library_mobile__modal-body_mobile__1-cYe .library_mobile__modal-body-left_mobile__RKP44 .library_mobile__menu-item__1rd0-.library_mobile__menu-item_current__1XHk_ { background: rgba(41, 205, 255, 0.1); border-radius: 0.33rem 0rem 0rem 0.33rem; border-color: #29cdff; margin-left: 4rem; width: calc(7.25rem); } .library_mobile__modal-wrap_mobile__Zd8AJ .library_mobile__modal-body_mobile__1-cYe .library_mobile__modal-body-left_mobile__RKP44 .library_mobile__menu-item__1rd0- .library_mobile__menu-item-img__jcXrL { width: 1.67rem; height: 1.67rem; flex-shrink: 0; margin-right: 0.33rem; } .library_mobile__modal-wrap_mobile__Zd8AJ .library_mobile__modal-body_mobile__1-cYe .library_mobile__modal-body-left_mobile__RKP44 .library_mobile__menu-item__1rd0- .library_mobile__menu-item-label__2jvgz { color: #5e6b81; font-family: 'PingFang SC'; font-size: 1.17rem; font-weight: 400; line-height: 1.17rem; } .library_mobile__modal-wrap_mobile__Zd8AJ .library_mobile__modal-body_mobile__1-cYe .library_mobile__modal-body-main_mobile__3Kanh { flex: 1 0; display: flex; flex-wrap: wrap; overflow-y: auto; padding: 1rem 0 0 1rem; align-content: flex-start; align-items: flex-start; justify-content: flex-start; } .library_mobile__modal-wrap_mobile__Zd8AJ .library_mobile__modal-body_mobile__1-cYe .library_mobile__modal-body-main_mobile__3Kanh .library_mobile__selector-btn-add__3kppt, .library_mobile__modal-wrap_mobile__Zd8AJ .library_mobile__modal-body_mobile__1-cYe .library_mobile__modal-body-main_mobile__3Kanh .library_mobile__selector-btn-item__1Igul { width: 8.1rem; height: 7.83rem; flex-shrink: 0; margin-right: 1rem; margin-bottom: 1rem; } .library_mobile__modal-wrap_mobile__Zd8AJ .library_mobile__modal-body_mobile__1-cYe .library_mobile__modal-body-main_mobile__3Kanh .library_mobile__selector-btn-item__1Igul .library_mobile__item-img__u2SKT { height: 4.71rem; flex-shrink: 0; background-color: transparent; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .stage-selector__flex-center__1g8Up { display: flex; align-items: center; justify-content: center; } .stage-selector__full-filled__35GhI { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .stage-selector__modal-mask__3yaVj { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .stage-selector__modal-mask__3yaVj .stage-selector__modal-wrap__RJU5A { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .stage-selector__modal-mask__3yaVj .stage-selector__modal-wrap__RJU5A .stage-selector__modal-header-wrap__1sQAS { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .stage-selector__modal-mask__3yaVj .stage-selector__modal-wrap__RJU5A .stage-selector__modal-header-wrap__1sQAS .stage-selector__modal-header-bg__2SLMq { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .stage-selector__modal-mask__3yaVj .stage-selector__modal-wrap__RJU5A .stage-selector__modal-header-wrap__1sQAS .stage-selector__modal-header-label__1YPrV { flex-shrink: 0; font-size: 16px; font-weight: bold; } .stage-selector__modal-mask__3yaVj .stage-selector__modal-wrap__RJU5A .stage-selector__modal-header-wrap__1sQAS .stage-selector__modal-header-close__2ZETG { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .stage-selector__modal-mask__3yaVj .stage-selector__modal-wrap__RJU5A .stage-selector__modal-header-wrap__1sQAS .stage-selector__modal-header-close__2ZETG:hover { color: #98a2b4; } .stage-selector__modal-mask__3yaVj .stage-selector__modal-wrap__RJU5A .stage-selector__modal-body-wrap__3NhDH { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .stage-selector__modal-mask__3yaVj .stage-selector__modal-wrap__RJU5A .stage-selector__modal-footer-wrap__z_0mu { flex-shrink: 0; display: flex; } .stage-selector__modal-header__2HkTP { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .stage-selector__modal-header__2HkTP .stage-selector__modal-header-upload__2Z8Nz { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .stage-selector__modal-header__2HkTP .stage-selector__modal-header-upload__2Z8Nz:hover { background-color: #e0e9ff; } .stage-selector__modal-header__2HkTP .stage-selector__modal-header-upload__2Z8Nz:active { background-color: #ccdaff; } .stage-selector__modal-header__2HkTP .stage-selector__modal-header-upload__2Z8Nz .stage-selector__upload-img__s5ZUM { font-size: 16px; margin-right: calc(2px); } .stage-selector__modal-header__2HkTP .stage-selector__modal-header-upload__2Z8Nz .stage-selector__upload-label__3DyM5 { font-size: 14px; } .stage-selector__modal-header__2HkTP .stage-selector__modal-header-upload__2Z8Nz .stage-selector__upload-input__wL_Oj { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .stage-selector__modal-header__2HkTP .stage-selector__modal-header-search__xA4Xe { position: relative; } .stage-selector__modal-header__2HkTP .stage-selector__modal-header-search__xA4Xe .stage-selector__search-input__1jzmo { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .stage-selector__modal-header__2HkTP .stage-selector__modal-header-search__xA4Xe .stage-selector__search-input__1jzmo::-webkit-input-placeholder { color: #98a2b4; } .stage-selector__modal-header__2HkTP .stage-selector__modal-header-search__xA4Xe .stage-selector__search-input__1jzmo::-moz-placeholder { color: #98a2b4; } .stage-selector__modal-header__2HkTP .stage-selector__modal-header-search__xA4Xe .stage-selector__search-input__1jzmo:-ms-input-placeholder { color: #98a2b4; } .stage-selector__modal-header__2HkTP .stage-selector__modal-header-search__xA4Xe .stage-selector__search-input__1jzmo:hover { border-color: #d1d7e1; } .stage-selector__modal-header__2HkTP .stage-selector__modal-header-search__xA4Xe .stage-selector__search-input__1jzmo:active { border-color: #d1d7e1; } .stage-selector__modal-header__2HkTP .stage-selector__modal-header-search__xA4Xe .stage-selector__search-img__3pw3M { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .stage-selector__modal-body__2ZfX_ { flex-grow: 1; display: flex; } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-left__2plCD, .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-main__3wbiM { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-left__2plCD { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-left__2plCD .stage-selector__modal-body-left-scroll__Y9dex { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-left__2plCD .stage-selector__modal-body-left-scroll__Y9dex .stage-selector__modal-body-left-inner__1uQ1s { width: 121px; padding: calc(12px); color: #5e6b81; } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-left__2plCD .stage-selector__modal-body-left-scroll__Y9dex .stage-selector__modal-body-left-inner__1uQ1s .stage-selector__menu-item-current__2uTIE { color: var(--theme-primary); background-color: #e0e9ff; } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-left__2plCD .stage-selector__modal-body-left-scroll__Y9dex .stage-selector__modal-body-left-inner__1uQ1s .stage-selector__menu-item__foUqy { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-left__2plCD .stage-selector__modal-body-left-scroll__Y9dex .stage-selector__modal-body-left-inner__1uQ1s .stage-selector__menu-item__foUqy:hover { background-color: #edeff5; } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-left__2plCD .stage-selector__modal-body-left-scroll__Y9dex .stage-selector__modal-body-left-inner__1uQ1s .stage-selector__menu-item__foUqy .stage-selector__menu-item-img__1yJIV { flex-shrink: 0; width: 20px; margin-right: 8px; } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-left__2plCD .stage-selector__modal-body-left-scroll__Y9dex .stage-selector__modal-body-left-inner__1uQ1s .stage-selector__menu-item__foUqy .stage-selector__menu-item-label__3PyQU { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-main__3wbiM { padding: calc(12px) 0; } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-main__3wbiM .stage-selector__modal-body-main-scroll__xEvQ5 { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-main__3wbiM .stage-selector__modal-body-main-scroll__xEvQ5 .stage-selector__modal-body-main-inner__1lFeb { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-main__3wbiM .stage-selector__modal-body-main-scroll__xEvQ5 .stage-selector__modal-body-main-inner__1lFeb .stage-selector__selector-btn-add__1OHWK, .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-main__3wbiM .stage-selector__modal-body-main-scroll__xEvQ5 .stage-selector__modal-body-main-inner__1lFeb .stage-selector__selector-btn-item__3BH2E { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-main__3wbiM .stage-selector__modal-body-main-scroll__xEvQ5 .stage-selector__modal-body-main-inner__1lFeb .stage-selector__selector-btn-add__1OHWK:hover, .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-main__3wbiM .stage-selector__modal-body-main-scroll__xEvQ5 .stage-selector__modal-body-main-inner__1lFeb .stage-selector__selector-btn-item__3BH2E:hover { background-color: #e0e9ff; } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-main__3wbiM .stage-selector__modal-body-main-scroll__xEvQ5 .stage-selector__modal-body-main-inner__1lFeb .stage-selector__selector-btn-add__1OHWK:active, .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-main__3wbiM .stage-selector__modal-body-main-scroll__xEvQ5 .stage-selector__modal-body-main-inner__1lFeb .stage-selector__selector-btn-item__3BH2E:active { background-color: #ccdaff; } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-main__3wbiM .stage-selector__modal-body-main-scroll__xEvQ5 .stage-selector__modal-body-main-inner__1lFeb .stage-selector__selector-btn-add__1OHWK:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-main__3wbiM .stage-selector__modal-body-main-scroll__xEvQ5 .stage-selector__modal-body-main-inner__1lFeb .stage-selector__selector-btn-add__1OHWK:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-main__3wbiM .stage-selector__modal-body-main-scroll__xEvQ5 .stage-selector__modal-body-main-inner__1lFeb .stage-selector__selector-btn-add__1OHWK .stage-selector__add-img__1rl6n { font-size: 28px; height: auto; margin-bottom: 8px; } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-main__3wbiM .stage-selector__modal-body-main-scroll__xEvQ5 .stage-selector__modal-body-main-inner__1lFeb .stage-selector__selector-btn-add__1OHWK .stage-selector__add-label__2gsTw { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-main__3wbiM .stage-selector__modal-body-main-scroll__xEvQ5 .stage-selector__modal-body-main-inner__1lFeb .stage-selector__selector-btn-item__3BH2E { justify-content: space-between; } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-main__3wbiM .stage-selector__modal-body-main-scroll__xEvQ5 .stage-selector__modal-body-main-inner__1lFeb .stage-selector__selector-btn-item__3BH2E .stage-selector__item-img__22xEI { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-main__3wbiM .stage-selector__modal-body-main-scroll__xEvQ5 .stage-selector__modal-body-main-inner__1lFeb .stage-selector__selector-btn-item__3BH2E .stage-selector__item-img__22xEI img { width: auto; height: 105px; } .stage-selector__modal-body__2ZfX_ .stage-selector__modal-body-main__3wbiM .stage-selector__modal-body-main-scroll__xEvQ5 .stage-selector__modal-body-main-inner__1lFeb .stage-selector__selector-btn-item__3BH2E .stage-selector__item-label__pG0XS { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .stage-selector__modal-footer__1L2St { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .stage-selector__selector-btn-add__1OHWK, .stage-selector__selector-btn-item__3BH2E { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .stage-selector__selector-btn-add__1OHWK { background-color: var(--selector-sprite-bg_primary); } .stage-selector__selector-btn-add__1OHWK:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .stage-selector__selector-btn-add__1OHWK:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .stage-selector__selector-btn-add__1OHWK .stage-selector__add-img__1rl6n { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .stage-selector__selector-btn-add__1OHWK .stage-selector__add-label__2gsTw { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .stage-selector__selector-btn-item__3BH2E { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .stage-selector__selector-btn-item__3BH2E .stage-selector__item-img__22xEI { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .stage-selector__selector-btn-item__3BH2E .stage-selector__item-img__22xEI img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .stage-selector__selector-btn-item__3BH2E .stage-selector__item-label__pG0XS { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .stage-selector__selector-btn-item__3BH2E:hover { background-color: var(--selector-sprite-bg_primary); } .stage-selector__selector-btn-item__3BH2E:hover .stage-selector__item-img__22xEI { border-color: var(--selector-sprite-bg_primary); } .stage-selector__selector-btn-item_selected__3--Jb { background-color: var(--selector-sprite-bg_primary); } .stage-selector__selector-btn-item_selected__3--Jb .stage-selector__item-img__22xEI { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .stage-selector__menu-bar-btn__1CBkx { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .stage-selector__menu-bar-btn_green__TPMGQ, .stage-selector__menu-bar-btn_create__29_2Z { background-color: #3cdc8f; } .stage-selector__menu-bar-btn_green__TPMGQ:hover, .stage-selector__menu-bar-btn_create__29_2Z:hover { background-color: #00d374; } .stage-selector__menu-bar-btn_green__TPMGQ:active, .stage-selector__menu-bar-btn_create__29_2Z:active { background-color: #00d374; } .stage-selector__menu-bar-btn_save__BeMHd, .stage-selector__menu-bar-btn_reset__1AweE { background-color: #6ac8ff; } .stage-selector__menu-bar-btn_save__BeMHd:hover, .stage-selector__menu-bar-btn_reset__1AweE:hover { background-color: #57bcfe; } .stage-selector__menu-bar-btn_save__BeMHd:active, .stage-selector__menu-bar-btn_reset__1AweE:active { background-color: #4fb0fc; } .stage-selector__menu-bar-btn_submit__ATUOA, .stage-selector__menu-bar-btn_open__2cMx0 { background-color: #ff9e23; } .stage-selector__menu-bar-btn_submit__ATUOA:hover, .stage-selector__menu-bar-btn_open__2cMx0:hover { background-color: #f47b04; } .stage-selector__menu-bar-btn_submit__ATUOA:active, .stage-selector__menu-bar-btn_open__2cMx0:active { background-color: #fe8f22; } .stage-selector__menu-bar-btn_link__2kWig { background-color: #e8efff; color: var(--theme-primary); } .stage-selector__menu-bar-btn_link__2kWig:hover { background-color: #b6c7ff; } .stage-selector__menu-bar-btn_link__2kWig:active { background-color: #cfdcff; } .stage-selector__menu-bar-btn_disabled__2Vow5 { color: #565266; background-color: #e6e9ed; } .stage-selector__menu-bar-btn_disabled__2Vow5:hover { cursor: not-allowed; } .stage-selector__menu-bar-btn_help__33JqB { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .stage-selector__menu-bar-btn_help__33JqB:hover { background-color: #8398ff; } .stage-selector__menu-bar-btn_help__33JqB:active { background-color: #8ca3ff; } .stage-selector__menu-bar-separator__2Z8b- { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .stage-selector__stage-separator__2RgbX { width: calc(100% - 16px); height: 1px; margin: 0 auto; background-color: #ccdcff; } .stage-selector__stage-selector__D7XU2 { display: flex; flex-shrink: 0; padding: 8px; } .stage-selector__stage-selector__D7XU2 .stage-selector__raised__3MZ4s { transition: all 0.25s ease; } .stage-selector__stage-selector__D7XU2 .stage-selector__raised__3MZ4s:hover { transform: scale(1.05); } .stage-selector__stage-selector__D7XU2 .stage-selector__received-blocks__1FQNy { animation: stage-selector__glowing__1G_m_ 250ms; } @keyframes stage-selector__glowing__1G_m_ { 10% { box-shadow: 0 0 10px #7fff1e; } 90% { box-shadow: 0 0 10px #7fff1e; } 100% { box-shadow: none; } } .stage-selector__stage-selector__D7XU2 .stage-selector__selector-btn-add__1OHWK { margin-right: 8px; background-color: #cdeeff; } .stage-selector__stage-selector__D7XU2 .stage-selector__selector-btn-add__1OHWK:hover { background-color: #bde9ff; border: 1px dashed #b4e3ff; } .stage-selector__stage-selector__D7XU2 .stage-selector__selector-btn-add__1OHWK:active { background-color: #ade4ff; border: 1px dashed #b4e3ff; } .stage-selector__stage-selector__D7XU2 .stage-selector__selector-btn-add__1OHWK .stage-selector__add-img__1rl6n { color: #1aa4ff; } .stage-selector__stage-selector__D7XU2 .stage-selector__selector-btn-add__1OHWK .stage-selector__add-label__2gsTw { color: #1aa4ff; } .stage-selector__stage-selector__D7XU2 .stage-selector__selector-btn-item__3BH2E { background-color: #cdeeff; position: relative; } .stage-selector__stage-selector__D7XU2 .stage-selector__selector-btn-item__3BH2E.stage-selector__selector-btn-item_disabled__1a3Q- { cursor: not-allowed; } .stage-selector__stage-selector__D7XU2 .stage-selector__selector-btn-item__3BH2E.stage-selector__selector-btn-item_disabled__1a3Q-::after { content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(255, 255, 255, 0.5); } .stage-selector__stage-selector__D7XU2 .stage-selector__selector-btn-item__3BH2E.stage-selector__selector-btn-item_disabled__1a3Q-:hover .stage-selector__disable-button__BJCrb { display: flex; justify-content: center; align-items: center; } .stage-selector__stage-selector__D7XU2 .stage-selector__selector-btn-item__3BH2E.stage-selector__selector-btn-item_disabled__1a3Q- .stage-selector__disable-button__BJCrb { display: none; } .stage-selector__stage-selector__D7XU2 .stage-selector__selector-btn-item__3BH2E .stage-selector__delete-button__mrgyO { display: flex; align-items: center; justify-content: center; font-size: 12px; position: absolute; top: -4px; right: -4px; z-index: 999; color: #ffffff; width: 16px; height: 16px; border-radius: 50%; background-color: #ff7070; } .stage-selector__stage-selector__D7XU2 .stage-selector__selector-btn-item__3BH2E .stage-selector__delete-button__mrgyO:hover { background-color: #f66464; } .stage-selector__stage-selector__D7XU2 .stage-selector__selector-btn-item__3BH2E .stage-selector__disable-button__BJCrb { display: flex; align-items: center; justify-content: center; font-size: 12px; position: absolute; top: -4px; right: -4px; z-index: 999; color: #ffffff; width: 16px; height: 16px; border-radius: 50%; background-color: #ff7070; } .stage-selector__stage-selector__D7XU2 .stage-selector__selector-btn-item__3BH2E .stage-selector__item-img__22xEI { border: 2px solid #cdeeff; background-color: #ffffff; } .stage-selector__stage-selector__D7XU2 .stage-selector__selector-btn-item__3BH2E .stage-selector__item-img__22xEI img { object-fit: cover; } .stage-selector__stage-selector__D7XU2 .stage-selector__selector-btn-item__3BH2E .stage-selector__item-label__pG0XS { color: #565266; } .stage-selector__stage-selector__D7XU2 .stage-selector__selector-btn-item__3BH2E:hover { background-color: #cdeeff; } .stage-selector__stage-selector__D7XU2 .stage-selector__selector-btn-item__3BH2E:hover .stage-selector__item-img__22xEI { border-color: #c6ebff; } .stage-selector__stage-selector__D7XU2 .stage-selector__selector-btn-item__3BH2E.stage-selector__selector-btn-item_selected__3--Jb { background-color: #cdeeff; } .stage-selector__stage-selector__D7XU2 .stage-selector__selector-btn-item__3BH2E.stage-selector__selector-btn-item_selected__3--Jb .stage-selector__item-img__22xEI { border-color: #6ac8ff; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .keyboard_jr__flex-center__2P6Kp { display: flex; align-items: center; justify-content: center; } .keyboard_jr__full-filled__1kBre { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .keyboard_jr__modal-mask__OIVqK { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .keyboard_jr__modal-mask__OIVqK .keyboard_jr__modal-wrap__33HU0 { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .keyboard_jr__modal-mask__OIVqK .keyboard_jr__modal-wrap__33HU0 .keyboard_jr__modal-header-wrap__3nORd { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .keyboard_jr__modal-mask__OIVqK .keyboard_jr__modal-wrap__33HU0 .keyboard_jr__modal-header-wrap__3nORd .keyboard_jr__modal-header-bg__2H7gx { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .keyboard_jr__modal-mask__OIVqK .keyboard_jr__modal-wrap__33HU0 .keyboard_jr__modal-header-wrap__3nORd .keyboard_jr__modal-header-label__1G1sG { flex-shrink: 0; font-size: 16px; font-weight: bold; } .keyboard_jr__modal-mask__OIVqK .keyboard_jr__modal-wrap__33HU0 .keyboard_jr__modal-header-wrap__3nORd .keyboard_jr__modal-header-close__2tNKD { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .keyboard_jr__modal-mask__OIVqK .keyboard_jr__modal-wrap__33HU0 .keyboard_jr__modal-header-wrap__3nORd .keyboard_jr__modal-header-close__2tNKD:hover { color: #98a2b4; } .keyboard_jr__modal-mask__OIVqK .keyboard_jr__modal-wrap__33HU0 .keyboard_jr__modal-body-wrap__Liulq { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .keyboard_jr__modal-mask__OIVqK .keyboard_jr__modal-wrap__33HU0 .keyboard_jr__modal-footer-wrap__1ftg1 { flex-shrink: 0; display: flex; } .keyboard_jr__modal-header__3EEom { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .keyboard_jr__modal-header__3EEom .keyboard_jr__modal-header-upload__ElnuM { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .keyboard_jr__modal-header__3EEom .keyboard_jr__modal-header-upload__ElnuM:hover { background-color: #e0e9ff; } .keyboard_jr__modal-header__3EEom .keyboard_jr__modal-header-upload__ElnuM:active { background-color: #ccdaff; } .keyboard_jr__modal-header__3EEom .keyboard_jr__modal-header-upload__ElnuM .keyboard_jr__upload-img__3rkhA { font-size: 16px; margin-right: calc(2px); } .keyboard_jr__modal-header__3EEom .keyboard_jr__modal-header-upload__ElnuM .keyboard_jr__upload-label__uYSIP { font-size: 14px; } .keyboard_jr__modal-header__3EEom .keyboard_jr__modal-header-upload__ElnuM .keyboard_jr__upload-input__8AMi2 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .keyboard_jr__modal-header__3EEom .keyboard_jr__modal-header-search__3bKYE { position: relative; } .keyboard_jr__modal-header__3EEom .keyboard_jr__modal-header-search__3bKYE .keyboard_jr__search-input__3F-0p { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .keyboard_jr__modal-header__3EEom .keyboard_jr__modal-header-search__3bKYE .keyboard_jr__search-input__3F-0p::-webkit-input-placeholder { color: #98a2b4; } .keyboard_jr__modal-header__3EEom .keyboard_jr__modal-header-search__3bKYE .keyboard_jr__search-input__3F-0p::-moz-placeholder { color: #98a2b4; } .keyboard_jr__modal-header__3EEom .keyboard_jr__modal-header-search__3bKYE .keyboard_jr__search-input__3F-0p:-ms-input-placeholder { color: #98a2b4; } .keyboard_jr__modal-header__3EEom .keyboard_jr__modal-header-search__3bKYE .keyboard_jr__search-input__3F-0p:hover { border-color: #d1d7e1; } .keyboard_jr__modal-header__3EEom .keyboard_jr__modal-header-search__3bKYE .keyboard_jr__search-input__3F-0p:active { border-color: #d1d7e1; } .keyboard_jr__modal-header__3EEom .keyboard_jr__modal-header-search__3bKYE .keyboard_jr__search-img__Nlkee { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .keyboard_jr__modal-body__1yQ9X { flex-grow: 1; display: flex; } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-left__3ElxM, .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-main__1s5yI { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-left__3ElxM { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-left__3ElxM .keyboard_jr__modal-body-left-scroll__RDn94 { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-left__3ElxM .keyboard_jr__modal-body-left-scroll__RDn94 .keyboard_jr__modal-body-left-inner__kK0c2 { width: 121px; padding: calc(12px); color: #5e6b81; } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-left__3ElxM .keyboard_jr__modal-body-left-scroll__RDn94 .keyboard_jr__modal-body-left-inner__kK0c2 .keyboard_jr__menu-item-current__2qGND { color: var(--theme-primary); background-color: #e0e9ff; } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-left__3ElxM .keyboard_jr__modal-body-left-scroll__RDn94 .keyboard_jr__modal-body-left-inner__kK0c2 .keyboard_jr__menu-item__1go31 { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-left__3ElxM .keyboard_jr__modal-body-left-scroll__RDn94 .keyboard_jr__modal-body-left-inner__kK0c2 .keyboard_jr__menu-item__1go31:hover { background-color: #edeff5; } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-left__3ElxM .keyboard_jr__modal-body-left-scroll__RDn94 .keyboard_jr__modal-body-left-inner__kK0c2 .keyboard_jr__menu-item__1go31 .keyboard_jr__menu-item-img__30upS { flex-shrink: 0; width: 20px; margin-right: 8px; } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-left__3ElxM .keyboard_jr__modal-body-left-scroll__RDn94 .keyboard_jr__modal-body-left-inner__kK0c2 .keyboard_jr__menu-item__1go31 .keyboard_jr__menu-item-label__2p9Ug { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-main__1s5yI { padding: calc(12px) 0; } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-main__1s5yI .keyboard_jr__modal-body-main-scroll__wHLAx { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-main__1s5yI .keyboard_jr__modal-body-main-scroll__wHLAx .keyboard_jr__modal-body-main-inner__SnRH7 { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-main__1s5yI .keyboard_jr__modal-body-main-scroll__wHLAx .keyboard_jr__modal-body-main-inner__SnRH7 .keyboard_jr__selector-btn-add__reo11, .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-main__1s5yI .keyboard_jr__modal-body-main-scroll__wHLAx .keyboard_jr__modal-body-main-inner__SnRH7 .keyboard_jr__selector-btn-item__3fLzD { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-main__1s5yI .keyboard_jr__modal-body-main-scroll__wHLAx .keyboard_jr__modal-body-main-inner__SnRH7 .keyboard_jr__selector-btn-add__reo11:hover, .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-main__1s5yI .keyboard_jr__modal-body-main-scroll__wHLAx .keyboard_jr__modal-body-main-inner__SnRH7 .keyboard_jr__selector-btn-item__3fLzD:hover { background-color: #e0e9ff; } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-main__1s5yI .keyboard_jr__modal-body-main-scroll__wHLAx .keyboard_jr__modal-body-main-inner__SnRH7 .keyboard_jr__selector-btn-add__reo11:active, .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-main__1s5yI .keyboard_jr__modal-body-main-scroll__wHLAx .keyboard_jr__modal-body-main-inner__SnRH7 .keyboard_jr__selector-btn-item__3fLzD:active { background-color: #ccdaff; } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-main__1s5yI .keyboard_jr__modal-body-main-scroll__wHLAx .keyboard_jr__modal-body-main-inner__SnRH7 .keyboard_jr__selector-btn-add__reo11:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-main__1s5yI .keyboard_jr__modal-body-main-scroll__wHLAx .keyboard_jr__modal-body-main-inner__SnRH7 .keyboard_jr__selector-btn-add__reo11:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-main__1s5yI .keyboard_jr__modal-body-main-scroll__wHLAx .keyboard_jr__modal-body-main-inner__SnRH7 .keyboard_jr__selector-btn-add__reo11 .keyboard_jr__add-img__16_TB { font-size: 28px; height: auto; margin-bottom: 8px; } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-main__1s5yI .keyboard_jr__modal-body-main-scroll__wHLAx .keyboard_jr__modal-body-main-inner__SnRH7 .keyboard_jr__selector-btn-add__reo11 .keyboard_jr__add-label__1EIAd { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-main__1s5yI .keyboard_jr__modal-body-main-scroll__wHLAx .keyboard_jr__modal-body-main-inner__SnRH7 .keyboard_jr__selector-btn-item__3fLzD { justify-content: space-between; } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-main__1s5yI .keyboard_jr__modal-body-main-scroll__wHLAx .keyboard_jr__modal-body-main-inner__SnRH7 .keyboard_jr__selector-btn-item__3fLzD .keyboard_jr__item-img__3WyHr { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-main__1s5yI .keyboard_jr__modal-body-main-scroll__wHLAx .keyboard_jr__modal-body-main-inner__SnRH7 .keyboard_jr__selector-btn-item__3fLzD .keyboard_jr__item-img__3WyHr img { width: auto; height: 105px; } .keyboard_jr__modal-body__1yQ9X .keyboard_jr__modal-body-main__1s5yI .keyboard_jr__modal-body-main-scroll__wHLAx .keyboard_jr__modal-body-main-inner__SnRH7 .keyboard_jr__selector-btn-item__3fLzD .keyboard_jr__item-label__2ayGr { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .keyboard_jr__modal-footer__1w2Sd { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .keyboard_jr__selector-btn-add__reo11, .keyboard_jr__selector-btn-item__3fLzD { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .keyboard_jr__selector-btn-add__reo11 { background-color: var(--selector-sprite-bg_primary); } .keyboard_jr__selector-btn-add__reo11:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .keyboard_jr__selector-btn-add__reo11:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .keyboard_jr__selector-btn-add__reo11 .keyboard_jr__add-img__16_TB { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .keyboard_jr__selector-btn-add__reo11 .keyboard_jr__add-label__1EIAd { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .keyboard_jr__selector-btn-item__3fLzD { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .keyboard_jr__selector-btn-item__3fLzD .keyboard_jr__item-img__3WyHr { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .keyboard_jr__selector-btn-item__3fLzD .keyboard_jr__item-img__3WyHr img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .keyboard_jr__selector-btn-item__3fLzD .keyboard_jr__item-label__2ayGr { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .keyboard_jr__selector-btn-item__3fLzD:hover { background-color: var(--selector-sprite-bg_primary); } .keyboard_jr__selector-btn-item__3fLzD:hover .keyboard_jr__item-img__3WyHr { border-color: var(--selector-sprite-bg_primary); } .keyboard_jr__selector-btn-item_selected__1boOq { background-color: var(--selector-sprite-bg_primary); } .keyboard_jr__selector-btn-item_selected__1boOq .keyboard_jr__item-img__3WyHr { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .keyboard_jr__menu-bar-btn__2af7g { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .keyboard_jr__menu-bar-btn_green__18D_j, .keyboard_jr__menu-bar-btn_create__3fkc- { background-color: #3cdc8f; } .keyboard_jr__menu-bar-btn_green__18D_j:hover, .keyboard_jr__menu-bar-btn_create__3fkc-:hover { background-color: #00d374; } .keyboard_jr__menu-bar-btn_green__18D_j:active, .keyboard_jr__menu-bar-btn_create__3fkc-:active { background-color: #00d374; } .keyboard_jr__menu-bar-btn_save__3YEyz, .keyboard_jr__menu-bar-btn_reset__1JrWp { background-color: #6ac8ff; } .keyboard_jr__menu-bar-btn_save__3YEyz:hover, .keyboard_jr__menu-bar-btn_reset__1JrWp:hover { background-color: #57bcfe; } .keyboard_jr__menu-bar-btn_save__3YEyz:active, .keyboard_jr__menu-bar-btn_reset__1JrWp:active { background-color: #4fb0fc; } .keyboard_jr__menu-bar-btn_submit__256QD, .keyboard_jr__menu-bar-btn_open__3g5Xo { background-color: #ff9e23; } .keyboard_jr__menu-bar-btn_submit__256QD:hover, .keyboard_jr__menu-bar-btn_open__3g5Xo:hover { background-color: #f47b04; } .keyboard_jr__menu-bar-btn_submit__256QD:active, .keyboard_jr__menu-bar-btn_open__3g5Xo:active { background-color: #fe8f22; } .keyboard_jr__menu-bar-btn_link__1bA3L { background-color: #e8efff; color: var(--theme-primary); } .keyboard_jr__menu-bar-btn_link__1bA3L:hover { background-color: #b6c7ff; } .keyboard_jr__menu-bar-btn_link__1bA3L:active { background-color: #cfdcff; } .keyboard_jr__menu-bar-btn_disabled__35FWr { color: #565266; background-color: #e6e9ed; } .keyboard_jr__menu-bar-btn_disabled__35FWr:hover { cursor: not-allowed; } .keyboard_jr__menu-bar-btn_help__XTwlg { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .keyboard_jr__menu-bar-btn_help__XTwlg:hover { background-color: #8398ff; } .keyboard_jr__menu-bar-btn_help__XTwlg:active { background-color: #8ca3ff; } .keyboard_jr__menu-bar-separator__cGO5y { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .keyboard_jr__keyboard-jr__2siVY { flex: 1 0; font-size: var(--keyboard-bg-width); display: flex; justify-content: center; align-items: flex-end; } .keyboard_jr__keyboard-jr__2siVY .keyboard_jr__keyboard-bg__tpxId { background-size: 100% 100%; background-repeat: no-repeat; display: flex; justify-content: space-around; } .keyboard_jr__keyboard-jr__2siVY .keyboard_jr__keyboard-bg__tpxId .keyboard_jr__keyboard-left__3y_AL .keyboard_jr__keyboard-direction__2sYqn { position: relative; background-size: 100% 100%; background-repeat: no-repeat; width: 0.28em; height: 0.3em; flex-shrink: 0; margin: 0.16em auto auto 0.08em; } .keyboard_jr__keyboard-jr__2siVY .keyboard_jr__keyboard-bg__tpxId .keyboard_jr__keyboard-left__3y_AL .keyboard_jr__keyboard-direction__2sYqn .keyboard_jr__keyboard-arrow__zxpOi { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 0.1em; height: 0.1em; flex-shrink: 0; padding: 0.02em; } .keyboard_jr__keyboard-jr__2siVY .keyboard_jr__keyboard-bg__tpxId .keyboard_jr__keyboard-left__3y_AL .keyboard_jr__keyboard-direction__2sYqn .keyboard_jr__keyboard-arrow__zxpOi.keyboard_jr__keyboard-arrow_up__17nt8 { bottom: auto; } .keyboard_jr__keyboard-jr__2siVY .keyboard_jr__keyboard-bg__tpxId .keyboard_jr__keyboard-left__3y_AL .keyboard_jr__keyboard-direction__2sYqn .keyboard_jr__keyboard-arrow__zxpOi.keyboard_jr__keyboard-arrow_down__3pqzH { bottom: 0.02em; top: auto; transform: rotate(180deg); } .keyboard_jr__keyboard-jr__2siVY .keyboard_jr__keyboard-bg__tpxId .keyboard_jr__keyboard-left__3y_AL .keyboard_jr__keyboard-direction__2sYqn .keyboard_jr__keyboard-arrow__zxpOi.keyboard_jr__keyboard-arrow_left__3A3Gp { right: auto; transform: translateY(-0.01em) rotate(270deg); } .keyboard_jr__keyboard-jr__2siVY .keyboard_jr__keyboard-bg__tpxId .keyboard_jr__keyboard-left__3y_AL .keyboard_jr__keyboard-direction__2sYqn .keyboard_jr__keyboard-arrow__zxpOi.keyboard_jr__keyboard-arrow_right__23WH4 { left: auto; transform: translateY(-0.01em) rotate(90deg); } .keyboard_jr__keyboard-jr__2siVY .keyboard_jr__keyboard-bg__tpxId .keyboard_jr__keyboard-right__i2EIe { display: flex; flex-direction: column; } .keyboard_jr__keyboard-jr__2siVY .keyboard_jr__keyboard-bg__tpxId .keyboard_jr__keyboard-right__i2EIe .keyboard_jr__keyboard-numbers__1fLFy { display: flex; justify-content: flex-end; margin: 0.17em 0.08em 0.04em auto; } .keyboard_jr__keyboard-jr__2siVY .keyboard_jr__keyboard-bg__tpxId .keyboard_jr__keyboard-right__i2EIe .keyboard_jr__keyboard-numbers__1fLFy .keyboard_jr__keyboard-number__iT9OD { display: flex; align-items: center; justify-content: center; background-size: 100% 100%; background-repeat: no-repeat; width: 0.11em; height: 0.11em; flex-shrink: 0; margin-right: 0.01em; } .keyboard_jr__keyboard-jr__2siVY .keyboard_jr__keyboard-bg__tpxId .keyboard_jr__keyboard-right__i2EIe .keyboard_jr__keyboard-numbers__1fLFy .keyboard_jr__keyboard-number__iT9OD span { color: #144d93; font-size: 0.06em; font-weight: 700; font-family: DejaVuSansMono; transform: translateY(-0.2em); } .keyboard_jr__keyboard-jr__2siVY .keyboard_jr__keyboard-bg__tpxId .keyboard_jr__keyboard-right__i2EIe .keyboard_jr__keyboard-space__Po4ZE { width: 0.48em; height: 0.15em; flex-shrink: 0; margin: auto 0.08em 0.11em auto; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .target-pane__target-pane__2ligI { /* Makes columns for the sprite library selector + and the stage selector */ display: flex; flex-direction: column; flex-grow: 1; } .target-pane__target-pane__2ligI * { -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .selector__flex-center__12W7h { display: flex; align-items: center; justify-content: center; } .selector__full-filled__2GN-P { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .selector__modal-mask__WUjMn { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .selector__modal-mask__WUjMn .selector__modal-wrap__GxWQS { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .selector__modal-mask__WUjMn .selector__modal-wrap__GxWQS .selector__modal-header-wrap__GBp7M { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .selector__modal-mask__WUjMn .selector__modal-wrap__GxWQS .selector__modal-header-wrap__GBp7M .selector__modal-header-bg__1cmcK { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .selector__modal-mask__WUjMn .selector__modal-wrap__GxWQS .selector__modal-header-wrap__GBp7M .selector__modal-header-label__3BJCC { flex-shrink: 0; font-size: 16px; font-weight: bold; } .selector__modal-mask__WUjMn .selector__modal-wrap__GxWQS .selector__modal-header-wrap__GBp7M .selector__modal-header-close__1BJvs { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .selector__modal-mask__WUjMn .selector__modal-wrap__GxWQS .selector__modal-header-wrap__GBp7M .selector__modal-header-close__1BJvs:hover { color: #98a2b4; } .selector__modal-mask__WUjMn .selector__modal-wrap__GxWQS .selector__modal-body-wrap__cL6Vv { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .selector__modal-mask__WUjMn .selector__modal-wrap__GxWQS .selector__modal-footer-wrap__2cKSY { flex-shrink: 0; display: flex; } .selector__modal-header__UqJzh { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .selector__modal-header__UqJzh .selector__modal-header-upload__1RmsK { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .selector__modal-header__UqJzh .selector__modal-header-upload__1RmsK:hover { background-color: #e0e9ff; } .selector__modal-header__UqJzh .selector__modal-header-upload__1RmsK:active { background-color: #ccdaff; } .selector__modal-header__UqJzh .selector__modal-header-upload__1RmsK .selector__upload-img__1q4E8 { font-size: 16px; margin-right: calc(2px); } .selector__modal-header__UqJzh .selector__modal-header-upload__1RmsK .selector__upload-label__3dzJH { font-size: 14px; } .selector__modal-header__UqJzh .selector__modal-header-upload__1RmsK .selector__upload-input__32zT8 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .selector__modal-header__UqJzh .selector__modal-header-search__3M6fw { position: relative; } .selector__modal-header__UqJzh .selector__modal-header-search__3M6fw .selector__search-input__204LD { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .selector__modal-header__UqJzh .selector__modal-header-search__3M6fw .selector__search-input__204LD::-webkit-input-placeholder { color: #98a2b4; } .selector__modal-header__UqJzh .selector__modal-header-search__3M6fw .selector__search-input__204LD::-moz-placeholder { color: #98a2b4; } .selector__modal-header__UqJzh .selector__modal-header-search__3M6fw .selector__search-input__204LD:-ms-input-placeholder { color: #98a2b4; } .selector__modal-header__UqJzh .selector__modal-header-search__3M6fw .selector__search-input__204LD:hover { border-color: #d1d7e1; } .selector__modal-header__UqJzh .selector__modal-header-search__3M6fw .selector__search-input__204LD:active { border-color: #d1d7e1; } .selector__modal-header__UqJzh .selector__modal-header-search__3M6fw .selector__search-img__2gFJn { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .selector__modal-body__1NYXW { flex-grow: 1; display: flex; } .selector__modal-body__1NYXW .selector__modal-body-left__1-Yzt, .selector__modal-body__1NYXW .selector__modal-body-main__1PyZ9 { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .selector__modal-body__1NYXW .selector__modal-body-left__1-Yzt { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .selector__modal-body__1NYXW .selector__modal-body-left__1-Yzt .selector__modal-body-left-scroll__2o_Jh { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .selector__modal-body__1NYXW .selector__modal-body-left__1-Yzt .selector__modal-body-left-scroll__2o_Jh .selector__modal-body-left-inner__1-J0Z { width: 121px; padding: calc(12px); color: #5e6b81; } .selector__modal-body__1NYXW .selector__modal-body-left__1-Yzt .selector__modal-body-left-scroll__2o_Jh .selector__modal-body-left-inner__1-J0Z .selector__menu-item-current__18LTl { color: var(--theme-primary); background-color: #e0e9ff; } .selector__modal-body__1NYXW .selector__modal-body-left__1-Yzt .selector__modal-body-left-scroll__2o_Jh .selector__modal-body-left-inner__1-J0Z .selector__menu-item__30yCV { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .selector__modal-body__1NYXW .selector__modal-body-left__1-Yzt .selector__modal-body-left-scroll__2o_Jh .selector__modal-body-left-inner__1-J0Z .selector__menu-item__30yCV:hover { background-color: #edeff5; } .selector__modal-body__1NYXW .selector__modal-body-left__1-Yzt .selector__modal-body-left-scroll__2o_Jh .selector__modal-body-left-inner__1-J0Z .selector__menu-item__30yCV .selector__menu-item-img__1sKES { flex-shrink: 0; width: 20px; margin-right: 8px; } .selector__modal-body__1NYXW .selector__modal-body-left__1-Yzt .selector__modal-body-left-scroll__2o_Jh .selector__modal-body-left-inner__1-J0Z .selector__menu-item__30yCV .selector__menu-item-label__1f-qW { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .selector__modal-body__1NYXW .selector__modal-body-main__1PyZ9 { padding: calc(12px) 0; } .selector__modal-body__1NYXW .selector__modal-body-main__1PyZ9 .selector__modal-body-main-scroll__3TOuW { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .selector__modal-body__1NYXW .selector__modal-body-main__1PyZ9 .selector__modal-body-main-scroll__3TOuW .selector__modal-body-main-inner__2xh3m { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .selector__modal-body__1NYXW .selector__modal-body-main__1PyZ9 .selector__modal-body-main-scroll__3TOuW .selector__modal-body-main-inner__2xh3m .selector__selector-btn-add__shhsW, .selector__modal-body__1NYXW .selector__modal-body-main__1PyZ9 .selector__modal-body-main-scroll__3TOuW .selector__modal-body-main-inner__2xh3m .selector__selector-btn-item__cJQWp { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .selector__modal-body__1NYXW .selector__modal-body-main__1PyZ9 .selector__modal-body-main-scroll__3TOuW .selector__modal-body-main-inner__2xh3m .selector__selector-btn-add__shhsW:hover, .selector__modal-body__1NYXW .selector__modal-body-main__1PyZ9 .selector__modal-body-main-scroll__3TOuW .selector__modal-body-main-inner__2xh3m .selector__selector-btn-item__cJQWp:hover { background-color: #e0e9ff; } .selector__modal-body__1NYXW .selector__modal-body-main__1PyZ9 .selector__modal-body-main-scroll__3TOuW .selector__modal-body-main-inner__2xh3m .selector__selector-btn-add__shhsW:active, .selector__modal-body__1NYXW .selector__modal-body-main__1PyZ9 .selector__modal-body-main-scroll__3TOuW .selector__modal-body-main-inner__2xh3m .selector__selector-btn-item__cJQWp:active { background-color: #ccdaff; } .selector__modal-body__1NYXW .selector__modal-body-main__1PyZ9 .selector__modal-body-main-scroll__3TOuW .selector__modal-body-main-inner__2xh3m .selector__selector-btn-add__shhsW:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .selector__modal-body__1NYXW .selector__modal-body-main__1PyZ9 .selector__modal-body-main-scroll__3TOuW .selector__modal-body-main-inner__2xh3m .selector__selector-btn-add__shhsW:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .selector__modal-body__1NYXW .selector__modal-body-main__1PyZ9 .selector__modal-body-main-scroll__3TOuW .selector__modal-body-main-inner__2xh3m .selector__selector-btn-add__shhsW .selector__add-img__1brYt { font-size: 28px; height: auto; margin-bottom: 8px; } .selector__modal-body__1NYXW .selector__modal-body-main__1PyZ9 .selector__modal-body-main-scroll__3TOuW .selector__modal-body-main-inner__2xh3m .selector__selector-btn-add__shhsW .selector__add-label__2fsWX { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .selector__modal-body__1NYXW .selector__modal-body-main__1PyZ9 .selector__modal-body-main-scroll__3TOuW .selector__modal-body-main-inner__2xh3m .selector__selector-btn-item__cJQWp { justify-content: space-between; } .selector__modal-body__1NYXW .selector__modal-body-main__1PyZ9 .selector__modal-body-main-scroll__3TOuW .selector__modal-body-main-inner__2xh3m .selector__selector-btn-item__cJQWp .selector__item-img__2bcE1 { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .selector__modal-body__1NYXW .selector__modal-body-main__1PyZ9 .selector__modal-body-main-scroll__3TOuW .selector__modal-body-main-inner__2xh3m .selector__selector-btn-item__cJQWp .selector__item-img__2bcE1 img { width: auto; height: 105px; } .selector__modal-body__1NYXW .selector__modal-body-main__1PyZ9 .selector__modal-body-main-scroll__3TOuW .selector__modal-body-main-inner__2xh3m .selector__selector-btn-item__cJQWp .selector__item-label__23jGU { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .selector__modal-footer__1c1Xr { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .selector__selector-btn-add__shhsW, .selector__selector-btn-item__cJQWp { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .selector__selector-btn-add__shhsW { background-color: var(--selector-sprite-bg_primary); } .selector__selector-btn-add__shhsW:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .selector__selector-btn-add__shhsW:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .selector__selector-btn-add__shhsW .selector__add-img__1brYt { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .selector__selector-btn-add__shhsW .selector__add-label__2fsWX { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .selector__selector-btn-item__cJQWp { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .selector__selector-btn-item__cJQWp .selector__item-img__2bcE1 { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .selector__selector-btn-item__cJQWp .selector__item-img__2bcE1 img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .selector__selector-btn-item__cJQWp .selector__item-label__23jGU { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .selector__selector-btn-item__cJQWp:hover { background-color: var(--selector-sprite-bg_primary); } .selector__selector-btn-item__cJQWp:hover .selector__item-img__2bcE1 { border-color: var(--selector-sprite-bg_primary); } .selector__selector-btn-item_selected__3gF9l { background-color: var(--selector-sprite-bg_primary); } .selector__selector-btn-item_selected__3gF9l .selector__item-img__2bcE1 { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .selector__menu-bar-btn__VTEwV { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .selector__menu-bar-btn_green__1aQ7R, .selector__menu-bar-btn_create__3O-uN { background-color: #3cdc8f; } .selector__menu-bar-btn_green__1aQ7R:hover, .selector__menu-bar-btn_create__3O-uN:hover { background-color: #00d374; } .selector__menu-bar-btn_green__1aQ7R:active, .selector__menu-bar-btn_create__3O-uN:active { background-color: #00d374; } .selector__menu-bar-btn_save__2m5Lc, .selector__menu-bar-btn_reset__6mc7Y { background-color: #6ac8ff; } .selector__menu-bar-btn_save__2m5Lc:hover, .selector__menu-bar-btn_reset__6mc7Y:hover { background-color: #57bcfe; } .selector__menu-bar-btn_save__2m5Lc:active, .selector__menu-bar-btn_reset__6mc7Y:active { background-color: #4fb0fc; } .selector__menu-bar-btn_submit__2ke4P, .selector__menu-bar-btn_open__3iMp2 { background-color: #ff9e23; } .selector__menu-bar-btn_submit__2ke4P:hover, .selector__menu-bar-btn_open__3iMp2:hover { background-color: #f47b04; } .selector__menu-bar-btn_submit__2ke4P:active, .selector__menu-bar-btn_open__3iMp2:active { background-color: #fe8f22; } .selector__menu-bar-btn_link__vqHaC { background-color: #e8efff; color: var(--theme-primary); } .selector__menu-bar-btn_link__vqHaC:hover { background-color: #b6c7ff; } .selector__menu-bar-btn_link__vqHaC:active { background-color: #cfdcff; } .selector__menu-bar-btn_disabled__1V5p1 { color: #565266; background-color: #e6e9ed; } .selector__menu-bar-btn_disabled__1V5p1:hover { cursor: not-allowed; } .selector__menu-bar-btn_help__2qOBi { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .selector__menu-bar-btn_help__2qOBi:hover { background-color: #8398ff; } .selector__menu-bar-btn_help__2qOBi:active { background-color: #8ca3ff; } .selector__menu-bar-separator__QbGv7 { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .selector__wrapper__1uwJh { width: 105px; position: relative; display: flex; flex-direction: column; justify-content: space-between; background-color: #f7f7ff; overflow-y: auto; } .selector__wrapper__1uwJh .selector__list-area__1KMDU { /* Must have some height (recalculated by flex-grow) in order to scroll */ height: 0; width: 105px; flex-grow: 1; flex-shrink: 0; display: flex; flex-direction: column; padding: 10px; padding-right: 0; } .selector__wrapper__1uwJh .selector__list-area__1KMDU .selector__selector-btn-add__shhsW { width: 80px; height: 80px; } .selector__wrapper__1uwJh .selector__list-area__1KMDU .selector__list-item__3cu1z { width: 80px; height: 80px; margin-top: 10px; } .selector__wrapper__1uwJh .selector__list-area__1KMDU .selector__list-item__3cu1z:-ms-input-placeholder { background: white; filter: opacity(15%) brightness(0%); } .selector__wrapper__1uwJh .selector__list-area__1KMDU .selector__list-item__3cu1z::placeholder { background: white; filter: opacity(15%) brightness(0%); } .selector__wrapper__1uwJh .selector__list-area__1KMDU .selector__list-item-first__clKSo { margin-top: 0; } .selector__wrapper__1uwJh .selector__new-buttons__3gI-H { position: absolute; bottom: 0; width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: space-around; padding: 0.75rem 0; color: var(--theme-primary); text-align: center; background: none; } .selector__wrapper__1uwJh .selector__new-buttons__3gI-H:before { content: ''; position: absolute; bottom: 0; left: 0; right: 0; background: linear-gradient(rgba(232, 237, 241, 0), #e8edf1); height: 100px; width: 100%; pointer-events: none; } .selector__wrapper__1uwJh .selector__new-buttons__3gI-H button + button { margin-top: 0.75rem; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .meter__green__2vxhG { fill: #abdcaa; stroke: #aed3a8; } .meter__yellow__3nJXR { fill: #fbdb82; stroke: #efd486; } .meter__red__kh0G3 { fill: #fbc28e; stroke: #ebbd8e; } .meter__mask-container__2I6nv { position: relative; } .meter__mask__1xuCn { position: absolute; top: 0; left: 0; height: 100%; width: 100%; transform-origin: top; will-change: transform; background: #e6ebff; opacity: 0.75; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .waveform__container__30sq6 { width: 100%; } .waveform__waveform-path__3U4_F { /* This color is lighter than sound-primary, but cannot use alpha because of overlapping elements. */ } .waveform-path { fill: #de91de; stroke: #bd42bd; } .waveform__baseline__oCQXp { stroke: #bd42bd; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .record-modal__modal-content__VfkoL { width: 600px; } .record-modal__body__27G9F { background: #ffffff; padding: 1.5rem 2.25rem; } .record-modal__visualization-container__37HTp { display: flex; justify-content: space-around; } .record-modal__meter-container__26aes, .record-modal__waveform-container__2FZd7 { background: #e6ebff; border: 1px solid #e8efff; border-radius: 5px; padding: 3px; /* Force these to be on their own render layer because they update often */ transform: translateZ(0); } .record-modal__meter-container__26aes { margin-right: 5px; height: 180px; } .record-modal__waveform-container__2FZd7 { display: flex; justify-content: space-around; align-items: center; width: 100%; height: 180px; position: relative; } .record-modal__help-text__yQXUF { margin: 10px auto 0; font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; color: #a7aab5; font-size: 0.95rem; font-weight: 500; } .record-modal__playing-text__3SyGA { color: var(--theme-primary); } .record-modal__recording-text__2bRnN { color: #e64d00; } .record-modal__main-button-row__2_yAa { display: flex; justify-content: space-around; margin-top: 15px; } .record-modal__main-button-row__2_yAa button { padding: 0.5rem 0.75rem; border-radius: 0.25rem; background: transparent; border: none; } .record-modal__main-button-row__2_yAa button:disabled { opacity: 0.25; } .record-modal__main-button-row__2_yAa button:active, .record-modal__main-button-row__2_yAa button:focus { outline: none; } .record-modal__button-row__2D9F8 { font-weight: bolder; text-align: right; display: flex; justify-content: space-between; } .record-modal__button-row__2D9F8 button { padding: 0.75rem 1rem; border-radius: 0.25rem; background: white; border: 1px solid #e8efff; font-weight: 600; font-size: 0.85rem; color: var(--theme-primary); } .record-modal__button-row__2D9F8 button.record-modal__ok-button__2VL35 { background: var(--theme-primary); border: var(--theme-primary); color: white; } .record-modal__button-row__2D9F8 button + button { margin-left: 0.5rem; } .record-modal__main-button__1Cn3Y { text-align: center; } .record-modal__record-button__20qus { overflow: visible; } .record-modal__record-button-circle__14vh4 { fill: #e64d00; stroke: #e64d00; } .record-modal__record-button-circle-outline__1n3lg { fill: #e64d00; opacity: 0.2; transition: 0.1s; } [dir='rtl'] .record-modal__rerecord-button__3bLKN img { transform: scaleX(-1); } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .audio-trimmer__absolute__32FO9 { position: absolute; top: 0; left: 0; width: 100%; height: 100%; /* Force the browser to paint separately to avoid composite cost with waveform */ transform: translateZ(0); } .audio-trimmer__selector__CBSRt { cursor: url(static/cursor/cursor-pointer.cur), pointer; } .audio-trimmer__trim-background__3_uxj { cursor: url(static/cursor/cursor-pointer.cur), pointer; touch-action: none; } .audio-trimmer__trim-background-mask__2TmzI { border: 1px solid #e64d00; opacity: 0.5; background: repeating-linear-gradient(45deg, #e64d00, #e64d00 10px, #e64d00 10px, #e64d00 calc(20px)); } .audio-trimmer__selection-background__2NgCy { background: var(--theme-primary); opacity: 0.5; } .audio-trimmer__start-trim-background__2qgmq .audio-trimmer__trim-background-mask__2TmzI { border-top-left-radius: calc(4px); border-bottom-left-radius: calc(4px); } .audio-trimmer__end-trim-background__3ZH_D .audio-trimmer__trim-background-mask__2TmzI { border-top-right-radius: calc(4px); border-bottom-right-radius: calc(4px); } .audio-trimmer__trim-line__mfJo6 { position: absolute; top: 0; width: 0px; height: 100%; border: 1px solid #e64d00; } .audio-trimmer__selector__CBSRt .audio-trimmer__trim-line__mfJo6 { border: 1px solid var(--theme-primary); } .audio-trimmer__playhead-container__2WtNB { position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; } .audio-trimmer__playhead__13ehj { /* Even though playhead is just a line, it is 100% width (the width of the waveform) so that we can use transform: translateX() using percentages. */ width: 100%; height: 100%; border-left: 1px solid var(--theme-primary); border-top: none; border-bottom: none; border-right: none; } .audio-trimmer__right-handle__2lK4C { transform: scaleX(-1); } .audio-trimmer__selector__CBSRt .audio-trimmer__left-handle__1vAMx { left: -1px; } .audio-trimmer__selector__CBSRt .audio-trimmer__right-handle__2lK4C { right: -1px; } .audio-trimmer__trimmer__OeSVM .audio-trimmer__left-handle__1vAMx { right: -1px; } .audio-trimmer__trimmer__OeSVM .audio-trimmer__right-handle__2lK4C { left: -1px; } .audio-trimmer__trim-handle__3cdA9 { position: absolute; width: 30px; height: 30px; right: 0; } .audio-trimmer__trimmer__OeSVM .audio-trimmer__trim-handle__3cdA9 { filter: hue-rotate(150deg); } .audio-trimmer__trim-handle__3cdA9 img { position: absolute; width: 30px; height: 30px; left: calc(4.5px); /* Make sure image dragging isn't triggered */ -webkit-user-drag: none; /* Autoprefixer doesn't seem to work for this */ transition: 0.2s; } .audio-trimmer__top-trim-handle__3CVop { top: calc(-27px); } .audio-trimmer__bottom-trim-handle__2wJHf { bottom: calc(-27px); } .audio-trimmer__top-trim-handle__3CVop img { transform: scaleY(-1); } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .label__input-group__ustbC { display: inline-flex; flex-direction: row; align-items: center; } .label__input-group-column__1zDZP { display: inline-flex; flex-direction: column; align-items: flex-start; } .label__input-group-column__1zDZP span { margin-bottom: 0.25rem; } .label__input-label__Fc6xt, .label__input-label-secondary__2umMp { /* font-size: 0.625rem; */ /* @TrumanGao 修改字体大小 */ font-size: 0.9rem; cursor: url(static/cursor/cursor-pointer.cur), pointer; white-space: nowrap; } [dir='ltr'] .label__input-label__Fc6xt, [dir='ltr'] .label__input-label-secondary__2umMp { margin-right: 0.5rem; } [dir='rtl'] .label__input-label__Fc6xt, [dir='rtl'] .label__input-label-secondary__2umMp { margin-left: 0.5rem; } .label__input-label__Fc6xt { color: #828da3; font-weight: bold; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .icon-button__container__3HIjP { display: flex; flex-direction: column; align-items: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; font-size: 0.75rem; font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; color: var(--theme-primary); border-radius: 0.5rem; } .icon-button__container__3HIjP + .icon-button__container__3HIjP { margin-top: 1.25rem; } .icon-button__title__2oCYR { margin-top: 0.5rem; text-align: center; } .icon-button__disabled__3-Jj0 { opacity: 0.5; pointer-events: none; } .icon-button__container__3HIjP:active { background-color: rgba(77, 151, 255, 0.15); } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .sound-editor__flex-center__qfu4l { display: flex; align-items: center; justify-content: center; } .sound-editor__full-filled__2IB0Y { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .sound-editor__modal-mask__1qrYK { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .sound-editor__modal-mask__1qrYK .sound-editor__modal-wrap__2Vz4W { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .sound-editor__modal-mask__1qrYK .sound-editor__modal-wrap__2Vz4W .sound-editor__modal-header-wrap__2FuA4 { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .sound-editor__modal-mask__1qrYK .sound-editor__modal-wrap__2Vz4W .sound-editor__modal-header-wrap__2FuA4 .sound-editor__modal-header-bg__2L_LC { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .sound-editor__modal-mask__1qrYK .sound-editor__modal-wrap__2Vz4W .sound-editor__modal-header-wrap__2FuA4 .sound-editor__modal-header-label__2ah_Z { flex-shrink: 0; font-size: 16px; font-weight: bold; } .sound-editor__modal-mask__1qrYK .sound-editor__modal-wrap__2Vz4W .sound-editor__modal-header-wrap__2FuA4 .sound-editor__modal-header-close__fAGam { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .sound-editor__modal-mask__1qrYK .sound-editor__modal-wrap__2Vz4W .sound-editor__modal-header-wrap__2FuA4 .sound-editor__modal-header-close__fAGam:hover { color: #98a2b4; } .sound-editor__modal-mask__1qrYK .sound-editor__modal-wrap__2Vz4W .sound-editor__modal-body-wrap__2Q9Jo { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .sound-editor__modal-mask__1qrYK .sound-editor__modal-wrap__2Vz4W .sound-editor__modal-footer-wrap__mNISK { flex-shrink: 0; display: flex; } .sound-editor__modal-header__yizyI { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .sound-editor__modal-header__yizyI .sound-editor__modal-header-upload__FXmog { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .sound-editor__modal-header__yizyI .sound-editor__modal-header-upload__FXmog:hover { background-color: #e0e9ff; } .sound-editor__modal-header__yizyI .sound-editor__modal-header-upload__FXmog:active { background-color: #ccdaff; } .sound-editor__modal-header__yizyI .sound-editor__modal-header-upload__FXmog .sound-editor__upload-img__1UGSv { font-size: 16px; margin-right: calc(2px); } .sound-editor__modal-header__yizyI .sound-editor__modal-header-upload__FXmog .sound-editor__upload-label__1tXDT { font-size: 14px; } .sound-editor__modal-header__yizyI .sound-editor__modal-header-upload__FXmog .sound-editor__upload-input__2SZwH { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .sound-editor__modal-header__yizyI .sound-editor__modal-header-search__34L-M { position: relative; } .sound-editor__modal-header__yizyI .sound-editor__modal-header-search__34L-M .sound-editor__search-input__3e2p5 { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .sound-editor__modal-header__yizyI .sound-editor__modal-header-search__34L-M .sound-editor__search-input__3e2p5::-webkit-input-placeholder { color: #98a2b4; } .sound-editor__modal-header__yizyI .sound-editor__modal-header-search__34L-M .sound-editor__search-input__3e2p5::-moz-placeholder { color: #98a2b4; } .sound-editor__modal-header__yizyI .sound-editor__modal-header-search__34L-M .sound-editor__search-input__3e2p5:-ms-input-placeholder { color: #98a2b4; } .sound-editor__modal-header__yizyI .sound-editor__modal-header-search__34L-M .sound-editor__search-input__3e2p5:hover { border-color: #d1d7e1; } .sound-editor__modal-header__yizyI .sound-editor__modal-header-search__34L-M .sound-editor__search-input__3e2p5:active { border-color: #d1d7e1; } .sound-editor__modal-header__yizyI .sound-editor__modal-header-search__34L-M .sound-editor__search-img__3x7O8 { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .sound-editor__modal-body__1SVKQ { flex-grow: 1; display: flex; } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-left__3KADN, .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-main__2QM1i { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-left__3KADN { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-left__3KADN .sound-editor__modal-body-left-scroll__6pIba { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-left__3KADN .sound-editor__modal-body-left-scroll__6pIba .sound-editor__modal-body-left-inner__1_SEC { width: 121px; padding: calc(12px); color: #5e6b81; } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-left__3KADN .sound-editor__modal-body-left-scroll__6pIba .sound-editor__modal-body-left-inner__1_SEC .sound-editor__menu-item-current__J3xz9 { color: var(--theme-primary); background-color: #e0e9ff; } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-left__3KADN .sound-editor__modal-body-left-scroll__6pIba .sound-editor__modal-body-left-inner__1_SEC .sound-editor__menu-item__3pgBc { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-left__3KADN .sound-editor__modal-body-left-scroll__6pIba .sound-editor__modal-body-left-inner__1_SEC .sound-editor__menu-item__3pgBc:hover { background-color: #edeff5; } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-left__3KADN .sound-editor__modal-body-left-scroll__6pIba .sound-editor__modal-body-left-inner__1_SEC .sound-editor__menu-item__3pgBc .sound-editor__menu-item-img__UdVlP { flex-shrink: 0; width: 20px; margin-right: 8px; } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-left__3KADN .sound-editor__modal-body-left-scroll__6pIba .sound-editor__modal-body-left-inner__1_SEC .sound-editor__menu-item__3pgBc .sound-editor__menu-item-label__1vK0d { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-main__2QM1i { padding: calc(12px) 0; } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-main__2QM1i .sound-editor__modal-body-main-scroll__18QYu { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-main__2QM1i .sound-editor__modal-body-main-scroll__18QYu .sound-editor__modal-body-main-inner__3-BVB { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-main__2QM1i .sound-editor__modal-body-main-scroll__18QYu .sound-editor__modal-body-main-inner__3-BVB .sound-editor__selector-btn-add__1BZWA, .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-main__2QM1i .sound-editor__modal-body-main-scroll__18QYu .sound-editor__modal-body-main-inner__3-BVB .sound-editor__selector-btn-item__JSg5j { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-main__2QM1i .sound-editor__modal-body-main-scroll__18QYu .sound-editor__modal-body-main-inner__3-BVB .sound-editor__selector-btn-add__1BZWA:hover, .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-main__2QM1i .sound-editor__modal-body-main-scroll__18QYu .sound-editor__modal-body-main-inner__3-BVB .sound-editor__selector-btn-item__JSg5j:hover { background-color: #e0e9ff; } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-main__2QM1i .sound-editor__modal-body-main-scroll__18QYu .sound-editor__modal-body-main-inner__3-BVB .sound-editor__selector-btn-add__1BZWA:active, .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-main__2QM1i .sound-editor__modal-body-main-scroll__18QYu .sound-editor__modal-body-main-inner__3-BVB .sound-editor__selector-btn-item__JSg5j:active { background-color: #ccdaff; } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-main__2QM1i .sound-editor__modal-body-main-scroll__18QYu .sound-editor__modal-body-main-inner__3-BVB .sound-editor__selector-btn-add__1BZWA:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-main__2QM1i .sound-editor__modal-body-main-scroll__18QYu .sound-editor__modal-body-main-inner__3-BVB .sound-editor__selector-btn-add__1BZWA:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-main__2QM1i .sound-editor__modal-body-main-scroll__18QYu .sound-editor__modal-body-main-inner__3-BVB .sound-editor__selector-btn-add__1BZWA .sound-editor__add-img__1t0Ef { font-size: 28px; height: auto; margin-bottom: 8px; } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-main__2QM1i .sound-editor__modal-body-main-scroll__18QYu .sound-editor__modal-body-main-inner__3-BVB .sound-editor__selector-btn-add__1BZWA .sound-editor__add-label__1rGIR { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-main__2QM1i .sound-editor__modal-body-main-scroll__18QYu .sound-editor__modal-body-main-inner__3-BVB .sound-editor__selector-btn-item__JSg5j { justify-content: space-between; } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-main__2QM1i .sound-editor__modal-body-main-scroll__18QYu .sound-editor__modal-body-main-inner__3-BVB .sound-editor__selector-btn-item__JSg5j .sound-editor__item-img__1fOTJ { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-main__2QM1i .sound-editor__modal-body-main-scroll__18QYu .sound-editor__modal-body-main-inner__3-BVB .sound-editor__selector-btn-item__JSg5j .sound-editor__item-img__1fOTJ img { width: auto; height: 105px; } .sound-editor__modal-body__1SVKQ .sound-editor__modal-body-main__2QM1i .sound-editor__modal-body-main-scroll__18QYu .sound-editor__modal-body-main-inner__3-BVB .sound-editor__selector-btn-item__JSg5j .sound-editor__item-label__1ZPdi { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .sound-editor__modal-footer__1xMl2 { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .sound-editor__selector-btn-add__1BZWA, .sound-editor__selector-btn-item__JSg5j { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .sound-editor__selector-btn-add__1BZWA { background-color: var(--selector-sprite-bg_primary); } .sound-editor__selector-btn-add__1BZWA:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .sound-editor__selector-btn-add__1BZWA:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .sound-editor__selector-btn-add__1BZWA .sound-editor__add-img__1t0Ef { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .sound-editor__selector-btn-add__1BZWA .sound-editor__add-label__1rGIR { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .sound-editor__selector-btn-item__JSg5j { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .sound-editor__selector-btn-item__JSg5j .sound-editor__item-img__1fOTJ { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .sound-editor__selector-btn-item__JSg5j .sound-editor__item-img__1fOTJ img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .sound-editor__selector-btn-item__JSg5j .sound-editor__item-label__1ZPdi { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .sound-editor__selector-btn-item__JSg5j:hover { background-color: var(--selector-sprite-bg_primary); } .sound-editor__selector-btn-item__JSg5j:hover .sound-editor__item-img__1fOTJ { border-color: var(--selector-sprite-bg_primary); } .sound-editor__selector-btn-item_selected__2mJ2Y { background-color: var(--selector-sprite-bg_primary); } .sound-editor__selector-btn-item_selected__2mJ2Y .sound-editor__item-img__1fOTJ { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .sound-editor__menu-bar-btn__2giN_ { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .sound-editor__menu-bar-btn_green__33lUh, .sound-editor__menu-bar-btn_create__3zDjI { background-color: #3cdc8f; } .sound-editor__menu-bar-btn_green__33lUh:hover, .sound-editor__menu-bar-btn_create__3zDjI:hover { background-color: #00d374; } .sound-editor__menu-bar-btn_green__33lUh:active, .sound-editor__menu-bar-btn_create__3zDjI:active { background-color: #00d374; } .sound-editor__menu-bar-btn_save__1FiS_, .sound-editor__menu-bar-btn_reset__1SNqb { background-color: #6ac8ff; } .sound-editor__menu-bar-btn_save__1FiS_:hover, .sound-editor__menu-bar-btn_reset__1SNqb:hover { background-color: #57bcfe; } .sound-editor__menu-bar-btn_save__1FiS_:active, .sound-editor__menu-bar-btn_reset__1SNqb:active { background-color: #4fb0fc; } .sound-editor__menu-bar-btn_submit__29ii3, .sound-editor__menu-bar-btn_open__1BHEz { background-color: #ff9e23; } .sound-editor__menu-bar-btn_submit__29ii3:hover, .sound-editor__menu-bar-btn_open__1BHEz:hover { background-color: #f47b04; } .sound-editor__menu-bar-btn_submit__29ii3:active, .sound-editor__menu-bar-btn_open__1BHEz:active { background-color: #fe8f22; } .sound-editor__menu-bar-btn_link__2UmwU { background-color: #e8efff; color: var(--theme-primary); } .sound-editor__menu-bar-btn_link__2UmwU:hover { background-color: #b6c7ff; } .sound-editor__menu-bar-btn_link__2UmwU:active { background-color: #cfdcff; } .sound-editor__menu-bar-btn_disabled__26mh6 { color: #565266; background-color: #e6e9ed; } .sound-editor__menu-bar-btn_disabled__26mh6:hover { cursor: not-allowed; } .sound-editor__menu-bar-btn_help__16xvj { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .sound-editor__menu-bar-btn_help__16xvj:hover { background-color: #8398ff; } .sound-editor__menu-bar-btn_help__16xvj:active { background-color: #8ca3ff; } .sound-editor__menu-bar-separator__3ALl0 { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .sound-editor__editor-container__2Qw3h { display: flex; flex-direction: column; flex-grow: 1; padding: calc(16px); } .sound-editor__editor-container__2Qw3h .sound-editor__row__1n2a_ { display: flex; flex-direction: row; align-items: center; /* row1 */ /* row1 */ /* row2 */ /* row2 */ /* row3 */ /* row3 */ } .sound-editor__editor-container__2Qw3h .sound-editor__row__1n2a_ + .sound-editor__row__1n2a_ { margin-top: calc(16px); } .sound-editor__editor-container__2Qw3h .sound-editor__row__1n2a_ .sound-editor__input-group__Nxesc { display: flex; flex-direction: row; padding-right: calc(16px); border-right: 1px dashed #e8efff; } .sound-editor__editor-container__2Qw3h .sound-editor__row__1n2a_ .sound-editor__input-group__Nxesc + .sound-editor__input-group__Nxesc { margin-left: calc(16px); } .sound-editor__editor-container__2Qw3h .sound-editor__row__1n2a_ .sound-editor__input-group__Nxesc .sound-editor__round-button__1sHC4 { display: flex; align-items: center; justify-content: center; height: 3rem; width: 3rem; outline: none; background-color: var(--theme-primary); border-radius: 100%; border: 4px solid #e8efff; cursor: url(static/cursor/cursor-pointer.cur), pointer; padding: 0.75rem; } .sound-editor__editor-container__2Qw3h .sound-editor__row__1n2a_ .sound-editor__input-group__Nxesc .sound-editor__round-button__1sHC4 img { flex-grow: 1; max-width: 100%; max-height: 100%; /*min-width: 1.5rem;*/ } .sound-editor__editor-container__2Qw3h .sound-editor__row__1n2a_ .sound-editor__input-group__Nxesc .sound-editor__button-group___VKsF { margin-left: 1rem; display: flex; } .sound-editor__editor-container__2Qw3h .sound-editor__row__1n2a_ .sound-editor__input-group__Nxesc .sound-editor__button-group___VKsF .sound-editor__button__1kXDb { border-radius: 0; border-left: none; } .sound-editor__editor-container__2Qw3h .sound-editor__row__1n2a_ .sound-editor__input-group__Nxesc .sound-editor__button-group___VKsF .sound-editor__button__1kXDb:last-of-type { border-top-right-radius: 0.25rem; border-bottom-right-radius: 0.25rem; } .sound-editor__editor-container__2Qw3h .sound-editor__row__1n2a_ .sound-editor__input-group__Nxesc .sound-editor__button-group___VKsF .sound-editor__button__1kXDb:first-of-type { border-left: 1px solid #e8efff; border-top-left-radius: 0.25rem; border-bottom-left-radius: 0.25rem; } .sound-editor__editor-container__2Qw3h .sound-editor__row__1n2a_ .sound-editor__input-group__Nxesc .sound-editor__button-group___VKsF .sound-editor__button__1kXDb:disabled > img { opacity: 0.25; } .sound-editor__editor-container__2Qw3h .sound-editor__row__1n2a_ .sound-editor__tool-button__3ElER { flex-basis: 60px; color: #565266; font-size: 0.625rem; padding: 0.25rem 0; } .sound-editor__editor-container__2Qw3h .sound-editor__row__1n2a_ .sound-editor__tool-button__3ElER + .sound-editor__tool-button__3ElER { margin: 0; } .sound-editor__editor-container__2Qw3h .sound-editor__row__1n2a_ .sound-editor__tool-button__3ElER img { width: 4rem; height: 1.5rem; margin-bottom: -0.375rem; } .sound-editor__editor-container__2Qw3h .sound-editor__row__1n2a_ .sound-editor__waveform-container__3xBGZ { display: flex; justify-content: space-around; align-items: center; width: 100%; position: relative; background: rgba(207, 99, 207, 0.15); border: 1px solid #e8efff; border-radius: 5px; margin-top: 20px; margin-bottom: 20px; } .sound-editor__editor-container__2Qw3h .sound-editor__row__1n2a_ .sound-editor__effect-button__Kf4xY { flex-basis: 60px; color: #565266; font-size: 0.625rem; padding: 0.25rem 0; } .sound-editor__editor-container__2Qw3h .sound-editor__row__1n2a_ .sound-editor__effect-button__Kf4xY + .sound-editor__effect-button__Kf4xY { margin: 0; } .sound-editor__editor-container__2Qw3h .sound-editor__row__1n2a_ .sound-editor__effect-button__Kf4xY img { width: 1.25rem; height: 1.25rem; margin-bottom: -0.375rem; } .sound-editor__button__1kXDb { height: 2rem; padding: 0.35rem; outline: none; background: white; border-radius: 0.25rem; border: 1px solid #e8efff; cursor: url(static/cursor/cursor-pointer.cur), pointer; font-size: 0.85rem; transition: 0.2s; margin: 0px; } .sound-editor__button__1kXDb > img { flex-grow: 1; max-width: 100%; max-height: 100%; min-width: 1.25rem; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .sound-tab__wrapper__G-R3S { display: flex; flex-grow: 1; border: 1px solid #e8efff; background: white; font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-size: 0.85rem; border-top-right-radius: 0.5rem; border-bottom-right-radius: 0.5rem; } .sound-tab__detail-area__2WaDe { display: flex; flex-grow: 1; flex-shrink: 1; overflow: visible; border-left: 1px solid #e8efff; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .costume-tab__wrapper__36Uz- { display: flex; flex-grow: 1; border: 1px solid #e8efff; background: white; font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-size: 0.85rem; border-top-right-radius: 0.5rem; border-bottom-right-radius: 0.5rem; } .costume-tab__detail-area__3T4mA { display: flex; flex-grow: 1; flex-shrink: 1; overflow: visible; border-left: 1px solid #e8efff; } .costume-tab__detail-area__3T4mA [role='button'] { cursor: url(static/cursor/cursor-pointer.cur), pointer; } .costume-tab__detail-area__3T4mA *[disabled] { cursor: url(static/cursor/cursor-auto.cur), auto; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .turbo-mode__turbo-container__2_5wL { display: flex; align-items: center; padding: 0.25rem; } .turbo-mode__turbo-icon__3G1zo { margin: 0.25rem; } .turbo-mode__turbo-label__2GDU7 { font-size: 0.625rem; font-weight: bold; font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; color: #ffab1a; white-space: nowrap; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .controls__flex-center__1wbq3 { display: flex; align-items: center; justify-content: center; } .controls__full-filled__39OeT { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .controls__modal-mask__1T_Av { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .controls__modal-mask__1T_Av .controls__modal-wrap__KHExq { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .controls__modal-mask__1T_Av .controls__modal-wrap__KHExq .controls__modal-header-wrap__1eaR- { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .controls__modal-mask__1T_Av .controls__modal-wrap__KHExq .controls__modal-header-wrap__1eaR- .controls__modal-header-bg__ijZb6 { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .controls__modal-mask__1T_Av .controls__modal-wrap__KHExq .controls__modal-header-wrap__1eaR- .controls__modal-header-label__Dfm6n { flex-shrink: 0; font-size: 16px; font-weight: bold; } .controls__modal-mask__1T_Av .controls__modal-wrap__KHExq .controls__modal-header-wrap__1eaR- .controls__modal-header-close__1wHrH { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .controls__modal-mask__1T_Av .controls__modal-wrap__KHExq .controls__modal-header-wrap__1eaR- .controls__modal-header-close__1wHrH:hover { color: #98a2b4; } .controls__modal-mask__1T_Av .controls__modal-wrap__KHExq .controls__modal-body-wrap__2PmXx { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .controls__modal-mask__1T_Av .controls__modal-wrap__KHExq .controls__modal-footer-wrap__3fy1g { flex-shrink: 0; display: flex; } .controls__modal-header__3YkF6 { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .controls__modal-header__3YkF6 .controls__modal-header-upload__17piR { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .controls__modal-header__3YkF6 .controls__modal-header-upload__17piR:hover { background-color: #e0e9ff; } .controls__modal-header__3YkF6 .controls__modal-header-upload__17piR:active { background-color: #ccdaff; } .controls__modal-header__3YkF6 .controls__modal-header-upload__17piR .controls__upload-img__DQ6zp { font-size: 16px; margin-right: calc(2px); } .controls__modal-header__3YkF6 .controls__modal-header-upload__17piR .controls__upload-label__S0at_ { font-size: 14px; } .controls__modal-header__3YkF6 .controls__modal-header-upload__17piR .controls__upload-input__NeBje { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .controls__modal-header__3YkF6 .controls__modal-header-search__iu1Wq { position: relative; } .controls__modal-header__3YkF6 .controls__modal-header-search__iu1Wq .controls__search-input__1tK_7 { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .controls__modal-header__3YkF6 .controls__modal-header-search__iu1Wq .controls__search-input__1tK_7::-webkit-input-placeholder { color: #98a2b4; } .controls__modal-header__3YkF6 .controls__modal-header-search__iu1Wq .controls__search-input__1tK_7::-moz-placeholder { color: #98a2b4; } .controls__modal-header__3YkF6 .controls__modal-header-search__iu1Wq .controls__search-input__1tK_7:-ms-input-placeholder { color: #98a2b4; } .controls__modal-header__3YkF6 .controls__modal-header-search__iu1Wq .controls__search-input__1tK_7:hover { border-color: #d1d7e1; } .controls__modal-header__3YkF6 .controls__modal-header-search__iu1Wq .controls__search-input__1tK_7:active { border-color: #d1d7e1; } .controls__modal-header__3YkF6 .controls__modal-header-search__iu1Wq .controls__search-img__zQd7f { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .controls__modal-body__3Ox86 { flex-grow: 1; display: flex; } .controls__modal-body__3Ox86 .controls__modal-body-left__mGQFU, .controls__modal-body__3Ox86 .controls__modal-body-main__jyOxk { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .controls__modal-body__3Ox86 .controls__modal-body-left__mGQFU { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .controls__modal-body__3Ox86 .controls__modal-body-left__mGQFU .controls__modal-body-left-scroll__1Qm1I { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .controls__modal-body__3Ox86 .controls__modal-body-left__mGQFU .controls__modal-body-left-scroll__1Qm1I .controls__modal-body-left-inner__1lcrO { width: 121px; padding: calc(12px); color: #5e6b81; } .controls__modal-body__3Ox86 .controls__modal-body-left__mGQFU .controls__modal-body-left-scroll__1Qm1I .controls__modal-body-left-inner__1lcrO .controls__menu-item-current__2QkqX { color: var(--theme-primary); background-color: #e0e9ff; } .controls__modal-body__3Ox86 .controls__modal-body-left__mGQFU .controls__modal-body-left-scroll__1Qm1I .controls__modal-body-left-inner__1lcrO .controls__menu-item__2yd8S { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .controls__modal-body__3Ox86 .controls__modal-body-left__mGQFU .controls__modal-body-left-scroll__1Qm1I .controls__modal-body-left-inner__1lcrO .controls__menu-item__2yd8S:hover { background-color: #edeff5; } .controls__modal-body__3Ox86 .controls__modal-body-left__mGQFU .controls__modal-body-left-scroll__1Qm1I .controls__modal-body-left-inner__1lcrO .controls__menu-item__2yd8S .controls__menu-item-img__2jrj8 { flex-shrink: 0; width: 20px; margin-right: 8px; } .controls__modal-body__3Ox86 .controls__modal-body-left__mGQFU .controls__modal-body-left-scroll__1Qm1I .controls__modal-body-left-inner__1lcrO .controls__menu-item__2yd8S .controls__menu-item-label__1-Iue { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .controls__modal-body__3Ox86 .controls__modal-body-main__jyOxk { padding: calc(12px) 0; } .controls__modal-body__3Ox86 .controls__modal-body-main__jyOxk .controls__modal-body-main-scroll__2MQKM { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .controls__modal-body__3Ox86 .controls__modal-body-main__jyOxk .controls__modal-body-main-scroll__2MQKM .controls__modal-body-main-inner__3uX5s { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .controls__modal-body__3Ox86 .controls__modal-body-main__jyOxk .controls__modal-body-main-scroll__2MQKM .controls__modal-body-main-inner__3uX5s .controls__selector-btn-add__2MrfM, .controls__modal-body__3Ox86 .controls__modal-body-main__jyOxk .controls__modal-body-main-scroll__2MQKM .controls__modal-body-main-inner__3uX5s .controls__selector-btn-item__2JKoa { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .controls__modal-body__3Ox86 .controls__modal-body-main__jyOxk .controls__modal-body-main-scroll__2MQKM .controls__modal-body-main-inner__3uX5s .controls__selector-btn-add__2MrfM:hover, .controls__modal-body__3Ox86 .controls__modal-body-main__jyOxk .controls__modal-body-main-scroll__2MQKM .controls__modal-body-main-inner__3uX5s .controls__selector-btn-item__2JKoa:hover { background-color: #e0e9ff; } .controls__modal-body__3Ox86 .controls__modal-body-main__jyOxk .controls__modal-body-main-scroll__2MQKM .controls__modal-body-main-inner__3uX5s .controls__selector-btn-add__2MrfM:active, .controls__modal-body__3Ox86 .controls__modal-body-main__jyOxk .controls__modal-body-main-scroll__2MQKM .controls__modal-body-main-inner__3uX5s .controls__selector-btn-item__2JKoa:active { background-color: #ccdaff; } .controls__modal-body__3Ox86 .controls__modal-body-main__jyOxk .controls__modal-body-main-scroll__2MQKM .controls__modal-body-main-inner__3uX5s .controls__selector-btn-add__2MrfM:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .controls__modal-body__3Ox86 .controls__modal-body-main__jyOxk .controls__modal-body-main-scroll__2MQKM .controls__modal-body-main-inner__3uX5s .controls__selector-btn-add__2MrfM:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .controls__modal-body__3Ox86 .controls__modal-body-main__jyOxk .controls__modal-body-main-scroll__2MQKM .controls__modal-body-main-inner__3uX5s .controls__selector-btn-add__2MrfM .controls__add-img__3AZjS { font-size: 28px; height: auto; margin-bottom: 8px; } .controls__modal-body__3Ox86 .controls__modal-body-main__jyOxk .controls__modal-body-main-scroll__2MQKM .controls__modal-body-main-inner__3uX5s .controls__selector-btn-add__2MrfM .controls__add-label__19giN { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .controls__modal-body__3Ox86 .controls__modal-body-main__jyOxk .controls__modal-body-main-scroll__2MQKM .controls__modal-body-main-inner__3uX5s .controls__selector-btn-item__2JKoa { justify-content: space-between; } .controls__modal-body__3Ox86 .controls__modal-body-main__jyOxk .controls__modal-body-main-scroll__2MQKM .controls__modal-body-main-inner__3uX5s .controls__selector-btn-item__2JKoa .controls__item-img__1fduU { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .controls__modal-body__3Ox86 .controls__modal-body-main__jyOxk .controls__modal-body-main-scroll__2MQKM .controls__modal-body-main-inner__3uX5s .controls__selector-btn-item__2JKoa .controls__item-img__1fduU img { width: auto; height: 105px; } .controls__modal-body__3Ox86 .controls__modal-body-main__jyOxk .controls__modal-body-main-scroll__2MQKM .controls__modal-body-main-inner__3uX5s .controls__selector-btn-item__2JKoa .controls__item-label__3V-w0 { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .controls__modal-footer__1WvSG { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .controls__selector-btn-add__2MrfM, .controls__selector-btn-item__2JKoa { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .controls__selector-btn-add__2MrfM { background-color: var(--selector-sprite-bg_primary); } .controls__selector-btn-add__2MrfM:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .controls__selector-btn-add__2MrfM:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .controls__selector-btn-add__2MrfM .controls__add-img__3AZjS { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .controls__selector-btn-add__2MrfM .controls__add-label__19giN { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .controls__selector-btn-item__2JKoa { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .controls__selector-btn-item__2JKoa .controls__item-img__1fduU { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .controls__selector-btn-item__2JKoa .controls__item-img__1fduU img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .controls__selector-btn-item__2JKoa .controls__item-label__3V-w0 { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .controls__selector-btn-item__2JKoa:hover { background-color: var(--selector-sprite-bg_primary); } .controls__selector-btn-item__2JKoa:hover .controls__item-img__1fduU { border-color: var(--selector-sprite-bg_primary); } .controls__selector-btn-item_selected__2p5xZ { background-color: var(--selector-sprite-bg_primary); } .controls__selector-btn-item_selected__2p5xZ .controls__item-img__1fduU { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .controls__menu-bar-btn__1b8Om { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .controls__menu-bar-btn_green__2kAKN, .controls__menu-bar-btn_create__35FbM { background-color: #3cdc8f; } .controls__menu-bar-btn_green__2kAKN:hover, .controls__menu-bar-btn_create__35FbM:hover { background-color: #00d374; } .controls__menu-bar-btn_green__2kAKN:active, .controls__menu-bar-btn_create__35FbM:active { background-color: #00d374; } .controls__menu-bar-btn_save__2eCH9, .controls__menu-bar-btn_reset__YJ0qC { background-color: #6ac8ff; } .controls__menu-bar-btn_save__2eCH9:hover, .controls__menu-bar-btn_reset__YJ0qC:hover { background-color: #57bcfe; } .controls__menu-bar-btn_save__2eCH9:active, .controls__menu-bar-btn_reset__YJ0qC:active { background-color: #4fb0fc; } .controls__menu-bar-btn_submit__38wzc, .controls__menu-bar-btn_open__1j5-X { background-color: #ff9e23; } .controls__menu-bar-btn_submit__38wzc:hover, .controls__menu-bar-btn_open__1j5-X:hover { background-color: #f47b04; } .controls__menu-bar-btn_submit__38wzc:active, .controls__menu-bar-btn_open__1j5-X:active { background-color: #fe8f22; } .controls__menu-bar-btn_link__2euj7 { background-color: #e8efff; color: var(--theme-primary); } .controls__menu-bar-btn_link__2euj7:hover { background-color: #b6c7ff; } .controls__menu-bar-btn_link__2euj7:active { background-color: #cfdcff; } .controls__menu-bar-btn_disabled__O41Nf { color: #565266; background-color: #e6e9ed; } .controls__menu-bar-btn_disabled__O41Nf:hover { cursor: not-allowed; } .controls__menu-bar-btn_help__3fwkf { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .controls__menu-bar-btn_help__3fwkf:hover { background-color: #8398ff; } .controls__menu-bar-btn_help__3fwkf:active { background-color: #8ca3ff; } .controls__menu-bar-separator__10VKB { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .controls__controls-container__wkn00 { display: flex; align-items: center; justify-content: center; } .controls__controls-container__wkn00 .controls__controls-btn__tAkL3 { display: flex; align-items: center; justify-content: center; width: 58px; height: 24px; border-radius: calc(12px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .controls__controls-container__wkn00 .controls__controls-btn__tAkL3 .controls__controls-icon__gLCqy { margin-right: 4px; } .controls__controls-container__wkn00 .controls__controls-btn__tAkL3 .controls__controls-label__lW2DH { color: #ffffff; font-size: 14px; } .controls__controls-container__wkn00 .controls__controls-btn_flag__27zKU { background-color: #3cdc8f; } .controls__controls-container__wkn00 .controls__controls-btn_flag__27zKU:hover { background-color: #00d374; } .controls__controls-container__wkn00 .controls__controls-btn_flag__27zKU .controls__controls-icon__gLCqy { width: 10px; height: auto; object-fit: contain; } @media screen and (orientation: portrait) { .controls__controls-container__wkn00 .controls__controls-btn_flag__27zKU:hover { background-color: #3cdc8f; } } .controls__controls-container__wkn00 .controls__controls-btn_stop__3sM5z { background-color: #ff666d; } .controls__controls-container__wkn00 .controls__controls-btn_stop__3sM5z:hover { background-color: #f66464; } .controls__controls-container__wkn00 .controls__controls-btn_stop__3sM5z .controls__controls-icon__gLCqy { width: 10px; height: 10px; border-radius: 2px; background-color: #ffffff; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .stage-header__flex-center__1TN_7 { display: flex; align-items: center; justify-content: center; } .stage-header__full-filled__3uH_v { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .stage-header__modal-mask__2nvcl { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .stage-header__modal-mask__2nvcl .stage-header__modal-wrap__1tOr8 { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .stage-header__modal-mask__2nvcl .stage-header__modal-wrap__1tOr8 .stage-header__modal-header-wrap__2Qk5Y { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .stage-header__modal-mask__2nvcl .stage-header__modal-wrap__1tOr8 .stage-header__modal-header-wrap__2Qk5Y .stage-header__modal-header-bg__2J_QR { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .stage-header__modal-mask__2nvcl .stage-header__modal-wrap__1tOr8 .stage-header__modal-header-wrap__2Qk5Y .stage-header__modal-header-label__y9xap { flex-shrink: 0; font-size: 16px; font-weight: bold; } .stage-header__modal-mask__2nvcl .stage-header__modal-wrap__1tOr8 .stage-header__modal-header-wrap__2Qk5Y .stage-header__modal-header-close__R7-9Z { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .stage-header__modal-mask__2nvcl .stage-header__modal-wrap__1tOr8 .stage-header__modal-header-wrap__2Qk5Y .stage-header__modal-header-close__R7-9Z:hover { color: #98a2b4; } .stage-header__modal-mask__2nvcl .stage-header__modal-wrap__1tOr8 .stage-header__modal-body-wrap__3gtLq { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .stage-header__modal-mask__2nvcl .stage-header__modal-wrap__1tOr8 .stage-header__modal-footer-wrap__uQICV { flex-shrink: 0; display: flex; } .stage-header__modal-header__3cSKj { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .stage-header__modal-header__3cSKj .stage-header__modal-header-upload__3xhJO { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .stage-header__modal-header__3cSKj .stage-header__modal-header-upload__3xhJO:hover { background-color: #e0e9ff; } .stage-header__modal-header__3cSKj .stage-header__modal-header-upload__3xhJO:active { background-color: #ccdaff; } .stage-header__modal-header__3cSKj .stage-header__modal-header-upload__3xhJO .stage-header__upload-img__2DY6U { font-size: 16px; margin-right: calc(2px); } .stage-header__modal-header__3cSKj .stage-header__modal-header-upload__3xhJO .stage-header__upload-label__na-vd { font-size: 14px; } .stage-header__modal-header__3cSKj .stage-header__modal-header-upload__3xhJO .stage-header__upload-input__1AzlN { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .stage-header__modal-header__3cSKj .stage-header__modal-header-search__JmfEj { position: relative; } .stage-header__modal-header__3cSKj .stage-header__modal-header-search__JmfEj .stage-header__search-input__3vBS5 { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .stage-header__modal-header__3cSKj .stage-header__modal-header-search__JmfEj .stage-header__search-input__3vBS5::-webkit-input-placeholder { color: #98a2b4; } .stage-header__modal-header__3cSKj .stage-header__modal-header-search__JmfEj .stage-header__search-input__3vBS5::-moz-placeholder { color: #98a2b4; } .stage-header__modal-header__3cSKj .stage-header__modal-header-search__JmfEj .stage-header__search-input__3vBS5:-ms-input-placeholder { color: #98a2b4; } .stage-header__modal-header__3cSKj .stage-header__modal-header-search__JmfEj .stage-header__search-input__3vBS5:hover { border-color: #d1d7e1; } .stage-header__modal-header__3cSKj .stage-header__modal-header-search__JmfEj .stage-header__search-input__3vBS5:active { border-color: #d1d7e1; } .stage-header__modal-header__3cSKj .stage-header__modal-header-search__JmfEj .stage-header__search-img__3c74l { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .stage-header__modal-body__1cIpP { flex-grow: 1; display: flex; } .stage-header__modal-body__1cIpP .stage-header__modal-body-left__1qnpM, .stage-header__modal-body__1cIpP .stage-header__modal-body-main__3QuRf { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .stage-header__modal-body__1cIpP .stage-header__modal-body-left__1qnpM { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .stage-header__modal-body__1cIpP .stage-header__modal-body-left__1qnpM .stage-header__modal-body-left-scroll__HEof1 { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .stage-header__modal-body__1cIpP .stage-header__modal-body-left__1qnpM .stage-header__modal-body-left-scroll__HEof1 .stage-header__modal-body-left-inner__3riDO { width: 121px; padding: calc(12px); color: #5e6b81; } .stage-header__modal-body__1cIpP .stage-header__modal-body-left__1qnpM .stage-header__modal-body-left-scroll__HEof1 .stage-header__modal-body-left-inner__3riDO .stage-header__menu-item-current__SQxGx { color: var(--theme-primary); background-color: #e0e9ff; } .stage-header__modal-body__1cIpP .stage-header__modal-body-left__1qnpM .stage-header__modal-body-left-scroll__HEof1 .stage-header__modal-body-left-inner__3riDO .stage-header__menu-item__3XP95 { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .stage-header__modal-body__1cIpP .stage-header__modal-body-left__1qnpM .stage-header__modal-body-left-scroll__HEof1 .stage-header__modal-body-left-inner__3riDO .stage-header__menu-item__3XP95:hover { background-color: #edeff5; } .stage-header__modal-body__1cIpP .stage-header__modal-body-left__1qnpM .stage-header__modal-body-left-scroll__HEof1 .stage-header__modal-body-left-inner__3riDO .stage-header__menu-item__3XP95 .stage-header__menu-item-img__1WkzM { flex-shrink: 0; width: 20px; margin-right: 8px; } .stage-header__modal-body__1cIpP .stage-header__modal-body-left__1qnpM .stage-header__modal-body-left-scroll__HEof1 .stage-header__modal-body-left-inner__3riDO .stage-header__menu-item__3XP95 .stage-header__menu-item-label__Oq_h6 { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .stage-header__modal-body__1cIpP .stage-header__modal-body-main__3QuRf { padding: calc(12px) 0; } .stage-header__modal-body__1cIpP .stage-header__modal-body-main__3QuRf .stage-header__modal-body-main-scroll__2BZCU { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .stage-header__modal-body__1cIpP .stage-header__modal-body-main__3QuRf .stage-header__modal-body-main-scroll__2BZCU .stage-header__modal-body-main-inner__2QQTx { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .stage-header__modal-body__1cIpP .stage-header__modal-body-main__3QuRf .stage-header__modal-body-main-scroll__2BZCU .stage-header__modal-body-main-inner__2QQTx .stage-header__selector-btn-add__2h2rw, .stage-header__modal-body__1cIpP .stage-header__modal-body-main__3QuRf .stage-header__modal-body-main-scroll__2BZCU .stage-header__modal-body-main-inner__2QQTx .stage-header__selector-btn-item__10r4Y { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .stage-header__modal-body__1cIpP .stage-header__modal-body-main__3QuRf .stage-header__modal-body-main-scroll__2BZCU .stage-header__modal-body-main-inner__2QQTx .stage-header__selector-btn-add__2h2rw:hover, .stage-header__modal-body__1cIpP .stage-header__modal-body-main__3QuRf .stage-header__modal-body-main-scroll__2BZCU .stage-header__modal-body-main-inner__2QQTx .stage-header__selector-btn-item__10r4Y:hover { background-color: #e0e9ff; } .stage-header__modal-body__1cIpP .stage-header__modal-body-main__3QuRf .stage-header__modal-body-main-scroll__2BZCU .stage-header__modal-body-main-inner__2QQTx .stage-header__selector-btn-add__2h2rw:active, .stage-header__modal-body__1cIpP .stage-header__modal-body-main__3QuRf .stage-header__modal-body-main-scroll__2BZCU .stage-header__modal-body-main-inner__2QQTx .stage-header__selector-btn-item__10r4Y:active { background-color: #ccdaff; } .stage-header__modal-body__1cIpP .stage-header__modal-body-main__3QuRf .stage-header__modal-body-main-scroll__2BZCU .stage-header__modal-body-main-inner__2QQTx .stage-header__selector-btn-add__2h2rw:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .stage-header__modal-body__1cIpP .stage-header__modal-body-main__3QuRf .stage-header__modal-body-main-scroll__2BZCU .stage-header__modal-body-main-inner__2QQTx .stage-header__selector-btn-add__2h2rw:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .stage-header__modal-body__1cIpP .stage-header__modal-body-main__3QuRf .stage-header__modal-body-main-scroll__2BZCU .stage-header__modal-body-main-inner__2QQTx .stage-header__selector-btn-add__2h2rw .stage-header__add-img__3djRm { font-size: 28px; height: auto; margin-bottom: 8px; } .stage-header__modal-body__1cIpP .stage-header__modal-body-main__3QuRf .stage-header__modal-body-main-scroll__2BZCU .stage-header__modal-body-main-inner__2QQTx .stage-header__selector-btn-add__2h2rw .stage-header__add-label__fJQwf { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .stage-header__modal-body__1cIpP .stage-header__modal-body-main__3QuRf .stage-header__modal-body-main-scroll__2BZCU .stage-header__modal-body-main-inner__2QQTx .stage-header__selector-btn-item__10r4Y { justify-content: space-between; } .stage-header__modal-body__1cIpP .stage-header__modal-body-main__3QuRf .stage-header__modal-body-main-scroll__2BZCU .stage-header__modal-body-main-inner__2QQTx .stage-header__selector-btn-item__10r4Y .stage-header__item-img__1nPxI { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .stage-header__modal-body__1cIpP .stage-header__modal-body-main__3QuRf .stage-header__modal-body-main-scroll__2BZCU .stage-header__modal-body-main-inner__2QQTx .stage-header__selector-btn-item__10r4Y .stage-header__item-img__1nPxI img { width: auto; height: 105px; } .stage-header__modal-body__1cIpP .stage-header__modal-body-main__3QuRf .stage-header__modal-body-main-scroll__2BZCU .stage-header__modal-body-main-inner__2QQTx .stage-header__selector-btn-item__10r4Y .stage-header__item-label__1KfD_ { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .stage-header__modal-footer__1FVtN { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .stage-header__selector-btn-add__2h2rw, .stage-header__selector-btn-item__10r4Y { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .stage-header__selector-btn-add__2h2rw { background-color: var(--selector-sprite-bg_primary); } .stage-header__selector-btn-add__2h2rw:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .stage-header__selector-btn-add__2h2rw:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .stage-header__selector-btn-add__2h2rw .stage-header__add-img__3djRm { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .stage-header__selector-btn-add__2h2rw .stage-header__add-label__fJQwf { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .stage-header__selector-btn-item__10r4Y { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .stage-header__selector-btn-item__10r4Y .stage-header__item-img__1nPxI { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .stage-header__selector-btn-item__10r4Y .stage-header__item-img__1nPxI img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .stage-header__selector-btn-item__10r4Y .stage-header__item-label__1KfD_ { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .stage-header__selector-btn-item__10r4Y:hover { background-color: var(--selector-sprite-bg_primary); } .stage-header__selector-btn-item__10r4Y:hover .stage-header__item-img__1nPxI { border-color: var(--selector-sprite-bg_primary); } .stage-header__selector-btn-item_selected__drzq_ { background-color: var(--selector-sprite-bg_primary); } .stage-header__selector-btn-item_selected__drzq_ .stage-header__item-img__1nPxI { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .stage-header__menu-bar-btn__115wo { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .stage-header__menu-bar-btn_green__2Q-sm, .stage-header__menu-bar-btn_create__36eSB { background-color: #3cdc8f; } .stage-header__menu-bar-btn_green__2Q-sm:hover, .stage-header__menu-bar-btn_create__36eSB:hover { background-color: #00d374; } .stage-header__menu-bar-btn_green__2Q-sm:active, .stage-header__menu-bar-btn_create__36eSB:active { background-color: #00d374; } .stage-header__menu-bar-btn_save__14bWr, .stage-header__menu-bar-btn_reset__2wTKk { background-color: #6ac8ff; } .stage-header__menu-bar-btn_save__14bWr:hover, .stage-header__menu-bar-btn_reset__2wTKk:hover { background-color: #57bcfe; } .stage-header__menu-bar-btn_save__14bWr:active, .stage-header__menu-bar-btn_reset__2wTKk:active { background-color: #4fb0fc; } .stage-header__menu-bar-btn_submit__1RSw-, .stage-header__menu-bar-btn_open__1u750 { background-color: #ff9e23; } .stage-header__menu-bar-btn_submit__1RSw-:hover, .stage-header__menu-bar-btn_open__1u750:hover { background-color: #f47b04; } .stage-header__menu-bar-btn_submit__1RSw-:active, .stage-header__menu-bar-btn_open__1u750:active { background-color: #fe8f22; } .stage-header__menu-bar-btn_link__2BqOy { background-color: #e8efff; color: var(--theme-primary); } .stage-header__menu-bar-btn_link__2BqOy:hover { background-color: #b6c7ff; } .stage-header__menu-bar-btn_link__2BqOy:active { background-color: #cfdcff; } .stage-header__menu-bar-btn_disabled__10-kw { color: #565266; background-color: #e6e9ed; } .stage-header__menu-bar-btn_disabled__10-kw:hover { cursor: not-allowed; } .stage-header__menu-bar-btn_help__2YOOZ { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .stage-header__menu-bar-btn_help__2YOOZ:hover { background-color: #8398ff; } .stage-header__menu-bar-btn_help__2YOOZ:active { background-color: #8ca3ff; } .stage-header__menu-bar-separator__2-NS- { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .stage-header__stage-header-wrapper-overlay__30k1b { position: fixed; background-color: #e8edf1; top: 0; left: 0; right: 0; bottom: 0; z-index: 5000; max-height: 44px; } .stage-header__stage-header-wrapper-overlay__30k1b .stage-header__stage-header__3etpq { height: 44px; } .stage-header__stage-header-wrapper-overlay__30k1b.stage-header__is-mobile__3ARW4, .stage-header__stage-header-wrapper-overlay__30k1b.stage-header__is-kid__3xOGD { display: none; } .stage-header__stage-header-wrapper-overlay__30k1b.stage-header__is-mobile__3ARW4 .stage-header__stage-header__3etpq, .stage-header__stage-header-wrapper-overlay__30k1b.stage-header__is-kid__3xOGD .stage-header__stage-header__3etpq { box-sizing: border-box; padding: 0 10px; display: flex; margin: auto; justify-content: space-between; flex-shrink: 0; align-items: center; height: 56px; width: 100vw !important; } .stage-header__stage-header-wrapper-overlay__30k1b.stage-header__is-mobile__3ARW4 .stage-header__stage-button__277V0, .stage-header__stage-header-wrapper-overlay__30k1b.stage-header__is-kid__3xOGD .stage-header__stage-button__277V0 { border: 1px solid #e8efff !important; } .stage-header__stage-button-share__1XocV { width: 26px; height: 26px; object-fit: cover; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .stage-header__stage-header__3etpq.stage-header__stage-header_large__12ixp { width: 360px; height: 40px; } .stage-header__stage-header__3etpq { margin: 0 auto; width: 260px; display: flex; justify-content: space-between; flex-shrink: 0; align-items: center; height: 40px; } .stage-header__stage-header__3etpq .stage-header__stage-header-left__M2JHQ, .stage-header__stage-header__3etpq .stage-header__stage-header-right__2P9An { flex-shrink: 0; display: flex; align-items: center; } .stage-header__stage-header__3etpq .stage-header__stage-button__277V0 { display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; margin-right: 4px; padding: 0; background-color: #e3e4f4; border: none; outline: none; border-radius: 50%; cursor: url(static/cursor/cursor-pointer.cur), pointer; color: #828da3; } .stage-header__stage-header__3etpq .stage-header__stage-button__277V0 .stage-header__stage-button-icon__1XytQ { font-size: 18px; } .stage-header__stage-header__3etpq .stage-header__stage-button__277V0:hover { color: var(--theme-primary); } .stage-header__stage-header__3etpq .stage-header__stage-button__277V0:active { color: var(--theme-primary); } .stage-header__stage-header__3etpq .stage-header__stage-button__277V0.stage-header__stage-button-screen__PdKnc { position: relative; width: auto; padding: 5px 6px 5px 5px; margin-right: 6px; border-radius: calc(12px); white-space: nowrap; font-weight: 600; align-items: flex-end; background-color: var(--selector-sprite-bg_primary); } .stage-header__stage-header__3etpq .stage-header__stage-button__277V0.stage-header__stage-button-screen__PdKnc .stage-header__stage-button-screen-icon__5CtMb { font-size: 16px; position: relative; bottom: -2px; } .stage-header__stage-header__3etpq .stage-header__stage-button__277V0.stage-header__stage-button-screen__PdKnc .stage-header__stage-button-screen-index__2Xy_D { font-size: 15px; line-height: 1; position: relative; bottom: -1px; } .stage-header__stage-header__3etpq .stage-header__stage-button__277V0.stage-header__stage-button-screen__PdKnc .stage-header__stage-button-screen-separater__1xvth { font-size: 8px; line-height: 1; } .stage-header__stage-header__3etpq .stage-header__stage-button__277V0.stage-header__stage-button-screen__PdKnc .stage-header__stage-button-screen-length__359Dn { font-size: 12px; line-height: 1; } .stage-header__stage-header__3etpq .stage-header__stage-size-toggle-group__3QiPr { display: flex; align-items: center; justify-content: center; height: 24px; margin-right: 4px; padding: 2px; background-color: #e3e4f4; border-radius: calc(12px); } .stage-header__stage-header__3etpq .stage-header__stage-size-toggle-group__3QiPr.stage-header__stage-size-toggle-group_disabled__iXSK4 { opacity: 0.2; pointer-events: none; } .stage-header__stage-header__3etpq .stage-header__stage-size-toggle-group__3QiPr .stage-header__stage-button-first__3kBtz, .stage-header__stage-header__3etpq .stage-header__stage-size-toggle-group__3QiPr .stage-header__stage-button-last__ZMm3w { width: 35px; height: calc(20px); margin-right: 0; border-radius: calc(10px); } .stage-header__stage-header__3etpq .stage-header__stage-size-toggle-group__3QiPr .stage-header__stage-button-toggled-on__1qvGo { color: var(--theme-primary); background-color: #ffffff; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .stage__flex-center__1xxVe { display: flex; align-items: center; justify-content: center; } .stage__full-filled__1AHrU { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .stage__modal-mask__2tpGI { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .stage__modal-mask__2tpGI .stage__modal-wrap__1JbzP { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .stage__modal-mask__2tpGI .stage__modal-wrap__1JbzP .stage__modal-header-wrap__164ui { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .stage__modal-mask__2tpGI .stage__modal-wrap__1JbzP .stage__modal-header-wrap__164ui .stage__modal-header-bg__2O1Jr { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .stage__modal-mask__2tpGI .stage__modal-wrap__1JbzP .stage__modal-header-wrap__164ui .stage__modal-header-label__2zb1T { flex-shrink: 0; font-size: 16px; font-weight: bold; } .stage__modal-mask__2tpGI .stage__modal-wrap__1JbzP .stage__modal-header-wrap__164ui .stage__modal-header-close__27R47 { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .stage__modal-mask__2tpGI .stage__modal-wrap__1JbzP .stage__modal-header-wrap__164ui .stage__modal-header-close__27R47:hover { color: #98a2b4; } .stage__modal-mask__2tpGI .stage__modal-wrap__1JbzP .stage__modal-body-wrap__1d7Vm { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .stage__modal-mask__2tpGI .stage__modal-wrap__1JbzP .stage__modal-footer-wrap__219H2 { flex-shrink: 0; display: flex; } .stage__modal-header__GfJFr { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .stage__modal-header__GfJFr .stage__modal-header-upload__3K-ct { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .stage__modal-header__GfJFr .stage__modal-header-upload__3K-ct:hover { background-color: #e0e9ff; } .stage__modal-header__GfJFr .stage__modal-header-upload__3K-ct:active { background-color: #ccdaff; } .stage__modal-header__GfJFr .stage__modal-header-upload__3K-ct .stage__upload-img__3gLQ3 { font-size: 16px; margin-right: calc(2px); } .stage__modal-header__GfJFr .stage__modal-header-upload__3K-ct .stage__upload-label__11Dci { font-size: 14px; } .stage__modal-header__GfJFr .stage__modal-header-upload__3K-ct .stage__upload-input__sleVG { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .stage__modal-header__GfJFr .stage__modal-header-search__9H_zK { position: relative; } .stage__modal-header__GfJFr .stage__modal-header-search__9H_zK .stage__search-input__3xb2N { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .stage__modal-header__GfJFr .stage__modal-header-search__9H_zK .stage__search-input__3xb2N::-webkit-input-placeholder { color: #98a2b4; } .stage__modal-header__GfJFr .stage__modal-header-search__9H_zK .stage__search-input__3xb2N::-moz-placeholder { color: #98a2b4; } .stage__modal-header__GfJFr .stage__modal-header-search__9H_zK .stage__search-input__3xb2N:-ms-input-placeholder { color: #98a2b4; } .stage__modal-header__GfJFr .stage__modal-header-search__9H_zK .stage__search-input__3xb2N:hover { border-color: #d1d7e1; } .stage__modal-header__GfJFr .stage__modal-header-search__9H_zK .stage__search-input__3xb2N:active { border-color: #d1d7e1; } .stage__modal-header__GfJFr .stage__modal-header-search__9H_zK .stage__search-img__3Wtwa { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .stage__modal-body__259Df { flex-grow: 1; display: flex; } .stage__modal-body__259Df .stage__modal-body-left__KJDCu, .stage__modal-body__259Df .stage__modal-body-main__2jRhF { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .stage__modal-body__259Df .stage__modal-body-left__KJDCu { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .stage__modal-body__259Df .stage__modal-body-left__KJDCu .stage__modal-body-left-scroll__8oCtk { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .stage__modal-body__259Df .stage__modal-body-left__KJDCu .stage__modal-body-left-scroll__8oCtk .stage__modal-body-left-inner__1bo04 { width: 121px; padding: calc(12px); color: #5e6b81; } .stage__modal-body__259Df .stage__modal-body-left__KJDCu .stage__modal-body-left-scroll__8oCtk .stage__modal-body-left-inner__1bo04 .stage__menu-item-current__2v8FK { color: var(--theme-primary); background-color: #e0e9ff; } .stage__modal-body__259Df .stage__modal-body-left__KJDCu .stage__modal-body-left-scroll__8oCtk .stage__modal-body-left-inner__1bo04 .stage__menu-item__3ikLG { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .stage__modal-body__259Df .stage__modal-body-left__KJDCu .stage__modal-body-left-scroll__8oCtk .stage__modal-body-left-inner__1bo04 .stage__menu-item__3ikLG:hover { background-color: #edeff5; } .stage__modal-body__259Df .stage__modal-body-left__KJDCu .stage__modal-body-left-scroll__8oCtk .stage__modal-body-left-inner__1bo04 .stage__menu-item__3ikLG .stage__menu-item-img__HjDjC { flex-shrink: 0; width: 20px; margin-right: 8px; } .stage__modal-body__259Df .stage__modal-body-left__KJDCu .stage__modal-body-left-scroll__8oCtk .stage__modal-body-left-inner__1bo04 .stage__menu-item__3ikLG .stage__menu-item-label__22AGQ { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .stage__modal-body__259Df .stage__modal-body-main__2jRhF { padding: calc(12px) 0; } .stage__modal-body__259Df .stage__modal-body-main__2jRhF .stage__modal-body-main-scroll__2J-x8 { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .stage__modal-body__259Df .stage__modal-body-main__2jRhF .stage__modal-body-main-scroll__2J-x8 .stage__modal-body-main-inner__3uFFv { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .stage__modal-body__259Df .stage__modal-body-main__2jRhF .stage__modal-body-main-scroll__2J-x8 .stage__modal-body-main-inner__3uFFv .stage__selector-btn-add__1i3zO, .stage__modal-body__259Df .stage__modal-body-main__2jRhF .stage__modal-body-main-scroll__2J-x8 .stage__modal-body-main-inner__3uFFv .stage__selector-btn-item__2h90e { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .stage__modal-body__259Df .stage__modal-body-main__2jRhF .stage__modal-body-main-scroll__2J-x8 .stage__modal-body-main-inner__3uFFv .stage__selector-btn-add__1i3zO:hover, .stage__modal-body__259Df .stage__modal-body-main__2jRhF .stage__modal-body-main-scroll__2J-x8 .stage__modal-body-main-inner__3uFFv .stage__selector-btn-item__2h90e:hover { background-color: #e0e9ff; } .stage__modal-body__259Df .stage__modal-body-main__2jRhF .stage__modal-body-main-scroll__2J-x8 .stage__modal-body-main-inner__3uFFv .stage__selector-btn-add__1i3zO:active, .stage__modal-body__259Df .stage__modal-body-main__2jRhF .stage__modal-body-main-scroll__2J-x8 .stage__modal-body-main-inner__3uFFv .stage__selector-btn-item__2h90e:active { background-color: #ccdaff; } .stage__modal-body__259Df .stage__modal-body-main__2jRhF .stage__modal-body-main-scroll__2J-x8 .stage__modal-body-main-inner__3uFFv .stage__selector-btn-add__1i3zO:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .stage__modal-body__259Df .stage__modal-body-main__2jRhF .stage__modal-body-main-scroll__2J-x8 .stage__modal-body-main-inner__3uFFv .stage__selector-btn-add__1i3zO:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .stage__modal-body__259Df .stage__modal-body-main__2jRhF .stage__modal-body-main-scroll__2J-x8 .stage__modal-body-main-inner__3uFFv .stage__selector-btn-add__1i3zO .stage__add-img__3anOT { font-size: 28px; height: auto; margin-bottom: 8px; } .stage__modal-body__259Df .stage__modal-body-main__2jRhF .stage__modal-body-main-scroll__2J-x8 .stage__modal-body-main-inner__3uFFv .stage__selector-btn-add__1i3zO .stage__add-label__yWSP1 { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .stage__modal-body__259Df .stage__modal-body-main__2jRhF .stage__modal-body-main-scroll__2J-x8 .stage__modal-body-main-inner__3uFFv .stage__selector-btn-item__2h90e { justify-content: space-between; } .stage__modal-body__259Df .stage__modal-body-main__2jRhF .stage__modal-body-main-scroll__2J-x8 .stage__modal-body-main-inner__3uFFv .stage__selector-btn-item__2h90e .stage__item-img__YTIPv { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .stage__modal-body__259Df .stage__modal-body-main__2jRhF .stage__modal-body-main-scroll__2J-x8 .stage__modal-body-main-inner__3uFFv .stage__selector-btn-item__2h90e .stage__item-img__YTIPv img { width: auto; height: 105px; } .stage__modal-body__259Df .stage__modal-body-main__2jRhF .stage__modal-body-main-scroll__2J-x8 .stage__modal-body-main-inner__3uFFv .stage__selector-btn-item__2h90e .stage__item-label__2R-NZ { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .stage__modal-footer__1ziIH { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .stage__selector-btn-add__1i3zO, .stage__selector-btn-item__2h90e { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .stage__selector-btn-add__1i3zO { background-color: var(--selector-sprite-bg_primary); } .stage__selector-btn-add__1i3zO:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .stage__selector-btn-add__1i3zO:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .stage__selector-btn-add__1i3zO .stage__add-img__3anOT { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .stage__selector-btn-add__1i3zO .stage__add-label__yWSP1 { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .stage__selector-btn-item__2h90e { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .stage__selector-btn-item__2h90e .stage__item-img__YTIPv { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .stage__selector-btn-item__2h90e .stage__item-img__YTIPv img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .stage__selector-btn-item__2h90e .stage__item-label__2R-NZ { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .stage__selector-btn-item__2h90e:hover { background-color: var(--selector-sprite-bg_primary); } .stage__selector-btn-item__2h90e:hover .stage__item-img__YTIPv { border-color: var(--selector-sprite-bg_primary); } .stage__selector-btn-item_selected__mMmVS { background-color: var(--selector-sprite-bg_primary); } .stage__selector-btn-item_selected__mMmVS .stage__item-img__YTIPv { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .stage__menu-bar-btn__36ILF { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .stage__menu-bar-btn_green__7OtDZ, .stage__menu-bar-btn_create__3UQ3m { background-color: #3cdc8f; } .stage__menu-bar-btn_green__7OtDZ:hover, .stage__menu-bar-btn_create__3UQ3m:hover { background-color: #00d374; } .stage__menu-bar-btn_green__7OtDZ:active, .stage__menu-bar-btn_create__3UQ3m:active { background-color: #00d374; } .stage__menu-bar-btn_save__X8VFj, .stage__menu-bar-btn_reset__3jHLD { background-color: #6ac8ff; } .stage__menu-bar-btn_save__X8VFj:hover, .stage__menu-bar-btn_reset__3jHLD:hover { background-color: #57bcfe; } .stage__menu-bar-btn_save__X8VFj:active, .stage__menu-bar-btn_reset__3jHLD:active { background-color: #4fb0fc; } .stage__menu-bar-btn_submit__2-lrw, .stage__menu-bar-btn_open__3_LYD { background-color: #ff9e23; } .stage__menu-bar-btn_submit__2-lrw:hover, .stage__menu-bar-btn_open__3_LYD:hover { background-color: #f47b04; } .stage__menu-bar-btn_submit__2-lrw:active, .stage__menu-bar-btn_open__3_LYD:active { background-color: #fe8f22; } .stage__menu-bar-btn_link__3310- { background-color: #e8efff; color: var(--theme-primary); } .stage__menu-bar-btn_link__3310-:hover { background-color: #b6c7ff; } .stage__menu-bar-btn_link__3310-:active { background-color: #cfdcff; } .stage__menu-bar-btn_disabled__2JnQq { color: #565266; background-color: #e6e9ed; } .stage__menu-bar-btn_disabled__2JnQq:hover { cursor: not-allowed; } .stage__menu-bar-btn_help__13gQ_ { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .stage__menu-bar-btn_help__13gQ_:hover { background-color: #8398ff; } .stage__menu-bar-btn_help__13gQ_:active { background-color: #8ca3ff; } .stage__menu-bar-separator__890L3 { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .stage__stage-wrap__2IA1L { position: relative; margin: 0 8px; } .stage__stage-wrap__2IA1L.stage__draggable__24jpx canvas { cursor: url(static/cursor/cursor-movable.cur), move !important; } .stage__stage-wrap__2IA1L.stage__rotatable__2nRWy canvas { cursor: url(static/cursor/cursor-rotatable.cur), auto !important; } .stage__stage-wrap__2IA1L.stage__resizable__1XMgv canvas { cursor: url(static/cursor/cursor-resizable.cur), auto !important; } .stage__stage-wrap__2IA1L.stage__is-share__20jbB .stage__stage__2tdds, .stage__stage-wrap__2IA1L.stage__is-mini__b_uN6 .stage__stage__2tdds, .stage__stage-wrap__2IA1L.stage__is-kid__T2PK_ .stage__stage__2tdds, .stage__stage-wrap__2IA1L.stage__is-jr__3O8V8 .stage__stage__2tdds { border-radius: 14px; overflow: hidden; } .stage__stage-wrap__2IA1L.stage__is-mini__b_uN6 { margin: 0 13px; } .stage__stage-wrap__2IA1L.stage__is-jr__3O8V8 .stage__stage__2tdds.stage__full-screen__3K4SG { border: 3px solid #ffffff; box-sizing: content-box; } .stage__stage-wrap__2IA1L.stage__is-jr__3O8V8 input { -webkit-user-select: text !important; } .stage__stage-wrap__2IA1L.stage__stage-wrap_with-color-picker__O5oyN { z-index: 2010; } .stage__stage-wrap__2IA1L .stage__stage-wrap_mask__tXtIu { position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: auto; z-index: 5000; } .stage__stage-wrap__2IA1L .stage__stage__2tdds { /* Fixes a few extra pixels of margin/padding, that adds on to the bottom of the element, which messes up the chrome padding consistency */ display: block; border-radius: 8px; overflow: hidden; /* @todo: This is for overriding the value being set somewhere. Where is it being set? */ background-color: transparent; /* Allow custom touch handling to prevent scrolling on Edge */ touch-action: none; /* Make sure border is not included in size calculation */ box-sizing: border-box; /* enforce overflow + reset position of absolutely-positioned children */ position: relative; margin: 0 auto; } .stage__stage-wrap__2IA1L .stage__stage__2tdds.stage__stage_with-color-picker__Z9uKa { cursor: none; } .stage__stage-wrap__2IA1L .stage__stage__2tdds > div { font-size: 0; } .stage__stage-wrap__2IA1L .stage__is-share__20jbB .stage__stage__2tdds.stage__full-screen__3K4SG { border-width: 6px; border-color: #fff; } .stage__color-picker-background__3kmUp { position: fixed; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.55); display: block; z-index: 2000; top: 0; left: 0; } /* we want stage overlays to all be positioned in the same spot as the stage, but can't put them inside the border because we want their overflow to be visible, and the bordered element must have overflow: hidden set so that the stage doesn't "spill" out from under its rounded corners. instead, shift these over by the border width. */ .stage__stage-overlays__mZydc { position: absolute; top: 1px; left: 1px; /* the overlay itself should not capture pointer events; only its child elements can do that */ pointer-events: none; } .stage__stage-overlays__mZydc.stage__full-screen__3K4SG { top: 0.1875rem; left: 0.1875rem; } .stage__monitor-wrapper__2Z2hg { z-index: 1; } .stage__keyboard-jr__1YSVO { position: absolute; bottom: 20px; right: 20px; z-index: 1; display: flex; flex-direction: column; width: calc(var(--stage-width) * 0.3); } .stage__keyboard-jr__1YSVO .stage__keyboard-key__2k0-w { display: flex; align-items: center; justify-content: center; height: calc(var(--stage-width) * 0.06); border-radius: calc(var(--stage-width) * 0.01); background-color: rgba(0, 0, 0, 0.6); color: rgba(255, 255, 255, 0.4); font-size: calc(var(--stage-width) * 0.04); font-family: DejaVuSansMono; } .stage__keyboard-jr__1YSVO .stage__keyboard-key__2k0-w.stage__keyboard-key_active__3Oaji { color: white; } .stage__keyboard-jr__1YSVO .stage__keyboard-numbers__3_XmN { display: flex; justify-content: space-between; margin-bottom: 10px; } .stage__keyboard-jr__1YSVO .stage__keyboard-numbers__3_XmN .stage__keyboard-number__3r4fW { width: calc(var(--stage-width) * 0.06); } .stage__keyboard-jr__1YSVO .stage__keyboard-space__9YpIA { width: 100%; } .stage__monitor-wrapper__2Z2hg, .stage__frame-wrapper__2zEGm, .stage__green-flag-overlay-wrapper__1Onxh { position: absolute; top: 0; left: 0; pointer-events: none; } .stage__dragging-sprite__3ExDI { position: absolute; top: 0; left: 0; z-index: 1020; filter: drop-shadow(5px 5px 5px #e8efff); } .stage__stage-bottom-wrapper__tusuA { position: absolute; display: flex; flex-direction: column; justify-content: flex-end; top: 0; left: 0; overflow: hidden; pointer-events: none; } .stage__mic-indicator__1dKEv { transform-origin: bottom right; z-index: 45; pointer-events: none; align-self: flex-end; } .stage__question-wrapper__3Ptso { z-index: 49; pointer-events: auto; } .stage__identigy-wrapper__2F8Nx { z-index: 49; pointer-events: auto; } .stage__recordwave-wrapper__1L5Cw { z-index: 49; pointer-events: auto; position: absolute; bottom: 8px; } .stage__green-flag-overlay-wrapper__1Onxh { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; background: rgba(0, 0, 0, 0); border-radius: 0.5rem; pointer-events: all; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .stage__green-flag-overlay__1ydXL.stage__is-mobile__ovTQW .stage__green-flag-overlay-wrapper__1Onxh { border-radius: 0; } .stage__green-flag-overlay__1ydXL { display: flex; justify-content: center; align-items: center; box-sizing: border-box; width: 5rem; height: 5rem; } .stage__green-flag-overlay__1ydXL > img { width: 100%; object-fit: contain; } .stage__stage-canvas-reloader__2znLQ { position: absolute; top: 0; left: 0; z-index: 1; height: 100%; width: 100%; display: flex; justify-content: center; align-items: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; background-color: #fff; } .stage__stage-canvas-reloader__2znLQ img { width: 68px; height: 68px; object-fit: contain; } @keyframes stage__flash__1tEqX { 0% { opacity: 1; } 100% { opacity: 0; } } .stage__sprite-control__2Hnri { position: absolute; bottom: 14.5px; left: 0; width: 100%; height: 40px; display: flex; flex-wrap: no-wrap; pointer-events: none; justify-content: center; } .stage__sprite-control__2Hnri .stage__sprite-attr__3a78d { pointer-events: all; margin-right: 16px; height: 100%; background: rgba(237, 239, 245, 0.7); border: 1px solid #edeff5; box-sizing: border-box; border-radius: 8px; display: flex; align-items: center; padding: 0 12px; color: #3d4554; font-size: 14px; font-weight: 600; font-style: normal; } .stage__sprite-control__2Hnri .stage__sprite-attr__3a78d span { font-weight: inherit; font-size: inherit; font-style: inherit; } .stage__sprite-control__2Hnri .stage__sprite-attr__3a78d label { height: 28px; display: block; margin-left: 4px; background: #ffffff; border-radius: 42px; } .stage__sprite-control__2Hnri .stage__sprite-attr__3a78d input { height: 100%; width: 55px; max-width: 200px; overflow: hidden; word-wrap: break-word; text-overflow: ellipsis; transition: width 0.05s; font-style: inherit; background: #ffffff; border-radius: inherit; border: none; font-weight: inherit; font-size: inherit; text-align: center; outline: none; } .stage__sprite-control__2Hnri .stage__sprite-attr__3a78d:last-child { margin-right: 0; } @media screen and (orientation: portrait) { .stage__stage__2tdds { box-sizing: border-box !important; border: 4px solid #fff; border-radius: 0; } .stage__green-flag-overlay-wrapper__1Onxh { border-radius: 0; } } @keyframes mic-indicator__popIn__2upaK { from { transform: scale(0.5); } to { transform: scale(1); } } .mic-indicator__mic-img__2iHp6 { margin: 10px; transform-origin: center; animation: mic-indicator__popIn__2upaK 0.1s ease-in-out; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .loupe__color-picker__lrZ0h { position: absolute; border-radius: 100%; border: 4px solid #e8efff; z-index: 0; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .record-modal__waveformwrap__RCEYd { box-sizing: border-box; margin: 0 calc(8px); display: flex; justify-content: space-around; align-items: center; position: relative; background: #f7f7ff; border: 1px solid #ccdcff; border-radius: calc(4px); padding: 0.4rem; /* Force these to be on their own render layer because they update often */ transform: translateZ(0); } .record-modal__waveformwrap__RCEYd > span span { height: 100%; width: 100%; display: block; } .record-modal__waveformwrap__RCEYd > span span svg { color: #828da3; height: 100%; width: 100%; } .record-modal__waveformwrap__RCEYd .record-modal__line__1QfWV { width: 1px; background-color: #ccdcff; margin: 0 6px; } .record-modal__waveformwrap__RCEYd .record-modal__wavewrap__2W9pw { width: 100%; height: 100%; position: relative; display: flex; align-items: center; justify-content: center; } .record-modal__waveformwrap__RCEYd .record-modal__wavewrap__2W9pw svg { height: 100%; } .record-modal__waveformwrap__RCEYd .record-modal__wavewrap__2W9pw .waveform-path { fill: #ffc730; stroke: #fcb800; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .monitor__flex-center__s4JNN { display: flex; align-items: center; justify-content: center; } .monitor__full-filled__2Mz0P { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .monitor__modal-mask__2mGt4 { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .monitor__modal-mask__2mGt4 .monitor__modal-wrap__Ux4ei { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .monitor__modal-mask__2mGt4 .monitor__modal-wrap__Ux4ei .monitor__modal-header-wrap__ySg3s { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .monitor__modal-mask__2mGt4 .monitor__modal-wrap__Ux4ei .monitor__modal-header-wrap__ySg3s .monitor__modal-header-bg__KEGpH { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .monitor__modal-mask__2mGt4 .monitor__modal-wrap__Ux4ei .monitor__modal-header-wrap__ySg3s .monitor__modal-header-label__TokEk { flex-shrink: 0; font-size: 16px; font-weight: bold; } .monitor__modal-mask__2mGt4 .monitor__modal-wrap__Ux4ei .monitor__modal-header-wrap__ySg3s .monitor__modal-header-close__1QRWy { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .monitor__modal-mask__2mGt4 .monitor__modal-wrap__Ux4ei .monitor__modal-header-wrap__ySg3s .monitor__modal-header-close__1QRWy:hover { color: #98a2b4; } .monitor__modal-mask__2mGt4 .monitor__modal-wrap__Ux4ei .monitor__modal-body-wrap__19bdM { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .monitor__modal-mask__2mGt4 .monitor__modal-wrap__Ux4ei .monitor__modal-footer-wrap__1vTqY { flex-shrink: 0; display: flex; } .monitor__modal-header__3wrDb { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .monitor__modal-header__3wrDb .monitor__modal-header-upload__2skiY { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .monitor__modal-header__3wrDb .monitor__modal-header-upload__2skiY:hover { background-color: #e0e9ff; } .monitor__modal-header__3wrDb .monitor__modal-header-upload__2skiY:active { background-color: #ccdaff; } .monitor__modal-header__3wrDb .monitor__modal-header-upload__2skiY .monitor__upload-img__3Hp7U { font-size: 16px; margin-right: calc(2px); } .monitor__modal-header__3wrDb .monitor__modal-header-upload__2skiY .monitor__upload-label__2VWcO { font-size: 14px; } .monitor__modal-header__3wrDb .monitor__modal-header-upload__2skiY .monitor__upload-input__RS7_U { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .monitor__modal-header__3wrDb .monitor__modal-header-search__1gPUc { position: relative; } .monitor__modal-header__3wrDb .monitor__modal-header-search__1gPUc .monitor__search-input__1QkDS { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .monitor__modal-header__3wrDb .monitor__modal-header-search__1gPUc .monitor__search-input__1QkDS::-webkit-input-placeholder { color: #98a2b4; } .monitor__modal-header__3wrDb .monitor__modal-header-search__1gPUc .monitor__search-input__1QkDS::-moz-placeholder { color: #98a2b4; } .monitor__modal-header__3wrDb .monitor__modal-header-search__1gPUc .monitor__search-input__1QkDS:-ms-input-placeholder { color: #98a2b4; } .monitor__modal-header__3wrDb .monitor__modal-header-search__1gPUc .monitor__search-input__1QkDS:hover { border-color: #d1d7e1; } .monitor__modal-header__3wrDb .monitor__modal-header-search__1gPUc .monitor__search-input__1QkDS:active { border-color: #d1d7e1; } .monitor__modal-header__3wrDb .monitor__modal-header-search__1gPUc .monitor__search-img__1NBdw { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .monitor__modal-body__-A8Xc { flex-grow: 1; display: flex; } .monitor__modal-body__-A8Xc .monitor__modal-body-left__30e6w, .monitor__modal-body__-A8Xc .monitor__modal-body-main__2G3VB { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .monitor__modal-body__-A8Xc .monitor__modal-body-left__30e6w { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .monitor__modal-body__-A8Xc .monitor__modal-body-left__30e6w .monitor__modal-body-left-scroll__3AGSf { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .monitor__modal-body__-A8Xc .monitor__modal-body-left__30e6w .monitor__modal-body-left-scroll__3AGSf .monitor__modal-body-left-inner__1svbc { width: 121px; padding: calc(12px); color: #5e6b81; } .monitor__modal-body__-A8Xc .monitor__modal-body-left__30e6w .monitor__modal-body-left-scroll__3AGSf .monitor__modal-body-left-inner__1svbc .monitor__menu-item-current__2od7I { color: var(--theme-primary); background-color: #e0e9ff; } .monitor__modal-body__-A8Xc .monitor__modal-body-left__30e6w .monitor__modal-body-left-scroll__3AGSf .monitor__modal-body-left-inner__1svbc .monitor__menu-item__1plDK { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .monitor__modal-body__-A8Xc .monitor__modal-body-left__30e6w .monitor__modal-body-left-scroll__3AGSf .monitor__modal-body-left-inner__1svbc .monitor__menu-item__1plDK:hover { background-color: #edeff5; } .monitor__modal-body__-A8Xc .monitor__modal-body-left__30e6w .monitor__modal-body-left-scroll__3AGSf .monitor__modal-body-left-inner__1svbc .monitor__menu-item__1plDK .monitor__menu-item-img__q6c7_ { flex-shrink: 0; width: 20px; margin-right: 8px; } .monitor__modal-body__-A8Xc .monitor__modal-body-left__30e6w .monitor__modal-body-left-scroll__3AGSf .monitor__modal-body-left-inner__1svbc .monitor__menu-item__1plDK .monitor__menu-item-label__2j7Ho { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .monitor__modal-body__-A8Xc .monitor__modal-body-main__2G3VB { padding: calc(12px) 0; } .monitor__modal-body__-A8Xc .monitor__modal-body-main__2G3VB .monitor__modal-body-main-scroll__3pK0M { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .monitor__modal-body__-A8Xc .monitor__modal-body-main__2G3VB .monitor__modal-body-main-scroll__3pK0M .monitor__modal-body-main-inner__rcLRo { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .monitor__modal-body__-A8Xc .monitor__modal-body-main__2G3VB .monitor__modal-body-main-scroll__3pK0M .monitor__modal-body-main-inner__rcLRo .monitor__selector-btn-add__1pKiF, .monitor__modal-body__-A8Xc .monitor__modal-body-main__2G3VB .monitor__modal-body-main-scroll__3pK0M .monitor__modal-body-main-inner__rcLRo .monitor__selector-btn-item__2IH8v { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .monitor__modal-body__-A8Xc .monitor__modal-body-main__2G3VB .monitor__modal-body-main-scroll__3pK0M .monitor__modal-body-main-inner__rcLRo .monitor__selector-btn-add__1pKiF:hover, .monitor__modal-body__-A8Xc .monitor__modal-body-main__2G3VB .monitor__modal-body-main-scroll__3pK0M .monitor__modal-body-main-inner__rcLRo .monitor__selector-btn-item__2IH8v:hover { background-color: #e0e9ff; } .monitor__modal-body__-A8Xc .monitor__modal-body-main__2G3VB .monitor__modal-body-main-scroll__3pK0M .monitor__modal-body-main-inner__rcLRo .monitor__selector-btn-add__1pKiF:active, .monitor__modal-body__-A8Xc .monitor__modal-body-main__2G3VB .monitor__modal-body-main-scroll__3pK0M .monitor__modal-body-main-inner__rcLRo .monitor__selector-btn-item__2IH8v:active { background-color: #ccdaff; } .monitor__modal-body__-A8Xc .monitor__modal-body-main__2G3VB .monitor__modal-body-main-scroll__3pK0M .monitor__modal-body-main-inner__rcLRo .monitor__selector-btn-add__1pKiF:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .monitor__modal-body__-A8Xc .monitor__modal-body-main__2G3VB .monitor__modal-body-main-scroll__3pK0M .monitor__modal-body-main-inner__rcLRo .monitor__selector-btn-add__1pKiF:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .monitor__modal-body__-A8Xc .monitor__modal-body-main__2G3VB .monitor__modal-body-main-scroll__3pK0M .monitor__modal-body-main-inner__rcLRo .monitor__selector-btn-add__1pKiF .monitor__add-img__2IkZU { font-size: 28px; height: auto; margin-bottom: 8px; } .monitor__modal-body__-A8Xc .monitor__modal-body-main__2G3VB .monitor__modal-body-main-scroll__3pK0M .monitor__modal-body-main-inner__rcLRo .monitor__selector-btn-add__1pKiF .monitor__add-label__1QaMS { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .monitor__modal-body__-A8Xc .monitor__modal-body-main__2G3VB .monitor__modal-body-main-scroll__3pK0M .monitor__modal-body-main-inner__rcLRo .monitor__selector-btn-item__2IH8v { justify-content: space-between; } .monitor__modal-body__-A8Xc .monitor__modal-body-main__2G3VB .monitor__modal-body-main-scroll__3pK0M .monitor__modal-body-main-inner__rcLRo .monitor__selector-btn-item__2IH8v .monitor__item-img__1rlRq { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .monitor__modal-body__-A8Xc .monitor__modal-body-main__2G3VB .monitor__modal-body-main-scroll__3pK0M .monitor__modal-body-main-inner__rcLRo .monitor__selector-btn-item__2IH8v .monitor__item-img__1rlRq img { width: auto; height: 105px; } .monitor__modal-body__-A8Xc .monitor__modal-body-main__2G3VB .monitor__modal-body-main-scroll__3pK0M .monitor__modal-body-main-inner__rcLRo .monitor__selector-btn-item__2IH8v .monitor__item-label__1X_BF { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .monitor__modal-footer__2PK06 { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .monitor__selector-btn-add__1pKiF, .monitor__selector-btn-item__2IH8v { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .monitor__selector-btn-add__1pKiF { background-color: var(--selector-sprite-bg_primary); } .monitor__selector-btn-add__1pKiF:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .monitor__selector-btn-add__1pKiF:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .monitor__selector-btn-add__1pKiF .monitor__add-img__2IkZU { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .monitor__selector-btn-add__1pKiF .monitor__add-label__1QaMS { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .monitor__selector-btn-item__2IH8v { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .monitor__selector-btn-item__2IH8v .monitor__item-img__1rlRq { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .monitor__selector-btn-item__2IH8v .monitor__item-img__1rlRq img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .monitor__selector-btn-item__2IH8v .monitor__item-label__1X_BF { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .monitor__selector-btn-item__2IH8v:hover { background-color: var(--selector-sprite-bg_primary); } .monitor__selector-btn-item__2IH8v:hover .monitor__item-img__1rlRq { border-color: var(--selector-sprite-bg_primary); } .monitor__selector-btn-item_selected__oKxO4 { background-color: var(--selector-sprite-bg_primary); } .monitor__selector-btn-item_selected__oKxO4 .monitor__item-img__1rlRq { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .monitor__menu-bar-btn__3FOM0 { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .monitor__menu-bar-btn_green__O49PW, .monitor__menu-bar-btn_create__1AtuS { background-color: #3cdc8f; } .monitor__menu-bar-btn_green__O49PW:hover, .monitor__menu-bar-btn_create__1AtuS:hover { background-color: #00d374; } .monitor__menu-bar-btn_green__O49PW:active, .monitor__menu-bar-btn_create__1AtuS:active { background-color: #00d374; } .monitor__menu-bar-btn_save__T-taY, .monitor__menu-bar-btn_reset__2TRUZ { background-color: #6ac8ff; } .monitor__menu-bar-btn_save__T-taY:hover, .monitor__menu-bar-btn_reset__2TRUZ:hover { background-color: #57bcfe; } .monitor__menu-bar-btn_save__T-taY:active, .monitor__menu-bar-btn_reset__2TRUZ:active { background-color: #4fb0fc; } .monitor__menu-bar-btn_submit__OJzfh, .monitor__menu-bar-btn_open__11W7s { background-color: #ff9e23; } .monitor__menu-bar-btn_submit__OJzfh:hover, .monitor__menu-bar-btn_open__11W7s:hover { background-color: #f47b04; } .monitor__menu-bar-btn_submit__OJzfh:active, .monitor__menu-bar-btn_open__11W7s:active { background-color: #fe8f22; } .monitor__menu-bar-btn_link__3kC9o { background-color: #e8efff; color: var(--theme-primary); } .monitor__menu-bar-btn_link__3kC9o:hover { background-color: #b6c7ff; } .monitor__menu-bar-btn_link__3kC9o:active { background-color: #cfdcff; } .monitor__menu-bar-btn_disabled__2f_MX { color: #565266; background-color: #e6e9ed; } .monitor__menu-bar-btn_disabled__2f_MX:hover { cursor: not-allowed; } .monitor__menu-bar-btn_help__3c6MT { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .monitor__menu-bar-btn_help__3c6MT:hover { background-color: #8398ff; } .monitor__menu-bar-btn_help__3c6MT:active { background-color: #8ca3ff; } .monitor__menu-bar-separator__2hWtk { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .monitor__monitor-container__1MalN { position: absolute; z-index: 48; transition: box-shadow 0.2s; font-size: 12px; pointer-events: all; border-radius: 10px; max-height: 246px; min-height: 17px; overflow: auto; padding: 2px 0; /* 变量 start */ /* 变量 end */ /* 列表 */ } .monitor__monitor-container__1MalN.monitor__dragging__EdWoQ { z-index: 1010; box-shadow: 3px 3px 5px #888888; } .monitor__monitor-container__1MalN .monitor__large-value__3c7Jd { display: flex; align-items: center; justify-content: center; box-sizing: border-box; font-size: 12px; line-height: 12px; min-height: 17px; height: 100%; border-radius: 4px; color: white; white-space: pre-wrap; padding: 2px 8px; } .monitor__monitor-container__1MalN .monitor__default-monitor__1xoHa { display: flex; flex-direction: column; padding: 2px 4px; background-color: #dfdcfd; border: 1px solid #c6bfff; border-radius: 4px; } .monitor__monitor-container__1MalN .monitor__default-monitor__1xoHa .monitor__row__1dM_B { display: flex; align-items: center; } .monitor__monitor-container__1MalN .monitor__default-monitor__1xoHa .monitor__row__1dM_B .monitor__label__1aGPo { max-width: calc(96px); font-size: 12px; font-weight: bold; transform-origin: left; line-height: 1; margin-right: 6px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .monitor__monitor-container__1MalN .monitor__default-monitor__1xoHa .monitor__row__1dM_B .monitor__value__2Y1za { font-size: 12px; line-height: 18px; max-width: calc(248px); height: 17px; border-radius: 4px; color: white; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; transform-origin: left; padding: 0 8px; } .monitor__monitor-container__1MalN .monitor__default-monitor__1xoHa .monitor__row__1dM_B .monitor__slider__2G1jr { width: 100%; transform: translateZ(0); /* Fixes flickering in Safari */ } .monitor__monitor-container__1MalN .monitor__list-monitor__3WdLb { display: flex; flex-direction: column; font-size: 12px; background-color: #dfdcfd; border: 1px solid #c6bfff; border-radius: 6px; } .monitor__monitor-container__1MalN .monitor__list-monitor__3WdLb .monitor__list-text__3JHRY { display: inline-block; transform-origin: left; } .monitor__monitor-container__1MalN .monitor__list-monitor__3WdLb .monitor__list-header__1yxil { display: flex; align-items: center; justify-content: center; background-color: #ffffff; border-radius: 6px 6px 0 0; } .monitor__monitor-container__1MalN .monitor__list-monitor__3WdLb .monitor__list-header__1yxil .monitor__list-text__3JHRY { font-weight: bold; color: #565266; } .monitor__monitor-container__1MalN .monitor__list-monitor__3WdLb .monitor__list-body__1t6WD { background: #e6ebff; width: 100%; display: flex; flex-direction: column; overflow-x: hidden; height: calc(56%); flex-grow: 1; } .monitor__monitor-container__1MalN .monitor__list-monitor__3WdLb .monitor__list-body__1t6WD .monitor__list-row__Qa1iW.monitor__list-empty__1EQm9 { text-align: center; width: 100%; padding: 5px; } .monitor__monitor-container__1MalN .monitor__list-monitor__3WdLb .monitor__list-body__1t6WD .monitor__list-row__Qa1iW { display: flex; justify-content: space-around; align-items: center; padding: 2px; flex-shrink: 0; transform: translateZ(0); /* Keep sharp when scaled */ } .monitor__monitor-container__1MalN .monitor__list-monitor__3WdLb .monitor__list-body__1t6WD .monitor__list-row__Qa1iW .monitor__list-index__2VYKI { flex-shrink: 0; font-weight: bold; color: #565266; } .monitor__monitor-container__1MalN .monitor__list-monitor__3WdLb .monitor__list-body__1t6WD .monitor__list-row__Qa1iW .monitor__list-value__nzCWI { flex-grow: 1; color: #ffffff; border-radius: calc(0.25rem); border: 1px solid #e8efff; height: 18px; overflow: hidden; /* Don't let long values escape container */ text-overflow: ellipsis; -webkit-user-select: text; -ms-user-select: text; user-select: text; /* Allow selecting list values for 2.0 compatibility, only relevant in player */ display: flex; align-items: center; } .monitor__monitor-container__1MalN .monitor__list-monitor__3WdLb .monitor__list-body__1t6WD .monitor__list-row__Qa1iW .monitor__list-value__nzCWI .monitor__list-text__3JHRY { transform-origin: left; padding-left: 3px; } .monitor__monitor-container__1MalN .monitor__list-monitor__3WdLb .monitor__list-body__1t6WD .monitor__list-row__Qa1iW .monitor__list-value__nzCWI .monitor__input-wrapper__1SIu9 { flex-grow: 1; overflow: hidden; background-color: rgba(0, 0, 0, 0.1); color: #ffffff; position: relative; display: flex; align-items: center; } .monitor__monitor-container__1MalN .monitor__list-monitor__3WdLb .monitor__list-body__1t6WD .monitor__list-row__Qa1iW .monitor__list-value__nzCWI .monitor__input-wrapper__1SIu9 .monitor__list-input__2O5Bd { flex-grow: 1; overflow: hidden; border: 0; outline: none; background-color: transparent; } .monitor__monitor-container__1MalN .monitor__list-monitor__3WdLb .monitor__list-body__1t6WD .monitor__list-row__Qa1iW .monitor__list-value__nzCWI .monitor__input-wrapper__1SIu9 .monitor__remove-button__3CYSP { position: absolute; right: 2px; line-height: 16px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .monitor__monitor-container__1MalN .monitor__list-monitor__3WdLb .monitor__list-footer__3OQOr { display: flex; align-items: center; justify-content: space-between; padding: 0 3px; background-color: #ffffff; color: #565266; font-weight: bold; border-radius: 0 0 6px 6px; } .monitor__monitor-container__1MalN .monitor__list-monitor__3WdLb .monitor__list-footer__3OQOr .monitor__add-button__fmh4e { cursor: url(static/cursor/cursor-pointer.cur), pointer; margin-right: 3px; } .monitor__monitor-container__1MalN .monitor__list-monitor__3WdLb .monitor__list-footer__3OQOr .monitor__footer-length__3fE74 { text-align: center; } .monitor__monitor-container__1MalN .monitor__list-monitor__3WdLb .monitor__list-footer__3OQOr .monitor__resize-handle__3lBV2 { cursor: nwse-resize; margin-left: 3px; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .slider-prompt__modal-content__1kcCw { width: 360px; } .slider-prompt__body__3Nl0v { background: #ffffff; padding: 1.5rem 2.25rem; } .slider-prompt__label__2Dc9X { font-weight: 500; margin: 0 0 0.75rem; } .slider-prompt__min-input__g7wFG, .slider-prompt__max-input__10J_f { margin-bottom: 1.5rem; width: 100%; border: 1px solid #e8efff; border-radius: 5px; padding: 0 1rem; height: 3rem; color: rgba(87, 94, 117, 0.75); font-size: 0.875rem; } .slider-prompt__button-row__d35D4 { font-weight: bolder; text-align: right; } .slider-prompt__button-row__d35D4 button { padding: 0.75rem 1rem; border-radius: 0.25rem; background: white; border: 1px solid #e8efff; font-weight: 600; font-size: 0.85rem; } .slider-prompt__button-row__d35D4 button.slider-prompt__ok-button__3fJqZ { background: var(--theme-primary); border: var(--theme-primary); color: white; } [dir='ltr'] .slider-prompt__button-row__d35D4 button + button { margin-left: 0.5rem; } [dir='rtl'] .slider-prompt__button-row__d35D4 button + button { margin-right: 0.5rem; } .monitor-list__monitor-list__2cLVr { /* Width/height are set by the component, margin: auto centers in fullscreen */ margin: auto; pointer-events: none; overflow: hidden; } .monitor-list__monitor-list-scaler__2iQtr { /* Scaling for monitors should happen from the top left */ transform-origin: left top; } ::-ms-clear { display: none; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .question__question-container__1CJcI { margin: calc(4px); border: 1px solid #e8efff; border-radius: calc(4px); border-width: 2px; padding: 1rem; background: white; } .question__question-label__2Fyox { font-size: 0.75rem; font-weight: bold; font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; color: #565266; padding-bottom: calc(4px); } .question__question-input__29DCF { display: flex; /* Keeps the input from going outside this container */ position: relative; } .question__question-submit-button__3NIZj { position: absolute; top: calc(0.25rem); padding: 0; width: calc(1.5rem); height: calc(1.5rem); border: none; border-radius: 100%; color: white; background: var(--theme-primary); display: flex; justify-content: center; align-items: center; } [dir='ltr'] .question__question-submit-button__3NIZj { right: calc(0.25rem); } [dir='rtl'] .question__question-submit-button__3NIZj { left: calc(0.25rem); } /* Input overrides: width, font-weight, focus outline and padding */ .question__question-input__29DCF > input { width: 100%; font-weight: normal; } [dir='ltr'] .question__question-input__29DCF > input { padding: 0 2rem 0 0.75rem; /* To make room for the submit button */ } [dir='rtl'] .question__question-input__29DCF > input { padding: 0 0.75rem 0 2rem; /* To make room for the submit button */ } .question__question-input__29DCF > input:focus { box-shadow: 0px 0px 0px 3px rgba(77, 151, 255, 0.35); } .question__question-submit-button-icon__3qwev { width: calc(1.5rem); object-fit: cover; /* position: relative; right: -7px; left: -7px; */ } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .selection__question-container__RPFu7 { margin: calc(4px); border-radius: calc(4px); border-width: 2px; } .selection__question-label__diSPW { font-size: 0.75rem; font-weight: bold; font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; color: #565266; padding-bottom: calc(4px); } .selection__question-input__3_Tw3 { display: flex; /* Keeps the input from going outside this container */ position: relative; } .selection__question-options__1uCwe { flex: 1; padding: 0.3rem; } .selection__question-options__1uCwe .selection__question-option__3gskt { width: calc(99.7%); min-height: 2.5rem; height: 100%; display: flex; align-items: center; justify-content: center; border-radius: 0.6rem; background-color: rgba(12, 15, 71, 0.8); margin-right: 0.4rem; cursor: pointer; color: #ffffff; font-family: 'PingFang SC'; font-size: 0.88rem; font-style: normal; font-weight: 500; line-height: 1.4; /* 1px */ text-align: center; } .selection__question-options__1uCwe .selection__question-option__3gskt:hover { background-color: #0c0f47; } .selection__question-options__1uCwe .selection__question-option__3gskt:last-child { margin-right: 0; } .selection__question-submit-button__2s6v3 { position: absolute; top: calc(0.25rem); padding: 0; width: calc(1.5rem); height: calc(1.5rem); border: none; border-radius: 100%; color: white; background: var(--theme-primary); display: flex; justify-content: center; align-items: center; } [dir='ltr'] .selection__question-submit-button__2s6v3 { right: calc(0.25rem); } [dir='rtl'] .selection__question-submit-button__2s6v3 { left: calc(0.25rem); } /* Input overrides: width, font-weight, focus outline and padding */ .selection__question-input__3_Tw3 > input { width: 100%; font-weight: normal; } [dir='ltr'] .selection__question-input__3_Tw3 > input { padding: 0 2rem 0 0.75rem; /* To make room for the submit button */ } [dir='rtl'] .selection__question-input__3_Tw3 > input { padding: 0 0.75rem 0 2rem; /* To make room for the submit button */ } .selection__question-input__3_Tw3 > input:focus { box-shadow: 0px 0px 0px 3px rgba(77, 151, 255, 0.35); } .selection__question-submit-button-icon__2_TQn { width: calc(1.5rem); object-fit: cover; /* position: relative; right: -7px; left: -7px; */ } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .identify__question-container__a2wJh { min-height: 5rem; border-radius: calc(4px); display: flex; flex-direction: column; align-items: center; justify-content: space-between; } .identify__question-container__a2wJh .identify__identify-main__P-iva { width: 100%; min-height: 2.5rem; border-radius: 8px; margin-bottom: 0.5rem; padding: 0.6rem 0.75rem; background: rgba(12, 15, 71, 0.6); display: flex; align-items: center; justify-content: flex-start; } .identify__question-container__a2wJh .identify__identify-main__P-iva .identify__main-icon__yXvGY { font-size: 1.1rem; margin-right: 0.5rem; } .identify__question-container__a2wJh .identify__identify-main__P-iva .identify__main__3qdQZ { flex: 1; align-items: center; color: #ffffff; font-family: 'PingFang SC'; font-size: 0.9rem; font-style: normal; font-weight: 400; } .identify__question-container__a2wJh .identify__identify-main__P-iva .identify__ok-icon__265mg { cursor: pointer; margin-left: 0.5rem; display: flex; align-items: center; justify-content: center; font-size: 1.1rem; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 { width: 100%; height: 8rem; border-radius: 8px; background: rgba(0, 0, 0, 0.5); display: flex; align-items: flex-start; justify-content: center; position: relative; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__close-icon__3nXzz { position: absolute; top: 0.5rem; right: 0.5rem; cursor: pointer; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__close-icon__3nXzz .identify__main-icon__yXvGY { font-size: 1.1rem; color: #ffffff; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__main__3qdQZ { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__main__3qdQZ .identify__bottom__1C8y_ { display: flex; align-items: center; justify-content: center; flex: 1; /* 给不同 bar 加延迟，产生波浪感 */ } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__main__3qdQZ .identify__bottom__1C8y_ .identify__bar__3AkEO { width: 6px; height: 30px; /* 初始高度 */ background-color: currentColor; border-radius: 3px; color: #ff6a38; margin: 0 2px; transform-origin: center; /* 以中点为缩放中心 */ animation: identify__pulse__2f5GI 1.2s ease-in-out infinite; transform: scaleY(0.4); } @keyframes identify__pulse__2f5GI { 0%, 100% { transform: scaleY(0.4); } 50% { transform: scaleY(1.4); } } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__main__3qdQZ .identify__bottom__1C8y_ .identify__bar__3AkEO:nth-child(1) { animation-delay: 0s; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__main__3qdQZ .identify__bottom__1C8y_ .identify__bar__3AkEO:nth-child(2) { animation-delay: 0.1s; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__main__3qdQZ .identify__bottom__1C8y_ .identify__bar__3AkEO:nth-child(3) { animation-delay: 0.2s; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__main__3qdQZ .identify__bottom__1C8y_ .identify__bar__3AkEO:nth-child(4) { animation-delay: 0.3s; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__main__3qdQZ .identify__bottom__1C8y_ .identify__bar__3AkEO:nth-child(5) { animation-delay: 0.4s; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__main__3qdQZ .identify__bottom__1C8y_ .identify__bar__3AkEO:nth-child(6) { animation-delay: 0.5s; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__main__3qdQZ .identify__bottom__1C8y_ .identify__bar__3AkEO:nth-child(7) { animation-delay: 0.5s; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__main__3qdQZ .identify__bottom__1C8y_ .identify__bar__3AkEO:nth-child(8) { animation-delay: 0.4s; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__main__3qdQZ .identify__bottom__1C8y_ .identify__bar__3AkEO:nth-child(9) { animation-delay: 0.3s; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__main__3qdQZ .identify__bottom__1C8y_ .identify__bar__3AkEO:nth-child(10) { animation-delay: 0.2s; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__main__3qdQZ .identify__bottom__1C8y_ .identify__bar__3AkEO:nth-child(11) { animation-delay: 0.1s; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__main__3qdQZ .identify__bottom__1C8y_ .identify__bar__3AkEO:nth-child(12) { animation-delay: 0s; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__main__3qdQZ .identify__button__AUN_E { width: 4rem; height: 4rem; margin: 1rem 0.6rem; border-radius: 50%; background-color: #ffffff; display: flex; align-items: center; justify-content: center; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__main__3qdQZ .identify__button__AUN_E .identify__mic-icon__2o9aK { font-size: 1.8rem; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__main__3qdQZ .identify__button2__WL_eH { width: 3rem; height: 3rem; margin: 1rem 0.6rem; border-radius: 50%; background-color: #ffffff; display: flex; align-items: center; justify-content: center; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__main__3qdQZ .identify__button2__WL_eH .identify__mic-icon__2o9aK { font-size: 1.8rem; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__main__3qdQZ .identify__text__3W9n0 { width: 100%; height: 1.2rem; margin-top: 0.5rem; padding: 0 1.6rem; font-size: 1rem; font-style: normal; font-weight: 600; line-height: 1.2; color: #ffffff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: center; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__btn__vrkrc { display: flex; align-items: center; justify-content: center; position: relative; color: #ffffff; font-family: 'PingFang SC'; font-size: 0.9rem; font-style: normal; font-weight: 400; line-height: 1.4; /* 17px */ text-align: center; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__btn__vrkrc .identify__mic-icon__2o9aK { font-size: 1.1rem; margin-right: 0.25rem; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__end-btn__1ogGT { width: 2rem; height: 100%; position: absolute; top: 0; right: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; cursor: pointer; } .identify__question-container__a2wJh .identify__identify-content__1mGa3 .identify__end-btn__1ogGT .identify__end-icon__39l6M { font-size: 1.2rem; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .ybc-modal__flex-center__R4e4f { display: flex; align-items: center; justify-content: center; } .ybc-modal__full-filled__3Plrg { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .ybc-modal__modal-mask__281pk { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .ybc-modal__modal-mask__281pk .ybc-modal__modal-wrap__3H6-5 { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .ybc-modal__modal-mask__281pk .ybc-modal__modal-wrap__3H6-5 .ybc-modal__modal-header-wrap__q91db { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .ybc-modal__modal-mask__281pk .ybc-modal__modal-wrap__3H6-5 .ybc-modal__modal-header-wrap__q91db .ybc-modal__modal-header-bg__Hsoq7 { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .ybc-modal__modal-mask__281pk .ybc-modal__modal-wrap__3H6-5 .ybc-modal__modal-header-wrap__q91db .ybc-modal__modal-header-label__vYaNQ { flex-shrink: 0; font-size: 16px; font-weight: bold; } .ybc-modal__modal-mask__281pk .ybc-modal__modal-wrap__3H6-5 .ybc-modal__modal-header-wrap__q91db .ybc-modal__modal-header-close__39Hqc { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .ybc-modal__modal-mask__281pk .ybc-modal__modal-wrap__3H6-5 .ybc-modal__modal-header-wrap__q91db .ybc-modal__modal-header-close__39Hqc:hover { color: #98a2b4; } .ybc-modal__modal-mask__281pk .ybc-modal__modal-wrap__3H6-5 .ybc-modal__modal-body-wrap__2Ec0p { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .ybc-modal__modal-mask__281pk .ybc-modal__modal-wrap__3H6-5 .ybc-modal__modal-footer-wrap__2Qn3x { flex-shrink: 0; display: flex; } .ybc-modal__modal-header__31A99 { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .ybc-modal__modal-header__31A99 .ybc-modal__modal-header-upload__Zz76u { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .ybc-modal__modal-header__31A99 .ybc-modal__modal-header-upload__Zz76u:hover { background-color: #e0e9ff; } .ybc-modal__modal-header__31A99 .ybc-modal__modal-header-upload__Zz76u:active { background-color: #ccdaff; } .ybc-modal__modal-header__31A99 .ybc-modal__modal-header-upload__Zz76u .ybc-modal__upload-img__1qEJT { font-size: 16px; margin-right: calc(2px); } .ybc-modal__modal-header__31A99 .ybc-modal__modal-header-upload__Zz76u .ybc-modal__upload-label__2371s { font-size: 14px; } .ybc-modal__modal-header__31A99 .ybc-modal__modal-header-upload__Zz76u .ybc-modal__upload-input__7ZfkG { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .ybc-modal__modal-header__31A99 .ybc-modal__modal-header-search__1Kw2w { position: relative; } .ybc-modal__modal-header__31A99 .ybc-modal__modal-header-search__1Kw2w .ybc-modal__search-input__1w4WE { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .ybc-modal__modal-header__31A99 .ybc-modal__modal-header-search__1Kw2w .ybc-modal__search-input__1w4WE::-webkit-input-placeholder { color: #98a2b4; } .ybc-modal__modal-header__31A99 .ybc-modal__modal-header-search__1Kw2w .ybc-modal__search-input__1w4WE::-moz-placeholder { color: #98a2b4; } .ybc-modal__modal-header__31A99 .ybc-modal__modal-header-search__1Kw2w .ybc-modal__search-input__1w4WE:-ms-input-placeholder { color: #98a2b4; } .ybc-modal__modal-header__31A99 .ybc-modal__modal-header-search__1Kw2w .ybc-modal__search-input__1w4WE:hover { border-color: #d1d7e1; } .ybc-modal__modal-header__31A99 .ybc-modal__modal-header-search__1Kw2w .ybc-modal__search-input__1w4WE:active { border-color: #d1d7e1; } .ybc-modal__modal-header__31A99 .ybc-modal__modal-header-search__1Kw2w .ybc-modal__search-img__3H4Mf { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .ybc-modal__modal-body__2vQ8G { flex-grow: 1; display: flex; } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-left__3ON9u, .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-main__3caUo { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-left__3ON9u { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-left__3ON9u .ybc-modal__modal-body-left-scroll__2K-DR { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-left__3ON9u .ybc-modal__modal-body-left-scroll__2K-DR .ybc-modal__modal-body-left-inner__icTMV { width: 121px; padding: calc(12px); color: #5e6b81; } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-left__3ON9u .ybc-modal__modal-body-left-scroll__2K-DR .ybc-modal__modal-body-left-inner__icTMV .ybc-modal__menu-item-current__2YhK5 { color: var(--theme-primary); background-color: #e0e9ff; } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-left__3ON9u .ybc-modal__modal-body-left-scroll__2K-DR .ybc-modal__modal-body-left-inner__icTMV .ybc-modal__menu-item__3xv8u { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-left__3ON9u .ybc-modal__modal-body-left-scroll__2K-DR .ybc-modal__modal-body-left-inner__icTMV .ybc-modal__menu-item__3xv8u:hover { background-color: #edeff5; } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-left__3ON9u .ybc-modal__modal-body-left-scroll__2K-DR .ybc-modal__modal-body-left-inner__icTMV .ybc-modal__menu-item__3xv8u .ybc-modal__menu-item-img__1iImk { flex-shrink: 0; width: 20px; margin-right: 8px; } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-left__3ON9u .ybc-modal__modal-body-left-scroll__2K-DR .ybc-modal__modal-body-left-inner__icTMV .ybc-modal__menu-item__3xv8u .ybc-modal__menu-item-label__1i6Px { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-main__3caUo { padding: calc(12px) 0; } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-main__3caUo .ybc-modal__modal-body-main-scroll__2K8BQ { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-main__3caUo .ybc-modal__modal-body-main-scroll__2K8BQ .ybc-modal__modal-body-main-inner__1VNLz { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-main__3caUo .ybc-modal__modal-body-main-scroll__2K8BQ .ybc-modal__modal-body-main-inner__1VNLz .ybc-modal__selector-btn-add__GFLQi, .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-main__3caUo .ybc-modal__modal-body-main-scroll__2K8BQ .ybc-modal__modal-body-main-inner__1VNLz .ybc-modal__selector-btn-item__o9V0y { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-main__3caUo .ybc-modal__modal-body-main-scroll__2K8BQ .ybc-modal__modal-body-main-inner__1VNLz .ybc-modal__selector-btn-add__GFLQi:hover, .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-main__3caUo .ybc-modal__modal-body-main-scroll__2K8BQ .ybc-modal__modal-body-main-inner__1VNLz .ybc-modal__selector-btn-item__o9V0y:hover { background-color: #e0e9ff; } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-main__3caUo .ybc-modal__modal-body-main-scroll__2K8BQ .ybc-modal__modal-body-main-inner__1VNLz .ybc-modal__selector-btn-add__GFLQi:active, .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-main__3caUo .ybc-modal__modal-body-main-scroll__2K8BQ .ybc-modal__modal-body-main-inner__1VNLz .ybc-modal__selector-btn-item__o9V0y:active { background-color: #ccdaff; } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-main__3caUo .ybc-modal__modal-body-main-scroll__2K8BQ .ybc-modal__modal-body-main-inner__1VNLz .ybc-modal__selector-btn-add__GFLQi:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-main__3caUo .ybc-modal__modal-body-main-scroll__2K8BQ .ybc-modal__modal-body-main-inner__1VNLz .ybc-modal__selector-btn-add__GFLQi:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-main__3caUo .ybc-modal__modal-body-main-scroll__2K8BQ .ybc-modal__modal-body-main-inner__1VNLz .ybc-modal__selector-btn-add__GFLQi .ybc-modal__add-img__TMAJ_ { font-size: 28px; height: auto; margin-bottom: 8px; } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-main__3caUo .ybc-modal__modal-body-main-scroll__2K8BQ .ybc-modal__modal-body-main-inner__1VNLz .ybc-modal__selector-btn-add__GFLQi .ybc-modal__add-label__2H_IZ { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-main__3caUo .ybc-modal__modal-body-main-scroll__2K8BQ .ybc-modal__modal-body-main-inner__1VNLz .ybc-modal__selector-btn-item__o9V0y { justify-content: space-between; } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-main__3caUo .ybc-modal__modal-body-main-scroll__2K8BQ .ybc-modal__modal-body-main-inner__1VNLz .ybc-modal__selector-btn-item__o9V0y .ybc-modal__item-img__T_lug { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-main__3caUo .ybc-modal__modal-body-main-scroll__2K8BQ .ybc-modal__modal-body-main-inner__1VNLz .ybc-modal__selector-btn-item__o9V0y .ybc-modal__item-img__T_lug img { width: auto; height: 105px; } .ybc-modal__modal-body__2vQ8G .ybc-modal__modal-body-main__3caUo .ybc-modal__modal-body-main-scroll__2K8BQ .ybc-modal__modal-body-main-inner__1VNLz .ybc-modal__selector-btn-item__o9V0y .ybc-modal__item-label__11Et1 { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .ybc-modal__modal-footer__1nAmb { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .ybc-modal__selector-btn-add__GFLQi, .ybc-modal__selector-btn-item__o9V0y { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .ybc-modal__selector-btn-add__GFLQi { background-color: var(--selector-sprite-bg_primary); } .ybc-modal__selector-btn-add__GFLQi:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .ybc-modal__selector-btn-add__GFLQi:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .ybc-modal__selector-btn-add__GFLQi .ybc-modal__add-img__TMAJ_ { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .ybc-modal__selector-btn-add__GFLQi .ybc-modal__add-label__2H_IZ { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .ybc-modal__selector-btn-item__o9V0y { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .ybc-modal__selector-btn-item__o9V0y .ybc-modal__item-img__T_lug { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .ybc-modal__selector-btn-item__o9V0y .ybc-modal__item-img__T_lug img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .ybc-modal__selector-btn-item__o9V0y .ybc-modal__item-label__11Et1 { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .ybc-modal__selector-btn-item__o9V0y:hover { background-color: var(--selector-sprite-bg_primary); } .ybc-modal__selector-btn-item__o9V0y:hover .ybc-modal__item-img__T_lug { border-color: var(--selector-sprite-bg_primary); } .ybc-modal__selector-btn-item_selected__3HXAC { background-color: var(--selector-sprite-bg_primary); } .ybc-modal__selector-btn-item_selected__3HXAC .ybc-modal__item-img__T_lug { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .ybc-modal__menu-bar-btn__2exys { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .ybc-modal__menu-bar-btn_green__2dWII, .ybc-modal__menu-bar-btn_create__cKxE4 { background-color: #3cdc8f; } .ybc-modal__menu-bar-btn_green__2dWII:hover, .ybc-modal__menu-bar-btn_create__cKxE4:hover { background-color: #00d374; } .ybc-modal__menu-bar-btn_green__2dWII:active, .ybc-modal__menu-bar-btn_create__cKxE4:active { background-color: #00d374; } .ybc-modal__menu-bar-btn_save__QOMIT, .ybc-modal__menu-bar-btn_reset__2nnbW { background-color: #6ac8ff; } .ybc-modal__menu-bar-btn_save__QOMIT:hover, .ybc-modal__menu-bar-btn_reset__2nnbW:hover { background-color: #57bcfe; } .ybc-modal__menu-bar-btn_save__QOMIT:active, .ybc-modal__menu-bar-btn_reset__2nnbW:active { background-color: #4fb0fc; } .ybc-modal__menu-bar-btn_submit__2ybdA, .ybc-modal__menu-bar-btn_open__1TBdX { background-color: #ff9e23; } .ybc-modal__menu-bar-btn_submit__2ybdA:hover, .ybc-modal__menu-bar-btn_open__1TBdX:hover { background-color: #f47b04; } .ybc-modal__menu-bar-btn_submit__2ybdA:active, .ybc-modal__menu-bar-btn_open__1TBdX:active { background-color: #fe8f22; } .ybc-modal__menu-bar-btn_link__3ssRE { background-color: #e8efff; color: var(--theme-primary); } .ybc-modal__menu-bar-btn_link__3ssRE:hover { background-color: #b6c7ff; } .ybc-modal__menu-bar-btn_link__3ssRE:active { background-color: #cfdcff; } .ybc-modal__menu-bar-btn_disabled__3I6Nd { color: #565266; background-color: #e6e9ed; } .ybc-modal__menu-bar-btn_disabled__3I6Nd:hover { cursor: not-allowed; } .ybc-modal__menu-bar-btn_help__2F4Rp { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .ybc-modal__menu-bar-btn_help__2F4Rp:hover { background-color: #8398ff; } .ybc-modal__menu-bar-btn_help__2F4Rp:active { background-color: #8ca3ff; } .ybc-modal__menu-bar-separator__2mssT { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .ybc-modal__ybc-modal-mask__Nkmwd { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .ybc-modal__ybc-modal__3uI4j { width: 804px; height: 556px; background-color: #ffffff; border-radius: calc(12px); display: flex; flex-direction: column; } .ybc-modal__ybc-modal__3uI4j .ybc-modal__ybc-modal-header__37zy6 { display: flex; align-items: center; justify-content: center; width: 100%; height: 40px; position: relative; } .ybc-modal__ybc-modal__3uI4j .ybc-modal__ybc-modal-header__37zy6 .ybc-modal__ybc-modal-icon_close__3e14C { position: absolute; top: 0; bottom: 0; right: 20px; margin: auto; width: 14px; height: 14px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .ybc-modal__ybc-modal__3uI4j .ybc-modal__ybc-modal-header__37zy6 .ybc-modal__ybc-modal-icon_close__3e14C:hover { color: #98a2b4; } .ybc-modal__ybc-modal__3uI4j .ybc-modal__ybc-modal-body__kRW8- { flex: 1 0; } .train-nn-model__flex-center__3ZARb { display: flex; align-items: center; justify-content: center; } .train-nn-model__full-filled__74nix { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .train-nn-model__modal-mask__3GdBf { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .train-nn-model__modal-mask__3GdBf .train-nn-model__modal-wrap__3bA5a { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .train-nn-model__modal-mask__3GdBf .train-nn-model__modal-wrap__3bA5a .train-nn-model__modal-header-wrap__3E-XZ { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .train-nn-model__modal-mask__3GdBf .train-nn-model__modal-wrap__3bA5a .train-nn-model__modal-header-wrap__3E-XZ .train-nn-model__modal-header-bg__NdQXU { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .train-nn-model__modal-mask__3GdBf .train-nn-model__modal-wrap__3bA5a .train-nn-model__modal-header-wrap__3E-XZ .train-nn-model__modal-header-label__1sxqx { flex-shrink: 0; font-size: 16px; font-weight: bold; } .train-nn-model__modal-mask__3GdBf .train-nn-model__modal-wrap__3bA5a .train-nn-model__modal-header-wrap__3E-XZ .train-nn-model__modal-header-close__3WNrB { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .train-nn-model__modal-mask__3GdBf .train-nn-model__modal-wrap__3bA5a .train-nn-model__modal-header-wrap__3E-XZ .train-nn-model__modal-header-close__3WNrB:hover { color: #98a2b4; } .train-nn-model__modal-mask__3GdBf .train-nn-model__modal-wrap__3bA5a .train-nn-model__modal-body-wrap__29UD3 { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .train-nn-model__modal-mask__3GdBf .train-nn-model__modal-wrap__3bA5a .train-nn-model__modal-footer-wrap__3bEW4 { flex-shrink: 0; display: flex; } .train-nn-model__modal-header__3wHmT { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .train-nn-model__modal-header__3wHmT .train-nn-model__modal-header-upload__3Jep3 { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .train-nn-model__modal-header__3wHmT .train-nn-model__modal-header-upload__3Jep3:hover { background-color: #e0e9ff; } .train-nn-model__modal-header__3wHmT .train-nn-model__modal-header-upload__3Jep3:active { background-color: #ccdaff; } .train-nn-model__modal-header__3wHmT .train-nn-model__modal-header-upload__3Jep3 .train-nn-model__upload-img__3ewC_ { font-size: 16px; margin-right: calc(2px); } .train-nn-model__modal-header__3wHmT .train-nn-model__modal-header-upload__3Jep3 .train-nn-model__upload-label__3gsvR { font-size: 14px; } .train-nn-model__modal-header__3wHmT .train-nn-model__modal-header-upload__3Jep3 .train-nn-model__upload-input__3dWKC { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .train-nn-model__modal-header__3wHmT .train-nn-model__modal-header-search__3EY2R { position: relative; } .train-nn-model__modal-header__3wHmT .train-nn-model__modal-header-search__3EY2R .train-nn-model__search-input__2RbwJ { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .train-nn-model__modal-header__3wHmT .train-nn-model__modal-header-search__3EY2R .train-nn-model__search-input__2RbwJ::-webkit-input-placeholder { color: #98a2b4; } .train-nn-model__modal-header__3wHmT .train-nn-model__modal-header-search__3EY2R .train-nn-model__search-input__2RbwJ::-moz-placeholder { color: #98a2b4; } .train-nn-model__modal-header__3wHmT .train-nn-model__modal-header-search__3EY2R .train-nn-model__search-input__2RbwJ:-ms-input-placeholder { color: #98a2b4; } .train-nn-model__modal-header__3wHmT .train-nn-model__modal-header-search__3EY2R .train-nn-model__search-input__2RbwJ:hover { border-color: #d1d7e1; } .train-nn-model__modal-header__3wHmT .train-nn-model__modal-header-search__3EY2R .train-nn-model__search-input__2RbwJ:active { border-color: #d1d7e1; } .train-nn-model__modal-header__3wHmT .train-nn-model__modal-header-search__3EY2R .train-nn-model__search-img__2O-7r { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .train-nn-model__modal-body__VYiPO { flex-grow: 1; display: flex; } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-left__3mSD5, .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-main__10l0j { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-left__3mSD5 { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-left__3mSD5 .train-nn-model__modal-body-left-scroll__1dSSR { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-left__3mSD5 .train-nn-model__modal-body-left-scroll__1dSSR .train-nn-model__modal-body-left-inner__1LFzB { width: 121px; padding: calc(12px); color: #5e6b81; } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-left__3mSD5 .train-nn-model__modal-body-left-scroll__1dSSR .train-nn-model__modal-body-left-inner__1LFzB .train-nn-model__menu-item-current__2WIao { color: var(--theme-primary); background-color: #e0e9ff; } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-left__3mSD5 .train-nn-model__modal-body-left-scroll__1dSSR .train-nn-model__modal-body-left-inner__1LFzB .train-nn-model__menu-item__2k4Hd { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-left__3mSD5 .train-nn-model__modal-body-left-scroll__1dSSR .train-nn-model__modal-body-left-inner__1LFzB .train-nn-model__menu-item__2k4Hd:hover { background-color: #edeff5; } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-left__3mSD5 .train-nn-model__modal-body-left-scroll__1dSSR .train-nn-model__modal-body-left-inner__1LFzB .train-nn-model__menu-item__2k4Hd .train-nn-model__menu-item-img__22fvL { flex-shrink: 0; width: 20px; margin-right: 8px; } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-left__3mSD5 .train-nn-model__modal-body-left-scroll__1dSSR .train-nn-model__modal-body-left-inner__1LFzB .train-nn-model__menu-item__2k4Hd .train-nn-model__menu-item-label__17_6m { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-main__10l0j { padding: calc(12px) 0; } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-main__10l0j .train-nn-model__modal-body-main-scroll__SfeCN { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-main__10l0j .train-nn-model__modal-body-main-scroll__SfeCN .train-nn-model__modal-body-main-inner__1_gwo { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-main__10l0j .train-nn-model__modal-body-main-scroll__SfeCN .train-nn-model__modal-body-main-inner__1_gwo .train-nn-model__selector-btn-add__3LuZA, .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-main__10l0j .train-nn-model__modal-body-main-scroll__SfeCN .train-nn-model__modal-body-main-inner__1_gwo .train-nn-model__selector-btn-item__24dG1 { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-main__10l0j .train-nn-model__modal-body-main-scroll__SfeCN .train-nn-model__modal-body-main-inner__1_gwo .train-nn-model__selector-btn-add__3LuZA:hover, .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-main__10l0j .train-nn-model__modal-body-main-scroll__SfeCN .train-nn-model__modal-body-main-inner__1_gwo .train-nn-model__selector-btn-item__24dG1:hover { background-color: #e0e9ff; } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-main__10l0j .train-nn-model__modal-body-main-scroll__SfeCN .train-nn-model__modal-body-main-inner__1_gwo .train-nn-model__selector-btn-add__3LuZA:active, .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-main__10l0j .train-nn-model__modal-body-main-scroll__SfeCN .train-nn-model__modal-body-main-inner__1_gwo .train-nn-model__selector-btn-item__24dG1:active { background-color: #ccdaff; } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-main__10l0j .train-nn-model__modal-body-main-scroll__SfeCN .train-nn-model__modal-body-main-inner__1_gwo .train-nn-model__selector-btn-add__3LuZA:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-main__10l0j .train-nn-model__modal-body-main-scroll__SfeCN .train-nn-model__modal-body-main-inner__1_gwo .train-nn-model__selector-btn-add__3LuZA:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-main__10l0j .train-nn-model__modal-body-main-scroll__SfeCN .train-nn-model__modal-body-main-inner__1_gwo .train-nn-model__selector-btn-add__3LuZA .train-nn-model__add-img__3bJo8 { font-size: 28px; height: auto; margin-bottom: 8px; } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-main__10l0j .train-nn-model__modal-body-main-scroll__SfeCN .train-nn-model__modal-body-main-inner__1_gwo .train-nn-model__selector-btn-add__3LuZA .train-nn-model__add-label__3zWOI { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-main__10l0j .train-nn-model__modal-body-main-scroll__SfeCN .train-nn-model__modal-body-main-inner__1_gwo .train-nn-model__selector-btn-item__24dG1 { justify-content: space-between; } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-main__10l0j .train-nn-model__modal-body-main-scroll__SfeCN .train-nn-model__modal-body-main-inner__1_gwo .train-nn-model__selector-btn-item__24dG1 .train-nn-model__item-img__LKJk2 { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-main__10l0j .train-nn-model__modal-body-main-scroll__SfeCN .train-nn-model__modal-body-main-inner__1_gwo .train-nn-model__selector-btn-item__24dG1 .train-nn-model__item-img__LKJk2 img { width: auto; height: 105px; } .train-nn-model__modal-body__VYiPO .train-nn-model__modal-body-main__10l0j .train-nn-model__modal-body-main-scroll__SfeCN .train-nn-model__modal-body-main-inner__1_gwo .train-nn-model__selector-btn-item__24dG1 .train-nn-model__item-label__CRdyp { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .train-nn-model__modal-footer__liXPC { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .train-nn-model__selector-btn-add__3LuZA, .train-nn-model__selector-btn-item__24dG1 { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .train-nn-model__selector-btn-add__3LuZA { background-color: var(--selector-sprite-bg_primary); } .train-nn-model__selector-btn-add__3LuZA:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .train-nn-model__selector-btn-add__3LuZA:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .train-nn-model__selector-btn-add__3LuZA .train-nn-model__add-img__3bJo8 { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .train-nn-model__selector-btn-add__3LuZA .train-nn-model__add-label__3zWOI { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .train-nn-model__selector-btn-item__24dG1 { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .train-nn-model__selector-btn-item__24dG1 .train-nn-model__item-img__LKJk2 { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .train-nn-model__selector-btn-item__24dG1 .train-nn-model__item-img__LKJk2 img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .train-nn-model__selector-btn-item__24dG1 .train-nn-model__item-label__CRdyp { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .train-nn-model__selector-btn-item__24dG1:hover { background-color: var(--selector-sprite-bg_primary); } .train-nn-model__selector-btn-item__24dG1:hover .train-nn-model__item-img__LKJk2 { border-color: var(--selector-sprite-bg_primary); } .train-nn-model__selector-btn-item_selected__1abxf { background-color: var(--selector-sprite-bg_primary); } .train-nn-model__selector-btn-item_selected__1abxf .train-nn-model__item-img__LKJk2 { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .train-nn-model__menu-bar-btn__1yNMn { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .train-nn-model__menu-bar-btn_green__3l-lD, .train-nn-model__menu-bar-btn_create__1cMfV { background-color: #3cdc8f; } .train-nn-model__menu-bar-btn_green__3l-lD:hover, .train-nn-model__menu-bar-btn_create__1cMfV:hover { background-color: #00d374; } .train-nn-model__menu-bar-btn_green__3l-lD:active, .train-nn-model__menu-bar-btn_create__1cMfV:active { background-color: #00d374; } .train-nn-model__menu-bar-btn_save__IZuGh, .train-nn-model__menu-bar-btn_reset__1yLL1 { background-color: #6ac8ff; } .train-nn-model__menu-bar-btn_save__IZuGh:hover, .train-nn-model__menu-bar-btn_reset__1yLL1:hover { background-color: #57bcfe; } .train-nn-model__menu-bar-btn_save__IZuGh:active, .train-nn-model__menu-bar-btn_reset__1yLL1:active { background-color: #4fb0fc; } .train-nn-model__menu-bar-btn_submit__3juJY, .train-nn-model__menu-bar-btn_open__2N5yh { background-color: #ff9e23; } .train-nn-model__menu-bar-btn_submit__3juJY:hover, .train-nn-model__menu-bar-btn_open__2N5yh:hover { background-color: #f47b04; } .train-nn-model__menu-bar-btn_submit__3juJY:active, .train-nn-model__menu-bar-btn_open__2N5yh:active { background-color: #fe8f22; } .train-nn-model__menu-bar-btn_link__2enUU { background-color: #e8efff; color: var(--theme-primary); } .train-nn-model__menu-bar-btn_link__2enUU:hover { background-color: #b6c7ff; } .train-nn-model__menu-bar-btn_link__2enUU:active { background-color: #cfdcff; } .train-nn-model__menu-bar-btn_disabled__71rEC { color: #565266; background-color: #e6e9ed; } .train-nn-model__menu-bar-btn_disabled__71rEC:hover { cursor: not-allowed; } .train-nn-model__menu-bar-btn_help__sX2zp { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .train-nn-model__menu-bar-btn_help__sX2zp:hover { background-color: #8398ff; } .train-nn-model__menu-bar-btn_help__sX2zp:active { background-color: #8ca3ff; } .train-nn-model__menu-bar-separator__28qLH { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .train-nn-model__train-nn-model__173kG { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; border-radius: 0; } .train-nn-model__train-nn-model__173kG.train-nn-model__train-nn-model_hidden__3WdbZ { opacity: 0; pointer-events: none; } .train-nn-model__train-nn-model__173kG .train-nn-model__train-nn-model-header__30r-j { flex-shrink: 0; background-color: orange; color: #ffffff; font-size: 14px; height: 32px; } .train-nn-model__train-nn-model__173kG .train-nn-model__train-nn-model-header__30r-j .train-nn-model__train-nn-model-close__3NCSE { color: #ffffff; } .train-nn-model__train-nn-model__173kG .train-nn-model__train-nn-model-header__30r-j .train-nn-model__train-nn-model-close__3NCSE:hover { color: inherit; } .train-nn-model__train-nn-model__173kG .train-nn-model__train-nn-model-body__1Sv1x { flex: 1 0; display: flex; flex-direction: row; } .train-nn-model__train-nn-model__173kG .train-nn-model__train-nn-model-body__1Sv1x .train-nn-model__body-left__3oQbs { padding: 20px 0 0 20px; line-height: 1.5; } .train-nn-model__train-nn-model__173kG .train-nn-model__train-nn-model-body__1Sv1x .train-nn-model__body-left__3oQbs .train-nn-model__body-left-label__3mkl1 { color: #939393; font-size: 12px; margin-bottom: 2px; } .train-nn-model__train-nn-model__173kG .train-nn-model__train-nn-model-body__1Sv1x .train-nn-model__body-left__3oQbs .train-nn-model__body-left-value__1pIAd { color: #000000; font-size: 14px; margin-bottom: 2px; height: calc(27px); } .train-nn-model__train-nn-model__173kG .train-nn-model__train-nn-model-body__1Sv1x .train-nn-model__body-right__12e71 { flex: 1 0; position: relative; } .train-nn-model__train-nn-model__173kG .train-nn-model__train-nn-model-body__1Sv1x .train-nn-model__body-right__12e71 .train-nn-model__scatter-plot__pV9oU, .train-nn-model__train-nn-model__173kG .train-nn-model__train-nn-model-body__1Sv1x .train-nn-model__body-right__12e71 .train-nn-model__decision-boundary__Vfjun { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; display: flex; align-items: center; justify-content: center; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .stage-wrapper__flex-center__1-kYG { display: flex; align-items: center; justify-content: center; } .stage-wrapper__full-filled__3Bpyy { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .stage-wrapper__modal-mask__1TuNP { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .stage-wrapper__modal-mask__1TuNP .stage-wrapper__modal-wrap__lON13 { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .stage-wrapper__modal-mask__1TuNP .stage-wrapper__modal-wrap__lON13 .stage-wrapper__modal-header-wrap__340G1 { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .stage-wrapper__modal-mask__1TuNP .stage-wrapper__modal-wrap__lON13 .stage-wrapper__modal-header-wrap__340G1 .stage-wrapper__modal-header-bg__2T9-P { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .stage-wrapper__modal-mask__1TuNP .stage-wrapper__modal-wrap__lON13 .stage-wrapper__modal-header-wrap__340G1 .stage-wrapper__modal-header-label__3ClbU { flex-shrink: 0; font-size: 16px; font-weight: bold; } .stage-wrapper__modal-mask__1TuNP .stage-wrapper__modal-wrap__lON13 .stage-wrapper__modal-header-wrap__340G1 .stage-wrapper__modal-header-close__2tMNx { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .stage-wrapper__modal-mask__1TuNP .stage-wrapper__modal-wrap__lON13 .stage-wrapper__modal-header-wrap__340G1 .stage-wrapper__modal-header-close__2tMNx:hover { color: #98a2b4; } .stage-wrapper__modal-mask__1TuNP .stage-wrapper__modal-wrap__lON13 .stage-wrapper__modal-body-wrap__2DxTx { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .stage-wrapper__modal-mask__1TuNP .stage-wrapper__modal-wrap__lON13 .stage-wrapper__modal-footer-wrap__3Jl4g { flex-shrink: 0; display: flex; } .stage-wrapper__modal-header__33EpC { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .stage-wrapper__modal-header__33EpC .stage-wrapper__modal-header-upload__3g8XY { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .stage-wrapper__modal-header__33EpC .stage-wrapper__modal-header-upload__3g8XY:hover { background-color: #e0e9ff; } .stage-wrapper__modal-header__33EpC .stage-wrapper__modal-header-upload__3g8XY:active { background-color: #ccdaff; } .stage-wrapper__modal-header__33EpC .stage-wrapper__modal-header-upload__3g8XY .stage-wrapper__upload-img__3mzUi { font-size: 16px; margin-right: calc(2px); } .stage-wrapper__modal-header__33EpC .stage-wrapper__modal-header-upload__3g8XY .stage-wrapper__upload-label__2Ak90 { font-size: 14px; } .stage-wrapper__modal-header__33EpC .stage-wrapper__modal-header-upload__3g8XY .stage-wrapper__upload-input__1GI_9 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .stage-wrapper__modal-header__33EpC .stage-wrapper__modal-header-search__18Uku { position: relative; } .stage-wrapper__modal-header__33EpC .stage-wrapper__modal-header-search__18Uku .stage-wrapper__search-input__Y7_nm { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .stage-wrapper__modal-header__33EpC .stage-wrapper__modal-header-search__18Uku .stage-wrapper__search-input__Y7_nm::-webkit-input-placeholder { color: #98a2b4; } .stage-wrapper__modal-header__33EpC .stage-wrapper__modal-header-search__18Uku .stage-wrapper__search-input__Y7_nm::-moz-placeholder { color: #98a2b4; } .stage-wrapper__modal-header__33EpC .stage-wrapper__modal-header-search__18Uku .stage-wrapper__search-input__Y7_nm:-ms-input-placeholder { color: #98a2b4; } .stage-wrapper__modal-header__33EpC .stage-wrapper__modal-header-search__18Uku .stage-wrapper__search-input__Y7_nm:hover { border-color: #d1d7e1; } .stage-wrapper__modal-header__33EpC .stage-wrapper__modal-header-search__18Uku .stage-wrapper__search-input__Y7_nm:active { border-color: #d1d7e1; } .stage-wrapper__modal-header__33EpC .stage-wrapper__modal-header-search__18Uku .stage-wrapper__search-img__xInP5 { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .stage-wrapper__modal-body__Y-RK8 { flex-grow: 1; display: flex; } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-left__3ULiR, .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-main__5AeZp { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-left__3ULiR { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-left__3ULiR .stage-wrapper__modal-body-left-scroll__1Gfdd { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-left__3ULiR .stage-wrapper__modal-body-left-scroll__1Gfdd .stage-wrapper__modal-body-left-inner__3bT7v { width: 121px; padding: calc(12px); color: #5e6b81; } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-left__3ULiR .stage-wrapper__modal-body-left-scroll__1Gfdd .stage-wrapper__modal-body-left-inner__3bT7v .stage-wrapper__menu-item-current__3dVl1 { color: var(--theme-primary); background-color: #e0e9ff; } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-left__3ULiR .stage-wrapper__modal-body-left-scroll__1Gfdd .stage-wrapper__modal-body-left-inner__3bT7v .stage-wrapper__menu-item__34m6B { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-left__3ULiR .stage-wrapper__modal-body-left-scroll__1Gfdd .stage-wrapper__modal-body-left-inner__3bT7v .stage-wrapper__menu-item__34m6B:hover { background-color: #edeff5; } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-left__3ULiR .stage-wrapper__modal-body-left-scroll__1Gfdd .stage-wrapper__modal-body-left-inner__3bT7v .stage-wrapper__menu-item__34m6B .stage-wrapper__menu-item-img__2flW_ { flex-shrink: 0; width: 20px; margin-right: 8px; } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-left__3ULiR .stage-wrapper__modal-body-left-scroll__1Gfdd .stage-wrapper__modal-body-left-inner__3bT7v .stage-wrapper__menu-item__34m6B .stage-wrapper__menu-item-label__34Zu6 { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-main__5AeZp { padding: calc(12px) 0; } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-main__5AeZp .stage-wrapper__modal-body-main-scroll__SOD9Z { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-main__5AeZp .stage-wrapper__modal-body-main-scroll__SOD9Z .stage-wrapper__modal-body-main-inner__3BlSf { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-main__5AeZp .stage-wrapper__modal-body-main-scroll__SOD9Z .stage-wrapper__modal-body-main-inner__3BlSf .stage-wrapper__selector-btn-add__2xUQ2, .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-main__5AeZp .stage-wrapper__modal-body-main-scroll__SOD9Z .stage-wrapper__modal-body-main-inner__3BlSf .stage-wrapper__selector-btn-item__3DWE9 { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-main__5AeZp .stage-wrapper__modal-body-main-scroll__SOD9Z .stage-wrapper__modal-body-main-inner__3BlSf .stage-wrapper__selector-btn-add__2xUQ2:hover, .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-main__5AeZp .stage-wrapper__modal-body-main-scroll__SOD9Z .stage-wrapper__modal-body-main-inner__3BlSf .stage-wrapper__selector-btn-item__3DWE9:hover { background-color: #e0e9ff; } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-main__5AeZp .stage-wrapper__modal-body-main-scroll__SOD9Z .stage-wrapper__modal-body-main-inner__3BlSf .stage-wrapper__selector-btn-add__2xUQ2:active, .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-main__5AeZp .stage-wrapper__modal-body-main-scroll__SOD9Z .stage-wrapper__modal-body-main-inner__3BlSf .stage-wrapper__selector-btn-item__3DWE9:active { background-color: #ccdaff; } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-main__5AeZp .stage-wrapper__modal-body-main-scroll__SOD9Z .stage-wrapper__modal-body-main-inner__3BlSf .stage-wrapper__selector-btn-add__2xUQ2:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-main__5AeZp .stage-wrapper__modal-body-main-scroll__SOD9Z .stage-wrapper__modal-body-main-inner__3BlSf .stage-wrapper__selector-btn-add__2xUQ2:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-main__5AeZp .stage-wrapper__modal-body-main-scroll__SOD9Z .stage-wrapper__modal-body-main-inner__3BlSf .stage-wrapper__selector-btn-add__2xUQ2 .stage-wrapper__add-img__3_ynW { font-size: 28px; height: auto; margin-bottom: 8px; } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-main__5AeZp .stage-wrapper__modal-body-main-scroll__SOD9Z .stage-wrapper__modal-body-main-inner__3BlSf .stage-wrapper__selector-btn-add__2xUQ2 .stage-wrapper__add-label__EigFX { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-main__5AeZp .stage-wrapper__modal-body-main-scroll__SOD9Z .stage-wrapper__modal-body-main-inner__3BlSf .stage-wrapper__selector-btn-item__3DWE9 { justify-content: space-between; } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-main__5AeZp .stage-wrapper__modal-body-main-scroll__SOD9Z .stage-wrapper__modal-body-main-inner__3BlSf .stage-wrapper__selector-btn-item__3DWE9 .stage-wrapper__item-img__XMyQJ { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-main__5AeZp .stage-wrapper__modal-body-main-scroll__SOD9Z .stage-wrapper__modal-body-main-inner__3BlSf .stage-wrapper__selector-btn-item__3DWE9 .stage-wrapper__item-img__XMyQJ img { width: auto; height: 105px; } .stage-wrapper__modal-body__Y-RK8 .stage-wrapper__modal-body-main__5AeZp .stage-wrapper__modal-body-main-scroll__SOD9Z .stage-wrapper__modal-body-main-inner__3BlSf .stage-wrapper__selector-btn-item__3DWE9 .stage-wrapper__item-label__2twC8 { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .stage-wrapper__modal-footer__3HgBj { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .stage-wrapper__selector-btn-add__2xUQ2, .stage-wrapper__selector-btn-item__3DWE9 { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .stage-wrapper__selector-btn-add__2xUQ2 { background-color: var(--selector-sprite-bg_primary); } .stage-wrapper__selector-btn-add__2xUQ2:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .stage-wrapper__selector-btn-add__2xUQ2:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .stage-wrapper__selector-btn-add__2xUQ2 .stage-wrapper__add-img__3_ynW { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .stage-wrapper__selector-btn-add__2xUQ2 .stage-wrapper__add-label__EigFX { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .stage-wrapper__selector-btn-item__3DWE9 { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .stage-wrapper__selector-btn-item__3DWE9 .stage-wrapper__item-img__XMyQJ { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .stage-wrapper__selector-btn-item__3DWE9 .stage-wrapper__item-img__XMyQJ img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .stage-wrapper__selector-btn-item__3DWE9 .stage-wrapper__item-label__2twC8 { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .stage-wrapper__selector-btn-item__3DWE9:hover { background-color: var(--selector-sprite-bg_primary); } .stage-wrapper__selector-btn-item__3DWE9:hover .stage-wrapper__item-img__XMyQJ { border-color: var(--selector-sprite-bg_primary); } .stage-wrapper__selector-btn-item_selected__15FIr { background-color: var(--selector-sprite-bg_primary); } .stage-wrapper__selector-btn-item_selected__15FIr .stage-wrapper__item-img__XMyQJ { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .stage-wrapper__menu-bar-btn__34l3n { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .stage-wrapper__menu-bar-btn_green__3OVu4, .stage-wrapper__menu-bar-btn_create__3IYec { background-color: #3cdc8f; } .stage-wrapper__menu-bar-btn_green__3OVu4:hover, .stage-wrapper__menu-bar-btn_create__3IYec:hover { background-color: #00d374; } .stage-wrapper__menu-bar-btn_green__3OVu4:active, .stage-wrapper__menu-bar-btn_create__3IYec:active { background-color: #00d374; } .stage-wrapper__menu-bar-btn_save__ouS2N, .stage-wrapper__menu-bar-btn_reset__1ksZ3 { background-color: #6ac8ff; } .stage-wrapper__menu-bar-btn_save__ouS2N:hover, .stage-wrapper__menu-bar-btn_reset__1ksZ3:hover { background-color: #57bcfe; } .stage-wrapper__menu-bar-btn_save__ouS2N:active, .stage-wrapper__menu-bar-btn_reset__1ksZ3:active { background-color: #4fb0fc; } .stage-wrapper__menu-bar-btn_submit__3uSz3, .stage-wrapper__menu-bar-btn_open__2PWQH { background-color: #ff9e23; } .stage-wrapper__menu-bar-btn_submit__3uSz3:hover, .stage-wrapper__menu-bar-btn_open__2PWQH:hover { background-color: #f47b04; } .stage-wrapper__menu-bar-btn_submit__3uSz3:active, .stage-wrapper__menu-bar-btn_open__2PWQH:active { background-color: #fe8f22; } .stage-wrapper__menu-bar-btn_link__2exjB { background-color: #e8efff; color: var(--theme-primary); } .stage-wrapper__menu-bar-btn_link__2exjB:hover { background-color: #b6c7ff; } .stage-wrapper__menu-bar-btn_link__2exjB:active { background-color: #cfdcff; } .stage-wrapper__menu-bar-btn_disabled__80Ln9 { color: #565266; background-color: #e6e9ed; } .stage-wrapper__menu-bar-btn_disabled__80Ln9:hover { cursor: not-allowed; } .stage-wrapper__menu-bar-btn_help__28a2Y { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .stage-wrapper__menu-bar-btn_help__28a2Y:hover { background-color: #8398ff; } .stage-wrapper__menu-bar-btn_help__28a2Y:active { background-color: #8ca3ff; } .stage-wrapper__menu-bar-separator__kYdCc { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .stage-wrapper__stage-wrapper__KbJr6 * { box-sizing: border-box; } .stage-wrapper__stage-wrapper__KbJr6.stage-wrapper__full-screen__hpVOD { position: fixed; top: 40px; left: 0; right: 0; bottom: 0; z-index: 5000; background-color: #ffffff; /* spacing between stage and control bar (on the top), or between stage and window edges (on left/right/bottom) */ padding: 0.1875rem; /* this centers the stage */ display: flex; flex-direction: column; align-items: center; } .stage-wrapper__stage-wrapper__KbJr6.stage-wrapper__full-screen__hpVOD.stage-wrapper__is-mobile__3dJc0, .stage-wrapper__stage-wrapper__KbJr6.stage-wrapper__full-screen__hpVOD.stage-wrapper__is-kid__5HCDn { position: relative !important; top: 0; padding: 0; background-color: transparent !important; } .stage-wrapper__stage-wrapper__KbJr6.stage-wrapper__full-screen__hpVOD.stage-wrapper__is-jr__mYRdx { display: flex; align-items: center; justify-content: center; width: var(--page-width); height: var(--page-height); position: fixed; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.8); z-index: 1050; } .stage-wrapper__stage-wrapper__KbJr6.stage-wrapper__full-screen__hpVOD.stage-wrapper__is-jr__mYRdx .stage-wrapper__jr-fullscreen-control__1d0xw { display: flex; align-items: center; justify-content: center; flex-direction: column; position: absolute; right: -5.25rem; bottom: 0; } .stage-wrapper__stage-wrapper__KbJr6.stage-wrapper__full-screen__hpVOD.stage-wrapper__is-jr__mYRdx .stage-wrapper__jr-fullscreen-control__1d0xw .stage-wrapper__jr-btn_shrink__niC6Z, .stage-wrapper__stage-wrapper__KbJr6.stage-wrapper__full-screen__hpVOD.stage-wrapper__is-jr__mYRdx .stage-wrapper__jr-fullscreen-control__1d0xw .stage-wrapper__jr-btn_start__9eKbc, .stage-wrapper__stage-wrapper__KbJr6.stage-wrapper__full-screen__hpVOD.stage-wrapper__is-jr__mYRdx .stage-wrapper__jr-fullscreen-control__1d0xw .stage-wrapper__jr-btn_stop__x5CgE { display: flex; align-items: center; justify-content: center; background-color: #ffffff; width: 4.38rem; height: 2.75rem; border: 2px solid transparent; border-radius: 2.75rem; } .stage-wrapper__stage-wrapper__KbJr6.stage-wrapper__full-screen__hpVOD.stage-wrapper__is-jr__mYRdx .stage-wrapper__jr-fullscreen-control__1d0xw .stage-wrapper__jr-btn_shrink__niC6Z { border-color: #00a6ec; margin-bottom: 0.75rem; } .stage-wrapper__stage-wrapper__KbJr6.stage-wrapper__full-screen__hpVOD.stage-wrapper__is-jr__mYRdx .stage-wrapper__jr-fullscreen-control__1d0xw .stage-wrapper__jr-btn_shrink__niC6Z .stage-wrapper__jr-btn-img__1TIpT { font-size: 1.8rem; color: #00a6ec; } .stage-wrapper__stage-wrapper__KbJr6.stage-wrapper__full-screen__hpVOD.stage-wrapper__is-jr__mYRdx .stage-wrapper__jr-fullscreen-control__1d0xw .stage-wrapper__jr-btn_stop__x5CgE { border-color: #ff666d; } .stage-wrapper__stage-wrapper__KbJr6.stage-wrapper__full-screen__hpVOD.stage-wrapper__is-jr__mYRdx .stage-wrapper__jr-fullscreen-control__1d0xw .stage-wrapper__jr-btn_stop__x5CgE .stage-wrapper__jr-btn-img__1TIpT { width: 1.2rem; height: 1.2rem; background-color: #ff666d; border-radius: 2px; } .stage-wrapper__stage-wrapper__KbJr6.stage-wrapper__full-screen__hpVOD.stage-wrapper__is-jr__mYRdx .stage-wrapper__jr-fullscreen-control__1d0xw .stage-wrapper__jr-btn_start__9eKbc { border-color: #0fce72; } .stage-wrapper__stage-wrapper__KbJr6.stage-wrapper__full-screen__hpVOD.stage-wrapper__is-jr__mYRdx .stage-wrapper__jr-fullscreen-control__1d0xw .stage-wrapper__jr-btn_start__9eKbc .stage-wrapper__jr-btn-img__1TIpT { width: 1.7rem; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .menu-bar_jr__flex-center__3cW_h { display: flex; align-items: center; justify-content: center; } .menu-bar_jr__full-filled__1ysgX { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .menu-bar_jr__modal-mask__2si9D { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .menu-bar_jr__modal-mask__2si9D .menu-bar_jr__modal-wrap__3UXEN { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .menu-bar_jr__modal-mask__2si9D .menu-bar_jr__modal-wrap__3UXEN .menu-bar_jr__modal-header-wrap__3XQSQ { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .menu-bar_jr__modal-mask__2si9D .menu-bar_jr__modal-wrap__3UXEN .menu-bar_jr__modal-header-wrap__3XQSQ .menu-bar_jr__modal-header-bg__3dWNY { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .menu-bar_jr__modal-mask__2si9D .menu-bar_jr__modal-wrap__3UXEN .menu-bar_jr__modal-header-wrap__3XQSQ .menu-bar_jr__modal-header-label__2kMKp { flex-shrink: 0; font-size: 16px; font-weight: bold; } .menu-bar_jr__modal-mask__2si9D .menu-bar_jr__modal-wrap__3UXEN .menu-bar_jr__modal-header-wrap__3XQSQ .menu-bar_jr__modal-header-close__3_H5O { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .menu-bar_jr__modal-mask__2si9D .menu-bar_jr__modal-wrap__3UXEN .menu-bar_jr__modal-header-wrap__3XQSQ .menu-bar_jr__modal-header-close__3_H5O:hover { color: #98a2b4; } .menu-bar_jr__modal-mask__2si9D .menu-bar_jr__modal-wrap__3UXEN .menu-bar_jr__modal-body-wrap__37tnO { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .menu-bar_jr__modal-mask__2si9D .menu-bar_jr__modal-wrap__3UXEN .menu-bar_jr__modal-footer-wrap__2qvnT { flex-shrink: 0; display: flex; } .menu-bar_jr__modal-header__3jTRj { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .menu-bar_jr__modal-header__3jTRj .menu-bar_jr__modal-header-upload__WGlvP { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .menu-bar_jr__modal-header__3jTRj .menu-bar_jr__modal-header-upload__WGlvP:hover { background-color: #e0e9ff; } .menu-bar_jr__modal-header__3jTRj .menu-bar_jr__modal-header-upload__WGlvP:active { background-color: #ccdaff; } .menu-bar_jr__modal-header__3jTRj .menu-bar_jr__modal-header-upload__WGlvP .menu-bar_jr__upload-img__1cjef { font-size: 16px; margin-right: calc(2px); } .menu-bar_jr__modal-header__3jTRj .menu-bar_jr__modal-header-upload__WGlvP .menu-bar_jr__upload-label__3-mwh { font-size: 14px; } .menu-bar_jr__modal-header__3jTRj .menu-bar_jr__modal-header-upload__WGlvP .menu-bar_jr__upload-input__PP3AS { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .menu-bar_jr__modal-header__3jTRj .menu-bar_jr__modal-header-search__q8D2l { position: relative; } .menu-bar_jr__modal-header__3jTRj .menu-bar_jr__modal-header-search__q8D2l .menu-bar_jr__search-input__2adPW { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .menu-bar_jr__modal-header__3jTRj .menu-bar_jr__modal-header-search__q8D2l .menu-bar_jr__search-input__2adPW::-webkit-input-placeholder { color: #98a2b4; } .menu-bar_jr__modal-header__3jTRj .menu-bar_jr__modal-header-search__q8D2l .menu-bar_jr__search-input__2adPW::-moz-placeholder { color: #98a2b4; } .menu-bar_jr__modal-header__3jTRj .menu-bar_jr__modal-header-search__q8D2l .menu-bar_jr__search-input__2adPW:-ms-input-placeholder { color: #98a2b4; } .menu-bar_jr__modal-header__3jTRj .menu-bar_jr__modal-header-search__q8D2l .menu-bar_jr__search-input__2adPW:hover { border-color: #d1d7e1; } .menu-bar_jr__modal-header__3jTRj .menu-bar_jr__modal-header-search__q8D2l .menu-bar_jr__search-input__2adPW:active { border-color: #d1d7e1; } .menu-bar_jr__modal-header__3jTRj .menu-bar_jr__modal-header-search__q8D2l .menu-bar_jr__search-img__1yyLC { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .menu-bar_jr__modal-body__37mXu { flex-grow: 1; display: flex; } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-left__2EM70, .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-main__27jcG { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-left__2EM70 { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-left__2EM70 .menu-bar_jr__modal-body-left-scroll__1SF7d { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-left__2EM70 .menu-bar_jr__modal-body-left-scroll__1SF7d .menu-bar_jr__modal-body-left-inner__3rpOO { width: 121px; padding: calc(12px); color: #5e6b81; } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-left__2EM70 .menu-bar_jr__modal-body-left-scroll__1SF7d .menu-bar_jr__modal-body-left-inner__3rpOO .menu-bar_jr__menu-item-current__2QSBC { color: var(--theme-primary); background-color: #e0e9ff; } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-left__2EM70 .menu-bar_jr__modal-body-left-scroll__1SF7d .menu-bar_jr__modal-body-left-inner__3rpOO .menu-bar_jr__menu-item__1f9hv { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-left__2EM70 .menu-bar_jr__modal-body-left-scroll__1SF7d .menu-bar_jr__modal-body-left-inner__3rpOO .menu-bar_jr__menu-item__1f9hv:hover { background-color: #edeff5; } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-left__2EM70 .menu-bar_jr__modal-body-left-scroll__1SF7d .menu-bar_jr__modal-body-left-inner__3rpOO .menu-bar_jr__menu-item__1f9hv .menu-bar_jr__menu-item-img__FN-Xg { flex-shrink: 0; width: 20px; margin-right: 8px; } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-left__2EM70 .menu-bar_jr__modal-body-left-scroll__1SF7d .menu-bar_jr__modal-body-left-inner__3rpOO .menu-bar_jr__menu-item__1f9hv .menu-bar_jr__menu-item-label__2SUxH { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-main__27jcG { padding: calc(12px) 0; } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-main__27jcG .menu-bar_jr__modal-body-main-scroll__cM4S0 { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-main__27jcG .menu-bar_jr__modal-body-main-scroll__cM4S0 .menu-bar_jr__modal-body-main-inner__2SFlg { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-main__27jcG .menu-bar_jr__modal-body-main-scroll__cM4S0 .menu-bar_jr__modal-body-main-inner__2SFlg .menu-bar_jr__selector-btn-add__2QvmA, .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-main__27jcG .menu-bar_jr__modal-body-main-scroll__cM4S0 .menu-bar_jr__modal-body-main-inner__2SFlg .menu-bar_jr__selector-btn-item__2odPO { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-main__27jcG .menu-bar_jr__modal-body-main-scroll__cM4S0 .menu-bar_jr__modal-body-main-inner__2SFlg .menu-bar_jr__selector-btn-add__2QvmA:hover, .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-main__27jcG .menu-bar_jr__modal-body-main-scroll__cM4S0 .menu-bar_jr__modal-body-main-inner__2SFlg .menu-bar_jr__selector-btn-item__2odPO:hover { background-color: #e0e9ff; } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-main__27jcG .menu-bar_jr__modal-body-main-scroll__cM4S0 .menu-bar_jr__modal-body-main-inner__2SFlg .menu-bar_jr__selector-btn-add__2QvmA:active, .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-main__27jcG .menu-bar_jr__modal-body-main-scroll__cM4S0 .menu-bar_jr__modal-body-main-inner__2SFlg .menu-bar_jr__selector-btn-item__2odPO:active { background-color: #ccdaff; } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-main__27jcG .menu-bar_jr__modal-body-main-scroll__cM4S0 .menu-bar_jr__modal-body-main-inner__2SFlg .menu-bar_jr__selector-btn-add__2QvmA:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-main__27jcG .menu-bar_jr__modal-body-main-scroll__cM4S0 .menu-bar_jr__modal-body-main-inner__2SFlg .menu-bar_jr__selector-btn-add__2QvmA:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-main__27jcG .menu-bar_jr__modal-body-main-scroll__cM4S0 .menu-bar_jr__modal-body-main-inner__2SFlg .menu-bar_jr__selector-btn-add__2QvmA .menu-bar_jr__add-img__g8V3X { font-size: 28px; height: auto; margin-bottom: 8px; } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-main__27jcG .menu-bar_jr__modal-body-main-scroll__cM4S0 .menu-bar_jr__modal-body-main-inner__2SFlg .menu-bar_jr__selector-btn-add__2QvmA .menu-bar_jr__add-label__2ZjFs { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-main__27jcG .menu-bar_jr__modal-body-main-scroll__cM4S0 .menu-bar_jr__modal-body-main-inner__2SFlg .menu-bar_jr__selector-btn-item__2odPO { justify-content: space-between; } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-main__27jcG .menu-bar_jr__modal-body-main-scroll__cM4S0 .menu-bar_jr__modal-body-main-inner__2SFlg .menu-bar_jr__selector-btn-item__2odPO .menu-bar_jr__item-img__3aSI_ { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-main__27jcG .menu-bar_jr__modal-body-main-scroll__cM4S0 .menu-bar_jr__modal-body-main-inner__2SFlg .menu-bar_jr__selector-btn-item__2odPO .menu-bar_jr__item-img__3aSI_ img { width: auto; height: 105px; } .menu-bar_jr__modal-body__37mXu .menu-bar_jr__modal-body-main__27jcG .menu-bar_jr__modal-body-main-scroll__cM4S0 .menu-bar_jr__modal-body-main-inner__2SFlg .menu-bar_jr__selector-btn-item__2odPO .menu-bar_jr__item-label__Nzia0 { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .menu-bar_jr__modal-footer__gotxh { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .menu-bar_jr__selector-btn-add__2QvmA, .menu-bar_jr__selector-btn-item__2odPO { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .menu-bar_jr__selector-btn-add__2QvmA { background-color: var(--selector-sprite-bg_primary); } .menu-bar_jr__selector-btn-add__2QvmA:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .menu-bar_jr__selector-btn-add__2QvmA:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .menu-bar_jr__selector-btn-add__2QvmA .menu-bar_jr__add-img__g8V3X { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .menu-bar_jr__selector-btn-add__2QvmA .menu-bar_jr__add-label__2ZjFs { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .menu-bar_jr__selector-btn-item__2odPO { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .menu-bar_jr__selector-btn-item__2odPO .menu-bar_jr__item-img__3aSI_ { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .menu-bar_jr__selector-btn-item__2odPO .menu-bar_jr__item-img__3aSI_ img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .menu-bar_jr__selector-btn-item__2odPO .menu-bar_jr__item-label__Nzia0 { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .menu-bar_jr__selector-btn-item__2odPO:hover { background-color: var(--selector-sprite-bg_primary); } .menu-bar_jr__selector-btn-item__2odPO:hover .menu-bar_jr__item-img__3aSI_ { border-color: var(--selector-sprite-bg_primary); } .menu-bar_jr__selector-btn-item_selected__3-zLB { background-color: var(--selector-sprite-bg_primary); } .menu-bar_jr__selector-btn-item_selected__3-zLB .menu-bar_jr__item-img__3aSI_ { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .menu-bar_jr__menu-bar-btn__1J_uk { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .menu-bar_jr__menu-bar-btn_green__3HWis, .menu-bar_jr__menu-bar-btn_create__Q4nIM { background-color: #3cdc8f; } .menu-bar_jr__menu-bar-btn_green__3HWis:hover, .menu-bar_jr__menu-bar-btn_create__Q4nIM:hover { background-color: #00d374; } .menu-bar_jr__menu-bar-btn_green__3HWis:active, .menu-bar_jr__menu-bar-btn_create__Q4nIM:active { background-color: #00d374; } .menu-bar_jr__menu-bar-btn_save__Xl7p6, .menu-bar_jr__menu-bar-btn_reset__f04sc { background-color: #6ac8ff; } .menu-bar_jr__menu-bar-btn_save__Xl7p6:hover, .menu-bar_jr__menu-bar-btn_reset__f04sc:hover { background-color: #57bcfe; } .menu-bar_jr__menu-bar-btn_save__Xl7p6:active, .menu-bar_jr__menu-bar-btn_reset__f04sc:active { background-color: #4fb0fc; } .menu-bar_jr__menu-bar-btn_submit__2U13x, .menu-bar_jr__menu-bar-btn_open__3PAFP { background-color: #ff9e23; } .menu-bar_jr__menu-bar-btn_submit__2U13x:hover, .menu-bar_jr__menu-bar-btn_open__3PAFP:hover { background-color: #f47b04; } .menu-bar_jr__menu-bar-btn_submit__2U13x:active, .menu-bar_jr__menu-bar-btn_open__3PAFP:active { background-color: #fe8f22; } .menu-bar_jr__menu-bar-btn_link__3Ti86 { background-color: #e8efff; color: var(--theme-primary); } .menu-bar_jr__menu-bar-btn_link__3Ti86:hover { background-color: #b6c7ff; } .menu-bar_jr__menu-bar-btn_link__3Ti86:active { background-color: #cfdcff; } .menu-bar_jr__menu-bar-btn_disabled__3s9DF { color: #565266; background-color: #e6e9ed; } .menu-bar_jr__menu-bar-btn_disabled__3s9DF:hover { cursor: not-allowed; } .menu-bar_jr__menu-bar-btn_help__1O3rE { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .menu-bar_jr__menu-bar-btn_help__1O3rE:hover { background-color: #8398ff; } .menu-bar_jr__menu-bar-btn_help__1O3rE:active { background-color: #8ca3ff; } .menu-bar_jr__menu-bar-separator__f7ZYA { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .menu-bar_jr__menu-bar_jr__e2FLy { display: flex; justify-content: space-between; align-items: center; width: 100%; height: var(--menu-bar-height); flex-shrink: 0; background-position: left; background-size: auto var(--menu-bar-height); background-repeat: repeat; background-color: var(--menu-bar-bg-color); /* 菜单栏左侧 */ /* 菜单栏右侧 */ } .menu-bar_jr__menu-bar_jr__e2FLy .menu-bar_jr__main-menu-left__2_2JN { width: 100%; display: flex; justify-content: flex-start; align-items: center; } .menu-bar_jr__menu-bar_jr__e2FLy .menu-bar_jr__main-menu-right__2--A5 { display: flex; justify-content: flex-start; align-items: center; } .menu-bar_jr__menu-bar_jr__e2FLy .menu-bar_jr__menu-bar-btn_jr__37ugg { display: flex; align-items: center; justify-content: center; min-width: 2rem; height: 2rem; flex-shrink: 0; color: #ffffff; background-color: #00a6ec; border-radius: 3.12rem; margin-right: 0.75rem; } @media (any-hover: hover) { .menu-bar_jr__menu-bar_jr__e2FLy .menu-bar_jr__menu-bar-btn_jr__37ugg:hover { background-color: #ffffff; color: #00a6ec; } .menu-bar_jr__menu-bar_jr__e2FLy .menu-bar_jr__menu-bar-btn_jr__37ugg:hover .menu-bar_jr__menu-bar-btn-icon-wrap__1ftir { background-color: #00a6ec; } .menu-bar_jr__menu-bar_jr__e2FLy .menu-bar_jr__menu-bar-btn_jr__37ugg:hover .menu-bar_jr__menu-bar-btn-icon-wrap__1ftir .menu-bar_jr__menu-bar-btn-icon__X6SIV { color: #ffffff; } } .menu-bar_jr__menu-bar_jr__e2FLy .menu-bar_jr__menu-bar-btn_jr__37ugg .menu-bar_jr__menu-bar-btn-icon-wrap__1ftir { display: flex; align-items: center; justify-content: center; pointer-events: none; width: 1.38rem; height: 1.38rem; font-size: 1rem; border-radius: 50%; background-color: #ffffff; } .menu-bar_jr__menu-bar_jr__e2FLy .menu-bar_jr__menu-bar-btn_jr__37ugg .menu-bar_jr__menu-bar-btn-icon-wrap__1ftir .menu-bar_jr__menu-bar-btn-icon__X6SIV { color: #00d44a; } .menu-bar_jr__menu-bar_jr__e2FLy .menu-bar_jr__menu-bar-btn_jr__37ugg .menu-bar_jr__menu-bar-btn-icon__X6SIV { font-size: 1.25rem; } .menu-bar_jr__menu-bar_jr__e2FLy .menu-bar_jr__menu-bar-btn_jr__37ugg .menu-bar_jr__menu-bar-btn-text__2_yi5 { font-size: 0.88rem; font-weight: 600; line-height: 2rem; white-space: nowrap; margin-left: 0.4rem; } .menu-bar_jr__menu-bar_jr__e2FLy .menu-bar_jr__menu-bar-btn_jr__37ugg.menu-bar_jr__menu-bar-btn_save__Xl7p6 { width: 7rem; } .menu-bar_jr__menu-bar_jr__e2FLy .menu-bar_jr__menu-bar-btn_jr__37ugg.menu-bar_jr__menu-bar-btn_save_iPad__1sJph { color: #00d44a; background-color: #ffffff; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .watermark__watermark__5WxHV { max-width: 66px; max-height: 66px; pointer-events: none; position: absolute; top: 8px; right: 8px; } .watermark__watermark__5WxHV .watermark__sprite-image__eBppu { width: 100%; height: auto; margin: auto; opacity: 0.35; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* typography start */ body { font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; } h2 { font-size: 1.5rem; font-weight: bold; } p { font-size: 1rem; line-height: 1.5em; } input, button, select, optgroup, textarea { line-height: normal; } /* typography end */ .webgl-modal__modal-overlay__2uzfE { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 1050; background-color: rgba(0, 0, 0, 0.64); } .webgl-modal__modal-content__2tAxj { margin: 100px auto; outline: none; border: 0.25rem solid rgba(255, 255, 255, 0.25); padding: 0; border-radius: calc(4px); width: 500px; color: #565266; overflow: hidden; } .webgl-modal__illustration__1lzKN { width: 100%; height: 208px; background-color: var(--theme-primary); background-size: cover; } [dir='rtl'] .webgl-modal__illustration__1lzKN { transform: scaleX(-1); } .webgl-modal__body__2enqv { background: #ffffff; padding: 1.5rem 2.25rem; text-align: center; } /* Confirmation buttons at the bottom of the modal */ .webgl-modal__button-row__24w4m { margin: 1.5rem 0; font-weight: bolder; text-align: right; display: flex; justify-content: center; } .webgl-modal__button-row__24w4m button { border: 1px solid var(--theme-primary); border-radius: 0.25rem; padding: 0.5rem 2rem; background: var(--theme-primary); color: white; font-weight: bold; font-size: 0.875rem; } .webgl-modal__faq-link-text__1k6eW { margin: 2rem 0 0.5rem 0; font-size: 0.875rem; color: #565266; } .webgl-modal__faq-link__eSf4P { color: var(--theme-primary); text-decoration: none; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .drag-layer__drag-layer__16Tm6 { position: fixed; pointer-events: none; z-index: 1000; left: 0; top: 0; width: 100%; height: 100%; direction: ltr; } .drag-layer__image-wrapper__3HGyz { /* Absolute allows wrapper to snuggly fit image */ position: absolute; } .drag-layer__image__1bLcv { max-width: 80px; max-height: 80px; min-width: 50px; min-height: 50px; /* Center the dragging image on the given position */ margin-left: -50%; margin-top: -50%; padding: 0.25rem; border: 2px solid var(--theme-primary); background: #ffffff; border-radius: 0.5rem; /* Use the same drop shadow as stage dragging */ box-shadow: 5px 5px 5px #e8efff; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .workspace-overlay__flex-center__2nT6I { display: flex; align-items: center; justify-content: center; } .workspace-overlay__full-filled__2Sy8o { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .workspace-overlay__modal-mask__bPT2B { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .workspace-overlay__modal-mask__bPT2B .workspace-overlay__modal-wrap__3mJP3 { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .workspace-overlay__modal-mask__bPT2B .workspace-overlay__modal-wrap__3mJP3 .workspace-overlay__modal-header-wrap__3XxIG { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .workspace-overlay__modal-mask__bPT2B .workspace-overlay__modal-wrap__3mJP3 .workspace-overlay__modal-header-wrap__3XxIG .workspace-overlay__modal-header-bg__24nj5 { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .workspace-overlay__modal-mask__bPT2B .workspace-overlay__modal-wrap__3mJP3 .workspace-overlay__modal-header-wrap__3XxIG .workspace-overlay__modal-header-label__ZsJTi { flex-shrink: 0; font-size: 16px; font-weight: bold; } .workspace-overlay__modal-mask__bPT2B .workspace-overlay__modal-wrap__3mJP3 .workspace-overlay__modal-header-wrap__3XxIG .workspace-overlay__modal-header-close__DDSdL { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .workspace-overlay__modal-mask__bPT2B .workspace-overlay__modal-wrap__3mJP3 .workspace-overlay__modal-header-wrap__3XxIG .workspace-overlay__modal-header-close__DDSdL:hover { color: #98a2b4; } .workspace-overlay__modal-mask__bPT2B .workspace-overlay__modal-wrap__3mJP3 .workspace-overlay__modal-body-wrap__1Z6Bo { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .workspace-overlay__modal-mask__bPT2B .workspace-overlay__modal-wrap__3mJP3 .workspace-overlay__modal-footer-wrap__VatwW { flex-shrink: 0; display: flex; } .workspace-overlay__modal-header__8pJ4j { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .workspace-overlay__modal-header__8pJ4j .workspace-overlay__modal-header-upload__2yTss { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .workspace-overlay__modal-header__8pJ4j .workspace-overlay__modal-header-upload__2yTss:hover { background-color: #e0e9ff; } .workspace-overlay__modal-header__8pJ4j .workspace-overlay__modal-header-upload__2yTss:active { background-color: #ccdaff; } .workspace-overlay__modal-header__8pJ4j .workspace-overlay__modal-header-upload__2yTss .workspace-overlay__upload-img__RxFOr { font-size: 16px; margin-right: calc(2px); } .workspace-overlay__modal-header__8pJ4j .workspace-overlay__modal-header-upload__2yTss .workspace-overlay__upload-label__1971u { font-size: 14px; } .workspace-overlay__modal-header__8pJ4j .workspace-overlay__modal-header-upload__2yTss .workspace-overlay__upload-input__24vTX { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .workspace-overlay__modal-header__8pJ4j .workspace-overlay__modal-header-search__3mCbd { position: relative; } .workspace-overlay__modal-header__8pJ4j .workspace-overlay__modal-header-search__3mCbd .workspace-overlay__search-input__1VIx1 { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .workspace-overlay__modal-header__8pJ4j .workspace-overlay__modal-header-search__3mCbd .workspace-overlay__search-input__1VIx1::-webkit-input-placeholder { color: #98a2b4; } .workspace-overlay__modal-header__8pJ4j .workspace-overlay__modal-header-search__3mCbd .workspace-overlay__search-input__1VIx1::-moz-placeholder { color: #98a2b4; } .workspace-overlay__modal-header__8pJ4j .workspace-overlay__modal-header-search__3mCbd .workspace-overlay__search-input__1VIx1:-ms-input-placeholder { color: #98a2b4; } .workspace-overlay__modal-header__8pJ4j .workspace-overlay__modal-header-search__3mCbd .workspace-overlay__search-input__1VIx1:hover { border-color: #d1d7e1; } .workspace-overlay__modal-header__8pJ4j .workspace-overlay__modal-header-search__3mCbd .workspace-overlay__search-input__1VIx1:active { border-color: #d1d7e1; } .workspace-overlay__modal-header__8pJ4j .workspace-overlay__modal-header-search__3mCbd .workspace-overlay__search-img__NY_yg { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .workspace-overlay__modal-body__1jpWd { flex-grow: 1; display: flex; } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-left__2qWI_, .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-main__21_82 { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-left__2qWI_ { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-left__2qWI_ .workspace-overlay__modal-body-left-scroll__ZGiJ6 { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-left__2qWI_ .workspace-overlay__modal-body-left-scroll__ZGiJ6 .workspace-overlay__modal-body-left-inner__1k6o2 { width: 121px; padding: calc(12px); color: #5e6b81; } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-left__2qWI_ .workspace-overlay__modal-body-left-scroll__ZGiJ6 .workspace-overlay__modal-body-left-inner__1k6o2 .workspace-overlay__menu-item-current__2buac { color: var(--theme-primary); background-color: #e0e9ff; } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-left__2qWI_ .workspace-overlay__modal-body-left-scroll__ZGiJ6 .workspace-overlay__modal-body-left-inner__1k6o2 .workspace-overlay__menu-item__GRTnd { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-left__2qWI_ .workspace-overlay__modal-body-left-scroll__ZGiJ6 .workspace-overlay__modal-body-left-inner__1k6o2 .workspace-overlay__menu-item__GRTnd:hover { background-color: #edeff5; } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-left__2qWI_ .workspace-overlay__modal-body-left-scroll__ZGiJ6 .workspace-overlay__modal-body-left-inner__1k6o2 .workspace-overlay__menu-item__GRTnd .workspace-overlay__menu-item-img__1dfuv { flex-shrink: 0; width: 20px; margin-right: 8px; } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-left__2qWI_ .workspace-overlay__modal-body-left-scroll__ZGiJ6 .workspace-overlay__modal-body-left-inner__1k6o2 .workspace-overlay__menu-item__GRTnd .workspace-overlay__menu-item-label__3Szdu { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-main__21_82 { padding: calc(12px) 0; } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-main__21_82 .workspace-overlay__modal-body-main-scroll__2iKa2 { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-main__21_82 .workspace-overlay__modal-body-main-scroll__2iKa2 .workspace-overlay__modal-body-main-inner__2HNG8 { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-main__21_82 .workspace-overlay__modal-body-main-scroll__2iKa2 .workspace-overlay__modal-body-main-inner__2HNG8 .workspace-overlay__selector-btn-add__2U5DV, .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-main__21_82 .workspace-overlay__modal-body-main-scroll__2iKa2 .workspace-overlay__modal-body-main-inner__2HNG8 .workspace-overlay__selector-btn-item__310kT { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-main__21_82 .workspace-overlay__modal-body-main-scroll__2iKa2 .workspace-overlay__modal-body-main-inner__2HNG8 .workspace-overlay__selector-btn-add__2U5DV:hover, .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-main__21_82 .workspace-overlay__modal-body-main-scroll__2iKa2 .workspace-overlay__modal-body-main-inner__2HNG8 .workspace-overlay__selector-btn-item__310kT:hover { background-color: #e0e9ff; } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-main__21_82 .workspace-overlay__modal-body-main-scroll__2iKa2 .workspace-overlay__modal-body-main-inner__2HNG8 .workspace-overlay__selector-btn-add__2U5DV:active, .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-main__21_82 .workspace-overlay__modal-body-main-scroll__2iKa2 .workspace-overlay__modal-body-main-inner__2HNG8 .workspace-overlay__selector-btn-item__310kT:active { background-color: #ccdaff; } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-main__21_82 .workspace-overlay__modal-body-main-scroll__2iKa2 .workspace-overlay__modal-body-main-inner__2HNG8 .workspace-overlay__selector-btn-add__2U5DV:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-main__21_82 .workspace-overlay__modal-body-main-scroll__2iKa2 .workspace-overlay__modal-body-main-inner__2HNG8 .workspace-overlay__selector-btn-add__2U5DV:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-main__21_82 .workspace-overlay__modal-body-main-scroll__2iKa2 .workspace-overlay__modal-body-main-inner__2HNG8 .workspace-overlay__selector-btn-add__2U5DV .workspace-overlay__add-img__2VdbV { font-size: 28px; height: auto; margin-bottom: 8px; } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-main__21_82 .workspace-overlay__modal-body-main-scroll__2iKa2 .workspace-overlay__modal-body-main-inner__2HNG8 .workspace-overlay__selector-btn-add__2U5DV .workspace-overlay__add-label__1ejHd { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-main__21_82 .workspace-overlay__modal-body-main-scroll__2iKa2 .workspace-overlay__modal-body-main-inner__2HNG8 .workspace-overlay__selector-btn-item__310kT { justify-content: space-between; } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-main__21_82 .workspace-overlay__modal-body-main-scroll__2iKa2 .workspace-overlay__modal-body-main-inner__2HNG8 .workspace-overlay__selector-btn-item__310kT .workspace-overlay__item-img__26pl- { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-main__21_82 .workspace-overlay__modal-body-main-scroll__2iKa2 .workspace-overlay__modal-body-main-inner__2HNG8 .workspace-overlay__selector-btn-item__310kT .workspace-overlay__item-img__26pl- img { width: auto; height: 105px; } .workspace-overlay__modal-body__1jpWd .workspace-overlay__modal-body-main__21_82 .workspace-overlay__modal-body-main-scroll__2iKa2 .workspace-overlay__modal-body-main-inner__2HNG8 .workspace-overlay__selector-btn-item__310kT .workspace-overlay__item-label__aiqqN { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .workspace-overlay__modal-footer__8k1de { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .workspace-overlay__selector-btn-add__2U5DV, .workspace-overlay__selector-btn-item__310kT { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .workspace-overlay__selector-btn-add__2U5DV { background-color: var(--selector-sprite-bg_primary); } .workspace-overlay__selector-btn-add__2U5DV:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .workspace-overlay__selector-btn-add__2U5DV:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .workspace-overlay__selector-btn-add__2U5DV .workspace-overlay__add-img__2VdbV { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .workspace-overlay__selector-btn-add__2U5DV .workspace-overlay__add-label__1ejHd { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .workspace-overlay__selector-btn-item__310kT { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .workspace-overlay__selector-btn-item__310kT .workspace-overlay__item-img__26pl- { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .workspace-overlay__selector-btn-item__310kT .workspace-overlay__item-img__26pl- img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .workspace-overlay__selector-btn-item__310kT .workspace-overlay__item-label__aiqqN { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .workspace-overlay__selector-btn-item__310kT:hover { background-color: var(--selector-sprite-bg_primary); } .workspace-overlay__selector-btn-item__310kT:hover .workspace-overlay__item-img__26pl- { border-color: var(--selector-sprite-bg_primary); } .workspace-overlay__selector-btn-item_selected__1V2nW { background-color: var(--selector-sprite-bg_primary); } .workspace-overlay__selector-btn-item_selected__1V2nW .workspace-overlay__item-img__26pl- { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .workspace-overlay__menu-bar-btn__1LbO_ { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .workspace-overlay__menu-bar-btn_green__1_9hV, .workspace-overlay__menu-bar-btn_create__3ErYi { background-color: #3cdc8f; } .workspace-overlay__menu-bar-btn_green__1_9hV:hover, .workspace-overlay__menu-bar-btn_create__3ErYi:hover { background-color: #00d374; } .workspace-overlay__menu-bar-btn_green__1_9hV:active, .workspace-overlay__menu-bar-btn_create__3ErYi:active { background-color: #00d374; } .workspace-overlay__menu-bar-btn_save__29yx8, .workspace-overlay__menu-bar-btn_reset__3TGAK { background-color: #6ac8ff; } .workspace-overlay__menu-bar-btn_save__29yx8:hover, .workspace-overlay__menu-bar-btn_reset__3TGAK:hover { background-color: #57bcfe; } .workspace-overlay__menu-bar-btn_save__29yx8:active, .workspace-overlay__menu-bar-btn_reset__3TGAK:active { background-color: #4fb0fc; } .workspace-overlay__menu-bar-btn_submit__2mp0_, .workspace-overlay__menu-bar-btn_open__89XgP { background-color: #ff9e23; } .workspace-overlay__menu-bar-btn_submit__2mp0_:hover, .workspace-overlay__menu-bar-btn_open__89XgP:hover { background-color: #f47b04; } .workspace-overlay__menu-bar-btn_submit__2mp0_:active, .workspace-overlay__menu-bar-btn_open__89XgP:active { background-color: #fe8f22; } .workspace-overlay__menu-bar-btn_link___6Z49 { background-color: #e8efff; color: var(--theme-primary); } .workspace-overlay__menu-bar-btn_link___6Z49:hover { background-color: #b6c7ff; } .workspace-overlay__menu-bar-btn_link___6Z49:active { background-color: #cfdcff; } .workspace-overlay__menu-bar-btn_disabled__2Oa28 { color: #565266; background-color: #e6e9ed; } .workspace-overlay__menu-bar-btn_disabled__2Oa28:hover { cursor: not-allowed; } .workspace-overlay__menu-bar-btn_help__jlpXM { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .workspace-overlay__menu-bar-btn_help__jlpXM:hover { background-color: #8398ff; } .workspace-overlay__menu-bar-btn_help__jlpXM:active { background-color: #8ca3ff; } .workspace-overlay__menu-bar-separator__2_kFs { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .workspace-overlay__workspace-overlay__1Mlnn { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 1001; pointer-events: all; } .workspace-overlay__workspace-overlay__1Mlnn.workspace-overlay__workspace-overlay_running__3L88p { background-color: rgba(0, 0, 0, 0.26); } .workspace-overlay__workspace-overlay__1Mlnn.workspace-overlay__workspace-overlay_banprogram__3ByZJ { background-color: rgba(255, 255, 255, 0.6); } .workspace-overlay__workspace-overlay__1Mlnn.workspace-overlay__workspace-overlay_banprogram__3ByZJ.workspace-overlay__workspace-overlay_running__3L88p { background-color: rgba(0, 0, 0, 0.26); } .workspace-overlay__workspace-overlay__1Mlnn .workspace-overlay__gear-wrapper__1acKb { display: flex; align-items: center; justify-content: center; flex-direction: column; } .workspace-overlay__workspace-overlay__1Mlnn .workspace-overlay__gear-wrapper__1acKb h5 { font-size: 18px; color: #fff; margin-top: 10px; } .workspace-overlay__workspace-overlay__1Mlnn .workspace-overlay__gear-wrapper__1acKb h5 .workspace-overlay__schedule__2FDFJ { font-size: 26px; } .workspace-overlay__workspace-overlay__1Mlnn .workspace-overlay__gear-wrapper__1acKb img { transform: rotate(0deg); animation-iteration-count: infinite; animation-timing-function: linear; animation-duration: 3s; object-fit: cover; } .workspace-overlay__workspace-overlay__1Mlnn .workspace-overlay__gear-wrapper__1acKb .workspace-overlay__gear-l__T5kLR { height: 100px; width: 100px; animation-name: workspace-overlay__loading__3Keos; } .workspace-overlay__workspace-overlay__1Mlnn .workspace-overlay__gear-wrapper__1acKb .workspace-overlay__gear-s__c65wD { height: 50px; width: 50px; animation-name: workspace-overlay__loading_alternate__2v8V2; margin: 70px 10px 0 20px; } .workspace-overlay__workspace-overlay__1Mlnn .workspace-overlay__lock-img__2Y9j3 { width: 5rem; height: 5rem; position: absolute; right: 1rem; top: 1rem; } @keyframes workspace-overlay__loading__3Keos { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @keyframes workspace-overlay__loading_alternate__2v8V2 { 0% { transform: rotate(0deg); } 100% { transform: rotate(-360deg); } } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .toolkit__flex-center__2j1Mt { display: flex; align-items: center; justify-content: center; } .toolkit__full-filled__2frqs { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .toolkit__modal-mask__2Q9Na { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .toolkit__modal-mask__2Q9Na .toolkit__modal-wrap__2EwUY { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .toolkit__modal-mask__2Q9Na .toolkit__modal-wrap__2EwUY .toolkit__modal-header-wrap__3Q2FS { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .toolkit__modal-mask__2Q9Na .toolkit__modal-wrap__2EwUY .toolkit__modal-header-wrap__3Q2FS .toolkit__modal-header-bg__1X6ml { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .toolkit__modal-mask__2Q9Na .toolkit__modal-wrap__2EwUY .toolkit__modal-header-wrap__3Q2FS .toolkit__modal-header-label__3x3mI { flex-shrink: 0; font-size: 16px; font-weight: bold; } .toolkit__modal-mask__2Q9Na .toolkit__modal-wrap__2EwUY .toolkit__modal-header-wrap__3Q2FS .toolkit__modal-header-close__3La2o { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .toolkit__modal-mask__2Q9Na .toolkit__modal-wrap__2EwUY .toolkit__modal-header-wrap__3Q2FS .toolkit__modal-header-close__3La2o:hover { color: #98a2b4; } .toolkit__modal-mask__2Q9Na .toolkit__modal-wrap__2EwUY .toolkit__modal-body-wrap__ldB8e { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .toolkit__modal-mask__2Q9Na .toolkit__modal-wrap__2EwUY .toolkit__modal-footer-wrap__1xpyE { flex-shrink: 0; display: flex; } .toolkit__modal-header__3luaK { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .toolkit__modal-header__3luaK .toolkit__modal-header-upload__3a1XC { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .toolkit__modal-header__3luaK .toolkit__modal-header-upload__3a1XC:hover { background-color: #e0e9ff; } .toolkit__modal-header__3luaK .toolkit__modal-header-upload__3a1XC:active { background-color: #ccdaff; } .toolkit__modal-header__3luaK .toolkit__modal-header-upload__3a1XC .toolkit__upload-img__mws30 { font-size: 16px; margin-right: calc(2px); } .toolkit__modal-header__3luaK .toolkit__modal-header-upload__3a1XC .toolkit__upload-label__2r3tD { font-size: 14px; } .toolkit__modal-header__3luaK .toolkit__modal-header-upload__3a1XC .toolkit__upload-input__2ENaA { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .toolkit__modal-header__3luaK .toolkit__modal-header-search__2GEmx { position: relative; } .toolkit__modal-header__3luaK .toolkit__modal-header-search__2GEmx .toolkit__search-input__3MX3L { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .toolkit__modal-header__3luaK .toolkit__modal-header-search__2GEmx .toolkit__search-input__3MX3L::-webkit-input-placeholder { color: #98a2b4; } .toolkit__modal-header__3luaK .toolkit__modal-header-search__2GEmx .toolkit__search-input__3MX3L::-moz-placeholder { color: #98a2b4; } .toolkit__modal-header__3luaK .toolkit__modal-header-search__2GEmx .toolkit__search-input__3MX3L:-ms-input-placeholder { color: #98a2b4; } .toolkit__modal-header__3luaK .toolkit__modal-header-search__2GEmx .toolkit__search-input__3MX3L:hover { border-color: #d1d7e1; } .toolkit__modal-header__3luaK .toolkit__modal-header-search__2GEmx .toolkit__search-input__3MX3L:active { border-color: #d1d7e1; } .toolkit__modal-header__3luaK .toolkit__modal-header-search__2GEmx .toolkit__search-img__2DHJ9 { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .toolkit__modal-body__47B9u { flex-grow: 1; display: flex; } .toolkit__modal-body__47B9u .toolkit__modal-body-left__2H9jc, .toolkit__modal-body__47B9u .toolkit__modal-body-main__3wPIq { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .toolkit__modal-body__47B9u .toolkit__modal-body-left__2H9jc { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .toolkit__modal-body__47B9u .toolkit__modal-body-left__2H9jc .toolkit__modal-body-left-scroll__FD4xN { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .toolkit__modal-body__47B9u .toolkit__modal-body-left__2H9jc .toolkit__modal-body-left-scroll__FD4xN .toolkit__modal-body-left-inner__3x1uW { width: 121px; padding: calc(12px); color: #5e6b81; } .toolkit__modal-body__47B9u .toolkit__modal-body-left__2H9jc .toolkit__modal-body-left-scroll__FD4xN .toolkit__modal-body-left-inner__3x1uW .toolkit__menu-item-current__1psr2 { color: var(--theme-primary); background-color: #e0e9ff; } .toolkit__modal-body__47B9u .toolkit__modal-body-left__2H9jc .toolkit__modal-body-left-scroll__FD4xN .toolkit__modal-body-left-inner__3x1uW .toolkit__menu-item__BUFSc { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .toolkit__modal-body__47B9u .toolkit__modal-body-left__2H9jc .toolkit__modal-body-left-scroll__FD4xN .toolkit__modal-body-left-inner__3x1uW .toolkit__menu-item__BUFSc:hover { background-color: #edeff5; } .toolkit__modal-body__47B9u .toolkit__modal-body-left__2H9jc .toolkit__modal-body-left-scroll__FD4xN .toolkit__modal-body-left-inner__3x1uW .toolkit__menu-item__BUFSc .toolkit__menu-item-img__1xMv6 { flex-shrink: 0; width: 20px; margin-right: 8px; } .toolkit__modal-body__47B9u .toolkit__modal-body-left__2H9jc .toolkit__modal-body-left-scroll__FD4xN .toolkit__modal-body-left-inner__3x1uW .toolkit__menu-item__BUFSc .toolkit__menu-item-label__1WNC5 { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .toolkit__modal-body__47B9u .toolkit__modal-body-main__3wPIq { padding: calc(12px) 0; } .toolkit__modal-body__47B9u .toolkit__modal-body-main__3wPIq .toolkit__modal-body-main-scroll__5T_Ek { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .toolkit__modal-body__47B9u .toolkit__modal-body-main__3wPIq .toolkit__modal-body-main-scroll__5T_Ek .toolkit__modal-body-main-inner__2uJB4 { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .toolkit__modal-body__47B9u .toolkit__modal-body-main__3wPIq .toolkit__modal-body-main-scroll__5T_Ek .toolkit__modal-body-main-inner__2uJB4 .toolkit__selector-btn-add__3fajW, .toolkit__modal-body__47B9u .toolkit__modal-body-main__3wPIq .toolkit__modal-body-main-scroll__5T_Ek .toolkit__modal-body-main-inner__2uJB4 .toolkit__selector-btn-item__3IeOd { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .toolkit__modal-body__47B9u .toolkit__modal-body-main__3wPIq .toolkit__modal-body-main-scroll__5T_Ek .toolkit__modal-body-main-inner__2uJB4 .toolkit__selector-btn-add__3fajW:hover, .toolkit__modal-body__47B9u .toolkit__modal-body-main__3wPIq .toolkit__modal-body-main-scroll__5T_Ek .toolkit__modal-body-main-inner__2uJB4 .toolkit__selector-btn-item__3IeOd:hover { background-color: #e0e9ff; } .toolkit__modal-body__47B9u .toolkit__modal-body-main__3wPIq .toolkit__modal-body-main-scroll__5T_Ek .toolkit__modal-body-main-inner__2uJB4 .toolkit__selector-btn-add__3fajW:active, .toolkit__modal-body__47B9u .toolkit__modal-body-main__3wPIq .toolkit__modal-body-main-scroll__5T_Ek .toolkit__modal-body-main-inner__2uJB4 .toolkit__selector-btn-item__3IeOd:active { background-color: #ccdaff; } .toolkit__modal-body__47B9u .toolkit__modal-body-main__3wPIq .toolkit__modal-body-main-scroll__5T_Ek .toolkit__modal-body-main-inner__2uJB4 .toolkit__selector-btn-add__3fajW:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .toolkit__modal-body__47B9u .toolkit__modal-body-main__3wPIq .toolkit__modal-body-main-scroll__5T_Ek .toolkit__modal-body-main-inner__2uJB4 .toolkit__selector-btn-add__3fajW:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .toolkit__modal-body__47B9u .toolkit__modal-body-main__3wPIq .toolkit__modal-body-main-scroll__5T_Ek .toolkit__modal-body-main-inner__2uJB4 .toolkit__selector-btn-add__3fajW .toolkit__add-img__kMCkv { font-size: 28px; height: auto; margin-bottom: 8px; } .toolkit__modal-body__47B9u .toolkit__modal-body-main__3wPIq .toolkit__modal-body-main-scroll__5T_Ek .toolkit__modal-body-main-inner__2uJB4 .toolkit__selector-btn-add__3fajW .toolkit__add-label__36lwR { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .toolkit__modal-body__47B9u .toolkit__modal-body-main__3wPIq .toolkit__modal-body-main-scroll__5T_Ek .toolkit__modal-body-main-inner__2uJB4 .toolkit__selector-btn-item__3IeOd { justify-content: space-between; } .toolkit__modal-body__47B9u .toolkit__modal-body-main__3wPIq .toolkit__modal-body-main-scroll__5T_Ek .toolkit__modal-body-main-inner__2uJB4 .toolkit__selector-btn-item__3IeOd .toolkit__item-img__2LfQW { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .toolkit__modal-body__47B9u .toolkit__modal-body-main__3wPIq .toolkit__modal-body-main-scroll__5T_Ek .toolkit__modal-body-main-inner__2uJB4 .toolkit__selector-btn-item__3IeOd .toolkit__item-img__2LfQW img { width: auto; height: 105px; } .toolkit__modal-body__47B9u .toolkit__modal-body-main__3wPIq .toolkit__modal-body-main-scroll__5T_Ek .toolkit__modal-body-main-inner__2uJB4 .toolkit__selector-btn-item__3IeOd .toolkit__item-label__1nuOb { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .toolkit__modal-footer__37Y7C { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .toolkit__selector-btn-add__3fajW, .toolkit__selector-btn-item__3IeOd { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .toolkit__selector-btn-add__3fajW { background-color: var(--selector-sprite-bg_primary); } .toolkit__selector-btn-add__3fajW:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .toolkit__selector-btn-add__3fajW:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .toolkit__selector-btn-add__3fajW .toolkit__add-img__kMCkv { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .toolkit__selector-btn-add__3fajW .toolkit__add-label__36lwR { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .toolkit__selector-btn-item__3IeOd { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .toolkit__selector-btn-item__3IeOd .toolkit__item-img__2LfQW { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .toolkit__selector-btn-item__3IeOd .toolkit__item-img__2LfQW img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .toolkit__selector-btn-item__3IeOd .toolkit__item-label__1nuOb { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .toolkit__selector-btn-item__3IeOd:hover { background-color: var(--selector-sprite-bg_primary); } .toolkit__selector-btn-item__3IeOd:hover .toolkit__item-img__2LfQW { border-color: var(--selector-sprite-bg_primary); } .toolkit__selector-btn-item_selected__3cOVS { background-color: var(--selector-sprite-bg_primary); } .toolkit__selector-btn-item_selected__3cOVS .toolkit__item-img__2LfQW { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .toolkit__menu-bar-btn__rVxQh { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .toolkit__menu-bar-btn_green__315k3, .toolkit__menu-bar-btn_create__2mP6a { background-color: #3cdc8f; } .toolkit__menu-bar-btn_green__315k3:hover, .toolkit__menu-bar-btn_create__2mP6a:hover { background-color: #00d374; } .toolkit__menu-bar-btn_green__315k3:active, .toolkit__menu-bar-btn_create__2mP6a:active { background-color: #00d374; } .toolkit__menu-bar-btn_save__66zCL, .toolkit__menu-bar-btn_reset__1W5b7 { background-color: #6ac8ff; } .toolkit__menu-bar-btn_save__66zCL:hover, .toolkit__menu-bar-btn_reset__1W5b7:hover { background-color: #57bcfe; } .toolkit__menu-bar-btn_save__66zCL:active, .toolkit__menu-bar-btn_reset__1W5b7:active { background-color: #4fb0fc; } .toolkit__menu-bar-btn_submit__1nIBo, .toolkit__menu-bar-btn_open__1qRON { background-color: #ff9e23; } .toolkit__menu-bar-btn_submit__1nIBo:hover, .toolkit__menu-bar-btn_open__1qRON:hover { background-color: #f47b04; } .toolkit__menu-bar-btn_submit__1nIBo:active, .toolkit__menu-bar-btn_open__1qRON:active { background-color: #fe8f22; } .toolkit__menu-bar-btn_link__Y0l55 { background-color: #e8efff; color: var(--theme-primary); } .toolkit__menu-bar-btn_link__Y0l55:hover { background-color: #b6c7ff; } .toolkit__menu-bar-btn_link__Y0l55:active { background-color: #cfdcff; } .toolkit__menu-bar-btn_disabled__3digv { color: #565266; background-color: #e6e9ed; } .toolkit__menu-bar-btn_disabled__3digv:hover { cursor: not-allowed; } .toolkit__menu-bar-btn_help__1Q8Ul { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .toolkit__menu-bar-btn_help__1Q8Ul:hover { background-color: #8398ff; } .toolkit__menu-bar-btn_help__1Q8Ul:active { background-color: #8ca3ff; } .toolkit__menu-bar-separator__3_TmC { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .toolkit__toolkit__3W9bZ { position: absolute; right: 20px; bottom: 24px; height: 40px; width: 182px; border-radius: 150px; background: #ffffff; box-shadow: 8px 4px 8px rgba(39, 71, 154, 0.04); z-index: 50; display: flex; justify-content: space-between; align-items: center; padding: 0 16px; } .toolkit__toolkit__3W9bZ .toolkit__toolkit-btn-wrap__Ycb40 { height: 100%; display: flex; align-items: center; justify-content: center; -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; transition: color 0.3s; color: #828da3; } @media (any-hover: hover) { .toolkit__toolkit__3W9bZ .toolkit__toolkit-btn-wrap__Ycb40:hover { cursor: url(static/cursor/cursor-pointer.cur), pointer; color: var(--theme-primary); } } .toolkit__toolkit__3W9bZ .toolkit__toolkit-btn-wrap__Ycb40:active { cursor: url(static/cursor/cursor-pointer.cur), pointer; color: var(--theme-primary); } .toolkit__toolkit__3W9bZ .toolkit__toolkit-btn-wrap__Ycb40 .toolkit__toolkit-btn__3b_cR { height: 20px; width: 20px; font-size: 20px; } .toolkit__toolkit__3W9bZ .toolkit__toolkit-btn-wrap__Ycb40 .toolkit__toolkit-btn__3b_cR.toolkit__toolkit-btn_disabled__2eJLE { cursor: not-allowed; color: #d1d7e1; } .toolkit__toolkit-delimiter__2k-lC { width: 1px; height: 14px; background-color: #f0f0f0; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .reset-work_jr__flex-center__2A7xg { display: flex; align-items: center; justify-content: center; } .reset-work_jr__full-filled__2whbz { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .reset-work_jr__modal-mask__15AGb { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .reset-work_jr__modal-mask__15AGb .reset-work_jr__modal-wrap__7rTX3 { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .reset-work_jr__modal-mask__15AGb .reset-work_jr__modal-wrap__7rTX3 .reset-work_jr__modal-header-wrap__32TUU { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .reset-work_jr__modal-mask__15AGb .reset-work_jr__modal-wrap__7rTX3 .reset-work_jr__modal-header-wrap__32TUU .reset-work_jr__modal-header-bg__ETyNt { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .reset-work_jr__modal-mask__15AGb .reset-work_jr__modal-wrap__7rTX3 .reset-work_jr__modal-header-wrap__32TUU .reset-work_jr__modal-header-label__304d4 { flex-shrink: 0; font-size: 16px; font-weight: bold; } .reset-work_jr__modal-mask__15AGb .reset-work_jr__modal-wrap__7rTX3 .reset-work_jr__modal-header-wrap__32TUU .reset-work_jr__modal-header-close__1aIvj { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .reset-work_jr__modal-mask__15AGb .reset-work_jr__modal-wrap__7rTX3 .reset-work_jr__modal-header-wrap__32TUU .reset-work_jr__modal-header-close__1aIvj:hover { color: #98a2b4; } .reset-work_jr__modal-mask__15AGb .reset-work_jr__modal-wrap__7rTX3 .reset-work_jr__modal-body-wrap__cvrkI { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .reset-work_jr__modal-mask__15AGb .reset-work_jr__modal-wrap__7rTX3 .reset-work_jr__modal-footer-wrap__2yu1h { flex-shrink: 0; display: flex; } .reset-work_jr__modal-header__121_U { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .reset-work_jr__modal-header__121_U .reset-work_jr__modal-header-upload__XcEpY { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .reset-work_jr__modal-header__121_U .reset-work_jr__modal-header-upload__XcEpY:hover { background-color: #e0e9ff; } .reset-work_jr__modal-header__121_U .reset-work_jr__modal-header-upload__XcEpY:active { background-color: #ccdaff; } .reset-work_jr__modal-header__121_U .reset-work_jr__modal-header-upload__XcEpY .reset-work_jr__upload-img__6aWED { font-size: 16px; margin-right: calc(2px); } .reset-work_jr__modal-header__121_U .reset-work_jr__modal-header-upload__XcEpY .reset-work_jr__upload-label__3zkns { font-size: 14px; } .reset-work_jr__modal-header__121_U .reset-work_jr__modal-header-upload__XcEpY .reset-work_jr__upload-input__2RrMJ { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .reset-work_jr__modal-header__121_U .reset-work_jr__modal-header-search__1LhPu { position: relative; } .reset-work_jr__modal-header__121_U .reset-work_jr__modal-header-search__1LhPu .reset-work_jr__search-input__20q76 { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .reset-work_jr__modal-header__121_U .reset-work_jr__modal-header-search__1LhPu .reset-work_jr__search-input__20q76::-webkit-input-placeholder { color: #98a2b4; } .reset-work_jr__modal-header__121_U .reset-work_jr__modal-header-search__1LhPu .reset-work_jr__search-input__20q76::-moz-placeholder { color: #98a2b4; } .reset-work_jr__modal-header__121_U .reset-work_jr__modal-header-search__1LhPu .reset-work_jr__search-input__20q76:-ms-input-placeholder { color: #98a2b4; } .reset-work_jr__modal-header__121_U .reset-work_jr__modal-header-search__1LhPu .reset-work_jr__search-input__20q76:hover { border-color: #d1d7e1; } .reset-work_jr__modal-header__121_U .reset-work_jr__modal-header-search__1LhPu .reset-work_jr__search-input__20q76:active { border-color: #d1d7e1; } .reset-work_jr__modal-header__121_U .reset-work_jr__modal-header-search__1LhPu .reset-work_jr__search-img__2weWQ { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .reset-work_jr__modal-body__2r26c { flex-grow: 1; display: flex; } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-left__1__0Y, .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-main__1A6rs { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-left__1__0Y { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-left__1__0Y .reset-work_jr__modal-body-left-scroll__1LR5c { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-left__1__0Y .reset-work_jr__modal-body-left-scroll__1LR5c .reset-work_jr__modal-body-left-inner__YFbjJ { width: 121px; padding: calc(12px); color: #5e6b81; } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-left__1__0Y .reset-work_jr__modal-body-left-scroll__1LR5c .reset-work_jr__modal-body-left-inner__YFbjJ .reset-work_jr__menu-item-current__2v_yM { color: var(--theme-primary); background-color: #e0e9ff; } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-left__1__0Y .reset-work_jr__modal-body-left-scroll__1LR5c .reset-work_jr__modal-body-left-inner__YFbjJ .reset-work_jr__menu-item__33LDG { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-left__1__0Y .reset-work_jr__modal-body-left-scroll__1LR5c .reset-work_jr__modal-body-left-inner__YFbjJ .reset-work_jr__menu-item__33LDG:hover { background-color: #edeff5; } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-left__1__0Y .reset-work_jr__modal-body-left-scroll__1LR5c .reset-work_jr__modal-body-left-inner__YFbjJ .reset-work_jr__menu-item__33LDG .reset-work_jr__menu-item-img__3g4eK { flex-shrink: 0; width: 20px; margin-right: 8px; } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-left__1__0Y .reset-work_jr__modal-body-left-scroll__1LR5c .reset-work_jr__modal-body-left-inner__YFbjJ .reset-work_jr__menu-item__33LDG .reset-work_jr__menu-item-label__j_T-k { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-main__1A6rs { padding: calc(12px) 0; } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-main__1A6rs .reset-work_jr__modal-body-main-scroll__6KVUb { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-main__1A6rs .reset-work_jr__modal-body-main-scroll__6KVUb .reset-work_jr__modal-body-main-inner__1cG17 { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-main__1A6rs .reset-work_jr__modal-body-main-scroll__6KVUb .reset-work_jr__modal-body-main-inner__1cG17 .reset-work_jr__selector-btn-add__1NiOP, .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-main__1A6rs .reset-work_jr__modal-body-main-scroll__6KVUb .reset-work_jr__modal-body-main-inner__1cG17 .reset-work_jr__selector-btn-item__3mmqh { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-main__1A6rs .reset-work_jr__modal-body-main-scroll__6KVUb .reset-work_jr__modal-body-main-inner__1cG17 .reset-work_jr__selector-btn-add__1NiOP:hover, .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-main__1A6rs .reset-work_jr__modal-body-main-scroll__6KVUb .reset-work_jr__modal-body-main-inner__1cG17 .reset-work_jr__selector-btn-item__3mmqh:hover { background-color: #e0e9ff; } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-main__1A6rs .reset-work_jr__modal-body-main-scroll__6KVUb .reset-work_jr__modal-body-main-inner__1cG17 .reset-work_jr__selector-btn-add__1NiOP:active, .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-main__1A6rs .reset-work_jr__modal-body-main-scroll__6KVUb .reset-work_jr__modal-body-main-inner__1cG17 .reset-work_jr__selector-btn-item__3mmqh:active { background-color: #ccdaff; } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-main__1A6rs .reset-work_jr__modal-body-main-scroll__6KVUb .reset-work_jr__modal-body-main-inner__1cG17 .reset-work_jr__selector-btn-add__1NiOP:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-main__1A6rs .reset-work_jr__modal-body-main-scroll__6KVUb .reset-work_jr__modal-body-main-inner__1cG17 .reset-work_jr__selector-btn-add__1NiOP:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-main__1A6rs .reset-work_jr__modal-body-main-scroll__6KVUb .reset-work_jr__modal-body-main-inner__1cG17 .reset-work_jr__selector-btn-add__1NiOP .reset-work_jr__add-img__t81y6 { font-size: 28px; height: auto; margin-bottom: 8px; } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-main__1A6rs .reset-work_jr__modal-body-main-scroll__6KVUb .reset-work_jr__modal-body-main-inner__1cG17 .reset-work_jr__selector-btn-add__1NiOP .reset-work_jr__add-label__1htr3 { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-main__1A6rs .reset-work_jr__modal-body-main-scroll__6KVUb .reset-work_jr__modal-body-main-inner__1cG17 .reset-work_jr__selector-btn-item__3mmqh { justify-content: space-between; } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-main__1A6rs .reset-work_jr__modal-body-main-scroll__6KVUb .reset-work_jr__modal-body-main-inner__1cG17 .reset-work_jr__selector-btn-item__3mmqh .reset-work_jr__item-img__3LNyT { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-main__1A6rs .reset-work_jr__modal-body-main-scroll__6KVUb .reset-work_jr__modal-body-main-inner__1cG17 .reset-work_jr__selector-btn-item__3mmqh .reset-work_jr__item-img__3LNyT img { width: auto; height: 105px; } .reset-work_jr__modal-body__2r26c .reset-work_jr__modal-body-main__1A6rs .reset-work_jr__modal-body-main-scroll__6KVUb .reset-work_jr__modal-body-main-inner__1cG17 .reset-work_jr__selector-btn-item__3mmqh .reset-work_jr__item-label__2CcHU { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .reset-work_jr__modal-footer__dBjvU { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .reset-work_jr__selector-btn-add__1NiOP, .reset-work_jr__selector-btn-item__3mmqh { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .reset-work_jr__selector-btn-add__1NiOP { background-color: var(--selector-sprite-bg_primary); } .reset-work_jr__selector-btn-add__1NiOP:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .reset-work_jr__selector-btn-add__1NiOP:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .reset-work_jr__selector-btn-add__1NiOP .reset-work_jr__add-img__t81y6 { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .reset-work_jr__selector-btn-add__1NiOP .reset-work_jr__add-label__1htr3 { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .reset-work_jr__selector-btn-item__3mmqh { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .reset-work_jr__selector-btn-item__3mmqh .reset-work_jr__item-img__3LNyT { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .reset-work_jr__selector-btn-item__3mmqh .reset-work_jr__item-img__3LNyT img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .reset-work_jr__selector-btn-item__3mmqh .reset-work_jr__item-label__2CcHU { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .reset-work_jr__selector-btn-item__3mmqh:hover { background-color: var(--selector-sprite-bg_primary); } .reset-work_jr__selector-btn-item__3mmqh:hover .reset-work_jr__item-img__3LNyT { border-color: var(--selector-sprite-bg_primary); } .reset-work_jr__selector-btn-item_selected__3V3RF { background-color: var(--selector-sprite-bg_primary); } .reset-work_jr__selector-btn-item_selected__3V3RF .reset-work_jr__item-img__3LNyT { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .reset-work_jr__menu-bar-btn__3GT88 { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .reset-work_jr__menu-bar-btn_green__GWEC_, .reset-work_jr__menu-bar-btn_create__l-Bs4 { background-color: #3cdc8f; } .reset-work_jr__menu-bar-btn_green__GWEC_:hover, .reset-work_jr__menu-bar-btn_create__l-Bs4:hover { background-color: #00d374; } .reset-work_jr__menu-bar-btn_green__GWEC_:active, .reset-work_jr__menu-bar-btn_create__l-Bs4:active { background-color: #00d374; } .reset-work_jr__menu-bar-btn_save__1a1qT, .reset-work_jr__menu-bar-btn_reset__1psRA { background-color: #6ac8ff; } .reset-work_jr__menu-bar-btn_save__1a1qT:hover, .reset-work_jr__menu-bar-btn_reset__1psRA:hover { background-color: #57bcfe; } .reset-work_jr__menu-bar-btn_save__1a1qT:active, .reset-work_jr__menu-bar-btn_reset__1psRA:active { background-color: #4fb0fc; } .reset-work_jr__menu-bar-btn_submit__1Ys_A, .reset-work_jr__menu-bar-btn_open__1TiHb { background-color: #ff9e23; } .reset-work_jr__menu-bar-btn_submit__1Ys_A:hover, .reset-work_jr__menu-bar-btn_open__1TiHb:hover { background-color: #f47b04; } .reset-work_jr__menu-bar-btn_submit__1Ys_A:active, .reset-work_jr__menu-bar-btn_open__1TiHb:active { background-color: #fe8f22; } .reset-work_jr__menu-bar-btn_link__2aOlC { background-color: #e8efff; color: var(--theme-primary); } .reset-work_jr__menu-bar-btn_link__2aOlC:hover { background-color: #b6c7ff; } .reset-work_jr__menu-bar-btn_link__2aOlC:active { background-color: #cfdcff; } .reset-work_jr__menu-bar-btn_disabled__3CYg5 { color: #565266; background-color: #e6e9ed; } .reset-work_jr__menu-bar-btn_disabled__3CYg5:hover { cursor: not-allowed; } .reset-work_jr__menu-bar-btn_help__2nx9G { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .reset-work_jr__menu-bar-btn_help__2nx9G:hover { background-color: #8398ff; } .reset-work_jr__menu-bar-btn_help__2nx9G:active { background-color: #8ca3ff; } .reset-work_jr__menu-bar-separator__2dD0C { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .reset-work_jr__reset-work-modal-mask__ZnQvu { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .reset-work_jr__reset-work-modal-mask__ZnQvu .reset-work_jr__modal-wrap__7rTX3 { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .reset-work_jr__reset-work-modal-mask__ZnQvu .reset-work_jr__modal-wrap__7rTX3 .reset-work_jr__modal-header-wrap__32TUU { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .reset-work_jr__reset-work-modal-mask__ZnQvu .reset-work_jr__modal-wrap__7rTX3 .reset-work_jr__modal-header-wrap__32TUU .reset-work_jr__modal-header-bg__ETyNt { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .reset-work_jr__reset-work-modal-mask__ZnQvu .reset-work_jr__modal-wrap__7rTX3 .reset-work_jr__modal-header-wrap__32TUU .reset-work_jr__modal-header-label__304d4 { flex-shrink: 0; font-size: 16px; font-weight: bold; } .reset-work_jr__reset-work-modal-mask__ZnQvu .reset-work_jr__modal-wrap__7rTX3 .reset-work_jr__modal-header-wrap__32TUU .reset-work_jr__modal-header-close__1aIvj { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .reset-work_jr__reset-work-modal-mask__ZnQvu .reset-work_jr__modal-wrap__7rTX3 .reset-work_jr__modal-header-wrap__32TUU .reset-work_jr__modal-header-close__1aIvj:hover { color: #98a2b4; } .reset-work_jr__reset-work-modal-mask__ZnQvu .reset-work_jr__modal-wrap__7rTX3 .reset-work_jr__modal-body-wrap__cvrkI { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .reset-work_jr__reset-work-modal-mask__ZnQvu .reset-work_jr__modal-wrap__7rTX3 .reset-work_jr__modal-footer-wrap__2yu1h { flex-shrink: 0; display: flex; } .reset-work_jr__reset-work-modal-mask__ZnQvu .reset-work_jr__reset-work-modal__1srV6 { width: 22.62rem; height: 19rem; flex-shrink: 0; position: relative; display: flex; align-items: center; flex-direction: column; padding-top: 2.5rem; background-size: 100% 100%; background-repeat: no-repeat; } .reset-work_jr__reset-work-modal-mask__ZnQvu .reset-work_jr__reset-work-modal__1srV6 .reset-work_jr__reset-work-close-wrap__UmN-S { position: absolute; top: 0; right: 0; display: flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; flex-shrink: 0; border-radius: 50%; background-color: #ff6a38; cursor: pointer; } .reset-work_jr__reset-work-modal-mask__ZnQvu .reset-work_jr__reset-work-modal__1srV6 .reset-work_jr__reset-work-close-wrap__UmN-S .reset-work_jr__reset-work-close__2T4cV { color: #ffffff; font-size: 2rem; } .reset-work_jr__reset-work-modal-mask__ZnQvu .reset-work_jr__reset-work-modal__1srV6 .reset-work_jr__reset-work-label__p8NfO { color: #000000; font-size: 1.12rem; font-weight: 600; margin-bottom: 1.56rem; } .reset-work_jr__reset-work-modal-mask__ZnQvu .reset-work_jr__reset-work-modal__1srV6 .reset-work_jr__reset-work-img__J7rDr { width: 7.82rem; height: 6.87rem; flex-shrink: 0; margin-bottom: 1.51rem; } .reset-work_jr__reset-work-modal-mask__ZnQvu .reset-work_jr__reset-work-modal__1srV6 .reset-work_jr__reset-work-btn__lj6en { display: flex; align-items: center; justify-content: center; width: 6.69rem; height: 2.75rem; flex-shrink: 0; border-radius: calc(1.375rem); background-color: #ff6a38; color: #ffffff; font-size: 1.12rem; font-weight: 600; cursor: pointer; } .reset-work_jr__reset-work-modal-mask__ZnQvu .reset-work_jr__reset-work-modal__1srV6 .reset-work_jr__reset-work-btn__lj6en .reset-work_jr__reset-work-btn-icon__3uOjZ { font-size: 2.5rem; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .request-loading__flex-center__IfAFQ { display: flex; align-items: center; justify-content: center; } .request-loading__full-filled__3v_tg { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .request-loading__modal-mask__3ngIy { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .request-loading__modal-mask__3ngIy .request-loading__modal-wrap__21O1d { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .request-loading__modal-mask__3ngIy .request-loading__modal-wrap__21O1d .request-loading__modal-header-wrap__1xTD5 { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .request-loading__modal-mask__3ngIy .request-loading__modal-wrap__21O1d .request-loading__modal-header-wrap__1xTD5 .request-loading__modal-header-bg__1jmIL { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .request-loading__modal-mask__3ngIy .request-loading__modal-wrap__21O1d .request-loading__modal-header-wrap__1xTD5 .request-loading__modal-header-label__YdF_r { flex-shrink: 0; font-size: 16px; font-weight: bold; } .request-loading__modal-mask__3ngIy .request-loading__modal-wrap__21O1d .request-loading__modal-header-wrap__1xTD5 .request-loading__modal-header-close__3EVBt { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .request-loading__modal-mask__3ngIy .request-loading__modal-wrap__21O1d .request-loading__modal-header-wrap__1xTD5 .request-loading__modal-header-close__3EVBt:hover { color: #98a2b4; } .request-loading__modal-mask__3ngIy .request-loading__modal-wrap__21O1d .request-loading__modal-body-wrap__1vLOt { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .request-loading__modal-mask__3ngIy .request-loading__modal-wrap__21O1d .request-loading__modal-footer-wrap__3oXmG { flex-shrink: 0; display: flex; } .request-loading__modal-header__H-QRy { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .request-loading__modal-header__H-QRy .request-loading__modal-header-upload__3Cmgb { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .request-loading__modal-header__H-QRy .request-loading__modal-header-upload__3Cmgb:hover { background-color: #e0e9ff; } .request-loading__modal-header__H-QRy .request-loading__modal-header-upload__3Cmgb:active { background-color: #ccdaff; } .request-loading__modal-header__H-QRy .request-loading__modal-header-upload__3Cmgb .request-loading__upload-img__3HRa6 { font-size: 16px; margin-right: calc(2px); } .request-loading__modal-header__H-QRy .request-loading__modal-header-upload__3Cmgb .request-loading__upload-label__2lB33 { font-size: 14px; } .request-loading__modal-header__H-QRy .request-loading__modal-header-upload__3Cmgb .request-loading__upload-input__3tRIb { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .request-loading__modal-header__H-QRy .request-loading__modal-header-search__1psaA { position: relative; } .request-loading__modal-header__H-QRy .request-loading__modal-header-search__1psaA .request-loading__search-input__25EGQ { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .request-loading__modal-header__H-QRy .request-loading__modal-header-search__1psaA .request-loading__search-input__25EGQ::-webkit-input-placeholder { color: #98a2b4; } .request-loading__modal-header__H-QRy .request-loading__modal-header-search__1psaA .request-loading__search-input__25EGQ::-moz-placeholder { color: #98a2b4; } .request-loading__modal-header__H-QRy .request-loading__modal-header-search__1psaA .request-loading__search-input__25EGQ:-ms-input-placeholder { color: #98a2b4; } .request-loading__modal-header__H-QRy .request-loading__modal-header-search__1psaA .request-loading__search-input__25EGQ:hover { border-color: #d1d7e1; } .request-loading__modal-header__H-QRy .request-loading__modal-header-search__1psaA .request-loading__search-input__25EGQ:active { border-color: #d1d7e1; } .request-loading__modal-header__H-QRy .request-loading__modal-header-search__1psaA .request-loading__search-img__BGIQE { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .request-loading__modal-body__38fSH { flex-grow: 1; display: flex; } .request-loading__modal-body__38fSH .request-loading__modal-body-left__111Qk, .request-loading__modal-body__38fSH .request-loading__modal-body-main__YIFVW { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .request-loading__modal-body__38fSH .request-loading__modal-body-left__111Qk { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .request-loading__modal-body__38fSH .request-loading__modal-body-left__111Qk .request-loading__modal-body-left-scroll__1ugPO { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .request-loading__modal-body__38fSH .request-loading__modal-body-left__111Qk .request-loading__modal-body-left-scroll__1ugPO .request-loading__modal-body-left-inner__6GwUl { width: 121px; padding: calc(12px); color: #5e6b81; } .request-loading__modal-body__38fSH .request-loading__modal-body-left__111Qk .request-loading__modal-body-left-scroll__1ugPO .request-loading__modal-body-left-inner__6GwUl .request-loading__menu-item-current__ZGcs9 { color: var(--theme-primary); background-color: #e0e9ff; } .request-loading__modal-body__38fSH .request-loading__modal-body-left__111Qk .request-loading__modal-body-left-scroll__1ugPO .request-loading__modal-body-left-inner__6GwUl .request-loading__menu-item__1eX0i { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .request-loading__modal-body__38fSH .request-loading__modal-body-left__111Qk .request-loading__modal-body-left-scroll__1ugPO .request-loading__modal-body-left-inner__6GwUl .request-loading__menu-item__1eX0i:hover { background-color: #edeff5; } .request-loading__modal-body__38fSH .request-loading__modal-body-left__111Qk .request-loading__modal-body-left-scroll__1ugPO .request-loading__modal-body-left-inner__6GwUl .request-loading__menu-item__1eX0i .request-loading__menu-item-img__2k1ub { flex-shrink: 0; width: 20px; margin-right: 8px; } .request-loading__modal-body__38fSH .request-loading__modal-body-left__111Qk .request-loading__modal-body-left-scroll__1ugPO .request-loading__modal-body-left-inner__6GwUl .request-loading__menu-item__1eX0i .request-loading__menu-item-label__1dgKx { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .request-loading__modal-body__38fSH .request-loading__modal-body-main__YIFVW { padding: calc(12px) 0; } .request-loading__modal-body__38fSH .request-loading__modal-body-main__YIFVW .request-loading__modal-body-main-scroll__3qYCJ { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .request-loading__modal-body__38fSH .request-loading__modal-body-main__YIFVW .request-loading__modal-body-main-scroll__3qYCJ .request-loading__modal-body-main-inner__3ySSV { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .request-loading__modal-body__38fSH .request-loading__modal-body-main__YIFVW .request-loading__modal-body-main-scroll__3qYCJ .request-loading__modal-body-main-inner__3ySSV .request-loading__selector-btn-add__2h6Bg, .request-loading__modal-body__38fSH .request-loading__modal-body-main__YIFVW .request-loading__modal-body-main-scroll__3qYCJ .request-loading__modal-body-main-inner__3ySSV .request-loading__selector-btn-item__3A_94 { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .request-loading__modal-body__38fSH .request-loading__modal-body-main__YIFVW .request-loading__modal-body-main-scroll__3qYCJ .request-loading__modal-body-main-inner__3ySSV .request-loading__selector-btn-add__2h6Bg:hover, .request-loading__modal-body__38fSH .request-loading__modal-body-main__YIFVW .request-loading__modal-body-main-scroll__3qYCJ .request-loading__modal-body-main-inner__3ySSV .request-loading__selector-btn-item__3A_94:hover { background-color: #e0e9ff; } .request-loading__modal-body__38fSH .request-loading__modal-body-main__YIFVW .request-loading__modal-body-main-scroll__3qYCJ .request-loading__modal-body-main-inner__3ySSV .request-loading__selector-btn-add__2h6Bg:active, .request-loading__modal-body__38fSH .request-loading__modal-body-main__YIFVW .request-loading__modal-body-main-scroll__3qYCJ .request-loading__modal-body-main-inner__3ySSV .request-loading__selector-btn-item__3A_94:active { background-color: #ccdaff; } .request-loading__modal-body__38fSH .request-loading__modal-body-main__YIFVW .request-loading__modal-body-main-scroll__3qYCJ .request-loading__modal-body-main-inner__3ySSV .request-loading__selector-btn-add__2h6Bg:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .request-loading__modal-body__38fSH .request-loading__modal-body-main__YIFVW .request-loading__modal-body-main-scroll__3qYCJ .request-loading__modal-body-main-inner__3ySSV .request-loading__selector-btn-add__2h6Bg:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .request-loading__modal-body__38fSH .request-loading__modal-body-main__YIFVW .request-loading__modal-body-main-scroll__3qYCJ .request-loading__modal-body-main-inner__3ySSV .request-loading__selector-btn-add__2h6Bg .request-loading__add-img__CrXqh { font-size: 28px; height: auto; margin-bottom: 8px; } .request-loading__modal-body__38fSH .request-loading__modal-body-main__YIFVW .request-loading__modal-body-main-scroll__3qYCJ .request-loading__modal-body-main-inner__3ySSV .request-loading__selector-btn-add__2h6Bg .request-loading__add-label__3-Ud- { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .request-loading__modal-body__38fSH .request-loading__modal-body-main__YIFVW .request-loading__modal-body-main-scroll__3qYCJ .request-loading__modal-body-main-inner__3ySSV .request-loading__selector-btn-item__3A_94 { justify-content: space-between; } .request-loading__modal-body__38fSH .request-loading__modal-body-main__YIFVW .request-loading__modal-body-main-scroll__3qYCJ .request-loading__modal-body-main-inner__3ySSV .request-loading__selector-btn-item__3A_94 .request-loading__item-img__1HrpK { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .request-loading__modal-body__38fSH .request-loading__modal-body-main__YIFVW .request-loading__modal-body-main-scroll__3qYCJ .request-loading__modal-body-main-inner__3ySSV .request-loading__selector-btn-item__3A_94 .request-loading__item-img__1HrpK img { width: auto; height: 105px; } .request-loading__modal-body__38fSH .request-loading__modal-body-main__YIFVW .request-loading__modal-body-main-scroll__3qYCJ .request-loading__modal-body-main-inner__3ySSV .request-loading__selector-btn-item__3A_94 .request-loading__item-label__1IRYc { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .request-loading__modal-footer__1zKuG { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .request-loading__selector-btn-add__2h6Bg, .request-loading__selector-btn-item__3A_94 { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .request-loading__selector-btn-add__2h6Bg { background-color: var(--selector-sprite-bg_primary); } .request-loading__selector-btn-add__2h6Bg:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .request-loading__selector-btn-add__2h6Bg:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .request-loading__selector-btn-add__2h6Bg .request-loading__add-img__CrXqh { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .request-loading__selector-btn-add__2h6Bg .request-loading__add-label__3-Ud- { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .request-loading__selector-btn-item__3A_94 { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .request-loading__selector-btn-item__3A_94 .request-loading__item-img__1HrpK { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .request-loading__selector-btn-item__3A_94 .request-loading__item-img__1HrpK img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .request-loading__selector-btn-item__3A_94 .request-loading__item-label__1IRYc { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .request-loading__selector-btn-item__3A_94:hover { background-color: var(--selector-sprite-bg_primary); } .request-loading__selector-btn-item__3A_94:hover .request-loading__item-img__1HrpK { border-color: var(--selector-sprite-bg_primary); } .request-loading__selector-btn-item_selected__aLsrR { background-color: var(--selector-sprite-bg_primary); } .request-loading__selector-btn-item_selected__aLsrR .request-loading__item-img__1HrpK { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .request-loading__menu-bar-btn__rbO0m { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .request-loading__menu-bar-btn_green__CA4At, .request-loading__menu-bar-btn_create__1FGJq { background-color: #3cdc8f; } .request-loading__menu-bar-btn_green__CA4At:hover, .request-loading__menu-bar-btn_create__1FGJq:hover { background-color: #00d374; } .request-loading__menu-bar-btn_green__CA4At:active, .request-loading__menu-bar-btn_create__1FGJq:active { background-color: #00d374; } .request-loading__menu-bar-btn_save__3kOOI, .request-loading__menu-bar-btn_reset__Dm3qD { background-color: #6ac8ff; } .request-loading__menu-bar-btn_save__3kOOI:hover, .request-loading__menu-bar-btn_reset__Dm3qD:hover { background-color: #57bcfe; } .request-loading__menu-bar-btn_save__3kOOI:active, .request-loading__menu-bar-btn_reset__Dm3qD:active { background-color: #4fb0fc; } .request-loading__menu-bar-btn_submit__1BPTO, .request-loading__menu-bar-btn_open__2YJza { background-color: #ff9e23; } .request-loading__menu-bar-btn_submit__1BPTO:hover, .request-loading__menu-bar-btn_open__2YJza:hover { background-color: #f47b04; } .request-loading__menu-bar-btn_submit__1BPTO:active, .request-loading__menu-bar-btn_open__2YJza:active { background-color: #fe8f22; } .request-loading__menu-bar-btn_link__1qNxr { background-color: #e8efff; color: var(--theme-primary); } .request-loading__menu-bar-btn_link__1qNxr:hover { background-color: #b6c7ff; } .request-loading__menu-bar-btn_link__1qNxr:active { background-color: #cfdcff; } .request-loading__menu-bar-btn_disabled__1Nonz { color: #565266; background-color: #e6e9ed; } .request-loading__menu-bar-btn_disabled__1Nonz:hover { cursor: not-allowed; } .request-loading__menu-bar-btn_help__AVtss { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .request-loading__menu-bar-btn_help__AVtss:hover { background-color: #8398ff; } .request-loading__menu-bar-btn_help__AVtss:active { background-color: #8ca3ff; } .request-loading__menu-bar-separator___iWX9 { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .request-loading__request-loading-mask__3Uv8o { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; z-index: 10000; } .request-loading__request-loading-mask__3Uv8o .request-loading__modal-wrap__21O1d { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .request-loading__request-loading-mask__3Uv8o .request-loading__modal-wrap__21O1d .request-loading__modal-header-wrap__1xTD5 { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .request-loading__request-loading-mask__3Uv8o .request-loading__modal-wrap__21O1d .request-loading__modal-header-wrap__1xTD5 .request-loading__modal-header-bg__1jmIL { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .request-loading__request-loading-mask__3Uv8o .request-loading__modal-wrap__21O1d .request-loading__modal-header-wrap__1xTD5 .request-loading__modal-header-label__YdF_r { flex-shrink: 0; font-size: 16px; font-weight: bold; } .request-loading__request-loading-mask__3Uv8o .request-loading__modal-wrap__21O1d .request-loading__modal-header-wrap__1xTD5 .request-loading__modal-header-close__3EVBt { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .request-loading__request-loading-mask__3Uv8o .request-loading__modal-wrap__21O1d .request-loading__modal-header-wrap__1xTD5 .request-loading__modal-header-close__3EVBt:hover { color: #98a2b4; } .request-loading__request-loading-mask__3Uv8o .request-loading__modal-wrap__21O1d .request-loading__modal-body-wrap__1vLOt { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .request-loading__request-loading-mask__3Uv8o .request-loading__modal-wrap__21O1d .request-loading__modal-footer-wrap__3oXmG { flex-shrink: 0; display: flex; } .request-loading__request-loading-mask__3Uv8o .request-loading__mission-exerciseCq-loading__2ajC2 { width: 250px; height: 274px; } .request-loading__request-loading-mask__3Uv8o .request-loading__mission-exerciseCq-loading__2ajC2 img { width: 250px; height: 250px; animation: request-loading__bounce-down__19ZM8 2s ease-in-out infinite; } @keyframes request-loading__bounce-down__19ZM8 { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-13px); } } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .gui__flex-center__1poRK { display: flex; align-items: center; justify-content: center; } .gui__full-filled__1UM2F { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .gui__modal-mask__OL68C { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .gui__modal-mask__OL68C .gui__modal-wrap__2dmfy { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .gui__modal-mask__OL68C .gui__modal-wrap__2dmfy .gui__modal-header-wrap__14ibQ { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .gui__modal-mask__OL68C .gui__modal-wrap__2dmfy .gui__modal-header-wrap__14ibQ .gui__modal-header-bg__2wlIV { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .gui__modal-mask__OL68C .gui__modal-wrap__2dmfy .gui__modal-header-wrap__14ibQ .gui__modal-header-label__SfpOH { flex-shrink: 0; font-size: 16px; font-weight: bold; } .gui__modal-mask__OL68C .gui__modal-wrap__2dmfy .gui__modal-header-wrap__14ibQ .gui__modal-header-close__Oak7L { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui__modal-mask__OL68C .gui__modal-wrap__2dmfy .gui__modal-header-wrap__14ibQ .gui__modal-header-close__Oak7L:hover { color: #98a2b4; } .gui__modal-mask__OL68C .gui__modal-wrap__2dmfy .gui__modal-body-wrap__h440O { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .gui__modal-mask__OL68C .gui__modal-wrap__2dmfy .gui__modal-footer-wrap__3wp2V { flex-shrink: 0; display: flex; } .gui__modal-header__yYZ89 { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .gui__modal-header__yYZ89 .gui__modal-header-upload__1-aJU { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .gui__modal-header__yYZ89 .gui__modal-header-upload__1-aJU:hover { background-color: #e0e9ff; } .gui__modal-header__yYZ89 .gui__modal-header-upload__1-aJU:active { background-color: #ccdaff; } .gui__modal-header__yYZ89 .gui__modal-header-upload__1-aJU .gui__upload-img__2w8f- { font-size: 16px; margin-right: calc(2px); } .gui__modal-header__yYZ89 .gui__modal-header-upload__1-aJU .gui__upload-label__2XgG8 { font-size: 14px; } .gui__modal-header__yYZ89 .gui__modal-header-upload__1-aJU .gui__upload-input__1Trjo { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui__modal-header__yYZ89 .gui__modal-header-search__3azJM { position: relative; } .gui__modal-header__yYZ89 .gui__modal-header-search__3azJM .gui__search-input__1gb5A { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .gui__modal-header__yYZ89 .gui__modal-header-search__3azJM .gui__search-input__1gb5A::-webkit-input-placeholder { color: #98a2b4; } .gui__modal-header__yYZ89 .gui__modal-header-search__3azJM .gui__search-input__1gb5A::-moz-placeholder { color: #98a2b4; } .gui__modal-header__yYZ89 .gui__modal-header-search__3azJM .gui__search-input__1gb5A:-ms-input-placeholder { color: #98a2b4; } .gui__modal-header__yYZ89 .gui__modal-header-search__3azJM .gui__search-input__1gb5A:hover { border-color: #d1d7e1; } .gui__modal-header__yYZ89 .gui__modal-header-search__3azJM .gui__search-input__1gb5A:active { border-color: #d1d7e1; } .gui__modal-header__yYZ89 .gui__modal-header-search__3azJM .gui__search-img__1voSL { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui__modal-body__3t46_ { flex-grow: 1; display: flex; } .gui__modal-body__3t46_ .gui__modal-body-left__2zZ3L, .gui__modal-body__3t46_ .gui__modal-body-main__24z72 { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .gui__modal-body__3t46_ .gui__modal-body-left__2zZ3L { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .gui__modal-body__3t46_ .gui__modal-body-left__2zZ3L .gui__modal-body-left-scroll__2EMxa { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .gui__modal-body__3t46_ .gui__modal-body-left__2zZ3L .gui__modal-body-left-scroll__2EMxa .gui__modal-body-left-inner__WBCDc { width: 121px; padding: calc(12px); color: #5e6b81; } .gui__modal-body__3t46_ .gui__modal-body-left__2zZ3L .gui__modal-body-left-scroll__2EMxa .gui__modal-body-left-inner__WBCDc .gui__menu-item-current__1U5e3 { color: var(--theme-primary); background-color: #e0e9ff; } .gui__modal-body__3t46_ .gui__modal-body-left__2zZ3L .gui__modal-body-left-scroll__2EMxa .gui__modal-body-left-inner__WBCDc .gui__menu-item__2AGmi { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui__modal-body__3t46_ .gui__modal-body-left__2zZ3L .gui__modal-body-left-scroll__2EMxa .gui__modal-body-left-inner__WBCDc .gui__menu-item__2AGmi:hover { background-color: #edeff5; } .gui__modal-body__3t46_ .gui__modal-body-left__2zZ3L .gui__modal-body-left-scroll__2EMxa .gui__modal-body-left-inner__WBCDc .gui__menu-item__2AGmi .gui__menu-item-img__34z2G { flex-shrink: 0; width: 20px; margin-right: 8px; } .gui__modal-body__3t46_ .gui__modal-body-left__2zZ3L .gui__modal-body-left-scroll__2EMxa .gui__modal-body-left-inner__WBCDc .gui__menu-item__2AGmi .gui__menu-item-label__1_cOh { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .gui__modal-body__3t46_ .gui__modal-body-main__24z72 { padding: calc(12px) 0; } .gui__modal-body__3t46_ .gui__modal-body-main__24z72 .gui__modal-body-main-scroll__2frW8 { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .gui__modal-body__3t46_ .gui__modal-body-main__24z72 .gui__modal-body-main-scroll__2frW8 .gui__modal-body-main-inner__37PTf { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .gui__modal-body__3t46_ .gui__modal-body-main__24z72 .gui__modal-body-main-scroll__2frW8 .gui__modal-body-main-inner__37PTf .gui__selector-btn-add___HJox, .gui__modal-body__3t46_ .gui__modal-body-main__24z72 .gui__modal-body-main-scroll__2frW8 .gui__modal-body-main-inner__37PTf .gui__selector-btn-item__FxMbM { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .gui__modal-body__3t46_ .gui__modal-body-main__24z72 .gui__modal-body-main-scroll__2frW8 .gui__modal-body-main-inner__37PTf .gui__selector-btn-add___HJox:hover, .gui__modal-body__3t46_ .gui__modal-body-main__24z72 .gui__modal-body-main-scroll__2frW8 .gui__modal-body-main-inner__37PTf .gui__selector-btn-item__FxMbM:hover { background-color: #e0e9ff; } .gui__modal-body__3t46_ .gui__modal-body-main__24z72 .gui__modal-body-main-scroll__2frW8 .gui__modal-body-main-inner__37PTf .gui__selector-btn-add___HJox:active, .gui__modal-body__3t46_ .gui__modal-body-main__24z72 .gui__modal-body-main-scroll__2frW8 .gui__modal-body-main-inner__37PTf .gui__selector-btn-item__FxMbM:active { background-color: #ccdaff; } .gui__modal-body__3t46_ .gui__modal-body-main__24z72 .gui__modal-body-main-scroll__2frW8 .gui__modal-body-main-inner__37PTf .gui__selector-btn-add___HJox:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .gui__modal-body__3t46_ .gui__modal-body-main__24z72 .gui__modal-body-main-scroll__2frW8 .gui__modal-body-main-inner__37PTf .gui__selector-btn-add___HJox:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .gui__modal-body__3t46_ .gui__modal-body-main__24z72 .gui__modal-body-main-scroll__2frW8 .gui__modal-body-main-inner__37PTf .gui__selector-btn-add___HJox .gui__add-img__3lAJM { font-size: 28px; height: auto; margin-bottom: 8px; } .gui__modal-body__3t46_ .gui__modal-body-main__24z72 .gui__modal-body-main-scroll__2frW8 .gui__modal-body-main-inner__37PTf .gui__selector-btn-add___HJox .gui__add-label__2ccf5 { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .gui__modal-body__3t46_ .gui__modal-body-main__24z72 .gui__modal-body-main-scroll__2frW8 .gui__modal-body-main-inner__37PTf .gui__selector-btn-item__FxMbM { justify-content: space-between; } .gui__modal-body__3t46_ .gui__modal-body-main__24z72 .gui__modal-body-main-scroll__2frW8 .gui__modal-body-main-inner__37PTf .gui__selector-btn-item__FxMbM .gui__item-img__3K0lG { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .gui__modal-body__3t46_ .gui__modal-body-main__24z72 .gui__modal-body-main-scroll__2frW8 .gui__modal-body-main-inner__37PTf .gui__selector-btn-item__FxMbM .gui__item-img__3K0lG img { width: auto; height: 105px; } .gui__modal-body__3t46_ .gui__modal-body-main__24z72 .gui__modal-body-main-scroll__2frW8 .gui__modal-body-main-inner__37PTf .gui__selector-btn-item__FxMbM .gui__item-label__3AnBa { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .gui__modal-footer__1iF_4 { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .gui__selector-btn-add___HJox, .gui__selector-btn-item__FxMbM { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .gui__selector-btn-add___HJox { background-color: var(--selector-sprite-bg_primary); } .gui__selector-btn-add___HJox:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .gui__selector-btn-add___HJox:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .gui__selector-btn-add___HJox .gui__add-img__3lAJM { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .gui__selector-btn-add___HJox .gui__add-label__2ccf5 { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .gui__selector-btn-item__FxMbM { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .gui__selector-btn-item__FxMbM .gui__item-img__3K0lG { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .gui__selector-btn-item__FxMbM .gui__item-img__3K0lG img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .gui__selector-btn-item__FxMbM .gui__item-label__3AnBa { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .gui__selector-btn-item__FxMbM:hover { background-color: var(--selector-sprite-bg_primary); } .gui__selector-btn-item__FxMbM:hover .gui__item-img__3K0lG { border-color: var(--selector-sprite-bg_primary); } .gui__selector-btn-item_selected__3tY89 { background-color: var(--selector-sprite-bg_primary); } .gui__selector-btn-item_selected__3tY89 .gui__item-img__3K0lG { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .gui__menu-bar-btn__yyK1H { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .gui__menu-bar-btn_green__3Sxc-, .gui__menu-bar-btn_create__1cYJ_ { background-color: #3cdc8f; } .gui__menu-bar-btn_green__3Sxc-:hover, .gui__menu-bar-btn_create__1cYJ_:hover { background-color: #00d374; } .gui__menu-bar-btn_green__3Sxc-:active, .gui__menu-bar-btn_create__1cYJ_:active { background-color: #00d374; } .gui__menu-bar-btn_save__3osto, .gui__menu-bar-btn_reset__3XgwJ { background-color: #6ac8ff; } .gui__menu-bar-btn_save__3osto:hover, .gui__menu-bar-btn_reset__3XgwJ:hover { background-color: #57bcfe; } .gui__menu-bar-btn_save__3osto:active, .gui__menu-bar-btn_reset__3XgwJ:active { background-color: #4fb0fc; } .gui__menu-bar-btn_submit__2rP1N, .gui__menu-bar-btn_open__24Sam { background-color: #ff9e23; } .gui__menu-bar-btn_submit__2rP1N:hover, .gui__menu-bar-btn_open__24Sam:hover { background-color: #f47b04; } .gui__menu-bar-btn_submit__2rP1N:active, .gui__menu-bar-btn_open__24Sam:active { background-color: #fe8f22; } .gui__menu-bar-btn_link__2I17y { background-color: #e8efff; color: var(--theme-primary); } .gui__menu-bar-btn_link__2I17y:hover { background-color: #b6c7ff; } .gui__menu-bar-btn_link__2I17y:active { background-color: #cfdcff; } .gui__menu-bar-btn_disabled__19fJe { color: #565266; background-color: #e6e9ed; } .gui__menu-bar-btn_disabled__19fJe:hover { cursor: not-allowed; } .gui__menu-bar-btn_help__2h-km { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .gui__menu-bar-btn_help__2h-km:hover { background-color: #8398ff; } .gui__menu-bar-btn_help__2h-km:active { background-color: #8ca3ff; } .gui__menu-bar-separator__11hYC { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .gui__page-wrapper__JKaGl { width: 100%; height: 100vh; background-color: var(--theme-primary); display: flex; flex-direction: column; } .gui__page-wrapper__JKaGl .gui__alerts-container__2bpvu { display: flex; justify-content: center; width: 100%; z-index: 490; position: absolute; margin-top: 53px; pointer-events: none; } .gui__page-wrapper__JKaGl .gui__body-wrapper__XXxbg { flex: 1 0; background-color: #ffffff; display: flex; /* Make 2 columns: a) for the blocks + workspace panes, and b) for combined stage menu + stage + sprite/stage selectors */ overflow-y: hidden; border-radius: 8px 8px 0 0; position: relative; } .gui__page-wrapper__JKaGl .gui__body-wrapper__XXxbg.gui__body-wrapper__no-menu__1PAXz { height: 100%; } .gui__page-wrapper__JKaGl .gui__body-wrapper__XXxbg .gui__stage-and-target-wrapper__1suG_ { /* Makes rows for children: 1) stage menu 2) stage 3) sprite/stage selectors Only reason we need this, is so .targetWrapper, which holds the selectors, goes to full vertical height of the window */ display: flex; flex-direction: column; /* pad entire wrapper to the left and right; allow children to fill width */ /* padding-left: @space; */ /* this will only ever be as wide as the stage */ flex-basis: 0; position: relative; } .gui__page-wrapper__JKaGl .gui__body-wrapper__XXxbg .gui__stage-and-target-wrapper__1suG_.gui__show__3S3dD { display: flex; } .gui__page-wrapper__JKaGl .gui__body-wrapper__XXxbg .gui__stage-and-target-wrapper__1suG_.gui__hidden__YZgE5 { display: none; width: 0; height: 0; } .gui__page-wrapper__JKaGl .gui__body-wrapper__XXxbg .gui__editor-wrapper__14gy8 { flex: 1 0; position: relative; display: flex; flex-direction: column; } .gui__page-wrapper__JKaGl .gui__body-wrapper__XXxbg .gui__editor-wrapper__14gy8 .gui__control-stop_wrap__30cXF, .gui__page-wrapper__JKaGl .gui__body-wrapper__XXxbg .gui__editor-wrapper__14gy8 .gui__control-start_wrap__e5fWs { display: flex; align-items: center; justify-content: center; background-color: #ffffff; position: absolute; right: 1rem; bottom: 1rem; width: 4.38rem; height: 2.75rem; border: 2px solid transparent; border-radius: 2.75rem; z-index: calc(1002); } .gui__page-wrapper__JKaGl .gui__body-wrapper__XXxbg .gui__editor-wrapper__14gy8 .gui__control-stop_wrap__30cXF { border-color: #ff666d; } .gui__page-wrapper__JKaGl .gui__body-wrapper__XXxbg .gui__editor-wrapper__14gy8 .gui__control-stop_wrap__30cXF .gui__control-stop__1FcO1 { width: 1.2rem; height: 1.2rem; background-color: #ff666d; border-radius: 2px; } .gui__page-wrapper__JKaGl .gui__body-wrapper__XXxbg .gui__editor-wrapper__14gy8 .gui__control-start_wrap__e5fWs { border-color: #0fce72; } .gui__page-wrapper__JKaGl .gui__body-wrapper__XXxbg .gui__editor-wrapper__14gy8 .gui__control-start_wrap__e5fWs .gui__control-start__2NFsu { width: 1.7rem; } /* Make the (background) page not scrollable when modals are open This CSS class is automatically added to the body when react-modal is open */ .ReactModal__Body--open { overflow: hidden; } .tutorial .blockyVisibleControl { pointer-events: none; transform: translate(50px, 0px) !important; opacity: 1 !important; -webkit-clip-path: none !important; clip-path: none !important; box-shadow: 3px 0px 12px rgba(72, 102, 179, 0.06); } .tutorial .blockyVisibleControl .blocklyWorkspace { pointer-events: all; } .ant-switch-checked .ant-switch-handle { left: calc(100% - 18px - 2px); } .ant-switch-small.ant-switch-checked .ant-switch-handle { left: calc(100% - 14px); } .active-line-number.line-numbers::after { content: ''; z-index: -1; display: block; width: 30px; height: 100%; position: absolute; top: 0; left: 3px; background-repeat: no-repeat; background-size: contain; background-image: url(https://ybc-online.oss-cn-beijing.aliyuncs.com/ybccrm/ada-school-ide/img/common/editor-highlighter.png); } .margin-view-overlays { font-weight: 700 !important; } .margin-view-overlays > div { display: flex !important; justify-content: flex-start; } .margin-view-overlays > div .line-numbers { position: static !important; width: unset !important; margin-left: 8px !important; } [data-field-type='button'] { cursor: url(static/cursor/cursor-pointer.cur), pointer; } .scratchRgbPicker { border-radius: 8px; display: flex; flex-wrap: wrap; overflow: hidden; padding: 7px; box-sizing: border-box; } .scratchRgbPicker span { overflow: hidden; margin: 5px; display: block; height: 18px; width: 18px; box-sizing: content-box; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 2px; border-width: 2px; border-style: solid; border-color: rgba(0, 0, 0, 0); border-radius: 50%; transition: border-color 0.3s; } .scratchRgbPicker span:hover { border-color: rgba(0, 0, 0, 0.2); } .scratchRgbPicker span:active { border-color: rgba(0, 0, 0, 0.3); } .scratchRgbPicker span.white { border-color: rgba(0, 0, 0, 0.2); } .scratchRgbPicker span.white:hover { border-color: rgba(0, 0, 0, 0.2); } .scratchRgbPicker span.white:active { border-color: rgba(0, 0, 0, 0.3); } .scratchRgbPicker span.black { border-color: #000000; } .scratchRgbPicker span.black:hover { border-color: #676767; } .scratchRgbPicker span.black:active { border-color: #6a6a6a; } .scratchHuePicker .goog-slider-horizontal { width: 256px !important; height: 16px !important; margin: 0 16px 18px 16px; } .scratchHuePicker .goog-slider-thumb { cursor: url(static/cursor/cursor-pointer.cur), pointer; height: 16.8px !important; width: 16.8px !important; top: -0.4px !important; box-shadow: 0 0 0 5.6px rgb(0 0 0 / 20%) !important; transition: box-shadow 0.3s; } .scratchHuePicker .goog-slider-thumb:hover { box-shadow: 0 0 0 5.6px rgb(0 0 0 / 30%) !important; } .scratchHuePicker .goog-slider-thumb:active { box-shadow: 0 0 0 5.6px rgb(0 0 0 / 40%) !important; } .scratchHuePicker .scratchColourPickerLabel { font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-style: normal !important; font-weight: normal !important; font-size: 14px !important; line-height: 14px !important; color: #555555 !important; margin: 16px 0 14px 16px !important; } .scratchHuePicker .scratchColourPickerLabel .scratchColourPickerLabelText { font-weight: unset; } .scratchHuePicker .scratchColourPickerLabel .scratchColourPickerReadout { margin-left: 12px; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .tab_jr__flex-center__1Bv4x { display: flex; align-items: center; justify-content: center; } .tab_jr__full-filled___KcKX { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .tab_jr__modal-mask__EdZ_l { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .tab_jr__modal-mask__EdZ_l .tab_jr__modal-wrap__3cjz- { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .tab_jr__modal-mask__EdZ_l .tab_jr__modal-wrap__3cjz- .tab_jr__modal-header-wrap__3xd55 { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .tab_jr__modal-mask__EdZ_l .tab_jr__modal-wrap__3cjz- .tab_jr__modal-header-wrap__3xd55 .tab_jr__modal-header-bg__Ftyvl { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .tab_jr__modal-mask__EdZ_l .tab_jr__modal-wrap__3cjz- .tab_jr__modal-header-wrap__3xd55 .tab_jr__modal-header-label__2hUI0 { flex-shrink: 0; font-size: 16px; font-weight: bold; } .tab_jr__modal-mask__EdZ_l .tab_jr__modal-wrap__3cjz- .tab_jr__modal-header-wrap__3xd55 .tab_jr__modal-header-close__199JL { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .tab_jr__modal-mask__EdZ_l .tab_jr__modal-wrap__3cjz- .tab_jr__modal-header-wrap__3xd55 .tab_jr__modal-header-close__199JL:hover { color: #98a2b4; } .tab_jr__modal-mask__EdZ_l .tab_jr__modal-wrap__3cjz- .tab_jr__modal-body-wrap__2YHvz { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .tab_jr__modal-mask__EdZ_l .tab_jr__modal-wrap__3cjz- .tab_jr__modal-footer-wrap__TwgGs { flex-shrink: 0; display: flex; } .tab_jr__modal-header__8NZvT { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .tab_jr__modal-header__8NZvT .tab_jr__modal-header-upload__2YYV9 { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .tab_jr__modal-header__8NZvT .tab_jr__modal-header-upload__2YYV9:hover { background-color: #e0e9ff; } .tab_jr__modal-header__8NZvT .tab_jr__modal-header-upload__2YYV9:active { background-color: #ccdaff; } .tab_jr__modal-header__8NZvT .tab_jr__modal-header-upload__2YYV9 .tab_jr__upload-img__2BAhD { font-size: 16px; margin-right: calc(2px); } .tab_jr__modal-header__8NZvT .tab_jr__modal-header-upload__2YYV9 .tab_jr__upload-label__2vSlP { font-size: 14px; } .tab_jr__modal-header__8NZvT .tab_jr__modal-header-upload__2YYV9 .tab_jr__upload-input__1aWR9 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .tab_jr__modal-header__8NZvT .tab_jr__modal-header-search__2NB3q { position: relative; } .tab_jr__modal-header__8NZvT .tab_jr__modal-header-search__2NB3q .tab_jr__search-input__MQhsU { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .tab_jr__modal-header__8NZvT .tab_jr__modal-header-search__2NB3q .tab_jr__search-input__MQhsU::-webkit-input-placeholder { color: #98a2b4; } .tab_jr__modal-header__8NZvT .tab_jr__modal-header-search__2NB3q .tab_jr__search-input__MQhsU::-moz-placeholder { color: #98a2b4; } .tab_jr__modal-header__8NZvT .tab_jr__modal-header-search__2NB3q .tab_jr__search-input__MQhsU:-ms-input-placeholder { color: #98a2b4; } .tab_jr__modal-header__8NZvT .tab_jr__modal-header-search__2NB3q .tab_jr__search-input__MQhsU:hover { border-color: #d1d7e1; } .tab_jr__modal-header__8NZvT .tab_jr__modal-header-search__2NB3q .tab_jr__search-input__MQhsU:active { border-color: #d1d7e1; } .tab_jr__modal-header__8NZvT .tab_jr__modal-header-search__2NB3q .tab_jr__search-img__143KM { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .tab_jr__modal-body__24Amz { flex-grow: 1; display: flex; } .tab_jr__modal-body__24Amz .tab_jr__modal-body-left__1n2Bb, .tab_jr__modal-body__24Amz .tab_jr__modal-body-main__1KEQd { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .tab_jr__modal-body__24Amz .tab_jr__modal-body-left__1n2Bb { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .tab_jr__modal-body__24Amz .tab_jr__modal-body-left__1n2Bb .tab_jr__modal-body-left-scroll__erjLV { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .tab_jr__modal-body__24Amz .tab_jr__modal-body-left__1n2Bb .tab_jr__modal-body-left-scroll__erjLV .tab_jr__modal-body-left-inner__iExEY { width: 121px; padding: calc(12px); color: #5e6b81; } .tab_jr__modal-body__24Amz .tab_jr__modal-body-left__1n2Bb .tab_jr__modal-body-left-scroll__erjLV .tab_jr__modal-body-left-inner__iExEY .tab_jr__menu-item-current__2M_6p { color: var(--theme-primary); background-color: #e0e9ff; } .tab_jr__modal-body__24Amz .tab_jr__modal-body-left__1n2Bb .tab_jr__modal-body-left-scroll__erjLV .tab_jr__modal-body-left-inner__iExEY .tab_jr__menu-item__1zZj9 { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .tab_jr__modal-body__24Amz .tab_jr__modal-body-left__1n2Bb .tab_jr__modal-body-left-scroll__erjLV .tab_jr__modal-body-left-inner__iExEY .tab_jr__menu-item__1zZj9:hover { background-color: #edeff5; } .tab_jr__modal-body__24Amz .tab_jr__modal-body-left__1n2Bb .tab_jr__modal-body-left-scroll__erjLV .tab_jr__modal-body-left-inner__iExEY .tab_jr__menu-item__1zZj9 .tab_jr__menu-item-img__2V-UK { flex-shrink: 0; width: 20px; margin-right: 8px; } .tab_jr__modal-body__24Amz .tab_jr__modal-body-left__1n2Bb .tab_jr__modal-body-left-scroll__erjLV .tab_jr__modal-body-left-inner__iExEY .tab_jr__menu-item__1zZj9 .tab_jr__menu-item-label__1NnDU { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .tab_jr__modal-body__24Amz .tab_jr__modal-body-main__1KEQd { padding: calc(12px) 0; } .tab_jr__modal-body__24Amz .tab_jr__modal-body-main__1KEQd .tab_jr__modal-body-main-scroll__1Fei- { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .tab_jr__modal-body__24Amz .tab_jr__modal-body-main__1KEQd .tab_jr__modal-body-main-scroll__1Fei- .tab_jr__modal-body-main-inner__2R3R1 { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .tab_jr__modal-body__24Amz .tab_jr__modal-body-main__1KEQd .tab_jr__modal-body-main-scroll__1Fei- .tab_jr__modal-body-main-inner__2R3R1 .tab_jr__selector-btn-add__9iIfm, .tab_jr__modal-body__24Amz .tab_jr__modal-body-main__1KEQd .tab_jr__modal-body-main-scroll__1Fei- .tab_jr__modal-body-main-inner__2R3R1 .tab_jr__selector-btn-item__3hiJK { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .tab_jr__modal-body__24Amz .tab_jr__modal-body-main__1KEQd .tab_jr__modal-body-main-scroll__1Fei- .tab_jr__modal-body-main-inner__2R3R1 .tab_jr__selector-btn-add__9iIfm:hover, .tab_jr__modal-body__24Amz .tab_jr__modal-body-main__1KEQd .tab_jr__modal-body-main-scroll__1Fei- .tab_jr__modal-body-main-inner__2R3R1 .tab_jr__selector-btn-item__3hiJK:hover { background-color: #e0e9ff; } .tab_jr__modal-body__24Amz .tab_jr__modal-body-main__1KEQd .tab_jr__modal-body-main-scroll__1Fei- .tab_jr__modal-body-main-inner__2R3R1 .tab_jr__selector-btn-add__9iIfm:active, .tab_jr__modal-body__24Amz .tab_jr__modal-body-main__1KEQd .tab_jr__modal-body-main-scroll__1Fei- .tab_jr__modal-body-main-inner__2R3R1 .tab_jr__selector-btn-item__3hiJK:active { background-color: #ccdaff; } .tab_jr__modal-body__24Amz .tab_jr__modal-body-main__1KEQd .tab_jr__modal-body-main-scroll__1Fei- .tab_jr__modal-body-main-inner__2R3R1 .tab_jr__selector-btn-add__9iIfm:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .tab_jr__modal-body__24Amz .tab_jr__modal-body-main__1KEQd .tab_jr__modal-body-main-scroll__1Fei- .tab_jr__modal-body-main-inner__2R3R1 .tab_jr__selector-btn-add__9iIfm:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .tab_jr__modal-body__24Amz .tab_jr__modal-body-main__1KEQd .tab_jr__modal-body-main-scroll__1Fei- .tab_jr__modal-body-main-inner__2R3R1 .tab_jr__selector-btn-add__9iIfm .tab_jr__add-img__1mnSE { font-size: 28px; height: auto; margin-bottom: 8px; } .tab_jr__modal-body__24Amz .tab_jr__modal-body-main__1KEQd .tab_jr__modal-body-main-scroll__1Fei- .tab_jr__modal-body-main-inner__2R3R1 .tab_jr__selector-btn-add__9iIfm .tab_jr__add-label__2_UvJ { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .tab_jr__modal-body__24Amz .tab_jr__modal-body-main__1KEQd .tab_jr__modal-body-main-scroll__1Fei- .tab_jr__modal-body-main-inner__2R3R1 .tab_jr__selector-btn-item__3hiJK { justify-content: space-between; } .tab_jr__modal-body__24Amz .tab_jr__modal-body-main__1KEQd .tab_jr__modal-body-main-scroll__1Fei- .tab_jr__modal-body-main-inner__2R3R1 .tab_jr__selector-btn-item__3hiJK .tab_jr__item-img__2wJ7C { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .tab_jr__modal-body__24Amz .tab_jr__modal-body-main__1KEQd .tab_jr__modal-body-main-scroll__1Fei- .tab_jr__modal-body-main-inner__2R3R1 .tab_jr__selector-btn-item__3hiJK .tab_jr__item-img__2wJ7C img { width: auto; height: 105px; } .tab_jr__modal-body__24Amz .tab_jr__modal-body-main__1KEQd .tab_jr__modal-body-main-scroll__1Fei- .tab_jr__modal-body-main-inner__2R3R1 .tab_jr__selector-btn-item__3hiJK .tab_jr__item-label__2Uaab { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .tab_jr__modal-footer__UD-_k { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .tab_jr__selector-btn-add__9iIfm, .tab_jr__selector-btn-item__3hiJK { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .tab_jr__selector-btn-add__9iIfm { background-color: var(--selector-sprite-bg_primary); } .tab_jr__selector-btn-add__9iIfm:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .tab_jr__selector-btn-add__9iIfm:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .tab_jr__selector-btn-add__9iIfm .tab_jr__add-img__1mnSE { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .tab_jr__selector-btn-add__9iIfm .tab_jr__add-label__2_UvJ { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .tab_jr__selector-btn-item__3hiJK { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .tab_jr__selector-btn-item__3hiJK .tab_jr__item-img__2wJ7C { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .tab_jr__selector-btn-item__3hiJK .tab_jr__item-img__2wJ7C img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .tab_jr__selector-btn-item__3hiJK .tab_jr__item-label__2Uaab { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .tab_jr__selector-btn-item__3hiJK:hover { background-color: var(--selector-sprite-bg_primary); } .tab_jr__selector-btn-item__3hiJK:hover .tab_jr__item-img__2wJ7C { border-color: var(--selector-sprite-bg_primary); } .tab_jr__selector-btn-item_selected__3C252 { background-color: var(--selector-sprite-bg_primary); } .tab_jr__selector-btn-item_selected__3C252 .tab_jr__item-img__2wJ7C { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .tab_jr__menu-bar-btn__327kG { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .tab_jr__menu-bar-btn_green__1O-Qe, .tab_jr__menu-bar-btn_create__3s1jo { background-color: #3cdc8f; } .tab_jr__menu-bar-btn_green__1O-Qe:hover, .tab_jr__menu-bar-btn_create__3s1jo:hover { background-color: #00d374; } .tab_jr__menu-bar-btn_green__1O-Qe:active, .tab_jr__menu-bar-btn_create__3s1jo:active { background-color: #00d374; } .tab_jr__menu-bar-btn_save__1pFax, .tab_jr__menu-bar-btn_reset__2KDMk { background-color: #6ac8ff; } .tab_jr__menu-bar-btn_save__1pFax:hover, .tab_jr__menu-bar-btn_reset__2KDMk:hover { background-color: #57bcfe; } .tab_jr__menu-bar-btn_save__1pFax:active, .tab_jr__menu-bar-btn_reset__2KDMk:active { background-color: #4fb0fc; } .tab_jr__menu-bar-btn_submit__2axRA, .tab_jr__menu-bar-btn_open__1u7WR { background-color: #ff9e23; } .tab_jr__menu-bar-btn_submit__2axRA:hover, .tab_jr__menu-bar-btn_open__1u7WR:hover { background-color: #f47b04; } .tab_jr__menu-bar-btn_submit__2axRA:active, .tab_jr__menu-bar-btn_open__1u7WR:active { background-color: #fe8f22; } .tab_jr__menu-bar-btn_link__3tkn5 { background-color: #e8efff; color: var(--theme-primary); } .tab_jr__menu-bar-btn_link__3tkn5:hover { background-color: #b6c7ff; } .tab_jr__menu-bar-btn_link__3tkn5:active { background-color: #cfdcff; } .tab_jr__menu-bar-btn_disabled__hE7Lb { color: #565266; background-color: #e6e9ed; } .tab_jr__menu-bar-btn_disabled__hE7Lb:hover { cursor: not-allowed; } .tab_jr__menu-bar-btn_help__pshqo { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .tab_jr__menu-bar-btn_help__pshqo:hover { background-color: #8398ff; } .tab_jr__menu-bar-btn_help__pshqo:active { background-color: #8ca3ff; } .tab_jr__menu-bar-separator__W5I8u { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* tab 组件整体 */ .tab_jr__tabs-jr__3Jblb { position: relative; flex-grow: 1; display: flex; flex-direction: column; } .tab_jr__tabs-jr__3Jblb .tab_jr__tab-list__2GAzM { display: flex; align-items: flex-end; margin: 0; border: none; height: var(--menu-bar-height); background-position: right; background-size: auto var(--menu-bar-height); background-repeat: repeat; background-color: var(--menu-bar-bg-color); } .tab_jr__tabs-jr__3Jblb .tab_jr__tab-list__2GAzM .tab_jr__tab-item__vd0fl { display: flex; align-items: center; justify-content: center; width: 7.25rem; height: 2.88rem; flex-shrink: 0; white-space: nowrap; position: relative; cursor: url(static/cursor/cursor-pointer.cur), pointer; border: none; border-radius: 0.75rem 0.75rem 0rem 0rem; bottom: 0; padding: 0; } .tab_jr__tabs-jr__3Jblb .tab_jr__tab-list__2GAzM .tab_jr__tab-item__vd0fl:focus { box-shadow: none; } .tab_jr__tabs-jr__3Jblb .tab_jr__tab-list__2GAzM .tab_jr__tab-item__vd0fl img { width: 1.81rem; height: 1.81rem; flex-shrink: 0; margin-right: 0.25rem; } .tab_jr__tabs-jr__3Jblb .tab_jr__tab-list__2GAzM .tab_jr__tab-item__vd0fl .tab_jr__tab-icon__1YpyZ { color: #d7f6ff; font-size: 1.81rem; margin-right: 0.25rem; } .tab_jr__tabs-jr__3Jblb .tab_jr__tab-list__2GAzM .tab_jr__tab-item__vd0fl span { color: #d7f6ff; font-size: 1rem; font-weight: 600; } .tab_jr__tabs-jr__3Jblb .tab_jr__tab-list__2GAzM .tab_jr__tab-item__vd0fl.tab_jr__is-selected__1MjoC { background-color: #00a6ec; /* Make sure selected is always above */ } .tab_jr__tabs-jr__3Jblb .tab_jr__tab-list__2GAzM .tab_jr__tab-item__vd0fl.tab_jr__is-selected__1MjoC .tab_jr__tab-icon__1YpyZ { color: #ffffff; } .tab_jr__tabs-jr__3Jblb .tab_jr__tab-list__2GAzM .tab_jr__tab-item__vd0fl.tab_jr__is-selected__1MjoC span { color: #ffffff; } .tab_jr__tabs-jr__3Jblb .tab_jr__tab-list__2GAzM .tab_jr__tab-item__vd0fl.tab_jr__is-selected__1MjoC::after { content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 10px; height: 3px; background-color: var(--theme-primary); border-radius: 2px; } .tab_jr__tabs-jr__3Jblb .tab_jr__tab-panel__G7Dt5 { position: relative; flex-grow: 1; display: none; } .tab_jr__tabs-jr__3Jblb .tab_jr__tab-panel__G7Dt5.tab_jr__is-selected__1MjoC { display: flex; } .tab_jr__tabs-jr__3Jblb .tab_jr__tab-panel__G7Dt5.tab_jr__is-selected__1MjoC * { -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .gui-share__flex-center__2E7WK { display: flex; align-items: center; justify-content: center; } .gui-share__full-filled__1RZWJ { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .gui-share__modal-mask__3xD86 { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .gui-share__modal-mask__3xD86 .gui-share__modal-wrap__3v3lV { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .gui-share__modal-mask__3xD86 .gui-share__modal-wrap__3v3lV .gui-share__modal-header-wrap__37uyb { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .gui-share__modal-mask__3xD86 .gui-share__modal-wrap__3v3lV .gui-share__modal-header-wrap__37uyb .gui-share__modal-header-bg__2ShdH { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .gui-share__modal-mask__3xD86 .gui-share__modal-wrap__3v3lV .gui-share__modal-header-wrap__37uyb .gui-share__modal-header-label__39lVH { flex-shrink: 0; font-size: 16px; font-weight: bold; } .gui-share__modal-mask__3xD86 .gui-share__modal-wrap__3v3lV .gui-share__modal-header-wrap__37uyb .gui-share__modal-header-close__1pssZ { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui-share__modal-mask__3xD86 .gui-share__modal-wrap__3v3lV .gui-share__modal-header-wrap__37uyb .gui-share__modal-header-close__1pssZ:hover { color: #98a2b4; } .gui-share__modal-mask__3xD86 .gui-share__modal-wrap__3v3lV .gui-share__modal-body-wrap__2_FAv { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .gui-share__modal-mask__3xD86 .gui-share__modal-wrap__3v3lV .gui-share__modal-footer-wrap__2IaBh { flex-shrink: 0; display: flex; } .gui-share__modal-header__31gOu { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .gui-share__modal-header__31gOu .gui-share__modal-header-upload__Xvsnm { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .gui-share__modal-header__31gOu .gui-share__modal-header-upload__Xvsnm:hover { background-color: #e0e9ff; } .gui-share__modal-header__31gOu .gui-share__modal-header-upload__Xvsnm:active { background-color: #ccdaff; } .gui-share__modal-header__31gOu .gui-share__modal-header-upload__Xvsnm .gui-share__upload-img__1UyD3 { font-size: 16px; margin-right: calc(2px); } .gui-share__modal-header__31gOu .gui-share__modal-header-upload__Xvsnm .gui-share__upload-label__QMWd8 { font-size: 14px; } .gui-share__modal-header__31gOu .gui-share__modal-header-upload__Xvsnm .gui-share__upload-input__1dKlm { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui-share__modal-header__31gOu .gui-share__modal-header-search__1LG2S { position: relative; } .gui-share__modal-header__31gOu .gui-share__modal-header-search__1LG2S .gui-share__search-input__1OEkw { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .gui-share__modal-header__31gOu .gui-share__modal-header-search__1LG2S .gui-share__search-input__1OEkw::-webkit-input-placeholder { color: #98a2b4; } .gui-share__modal-header__31gOu .gui-share__modal-header-search__1LG2S .gui-share__search-input__1OEkw::-moz-placeholder { color: #98a2b4; } .gui-share__modal-header__31gOu .gui-share__modal-header-search__1LG2S .gui-share__search-input__1OEkw:-ms-input-placeholder { color: #98a2b4; } .gui-share__modal-header__31gOu .gui-share__modal-header-search__1LG2S .gui-share__search-input__1OEkw:hover { border-color: #d1d7e1; } .gui-share__modal-header__31gOu .gui-share__modal-header-search__1LG2S .gui-share__search-input__1OEkw:active { border-color: #d1d7e1; } .gui-share__modal-header__31gOu .gui-share__modal-header-search__1LG2S .gui-share__search-img__15OqW { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui-share__modal-body__1_EVu { flex-grow: 1; display: flex; } .gui-share__modal-body__1_EVu .gui-share__modal-body-left__1uGj_, .gui-share__modal-body__1_EVu .gui-share__modal-body-main__1RS2n { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .gui-share__modal-body__1_EVu .gui-share__modal-body-left__1uGj_ { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .gui-share__modal-body__1_EVu .gui-share__modal-body-left__1uGj_ .gui-share__modal-body-left-scroll__2x25u { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .gui-share__modal-body__1_EVu .gui-share__modal-body-left__1uGj_ .gui-share__modal-body-left-scroll__2x25u .gui-share__modal-body-left-inner__hGj_f { width: 121px; padding: calc(12px); color: #5e6b81; } .gui-share__modal-body__1_EVu .gui-share__modal-body-left__1uGj_ .gui-share__modal-body-left-scroll__2x25u .gui-share__modal-body-left-inner__hGj_f .gui-share__menu-item-current__Y0aKO { color: var(--theme-primary); background-color: #e0e9ff; } .gui-share__modal-body__1_EVu .gui-share__modal-body-left__1uGj_ .gui-share__modal-body-left-scroll__2x25u .gui-share__modal-body-left-inner__hGj_f .gui-share__menu-item__2NOmU { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui-share__modal-body__1_EVu .gui-share__modal-body-left__1uGj_ .gui-share__modal-body-left-scroll__2x25u .gui-share__modal-body-left-inner__hGj_f .gui-share__menu-item__2NOmU:hover { background-color: #edeff5; } .gui-share__modal-body__1_EVu .gui-share__modal-body-left__1uGj_ .gui-share__modal-body-left-scroll__2x25u .gui-share__modal-body-left-inner__hGj_f .gui-share__menu-item__2NOmU .gui-share__menu-item-img__zXd_h { flex-shrink: 0; width: 20px; margin-right: 8px; } .gui-share__modal-body__1_EVu .gui-share__modal-body-left__1uGj_ .gui-share__modal-body-left-scroll__2x25u .gui-share__modal-body-left-inner__hGj_f .gui-share__menu-item__2NOmU .gui-share__menu-item-label__2d8M2 { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .gui-share__modal-body__1_EVu .gui-share__modal-body-main__1RS2n { padding: calc(12px) 0; } .gui-share__modal-body__1_EVu .gui-share__modal-body-main__1RS2n .gui-share__modal-body-main-scroll__10cwT { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .gui-share__modal-body__1_EVu .gui-share__modal-body-main__1RS2n .gui-share__modal-body-main-scroll__10cwT .gui-share__modal-body-main-inner__1Fli0 { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .gui-share__modal-body__1_EVu .gui-share__modal-body-main__1RS2n .gui-share__modal-body-main-scroll__10cwT .gui-share__modal-body-main-inner__1Fli0 .gui-share__selector-btn-add__26Bvv, .gui-share__modal-body__1_EVu .gui-share__modal-body-main__1RS2n .gui-share__modal-body-main-scroll__10cwT .gui-share__modal-body-main-inner__1Fli0 .gui-share__selector-btn-item__1Sjd8 { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .gui-share__modal-body__1_EVu .gui-share__modal-body-main__1RS2n .gui-share__modal-body-main-scroll__10cwT .gui-share__modal-body-main-inner__1Fli0 .gui-share__selector-btn-add__26Bvv:hover, .gui-share__modal-body__1_EVu .gui-share__modal-body-main__1RS2n .gui-share__modal-body-main-scroll__10cwT .gui-share__modal-body-main-inner__1Fli0 .gui-share__selector-btn-item__1Sjd8:hover { background-color: #e0e9ff; } .gui-share__modal-body__1_EVu .gui-share__modal-body-main__1RS2n .gui-share__modal-body-main-scroll__10cwT .gui-share__modal-body-main-inner__1Fli0 .gui-share__selector-btn-add__26Bvv:active, .gui-share__modal-body__1_EVu .gui-share__modal-body-main__1RS2n .gui-share__modal-body-main-scroll__10cwT .gui-share__modal-body-main-inner__1Fli0 .gui-share__selector-btn-item__1Sjd8:active { background-color: #ccdaff; } .gui-share__modal-body__1_EVu .gui-share__modal-body-main__1RS2n .gui-share__modal-body-main-scroll__10cwT .gui-share__modal-body-main-inner__1Fli0 .gui-share__selector-btn-add__26Bvv:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .gui-share__modal-body__1_EVu .gui-share__modal-body-main__1RS2n .gui-share__modal-body-main-scroll__10cwT .gui-share__modal-body-main-inner__1Fli0 .gui-share__selector-btn-add__26Bvv:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .gui-share__modal-body__1_EVu .gui-share__modal-body-main__1RS2n .gui-share__modal-body-main-scroll__10cwT .gui-share__modal-body-main-inner__1Fli0 .gui-share__selector-btn-add__26Bvv .gui-share__add-img__2UOFM { font-size: 28px; height: auto; margin-bottom: 8px; } .gui-share__modal-body__1_EVu .gui-share__modal-body-main__1RS2n .gui-share__modal-body-main-scroll__10cwT .gui-share__modal-body-main-inner__1Fli0 .gui-share__selector-btn-add__26Bvv .gui-share__add-label__VrGnZ { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .gui-share__modal-body__1_EVu .gui-share__modal-body-main__1RS2n .gui-share__modal-body-main-scroll__10cwT .gui-share__modal-body-main-inner__1Fli0 .gui-share__selector-btn-item__1Sjd8 { justify-content: space-between; } .gui-share__modal-body__1_EVu .gui-share__modal-body-main__1RS2n .gui-share__modal-body-main-scroll__10cwT .gui-share__modal-body-main-inner__1Fli0 .gui-share__selector-btn-item__1Sjd8 .gui-share__item-img__3izwA { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .gui-share__modal-body__1_EVu .gui-share__modal-body-main__1RS2n .gui-share__modal-body-main-scroll__10cwT .gui-share__modal-body-main-inner__1Fli0 .gui-share__selector-btn-item__1Sjd8 .gui-share__item-img__3izwA img { width: auto; height: 105px; } .gui-share__modal-body__1_EVu .gui-share__modal-body-main__1RS2n .gui-share__modal-body-main-scroll__10cwT .gui-share__modal-body-main-inner__1Fli0 .gui-share__selector-btn-item__1Sjd8 .gui-share__item-label__3l4pX { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .gui-share__modal-footer__2Xz9G { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .gui-share__selector-btn-add__26Bvv, .gui-share__selector-btn-item__1Sjd8 { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .gui-share__selector-btn-add__26Bvv { background-color: var(--selector-sprite-bg_primary); } .gui-share__selector-btn-add__26Bvv:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .gui-share__selector-btn-add__26Bvv:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .gui-share__selector-btn-add__26Bvv .gui-share__add-img__2UOFM { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .gui-share__selector-btn-add__26Bvv .gui-share__add-label__VrGnZ { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .gui-share__selector-btn-item__1Sjd8 { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .gui-share__selector-btn-item__1Sjd8 .gui-share__item-img__3izwA { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .gui-share__selector-btn-item__1Sjd8 .gui-share__item-img__3izwA img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .gui-share__selector-btn-item__1Sjd8 .gui-share__item-label__3l4pX { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .gui-share__selector-btn-item__1Sjd8:hover { background-color: var(--selector-sprite-bg_primary); } .gui-share__selector-btn-item__1Sjd8:hover .gui-share__item-img__3izwA { border-color: var(--selector-sprite-bg_primary); } .gui-share__selector-btn-item_selected__azkaU { background-color: var(--selector-sprite-bg_primary); } .gui-share__selector-btn-item_selected__azkaU .gui-share__item-img__3izwA { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .gui-share__menu-bar-btn__35fEk { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .gui-share__menu-bar-btn_green__2f44i, .gui-share__menu-bar-btn_create__3XPcN { background-color: #3cdc8f; } .gui-share__menu-bar-btn_green__2f44i:hover, .gui-share__menu-bar-btn_create__3XPcN:hover { background-color: #00d374; } .gui-share__menu-bar-btn_green__2f44i:active, .gui-share__menu-bar-btn_create__3XPcN:active { background-color: #00d374; } .gui-share__menu-bar-btn_save__2EnAd, .gui-share__menu-bar-btn_reset__3YYyz { background-color: #6ac8ff; } .gui-share__menu-bar-btn_save__2EnAd:hover, .gui-share__menu-bar-btn_reset__3YYyz:hover { background-color: #57bcfe; } .gui-share__menu-bar-btn_save__2EnAd:active, .gui-share__menu-bar-btn_reset__3YYyz:active { background-color: #4fb0fc; } .gui-share__menu-bar-btn_submit__1Qeak, .gui-share__menu-bar-btn_open__1OgrD { background-color: #ff9e23; } .gui-share__menu-bar-btn_submit__1Qeak:hover, .gui-share__menu-bar-btn_open__1OgrD:hover { background-color: #f47b04; } .gui-share__menu-bar-btn_submit__1Qeak:active, .gui-share__menu-bar-btn_open__1OgrD:active { background-color: #fe8f22; } .gui-share__menu-bar-btn_link__3ZLJY { background-color: #e8efff; color: var(--theme-primary); } .gui-share__menu-bar-btn_link__3ZLJY:hover { background-color: #b6c7ff; } .gui-share__menu-bar-btn_link__3ZLJY:active { background-color: #cfdcff; } .gui-share__menu-bar-btn_disabled__3Mbte { color: #565266; background-color: #e6e9ed; } .gui-share__menu-bar-btn_disabled__3Mbte:hover { cursor: not-allowed; } .gui-share__menu-bar-btn_help__3C6gJ { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .gui-share__menu-bar-btn_help__3C6gJ:hover { background-color: #8398ff; } .gui-share__menu-bar-btn_help__3C6gJ:active { background-color: #8ca3ff; } .gui-share__menu-bar-separator__2m2v- { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .gui-share__share-page__1MsHl { display: flex; flex-direction: column; height: 100%; background-image: linear-gradient(171.62deg, #8cd6ff -6.55%, #4345e9 110.1%); overflow: hidden; position: relative; } .gui-share__share-page__1MsHl .gui-share__share-page-container__1Xl0V { width: 100%; height: 100%; position: relative; transform-origin: top; will-change: transform; } .gui-share__share-page__1MsHl .gui-share__qrcode__3Zom3 { position: fixed; width: 326px; height: 46px; object-fit: cover; top: 20px; left: 50%; transform: translate(-50%, 0); } .gui-share__share-page__1MsHl .gui-share__share-page-bg__3-p7L { position: fixed; z-index: 1; top: 80px; left: 50%; object-fit: cover; transform: translate(-50%, 0); } .gui-share__share-page__1MsHl .gui-share__gui-container__WUYga { position: relative; width: 100vw; margin-top: 132px; display: flex; justify-content: center; } .gui-share__share-page__1MsHl .gui-share__run-btn__1QMf6 { position: relative; z-index: 2; margin-top: 60px; display: flex; justify-content: center; padding-top: 5px; } .gui-share__share-page__1MsHl .gui-share__run-btn__1QMf6 button { width: 160px; height: 60px; position: absolute; z-index: 1; border: none; outline: none; background-color: transparent; } .gui-share__share-page__1MsHl .gui-share__run-btn__1QMf6 img { width: 186px; height: 81px; pointer-events: none; } .gui-share__share-page__1MsHl .gui-share__modal-mask__3xD86 { width: 100vw; height: 100vh; position: fixed; z-index: 10000; background-color: rgba(0, 0, 0, 0.64); } .gui-share__share-page__1MsHl .gui-share__modal-mask__3xD86 .gui-share__modal-monkey__20tOQ { position: absolute; top: -68px; left: 50%; transform: translate(-50%, 0); width: 120px; object-fit: cover; } .gui-share__share-page__1MsHl .gui-share__modal-mask__3xD86 .gui-share__modal__3X7KL { height: 253px; width: 245px; background-color: #ffffff; border-radius: 13.8px; display: flex; align-items: center; flex-direction: column; position: relative; font-family: 'PingFang SC'; font-style: normal; } .gui-share__share-page__1MsHl .gui-share__modal-mask__3xD86 .gui-share__modal__3X7KL h4 { padding: 0; margin: 26px 0 0 0; color: #3d4554; font-weight: 600; font-size: 14px; } .gui-share__share-page__1MsHl .gui-share__modal-mask__3xD86 .gui-share__modal__3X7KL h5 { color: #3d4554; font-size: 13.8px; font-weight: 400; margin: 0; } .gui-share__share-page__1MsHl .gui-share__modal-mask__3xD86 .gui-share__modal__3X7KL h5 span { color: #6a7fff; } .gui-share__share-page__1MsHl .gui-share__modal-mask__3xD86 .gui-share__modal__3X7KL .gui-share__wechat__3K-at { margin: 9.76px 0 11px 0; height: 124px; width: 124px; object-fit: cover; filter: drop-shadow(0px 0px 6.90141px rgba(181, 188, 203, 0.5)); border-radius: 9.20188px; } .gui-share__share-page__1MsHl .gui-share__modal-mask__3xD86 .gui-share__modal__3X7KL .gui-share__modal-close-btn__1G1iW { position: absolute; top: 14px; right: 14px; color: #b5bccb; } .gui-share__share-keyboards-container__1LV90 { display: flex; justify-content: space-around; align-items: center; position: relative; margin-top: 5px; width: 100%; z-index: 2; } .gui-share__share-keyboards-container__1LV90 .gui-share__share-keyboards__1ZZUk { height: 100%; background: transparent; display: flex; justify-content: center; align-items: center; padding-right: 3px; } .gui-share__UP__3IMmA:active { transform: rotateX(20deg); box-shadow: 0 12px 0 rgba(0, 0, 0, 0.3), inset 0 6px 3px rgba(255, 255, 255, 0.3); } .gui-share__DOWN___J-_L:active { transform: rotateX(-10deg); box-shadow: 0 2px 0 rgba(0, 0, 0, 0.3), inset 0 -4px 3px rgba(255, 255, 255, 0.3); } .gui-share__LEFT__272ni:active { transform: rotateY(20deg); box-shadow: 4px 4px 0 rgba(0, 0, 0, 0.3), inset 4px 0px 3px rgba(255, 255, 255, 0.3); } .gui-share__RIGHT__2rt64:active { box-shadow: -4px 4px 0 rgba(0, 0, 0, 0.3), inset -4px 0px 3px rgba(255, 255, 255, 0.3); transform: rotateY(-20deg); } .gui-share__joystick__1uJGQ { height: 121px; width: 182px; position: relative; background-size: cover; display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 1fr); padding: 14px; flex-shrink: 0; margin-right: 15px; } .gui-share__joystick__1uJGQ button { position: relative; display: flex; justify-content: center; align-items: center; border: none; outline: none; background: transparent; transform: translate(0px, -12px); width: 100%; } .gui-share__joystick__1uJGQ button img { padding: 0; background-size: cover; height: 28px; width: 32px; position: relative; pointer-events: none; } .gui-share__right-place__3-bMu { position: relative; margin-left: 15px; } .gui-share__right-place__3-bMu .gui-share__space-btn__18yGN { background-color: transparent; background-size: cover; width: 126px; height: 66px; position: relative; outline: none; } .gui-share__right-place__3-bMu .gui-share__space-btn__18yGN:first-of-type { z-index: 2; } .gui-share__right-place__3-bMu .gui-share__space-btn__18yGN:last-of-type { z-index: 1; position: absolute; top: 0; left: 0; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .spinner__spinner__1c6Go { width: 1.25rem; height: 1.25rem; display: inline-block; position: relative; border-radius: 50%; border-width: 0.1875rem; border-style: solid; border-color: rgba(255, 255, 255, 0.25); box-sizing: content-box; } .spinner__spinner__1c6Go::before, .spinner__spinner__1c6Go::after { width: 1.25rem; height: 1.25rem; content: ''; border-radius: 50%; display: block; } .spinner__spinner__1c6Go::after { position: absolute; top: -0.1875rem; left: -0.1875rem; border: 0.1875rem solid transparent; border-top-color: #ffffff; animation: spinner__spin__2xflK 1.5s cubic-bezier(0.4, 0.1, 0.4, 1) infinite; } .spinner__small__1zt8W { width: 0.5rem; height: 0.5rem; } .spinner__small__1zt8W::before, .spinner__small__1zt8W::after { width: 0.5rem; height: 0.5rem; } .spinner__large__13_rF { width: 2.5rem; height: 2.5rem; } .spinner__large__13_rF::before, .spinner__large__13_rF::after { width: 2.5rem; height: 2.5rem; } @keyframes spinner__spin__2xflK { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .spinner__spinner__1c6Go.spinner__success__2ZmtN { border-color: rgba(15, 189, 140, 0.35); } .spinner__spinner__1c6Go.spinner__success__2ZmtN::after { border-top-color: #0fbd8c; } .spinner__spinner__1c6Go.spinner__warn__3XGnC { border-color: rgba(255, 140, 26, 0.25); } .spinner__spinner__1c6Go.spinner__warn__3XGnC::after { border-top-color: #ff8c1a; } .spinner__spinner__1c6Go.spinner__info__3lcDu { border-color: rgba(255, 255, 255, 0.25); } .spinner__spinner__1c6Go.spinner__info__3lcDu::after { border-top-color: #ffffff; } .spinner__spinner__1c6Go.spinner__primary__127Ie { border-color: rgba(77, 151, 255, 0.35); } .spinner__spinner__1c6Go.spinner__primary__127Ie::after { border-top-color: var(--theme-primary); } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .alert__alert__3qiSU { width: 100%; display: flex; flex-direction: row; overflow: hidden; justify-content: flex-start; border-radius: 8px; padding-top: 0.875rem; padding-bottom: 0.875rem; padding-left: 1rem; padding-right: 1rem; margin-bottom: 7px; min-height: 1.5rem; pointer-events: all; } .alert__alert__3qiSU.alert__warn__24tnP { background: #fff0df; border: 1px solid #7a5c3d; box-shadow: 0px 0px 0px 2px rgba(255, 140, 26, 0.25); } .alert__alert__3qiSU.alert__success__7otqn { background: #c3efe2; border: 1px solid #0b8e69; box-shadow: 0px 0px 0px 2px #c3efe2; } .alert__alert-spinner__3uApo { self-align: center; } .alert__icon-section__ouJcT { min-width: 1.25rem; min-height: 1.25rem; display: flex; padding-right: 1rem; } .alert__alert-icon__2IAwC { vertical-align: middle; } .alert__alert-message__2nY3x { color: #555; font-weight: bold; font-size: 0.8125rem; line-height: 0.875rem; display: flex; align-items: center; padding-right: 0.5rem; } .alert__alert-buttons__2oaeu { display: flex; flex-direction: row; } .alert__alert-close-button__1edjO { outline-style: none; } .alert__alert-close-button-container__3mBZq { outline-style: none; width: 30px; height: 30px; align-self: center; } .alert__alert-connection-button__3nezM { min-height: 2rem; width: 6.5rem; padding: 0.55rem 0.9rem; border-radius: 0.35rem; background: #ff8c1a; color: white; font-weight: 700; font-size: 0.77rem; border: none; cursor: pointer; display: flex; justify-content: center; align-items: center; align-self: stretch; outline-style: none; } .alert__alert-download-firmware__2wIlc { min-height: 2rem; /* width: 6.5rem; */ padding: 0.55rem 0.9rem; margin-right: 0.8rem; border-radius: 0.35rem; background: #ff8c1a; color: white; font-weight: 700; font-size: 0.77rem; border: none; cursor: pointer; display: flex; justify-content: center; align-items: center; align-self: stretch; outline-style: none; } [dir='ltr'] .alert__alert-connection-button__3nezM { margin-right: 13px; } [dir='rtl'] .alert__alert-connection-button__3nezM { margin-left: 13px; } /* prevent last button in list from too much margin to edge of alert */ .alert__alert-buttons__2oaeu > :last-child { margin-left: 0; margin-right: 0; } .alerts__alerts-inner-container__3X4Vf { min-width: 200px; max-width: 548px; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .gui__flex-center__2OcSM { display: flex; align-items: center; justify-content: center; } .gui__full-filled__1ZIoe { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .gui__modal-mask__5JN3I { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .gui__modal-mask__5JN3I .gui__modal-wrap__2sw20 { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .gui__modal-mask__5JN3I .gui__modal-wrap__2sw20 .gui__modal-header-wrap__1bDa2 { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .gui__modal-mask__5JN3I .gui__modal-wrap__2sw20 .gui__modal-header-wrap__1bDa2 .gui__modal-header-bg__2j7uH { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .gui__modal-mask__5JN3I .gui__modal-wrap__2sw20 .gui__modal-header-wrap__1bDa2 .gui__modal-header-label__3r1Ej { flex-shrink: 0; font-size: 16px; font-weight: bold; } .gui__modal-mask__5JN3I .gui__modal-wrap__2sw20 .gui__modal-header-wrap__1bDa2 .gui__modal-header-close__3yQz1 { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui__modal-mask__5JN3I .gui__modal-wrap__2sw20 .gui__modal-header-wrap__1bDa2 .gui__modal-header-close__3yQz1:hover { color: #98a2b4; } .gui__modal-mask__5JN3I .gui__modal-wrap__2sw20 .gui__modal-body-wrap__3ZoEP { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .gui__modal-mask__5JN3I .gui__modal-wrap__2sw20 .gui__modal-footer-wrap__239p1 { flex-shrink: 0; display: flex; } .gui__modal-header__3y4Nw { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .gui__modal-header__3y4Nw .gui__modal-header-upload__2IwF1 { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .gui__modal-header__3y4Nw .gui__modal-header-upload__2IwF1:hover { background-color: #e0e9ff; } .gui__modal-header__3y4Nw .gui__modal-header-upload__2IwF1:active { background-color: #ccdaff; } .gui__modal-header__3y4Nw .gui__modal-header-upload__2IwF1 .gui__upload-img__1AQVS { font-size: 16px; margin-right: calc(2px); } .gui__modal-header__3y4Nw .gui__modal-header-upload__2IwF1 .gui__upload-label__bAsjZ { font-size: 14px; } .gui__modal-header__3y4Nw .gui__modal-header-upload__2IwF1 .gui__upload-input__3qCiH { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui__modal-header__3y4Nw .gui__modal-header-search__1tRcp { position: relative; } .gui__modal-header__3y4Nw .gui__modal-header-search__1tRcp .gui__search-input__2opRh { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .gui__modal-header__3y4Nw .gui__modal-header-search__1tRcp .gui__search-input__2opRh::-webkit-input-placeholder { color: #98a2b4; } .gui__modal-header__3y4Nw .gui__modal-header-search__1tRcp .gui__search-input__2opRh::-moz-placeholder { color: #98a2b4; } .gui__modal-header__3y4Nw .gui__modal-header-search__1tRcp .gui__search-input__2opRh:-ms-input-placeholder { color: #98a2b4; } .gui__modal-header__3y4Nw .gui__modal-header-search__1tRcp .gui__search-input__2opRh:hover { border-color: #d1d7e1; } .gui__modal-header__3y4Nw .gui__modal-header-search__1tRcp .gui__search-input__2opRh:active { border-color: #d1d7e1; } .gui__modal-header__3y4Nw .gui__modal-header-search__1tRcp .gui__search-img__2cvu0 { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui__modal-body__hEncy { flex-grow: 1; display: flex; } .gui__modal-body__hEncy .gui__modal-body-left__dJGXk, .gui__modal-body__hEncy .gui__modal-body-main__2xJaP { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .gui__modal-body__hEncy .gui__modal-body-left__dJGXk { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .gui__modal-body__hEncy .gui__modal-body-left__dJGXk .gui__modal-body-left-scroll__1P00I { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .gui__modal-body__hEncy .gui__modal-body-left__dJGXk .gui__modal-body-left-scroll__1P00I .gui__modal-body-left-inner__1R_4y { width: 121px; padding: calc(12px); color: #5e6b81; } .gui__modal-body__hEncy .gui__modal-body-left__dJGXk .gui__modal-body-left-scroll__1P00I .gui__modal-body-left-inner__1R_4y .gui__menu-item-current__16Jj9 { color: var(--theme-primary); background-color: #e0e9ff; } .gui__modal-body__hEncy .gui__modal-body-left__dJGXk .gui__modal-body-left-scroll__1P00I .gui__modal-body-left-inner__1R_4y .gui__menu-item__45cpS { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui__modal-body__hEncy .gui__modal-body-left__dJGXk .gui__modal-body-left-scroll__1P00I .gui__modal-body-left-inner__1R_4y .gui__menu-item__45cpS:hover { background-color: #edeff5; } .gui__modal-body__hEncy .gui__modal-body-left__dJGXk .gui__modal-body-left-scroll__1P00I .gui__modal-body-left-inner__1R_4y .gui__menu-item__45cpS .gui__menu-item-img__1QN7j { flex-shrink: 0; width: 20px; margin-right: 8px; } .gui__modal-body__hEncy .gui__modal-body-left__dJGXk .gui__modal-body-left-scroll__1P00I .gui__modal-body-left-inner__1R_4y .gui__menu-item__45cpS .gui__menu-item-label__3mUrg { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .gui__modal-body__hEncy .gui__modal-body-main__2xJaP { padding: calc(12px) 0; } .gui__modal-body__hEncy .gui__modal-body-main__2xJaP .gui__modal-body-main-scroll__mxlYZ { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .gui__modal-body__hEncy .gui__modal-body-main__2xJaP .gui__modal-body-main-scroll__mxlYZ .gui__modal-body-main-inner__exgjr { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .gui__modal-body__hEncy .gui__modal-body-main__2xJaP .gui__modal-body-main-scroll__mxlYZ .gui__modal-body-main-inner__exgjr .gui__selector-btn-add__1_v1V, .gui__modal-body__hEncy .gui__modal-body-main__2xJaP .gui__modal-body-main-scroll__mxlYZ .gui__modal-body-main-inner__exgjr .gui__selector-btn-item__1nlk6 { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .gui__modal-body__hEncy .gui__modal-body-main__2xJaP .gui__modal-body-main-scroll__mxlYZ .gui__modal-body-main-inner__exgjr .gui__selector-btn-add__1_v1V:hover, .gui__modal-body__hEncy .gui__modal-body-main__2xJaP .gui__modal-body-main-scroll__mxlYZ .gui__modal-body-main-inner__exgjr .gui__selector-btn-item__1nlk6:hover { background-color: #e0e9ff; } .gui__modal-body__hEncy .gui__modal-body-main__2xJaP .gui__modal-body-main-scroll__mxlYZ .gui__modal-body-main-inner__exgjr .gui__selector-btn-add__1_v1V:active, .gui__modal-body__hEncy .gui__modal-body-main__2xJaP .gui__modal-body-main-scroll__mxlYZ .gui__modal-body-main-inner__exgjr .gui__selector-btn-item__1nlk6:active { background-color: #ccdaff; } .gui__modal-body__hEncy .gui__modal-body-main__2xJaP .gui__modal-body-main-scroll__mxlYZ .gui__modal-body-main-inner__exgjr .gui__selector-btn-add__1_v1V:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .gui__modal-body__hEncy .gui__modal-body-main__2xJaP .gui__modal-body-main-scroll__mxlYZ .gui__modal-body-main-inner__exgjr .gui__selector-btn-add__1_v1V:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .gui__modal-body__hEncy .gui__modal-body-main__2xJaP .gui__modal-body-main-scroll__mxlYZ .gui__modal-body-main-inner__exgjr .gui__selector-btn-add__1_v1V .gui__add-img__1IY2e { font-size: 28px; height: auto; margin-bottom: 8px; } .gui__modal-body__hEncy .gui__modal-body-main__2xJaP .gui__modal-body-main-scroll__mxlYZ .gui__modal-body-main-inner__exgjr .gui__selector-btn-add__1_v1V .gui__add-label__3ngNH { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .gui__modal-body__hEncy .gui__modal-body-main__2xJaP .gui__modal-body-main-scroll__mxlYZ .gui__modal-body-main-inner__exgjr .gui__selector-btn-item__1nlk6 { justify-content: space-between; } .gui__modal-body__hEncy .gui__modal-body-main__2xJaP .gui__modal-body-main-scroll__mxlYZ .gui__modal-body-main-inner__exgjr .gui__selector-btn-item__1nlk6 .gui__item-img__3OI2u { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .gui__modal-body__hEncy .gui__modal-body-main__2xJaP .gui__modal-body-main-scroll__mxlYZ .gui__modal-body-main-inner__exgjr .gui__selector-btn-item__1nlk6 .gui__item-img__3OI2u img { width: auto; height: 105px; } .gui__modal-body__hEncy .gui__modal-body-main__2xJaP .gui__modal-body-main-scroll__mxlYZ .gui__modal-body-main-inner__exgjr .gui__selector-btn-item__1nlk6 .gui__item-label__3bnfi { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .gui__modal-footer__175ZO { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .gui__selector-btn-add__1_v1V, .gui__selector-btn-item__1nlk6 { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .gui__selector-btn-add__1_v1V { background-color: var(--selector-sprite-bg_primary); } .gui__selector-btn-add__1_v1V:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .gui__selector-btn-add__1_v1V:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .gui__selector-btn-add__1_v1V .gui__add-img__1IY2e { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .gui__selector-btn-add__1_v1V .gui__add-label__3ngNH { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .gui__selector-btn-item__1nlk6 { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .gui__selector-btn-item__1nlk6 .gui__item-img__3OI2u { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .gui__selector-btn-item__1nlk6 .gui__item-img__3OI2u img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .gui__selector-btn-item__1nlk6 .gui__item-label__3bnfi { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .gui__selector-btn-item__1nlk6:hover { background-color: var(--selector-sprite-bg_primary); } .gui__selector-btn-item__1nlk6:hover .gui__item-img__3OI2u { border-color: var(--selector-sprite-bg_primary); } .gui__selector-btn-item_selected__2QQd2 { background-color: var(--selector-sprite-bg_primary); } .gui__selector-btn-item_selected__2QQd2 .gui__item-img__3OI2u { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .gui__menu-bar-btn__fuIhQ { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .gui__menu-bar-btn_green__2ypa9, .gui__menu-bar-btn_create__3gsBS { background-color: #3cdc8f; } .gui__menu-bar-btn_green__2ypa9:hover, .gui__menu-bar-btn_create__3gsBS:hover { background-color: #00d374; } .gui__menu-bar-btn_green__2ypa9:active, .gui__menu-bar-btn_create__3gsBS:active { background-color: #00d374; } .gui__menu-bar-btn_save__2c8Oo, .gui__menu-bar-btn_reset__3vw8g { background-color: #6ac8ff; } .gui__menu-bar-btn_save__2c8Oo:hover, .gui__menu-bar-btn_reset__3vw8g:hover { background-color: #57bcfe; } .gui__menu-bar-btn_save__2c8Oo:active, .gui__menu-bar-btn_reset__3vw8g:active { background-color: #4fb0fc; } .gui__menu-bar-btn_submit__32vGU, .gui__menu-bar-btn_open__3R_ct { background-color: #ff9e23; } .gui__menu-bar-btn_submit__32vGU:hover, .gui__menu-bar-btn_open__3R_ct:hover { background-color: #f47b04; } .gui__menu-bar-btn_submit__32vGU:active, .gui__menu-bar-btn_open__3R_ct:active { background-color: #fe8f22; } .gui__menu-bar-btn_link__1KzPm { background-color: #e8efff; color: var(--theme-primary); } .gui__menu-bar-btn_link__1KzPm:hover { background-color: #b6c7ff; } .gui__menu-bar-btn_link__1KzPm:active { background-color: #cfdcff; } .gui__menu-bar-btn_disabled__QR8_z { color: #565266; background-color: #e6e9ed; } .gui__menu-bar-btn_disabled__QR8_z:hover { cursor: not-allowed; } .gui__menu-bar-btn_help__202y- { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .gui__menu-bar-btn_help__202y-:hover { background-color: #8398ff; } .gui__menu-bar-btn_help__202y-:active { background-color: #8ca3ff; } .gui__menu-bar-separator__1opyv { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .gui__alerts-container__1p8ew { display: flex; justify-content: center; width: 100%; z-index: 490; position: absolute; margin-top: 53px; pointer-events: none; } .message__message-content__bNSBq { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 17px 16px; background: rgba(0, 0, 0, 0.701076); border-radius: 8px; font-weight: 400; font-size: 16px; color: #ffffff; white-space: nowrap; transition: opacity 0.2s linear; } .gui-mini__flex-center__1059E { display: flex; align-items: center; justify-content: center; } .gui-mini__full-filled__2BodD { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .gui-mini__modal-mask__3PsIS { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .gui-mini__modal-mask__3PsIS .gui-mini__modal-wrap__hHxo8 { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .gui-mini__modal-mask__3PsIS .gui-mini__modal-wrap__hHxo8 .gui-mini__modal-header-wrap__30Y-r { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .gui-mini__modal-mask__3PsIS .gui-mini__modal-wrap__hHxo8 .gui-mini__modal-header-wrap__30Y-r .gui-mini__modal-header-bg__1E4zC { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .gui-mini__modal-mask__3PsIS .gui-mini__modal-wrap__hHxo8 .gui-mini__modal-header-wrap__30Y-r .gui-mini__modal-header-label__3RlhA { flex-shrink: 0; font-size: 16px; font-weight: bold; } .gui-mini__modal-mask__3PsIS .gui-mini__modal-wrap__hHxo8 .gui-mini__modal-header-wrap__30Y-r .gui-mini__modal-header-close__3-3KO { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui-mini__modal-mask__3PsIS .gui-mini__modal-wrap__hHxo8 .gui-mini__modal-header-wrap__30Y-r .gui-mini__modal-header-close__3-3KO:hover { color: #98a2b4; } .gui-mini__modal-mask__3PsIS .gui-mini__modal-wrap__hHxo8 .gui-mini__modal-body-wrap__2obai { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .gui-mini__modal-mask__3PsIS .gui-mini__modal-wrap__hHxo8 .gui-mini__modal-footer-wrap__1SEOr { flex-shrink: 0; display: flex; } .gui-mini__modal-header__3IT28 { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .gui-mini__modal-header__3IT28 .gui-mini__modal-header-upload__1GdIA { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .gui-mini__modal-header__3IT28 .gui-mini__modal-header-upload__1GdIA:hover { background-color: #e0e9ff; } .gui-mini__modal-header__3IT28 .gui-mini__modal-header-upload__1GdIA:active { background-color: #ccdaff; } .gui-mini__modal-header__3IT28 .gui-mini__modal-header-upload__1GdIA .gui-mini__upload-img__3Ewef { font-size: 16px; margin-right: calc(2px); } .gui-mini__modal-header__3IT28 .gui-mini__modal-header-upload__1GdIA .gui-mini__upload-label__3Y7TG { font-size: 14px; } .gui-mini__modal-header__3IT28 .gui-mini__modal-header-upload__1GdIA .gui-mini__upload-input__YBG4V { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui-mini__modal-header__3IT28 .gui-mini__modal-header-search__2tHg3 { position: relative; } .gui-mini__modal-header__3IT28 .gui-mini__modal-header-search__2tHg3 .gui-mini__search-input__1y5SD { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .gui-mini__modal-header__3IT28 .gui-mini__modal-header-search__2tHg3 .gui-mini__search-input__1y5SD::-webkit-input-placeholder { color: #98a2b4; } .gui-mini__modal-header__3IT28 .gui-mini__modal-header-search__2tHg3 .gui-mini__search-input__1y5SD::-moz-placeholder { color: #98a2b4; } .gui-mini__modal-header__3IT28 .gui-mini__modal-header-search__2tHg3 .gui-mini__search-input__1y5SD:-ms-input-placeholder { color: #98a2b4; } .gui-mini__modal-header__3IT28 .gui-mini__modal-header-search__2tHg3 .gui-mini__search-input__1y5SD:hover { border-color: #d1d7e1; } .gui-mini__modal-header__3IT28 .gui-mini__modal-header-search__2tHg3 .gui-mini__search-input__1y5SD:active { border-color: #d1d7e1; } .gui-mini__modal-header__3IT28 .gui-mini__modal-header-search__2tHg3 .gui-mini__search-img__sgksa { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui-mini__modal-body__398n9 { flex-grow: 1; display: flex; } .gui-mini__modal-body__398n9 .gui-mini__modal-body-left__34Kfq, .gui-mini__modal-body__398n9 .gui-mini__modal-body-main__1qFYI { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .gui-mini__modal-body__398n9 .gui-mini__modal-body-left__34Kfq { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .gui-mini__modal-body__398n9 .gui-mini__modal-body-left__34Kfq .gui-mini__modal-body-left-scroll__1xLmi { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .gui-mini__modal-body__398n9 .gui-mini__modal-body-left__34Kfq .gui-mini__modal-body-left-scroll__1xLmi .gui-mini__modal-body-left-inner__2KAzQ { width: 121px; padding: calc(12px); color: #5e6b81; } .gui-mini__modal-body__398n9 .gui-mini__modal-body-left__34Kfq .gui-mini__modal-body-left-scroll__1xLmi .gui-mini__modal-body-left-inner__2KAzQ .gui-mini__menu-item-current__1oS3C { color: var(--theme-primary); background-color: #e0e9ff; } .gui-mini__modal-body__398n9 .gui-mini__modal-body-left__34Kfq .gui-mini__modal-body-left-scroll__1xLmi .gui-mini__modal-body-left-inner__2KAzQ .gui-mini__menu-item__3_I76 { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui-mini__modal-body__398n9 .gui-mini__modal-body-left__34Kfq .gui-mini__modal-body-left-scroll__1xLmi .gui-mini__modal-body-left-inner__2KAzQ .gui-mini__menu-item__3_I76:hover { background-color: #edeff5; } .gui-mini__modal-body__398n9 .gui-mini__modal-body-left__34Kfq .gui-mini__modal-body-left-scroll__1xLmi .gui-mini__modal-body-left-inner__2KAzQ .gui-mini__menu-item__3_I76 .gui-mini__menu-item-img__ftRJn { flex-shrink: 0; width: 20px; margin-right: 8px; } .gui-mini__modal-body__398n9 .gui-mini__modal-body-left__34Kfq .gui-mini__modal-body-left-scroll__1xLmi .gui-mini__modal-body-left-inner__2KAzQ .gui-mini__menu-item__3_I76 .gui-mini__menu-item-label__2Nq6C { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .gui-mini__modal-body__398n9 .gui-mini__modal-body-main__1qFYI { padding: calc(12px) 0; } .gui-mini__modal-body__398n9 .gui-mini__modal-body-main__1qFYI .gui-mini__modal-body-main-scroll__1w4Rh { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .gui-mini__modal-body__398n9 .gui-mini__modal-body-main__1qFYI .gui-mini__modal-body-main-scroll__1w4Rh .gui-mini__modal-body-main-inner__89dh5 { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .gui-mini__modal-body__398n9 .gui-mini__modal-body-main__1qFYI .gui-mini__modal-body-main-scroll__1w4Rh .gui-mini__modal-body-main-inner__89dh5 .gui-mini__selector-btn-add__-8g1H, .gui-mini__modal-body__398n9 .gui-mini__modal-body-main__1qFYI .gui-mini__modal-body-main-scroll__1w4Rh .gui-mini__modal-body-main-inner__89dh5 .gui-mini__selector-btn-item__3SsDo { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .gui-mini__modal-body__398n9 .gui-mini__modal-body-main__1qFYI .gui-mini__modal-body-main-scroll__1w4Rh .gui-mini__modal-body-main-inner__89dh5 .gui-mini__selector-btn-add__-8g1H:hover, .gui-mini__modal-body__398n9 .gui-mini__modal-body-main__1qFYI .gui-mini__modal-body-main-scroll__1w4Rh .gui-mini__modal-body-main-inner__89dh5 .gui-mini__selector-btn-item__3SsDo:hover { background-color: #e0e9ff; } .gui-mini__modal-body__398n9 .gui-mini__modal-body-main__1qFYI .gui-mini__modal-body-main-scroll__1w4Rh .gui-mini__modal-body-main-inner__89dh5 .gui-mini__selector-btn-add__-8g1H:active, .gui-mini__modal-body__398n9 .gui-mini__modal-body-main__1qFYI .gui-mini__modal-body-main-scroll__1w4Rh .gui-mini__modal-body-main-inner__89dh5 .gui-mini__selector-btn-item__3SsDo:active { background-color: #ccdaff; } .gui-mini__modal-body__398n9 .gui-mini__modal-body-main__1qFYI .gui-mini__modal-body-main-scroll__1w4Rh .gui-mini__modal-body-main-inner__89dh5 .gui-mini__selector-btn-add__-8g1H:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .gui-mini__modal-body__398n9 .gui-mini__modal-body-main__1qFYI .gui-mini__modal-body-main-scroll__1w4Rh .gui-mini__modal-body-main-inner__89dh5 .gui-mini__selector-btn-add__-8g1H:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .gui-mini__modal-body__398n9 .gui-mini__modal-body-main__1qFYI .gui-mini__modal-body-main-scroll__1w4Rh .gui-mini__modal-body-main-inner__89dh5 .gui-mini__selector-btn-add__-8g1H .gui-mini__add-img__1dmYR { font-size: 28px; height: auto; margin-bottom: 8px; } .gui-mini__modal-body__398n9 .gui-mini__modal-body-main__1qFYI .gui-mini__modal-body-main-scroll__1w4Rh .gui-mini__modal-body-main-inner__89dh5 .gui-mini__selector-btn-add__-8g1H .gui-mini__add-label__2hWXu { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .gui-mini__modal-body__398n9 .gui-mini__modal-body-main__1qFYI .gui-mini__modal-body-main-scroll__1w4Rh .gui-mini__modal-body-main-inner__89dh5 .gui-mini__selector-btn-item__3SsDo { justify-content: space-between; } .gui-mini__modal-body__398n9 .gui-mini__modal-body-main__1qFYI .gui-mini__modal-body-main-scroll__1w4Rh .gui-mini__modal-body-main-inner__89dh5 .gui-mini__selector-btn-item__3SsDo .gui-mini__item-img__2NjOn { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .gui-mini__modal-body__398n9 .gui-mini__modal-body-main__1qFYI .gui-mini__modal-body-main-scroll__1w4Rh .gui-mini__modal-body-main-inner__89dh5 .gui-mini__selector-btn-item__3SsDo .gui-mini__item-img__2NjOn img { width: auto; height: 105px; } .gui-mini__modal-body__398n9 .gui-mini__modal-body-main__1qFYI .gui-mini__modal-body-main-scroll__1w4Rh .gui-mini__modal-body-main-inner__89dh5 .gui-mini__selector-btn-item__3SsDo .gui-mini__item-label__WE3et { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .gui-mini__modal-footer__IEFSG { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .gui-mini__selector-btn-add__-8g1H, .gui-mini__selector-btn-item__3SsDo { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .gui-mini__selector-btn-add__-8g1H { background-color: var(--selector-sprite-bg_primary); } .gui-mini__selector-btn-add__-8g1H:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .gui-mini__selector-btn-add__-8g1H:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .gui-mini__selector-btn-add__-8g1H .gui-mini__add-img__1dmYR { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .gui-mini__selector-btn-add__-8g1H .gui-mini__add-label__2hWXu { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .gui-mini__selector-btn-item__3SsDo { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .gui-mini__selector-btn-item__3SsDo .gui-mini__item-img__2NjOn { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .gui-mini__selector-btn-item__3SsDo .gui-mini__item-img__2NjOn img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .gui-mini__selector-btn-item__3SsDo .gui-mini__item-label__WE3et { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .gui-mini__selector-btn-item__3SsDo:hover { background-color: var(--selector-sprite-bg_primary); } .gui-mini__selector-btn-item__3SsDo:hover .gui-mini__item-img__2NjOn { border-color: var(--selector-sprite-bg_primary); } .gui-mini__selector-btn-item_selected__nrLPg { background-color: var(--selector-sprite-bg_primary); } .gui-mini__selector-btn-item_selected__nrLPg .gui-mini__item-img__2NjOn { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .gui-mini__menu-bar-btn__3G1hM { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .gui-mini__menu-bar-btn_green__1zdw-, .gui-mini__menu-bar-btn_create__fZJRR { background-color: #3cdc8f; } .gui-mini__menu-bar-btn_green__1zdw-:hover, .gui-mini__menu-bar-btn_create__fZJRR:hover { background-color: #00d374; } .gui-mini__menu-bar-btn_green__1zdw-:active, .gui-mini__menu-bar-btn_create__fZJRR:active { background-color: #00d374; } .gui-mini__menu-bar-btn_save__sJWoz, .gui-mini__menu-bar-btn_reset__1NIFt { background-color: #6ac8ff; } .gui-mini__menu-bar-btn_save__sJWoz:hover, .gui-mini__menu-bar-btn_reset__1NIFt:hover { background-color: #57bcfe; } .gui-mini__menu-bar-btn_save__sJWoz:active, .gui-mini__menu-bar-btn_reset__1NIFt:active { background-color: #4fb0fc; } .gui-mini__menu-bar-btn_submit__XvVr_, .gui-mini__menu-bar-btn_open__3kS8z { background-color: #ff9e23; } .gui-mini__menu-bar-btn_submit__XvVr_:hover, .gui-mini__menu-bar-btn_open__3kS8z:hover { background-color: #f47b04; } .gui-mini__menu-bar-btn_submit__XvVr_:active, .gui-mini__menu-bar-btn_open__3kS8z:active { background-color: #fe8f22; } .gui-mini__menu-bar-btn_link__1pp7w { background-color: #e8efff; color: var(--theme-primary); } .gui-mini__menu-bar-btn_link__1pp7w:hover { background-color: #b6c7ff; } .gui-mini__menu-bar-btn_link__1pp7w:active { background-color: #cfdcff; } .gui-mini__menu-bar-btn_disabled__2QRCv { color: #565266; background-color: #e6e9ed; } .gui-mini__menu-bar-btn_disabled__2QRCv:hover { cursor: not-allowed; } .gui-mini__menu-bar-btn_help__17cmW { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .gui-mini__menu-bar-btn_help__17cmW:hover { background-color: #8398ff; } .gui-mini__menu-bar-btn_help__17cmW:active { background-color: #8ca3ff; } .gui-mini__menu-bar-separator__3Btn_ { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ :root { --sat: env(safe-area-inset-top); --sar: env(safe-area-inset-right); --sab: env(safe-area-inset-bottom); --sal: env(safe-area-inset-left); } .gui-mini__mini-page__2s5dj { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; height: 100%; overflow: hidden; background-color: #84c4fd; position: fixed; position: -ms-device-fixed; top: 0px; left: 0px; right: 0px; bottom: 0px; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u { width: 375px; height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; position: relative; transform-origin: top; will-change: transform; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__running-mask__161wS { width: 100%; height: 100%; box-sizing: border-box; position: absolute; top: 0; left: 0; z-index: 5003; background: rgba(255, 255, 255, 0.5); } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__guide-mask__2FOfq { width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); position: fixed; z-index: 5001; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__container__o3KeA { width: 375px; height: 461px; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; position: relative; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__container__o3KeA .gui-mini__gui-container__1g0C9 { position: relative; width: 375px; margin-top: 23px; display: flex; flex-direction: column; justify-content: center; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__container__o3KeA .gui-mini__gui-container__1g0C9 .gui-mini__container-running__2PoDn { position: relative; z-index: 5004; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__container__o3KeA .gui-mini__gui-container__1g0C9 .gui-mini__screen-list__nIocB { width: 100%; height: 95px; padding: 11px 10px 13px; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__container__o3KeA .gui-mini__gui-container__1g0C9 .gui-mini__screen-list__nIocB .gui-mini__screen-item__1CADP { width: 76px; height: 58px; border-radius: 6px; border: 3px solid #ffffff; margin-left: 8px; overflow: hidden; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__container__o3KeA .gui-mini__gui-container__1g0C9 .gui-mini__screen-list__nIocB .gui-mini__screen-item__1CADP.gui-mini__screenActive__3QLEs { border-color: #467eff; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__container__o3KeA .gui-mini__gui-container__1g0C9 .gui-mini__screen-list__nIocB .gui-mini__screen-item__1CADP img { max-width: 70px; border-radius: 3px; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__container__o3KeA .gui-mini__gui-container__1g0C9 .gui-mini__gui-container-cover__1Q8P2 { width: 100%; flex: 1; position: absolute; top: 0; left: 0; z-index: 5004; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__container__o3KeA .gui-mini__btns__zyMkS { width: 375px; display: flex; flex-direction: row; justify-content: space-between; align-items: center; padding: 15px 22px 14px; margin-bottom: 13px; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__container__o3KeA .gui-mini__btns__zyMkS .gui-mini__btn__qgO7f { width: 78px; height: 35px; background: #ffffff; border: 3px solid #b0dfff; border-radius: 17.25px; font-weight: 400; font-size: 14px; display: flex; align-items: center; justify-content: center; position: relative; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__container__o3KeA .gui-mini__btns__zyMkS .gui-mini__btn__qgO7f.gui-mini__identify__2Gttc { color: #6ad7ef; position: relative; z-index: 5002; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__container__o3KeA .gui-mini__btns__zyMkS .gui-mini__btn__qgO7f.gui-mini__identify__2Gttc .gui-mini__disabled__fGaMD { width: 78px; height: 35px; border-radius: 17.25px; position: absolute; top: -3px; left: -3px; background: rgba(0, 0, 0, 0.3); z-index: 5002; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__container__o3KeA .gui-mini__btns__zyMkS .gui-mini__btn__qgO7f.gui-mini__identify__2Gttc .gui-mini__identify-message__30I-3 { width: 232px; position: absolute; left: 100px; top: -58px; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__container__o3KeA .gui-mini__btns__zyMkS .gui-mini__btn__qgO7f.gui-mini__identify__2Gttc .gui-mini__identify-message__30I-3 img { width: 100%; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__container__o3KeA .gui-mini__btns__zyMkS .gui-mini__btn__qgO7f.gui-mini__run__wH_Dc { color: #05cf4b; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__container__o3KeA .gui-mini__btns__zyMkS .gui-mini__btn__qgO7f.gui-mini__running__2B9AZ { color: #ff8b49; border-color: #ff8b49; z-index: 5004; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__container__o3KeA .gui-mini__btns__zyMkS .gui-mini__btn__qgO7f .gui-mini__icon__1iERA { margin-right: 4px; font-size: 18px; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__sprites__2ugxT { width: 375px; box-sizing: border-box; display: flex; flex-direction: row; flex-wrap: wrap; align-content: flex-start; justify-content: start; padding: 5px 0px 5px 5px; background: #d4edff; border: 8px solid #e7f5ff; box-shadow: inset 0px -2px 4px #95d4ff, inset 0px 2px 4px #98d5ff; border-radius: 12px; overflow-y: scroll; scrollbar-width: none; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__sprites__2ugxT .gui-mini__sprites-item__3wMfc { width: 82px; height: 99px; display: flex; flex-direction: column; align-items: center; justify-content: space-between; padding: 6px 6px 2px; margin-right: 6px; margin-bottom: 6px; background: #ffffff; box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.11), inset 0px -1px 2px #c9dff9; border-radius: 9.11111px; position: relative; overflow: hidden; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__sprites__2ugxT .gui-mini__sprites-item__3wMfc:nth-child(4n) { margin-right: 0; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__sprites__2ugxT .gui-mini__sprites-item__3wMfc.gui-mini__active-sprite__2YjCa .gui-mini__item-img__2NjOn { border-color: #6a7fff; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__sprites__2ugxT .gui-mini__sprites-item__3wMfc .gui-mini__item-running__2T-zP { width: 82px; height: 99px; position: absolute; top: 0; left: 0; background: rgba(0, 0, 0, 0.3); z-index: 5002; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__sprites__2ugxT .gui-mini__sprites-item__3wMfc .gui-mini__item-img__2NjOn { width: 70px; height: 70px; display: flex; align-items: center; justify-content: center; padding: 10px; background: #f5f8ff; border: 2px solid #dae2f4; border-radius: 6px; position: relative; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__sprites__2ugxT .gui-mini__sprites-item__3wMfc .gui-mini__item-img__2NjOn img { max-width: 50px; max-height: 50px; object-fit: contain; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__sprites__2ugxT .gui-mini__sprites-item__3wMfc .gui-mini__item-img__2NjOn .gui-mini__sign__3YKd5 { width: 18px; height: 18px; display: flex; align-items: center; justify-content: center; position: absolute; right: -4px; bottom: -4px; border-radius: 100%; background-color: #6a7fff; border: 2px solid #ffffff; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__sprites__2ugxT .gui-mini__sprites-item__3wMfc .gui-mini__item-img__2NjOn .gui-mini__sign__3YKd5.gui-mini__is-error__1fDxO { background-color: #ff6363; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__sprites__2ugxT .gui-mini__sprites-item__3wMfc .gui-mini__item-img__2NjOn .gui-mini__sign__3YKd5 .gui-mini__icon__1iERA { font-size: 12px; color: #ffffff; } .gui-mini__mini-page__2s5dj .gui-mini__mini-page-container__3Yf2u .gui-mini__sprites__2ugxT .gui-mini__sprites-item__3wMfc .gui-mini__item-name__3G6QG { font-weight: 400; font-size: 13px; line-height: 19px; color: #5e6b81; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx { width: 100vh; height: 100vh; position: fixed; top: 0; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, 0.6); transition: all 0.2s linear; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA { width: 319px; height: 401px; position: relative; display: flex; flex-direction: column; background: #ffffff; border: 6px solid #979797; border-radius: 17px; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-title__1IZoj { padding: 19px; display: flex; flex-direction: row; align-items: center; justify-content: center; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-title__1IZoj .gui-mini__tips__1Ykum { width: 7px; height: 7px; background: #8adffb; border-radius: 100%; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-title__1IZoj .gui-mini__title__35iVY { font-weight: 600; font-size: 16px; color: #565266; margin: 0 12px; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK { width: 100%; flex: 1; display: flex; align-items: start; justify-content: center; overflow-x: hidden; overflow-y: overlay; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK.gui-mini__modal-main-full__23Uwy { justify-content: flex-start; overflow: overlay; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK.gui-mini__modal-main-full__23Uwy .gui-mini__main-blocks__NZbRO { margin: 0 20px 0 0; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK.gui-mini__modal-main-full__23Uwy .gui-mini__main-blocks__NZbRO.gui-mini__main-blocks-first__2_isP { margin-left: 20px; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK.gui-mini__modal-main-full__23Uwy .gui-mini__main-blocks__NZbRO.gui-mini__main-blocks-last__nV_cK { margin-right: 0; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK.gui-mini__modal-main-full__23Uwy .gui-mini__last-chunk__1jItv { height: 100%; padding: 0 10px; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK::-webkit-scrollbar { width: 8px; height: 8px; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK::-webkit-scrollbar-thumb { background: #dddddd; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK .gui-mini__main-blocks__NZbRO { width: 72px; height: 100%; margin: 0 11px; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK .gui-mini__main-blocks__NZbRO .gui-mini__block__yLz7G { width: 72px; height: 47px; position: relative; top: 0px; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK .gui-mini__main-blocks__NZbRO .gui-mini__block__yLz7G.gui-mini__is-control__Pvsxa { width: 82px; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK .gui-mini__main-blocks__NZbRO .gui-mini__block__yLz7G.gui-mini__is-control-stop__1YQhW { height: 20px; top: -11px; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK .gui-mini__main-blocks__NZbRO .gui-mini__block__yLz7G .gui-mini__control-range__2uF9t { width: 9px; min-height: 55px; height: 110%; position: absolute; top: -3px; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK .gui-mini__main-blocks__NZbRO .gui-mini__block__yLz7G .gui-mini__block-img__3k_Rg { height: 53px; position: absolute; top: 0px; z-index: 1001; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK .gui-mini__main-blocks__NZbRO .gui-mini__block__yLz7G .gui-mini__block-img__3k_Rg.gui-mini__control-forever__2hsRW { height: 58px; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK .gui-mini__main-blocks__NZbRO .gui-mini__block__yLz7G .gui-mini__block-img__3k_Rg.gui-mini__control-forever-stop__2xtT6 { height: 37px; z-index: 1000; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK .gui-mini__main-blocks__NZbRO .gui-mini__block__yLz7G .gui-mini__block-img__3k_Rg.gui-mini__control-stop__3rRO- { height: 40px; z-index: 1000; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK .gui-mini__main-blocks__NZbRO .gui-mini__block__yLz7G .gui-mini__block-num__2eIGi { width: 27px; height: 21.2px; display: flex; align-items: center; justify-content: center; position: absolute; right: 0; top: 14.5px; z-index: 1002; font-size: 14px; color: #000000; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK .gui-mini__main-blocks__NZbRO .gui-mini__block__yLz7G .gui-mini__content-img__975H6 { width: 16px; height: 16px; position: absolute; right: 5px; top: 16.5px; z-index: 1002; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK .gui-mini__main-blocks__NZbRO .gui-mini__block__yLz7G .gui-mini__content-img__975H6.gui-mini__screen-img__14xHm { width: 12px; height: 12px; right: 7px; top: 19px; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK .gui-mini__empty__Vpgh5 { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: start; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK .gui-mini__empty__Vpgh5 .gui-mini__empty-img__2aBrr { width: 200px; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__modal-main__2xYRK .gui-mini__empty__Vpgh5 .gui-mini__empty-info__RIM7g { font-weight: 400; font-size: 14px; color: #98a2b4; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__close__2WH4X { width: 42px; height: 42px; display: flex; align-items: center; justify-content: center; position: absolute; right: -21px; top: -21px; background: #f66e55; border-radius: 100%; } .gui-mini__mini-page__2s5dj .gui-mini__mask__2MSIx .gui-mini__modal__3iUbA .gui-mini__close__2WH4X .gui-mini__icon__1iERA { color: #ffffff; font-size: 26px; } .gui-mini__mini-page__2s5dj .gui-mini__custom-loading__231Rb { width: 100%; height: 100%; position: fixed; top: 0; left: 0; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, 0); } .gui-mini__mini-page__2s5dj .gui-mini__custom-loading__231Rb .gui-mini__loading-content__1MeqZ { width: 136px; height: 136px; display: flex; flex-direction: column; align-items: center; justify-content: center; background: #4c4c4c; border-radius: 12px; font-weight: 400; font-size: 17px; color: rgba(255, 255, 255, 0.9); transition: all 0.2s linear; } .gui-mini__mini-page__2s5dj .gui-mini__custom-loading__231Rb .gui-mini__loading-content__1MeqZ img { width: 36px; height: 36px; margin-bottom: 16px; animation: gui-mini__rotate__3YqML 1.5s linear infinite; } @keyframes gui-mini__rotate__3YqML { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } .gui-mini__mini-page__2s5dj .gui-mini__custom-action-sheet__2wUef { width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); position: fixed; top: 0; left: 0; z-index: 5002; transition: all 0.2s linear; } .gui-mini__mini-page__2s5dj .gui-mini__custom-action-sheet__2wUef .gui-mini__action-sheet-content__3egBg { width: 100%; display: flex; flex-direction: column; position: fixed; bottom: 0; left: 0; z-index: 5003; background-color: #ffffff; border-radius: 12px 12px 0 0; overflow: hidden; transition: all 0.2s linear; } .gui-mini__mini-page__2s5dj .gui-mini__custom-action-sheet__2wUef .gui-mini__action-sheet-content__3egBg .gui-mini__action-sheet-item__3wrXV { width: 100%; height: 50px; display: flex; align-items: center; justify-content: center; } .gui-mini__mini-page__2s5dj .gui-mini__custom-action-sheet__2wUef .gui-mini__action-sheet-content__3egBg .gui-mini__action-sheet-item__3wrXV:last-of-type { margin-bottom: constant(safe-area-inset-bottom); /*兼容 IOS<11.2*/ margin-bottom: env(safe-area-inset-bottom); /*兼容 IOS>11.2*/ } .gui-mini__mini-page__2s5dj .gui-mini__custom-action-sheet__2wUef .gui-mini__action-sheet-content__3egBg .gui-mini__action-sheet-item__3wrXV:active { background-color: #f2f3f5; } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu { width: 100%; height: 100%; position: absolute; bottom: 0; left: 0; display: flex; flex-direction: column; background-color: #000000; transition: all 0.2s linear; } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__videoAndCanvas__2Gvhp { width: 100%; flex: 1; display: flex; align-items: center; justify-content: center; overflow: hidden; } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__videoAndCanvas__2Gvhp .gui-mini__canvas-img__3ht9v { width: 100%; } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__videoAndCanvas__2Gvhp .gui-mini__video__1LVPt { width: 100%; object-fit: contain; } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS { width: 100%; height: 104px; padding-bottom: 24px; padding-top: 3; display: flex; flex-direction: row; align-items: center; justify-content: space-around; font-size: 16px; font-weight: 500; color: #ffffff; margin-bottom: constant(safe-area-inset-bottom); /*兼容 IOS<11.2*/ margin-bottom: env(safe-area-inset-bottom); /*兼容 IOS>11.2*/ } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__submit-btn__3kl0H, .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__photo-btn__2HVWF, .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__remake-btn__19HUM { width: 64px; } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__photo-btn__2HVWF { width: 64px; height: 64px; background-color: #ffffff; border-radius: 100%; display: flex; align-items: center; justify-content: center; } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__photo-btn__2HVWF .gui-mini__photo-btn-item__2eJ5W { width: 50px; height: 50px; border-radius: 100%; border: 3px solid #000000; } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 { width: 64px; height: 64px; position: relative; } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-child__yWoFk { width: 100%; height: 100%; position: absolute; left: 0; top: 0; } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-child__yWoFk:before { content: ''; display: block; margin: 0 auto; width: 15%; height: 15%; background-color: #fff; border-radius: 100%; animation: gui-mini__sk-circleBounceDelay__PjAx- 1.2s infinite ease-in-out both; } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle2__2jBzh { transform: rotate(30deg); } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle3__2Sbyw { transform: rotate(60deg); } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle4__cY8RV { transform: rotate(90deg); } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle5__Qkxa4 { transform: rotate(120deg); } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle6__2V1wV { transform: rotate(150deg); } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle7__2VOBk { transform: rotate(180deg); } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle8__11e7o { transform: rotate(210deg); } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle9__28JmV { transform: rotate(240deg); } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle10__MFtov { transform: rotate(270deg); } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle11__2g_zo { transform: rotate(300deg); } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle12__AxR-P { transform: rotate(330deg); } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle2__2jBzh:before { animation-delay: -1.1s; } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle3__2Sbyw:before { animation-delay: -1s; } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle4__cY8RV:before { animation-delay: -0.9s; } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle5__Qkxa4:before { animation-delay: -0.8s; } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle6__2V1wV:before { animation-delay: -0.7s; } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle7__2VOBk:before { animation-delay: -0.6s; } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle8__11e7o:before { animation-delay: -0.5s; } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle9__28JmV:before { animation-delay: -0.4s; } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle10__MFtov:before { animation-delay: -0.3s; } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle11__2g_zo:before { animation-delay: -0.2s; } .gui-mini__mini-page__2s5dj .gui-mini__custom-photo__14CWu .gui-mini__btns__zyMkS .gui-mini__sk-circle__168p6 .gui-mini__sk-circle12__AxR-P:before { animation-delay: -0.1s; } @keyframes gui-mini__sk-circleBounceDelay__PjAx- { 0%, 80%, 100% { transform: scale(0); } 40% { transform: scale(1); } } .gui-kid__flex-center__PAMGK { display: flex; align-items: center; justify-content: center; } .gui-kid__full-filled__3ApFX { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .gui-kid__modal-mask__31pwO { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .gui-kid__modal-mask__31pwO .gui-kid__modal-wrap__391LH { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .gui-kid__modal-mask__31pwO .gui-kid__modal-wrap__391LH .gui-kid__modal-header-wrap__2EPll { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .gui-kid__modal-mask__31pwO .gui-kid__modal-wrap__391LH .gui-kid__modal-header-wrap__2EPll .gui-kid__modal-header-bg__iv2qw { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .gui-kid__modal-mask__31pwO .gui-kid__modal-wrap__391LH .gui-kid__modal-header-wrap__2EPll .gui-kid__modal-header-label__7wwzD { flex-shrink: 0; font-size: 16px; font-weight: bold; } .gui-kid__modal-mask__31pwO .gui-kid__modal-wrap__391LH .gui-kid__modal-header-wrap__2EPll .gui-kid__modal-header-close__1WZsl { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui-kid__modal-mask__31pwO .gui-kid__modal-wrap__391LH .gui-kid__modal-header-wrap__2EPll .gui-kid__modal-header-close__1WZsl:hover { color: #98a2b4; } .gui-kid__modal-mask__31pwO .gui-kid__modal-wrap__391LH .gui-kid__modal-body-wrap__3E93F { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .gui-kid__modal-mask__31pwO .gui-kid__modal-wrap__391LH .gui-kid__modal-footer-wrap__3xWRX { flex-shrink: 0; display: flex; } .gui-kid__modal-header__1_YJ6 { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .gui-kid__modal-header__1_YJ6 .gui-kid__modal-header-upload__2I6VK { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .gui-kid__modal-header__1_YJ6 .gui-kid__modal-header-upload__2I6VK:hover { background-color: #e0e9ff; } .gui-kid__modal-header__1_YJ6 .gui-kid__modal-header-upload__2I6VK:active { background-color: #ccdaff; } .gui-kid__modal-header__1_YJ6 .gui-kid__modal-header-upload__2I6VK .gui-kid__upload-img__16gV0 { font-size: 16px; margin-right: calc(2px); } .gui-kid__modal-header__1_YJ6 .gui-kid__modal-header-upload__2I6VK .gui-kid__upload-label__KgPfr { font-size: 14px; } .gui-kid__modal-header__1_YJ6 .gui-kid__modal-header-upload__2I6VK .gui-kid__upload-input__3VXZ8 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui-kid__modal-header__1_YJ6 .gui-kid__modal-header-search__33mWd { position: relative; } .gui-kid__modal-header__1_YJ6 .gui-kid__modal-header-search__33mWd .gui-kid__search-input__1DHRM { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .gui-kid__modal-header__1_YJ6 .gui-kid__modal-header-search__33mWd .gui-kid__search-input__1DHRM::-webkit-input-placeholder { color: #98a2b4; } .gui-kid__modal-header__1_YJ6 .gui-kid__modal-header-search__33mWd .gui-kid__search-input__1DHRM::-moz-placeholder { color: #98a2b4; } .gui-kid__modal-header__1_YJ6 .gui-kid__modal-header-search__33mWd .gui-kid__search-input__1DHRM:-ms-input-placeholder { color: #98a2b4; } .gui-kid__modal-header__1_YJ6 .gui-kid__modal-header-search__33mWd .gui-kid__search-input__1DHRM:hover { border-color: #d1d7e1; } .gui-kid__modal-header__1_YJ6 .gui-kid__modal-header-search__33mWd .gui-kid__search-input__1DHRM:active { border-color: #d1d7e1; } .gui-kid__modal-header__1_YJ6 .gui-kid__modal-header-search__33mWd .gui-kid__search-img__3YUN4 { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui-kid__modal-body__36dsq { flex-grow: 1; display: flex; } .gui-kid__modal-body__36dsq .gui-kid__modal-body-left__32Wt2, .gui-kid__modal-body__36dsq .gui-kid__modal-body-main__36Oi5 { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .gui-kid__modal-body__36dsq .gui-kid__modal-body-left__32Wt2 { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .gui-kid__modal-body__36dsq .gui-kid__modal-body-left__32Wt2 .gui-kid__modal-body-left-scroll__3XFCY { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .gui-kid__modal-body__36dsq .gui-kid__modal-body-left__32Wt2 .gui-kid__modal-body-left-scroll__3XFCY .gui-kid__modal-body-left-inner__2XtGF { width: 121px; padding: calc(12px); color: #5e6b81; } .gui-kid__modal-body__36dsq .gui-kid__modal-body-left__32Wt2 .gui-kid__modal-body-left-scroll__3XFCY .gui-kid__modal-body-left-inner__2XtGF .gui-kid__menu-item-current__3nOqy { color: var(--theme-primary); background-color: #e0e9ff; } .gui-kid__modal-body__36dsq .gui-kid__modal-body-left__32Wt2 .gui-kid__modal-body-left-scroll__3XFCY .gui-kid__modal-body-left-inner__2XtGF .gui-kid__menu-item__1vZqe { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui-kid__modal-body__36dsq .gui-kid__modal-body-left__32Wt2 .gui-kid__modal-body-left-scroll__3XFCY .gui-kid__modal-body-left-inner__2XtGF .gui-kid__menu-item__1vZqe:hover { background-color: #edeff5; } .gui-kid__modal-body__36dsq .gui-kid__modal-body-left__32Wt2 .gui-kid__modal-body-left-scroll__3XFCY .gui-kid__modal-body-left-inner__2XtGF .gui-kid__menu-item__1vZqe .gui-kid__menu-item-img__3xOlt { flex-shrink: 0; width: 20px; margin-right: 8px; } .gui-kid__modal-body__36dsq .gui-kid__modal-body-left__32Wt2 .gui-kid__modal-body-left-scroll__3XFCY .gui-kid__modal-body-left-inner__2XtGF .gui-kid__menu-item__1vZqe .gui-kid__menu-item-label__2piJR { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .gui-kid__modal-body__36dsq .gui-kid__modal-body-main__36Oi5 { padding: calc(12px) 0; } .gui-kid__modal-body__36dsq .gui-kid__modal-body-main__36Oi5 .gui-kid__modal-body-main-scroll__q742J { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .gui-kid__modal-body__36dsq .gui-kid__modal-body-main__36Oi5 .gui-kid__modal-body-main-scroll__q742J .gui-kid__modal-body-main-inner__2C7Jr { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .gui-kid__modal-body__36dsq .gui-kid__modal-body-main__36Oi5 .gui-kid__modal-body-main-scroll__q742J .gui-kid__modal-body-main-inner__2C7Jr .gui-kid__selector-btn-add__2rUlO, .gui-kid__modal-body__36dsq .gui-kid__modal-body-main__36Oi5 .gui-kid__modal-body-main-scroll__q742J .gui-kid__modal-body-main-inner__2C7Jr .gui-kid__selector-btn-item__2TuBJ { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .gui-kid__modal-body__36dsq .gui-kid__modal-body-main__36Oi5 .gui-kid__modal-body-main-scroll__q742J .gui-kid__modal-body-main-inner__2C7Jr .gui-kid__selector-btn-add__2rUlO:hover, .gui-kid__modal-body__36dsq .gui-kid__modal-body-main__36Oi5 .gui-kid__modal-body-main-scroll__q742J .gui-kid__modal-body-main-inner__2C7Jr .gui-kid__selector-btn-item__2TuBJ:hover { background-color: #e0e9ff; } .gui-kid__modal-body__36dsq .gui-kid__modal-body-main__36Oi5 .gui-kid__modal-body-main-scroll__q742J .gui-kid__modal-body-main-inner__2C7Jr .gui-kid__selector-btn-add__2rUlO:active, .gui-kid__modal-body__36dsq .gui-kid__modal-body-main__36Oi5 .gui-kid__modal-body-main-scroll__q742J .gui-kid__modal-body-main-inner__2C7Jr .gui-kid__selector-btn-item__2TuBJ:active { background-color: #ccdaff; } .gui-kid__modal-body__36dsq .gui-kid__modal-body-main__36Oi5 .gui-kid__modal-body-main-scroll__q742J .gui-kid__modal-body-main-inner__2C7Jr .gui-kid__selector-btn-add__2rUlO:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .gui-kid__modal-body__36dsq .gui-kid__modal-body-main__36Oi5 .gui-kid__modal-body-main-scroll__q742J .gui-kid__modal-body-main-inner__2C7Jr .gui-kid__selector-btn-add__2rUlO:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .gui-kid__modal-body__36dsq .gui-kid__modal-body-main__36Oi5 .gui-kid__modal-body-main-scroll__q742J .gui-kid__modal-body-main-inner__2C7Jr .gui-kid__selector-btn-add__2rUlO .gui-kid__add-img__2ahup { font-size: 28px; height: auto; margin-bottom: 8px; } .gui-kid__modal-body__36dsq .gui-kid__modal-body-main__36Oi5 .gui-kid__modal-body-main-scroll__q742J .gui-kid__modal-body-main-inner__2C7Jr .gui-kid__selector-btn-add__2rUlO .gui-kid__add-label__1dKg3 { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .gui-kid__modal-body__36dsq .gui-kid__modal-body-main__36Oi5 .gui-kid__modal-body-main-scroll__q742J .gui-kid__modal-body-main-inner__2C7Jr .gui-kid__selector-btn-item__2TuBJ { justify-content: space-between; } .gui-kid__modal-body__36dsq .gui-kid__modal-body-main__36Oi5 .gui-kid__modal-body-main-scroll__q742J .gui-kid__modal-body-main-inner__2C7Jr .gui-kid__selector-btn-item__2TuBJ .gui-kid__item-img__3BWTZ { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .gui-kid__modal-body__36dsq .gui-kid__modal-body-main__36Oi5 .gui-kid__modal-body-main-scroll__q742J .gui-kid__modal-body-main-inner__2C7Jr .gui-kid__selector-btn-item__2TuBJ .gui-kid__item-img__3BWTZ img { width: auto; height: 105px; } .gui-kid__modal-body__36dsq .gui-kid__modal-body-main__36Oi5 .gui-kid__modal-body-main-scroll__q742J .gui-kid__modal-body-main-inner__2C7Jr .gui-kid__selector-btn-item__2TuBJ .gui-kid__item-label__3BSUg { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .gui-kid__modal-footer__1CLuX { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .gui-kid__selector-btn-add__2rUlO, .gui-kid__selector-btn-item__2TuBJ { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .gui-kid__selector-btn-add__2rUlO { background-color: var(--selector-sprite-bg_primary); } .gui-kid__selector-btn-add__2rUlO:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .gui-kid__selector-btn-add__2rUlO:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .gui-kid__selector-btn-add__2rUlO .gui-kid__add-img__2ahup { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .gui-kid__selector-btn-add__2rUlO .gui-kid__add-label__1dKg3 { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .gui-kid__selector-btn-item__2TuBJ { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .gui-kid__selector-btn-item__2TuBJ .gui-kid__item-img__3BWTZ { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .gui-kid__selector-btn-item__2TuBJ .gui-kid__item-img__3BWTZ img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .gui-kid__selector-btn-item__2TuBJ .gui-kid__item-label__3BSUg { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .gui-kid__selector-btn-item__2TuBJ:hover { background-color: var(--selector-sprite-bg_primary); } .gui-kid__selector-btn-item__2TuBJ:hover .gui-kid__item-img__3BWTZ { border-color: var(--selector-sprite-bg_primary); } .gui-kid__selector-btn-item_selected__1ZumH { background-color: var(--selector-sprite-bg_primary); } .gui-kid__selector-btn-item_selected__1ZumH .gui-kid__item-img__3BWTZ { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .gui-kid__menu-bar-btn__G9w_B { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .gui-kid__menu-bar-btn_green__345N6, .gui-kid__menu-bar-btn_create__23wRo { background-color: #3cdc8f; } .gui-kid__menu-bar-btn_green__345N6:hover, .gui-kid__menu-bar-btn_create__23wRo:hover { background-color: #00d374; } .gui-kid__menu-bar-btn_green__345N6:active, .gui-kid__menu-bar-btn_create__23wRo:active { background-color: #00d374; } .gui-kid__menu-bar-btn_save__VykKS, .gui-kid__menu-bar-btn_reset__mgrDQ { background-color: #6ac8ff; } .gui-kid__menu-bar-btn_save__VykKS:hover, .gui-kid__menu-bar-btn_reset__mgrDQ:hover { background-color: #57bcfe; } .gui-kid__menu-bar-btn_save__VykKS:active, .gui-kid__menu-bar-btn_reset__mgrDQ:active { background-color: #4fb0fc; } .gui-kid__menu-bar-btn_submit__2Rh2M, .gui-kid__menu-bar-btn_open__1gu13 { background-color: #ff9e23; } .gui-kid__menu-bar-btn_submit__2Rh2M:hover, .gui-kid__menu-bar-btn_open__1gu13:hover { background-color: #f47b04; } .gui-kid__menu-bar-btn_submit__2Rh2M:active, .gui-kid__menu-bar-btn_open__1gu13:active { background-color: #fe8f22; } .gui-kid__menu-bar-btn_link__3L8WB { background-color: #e8efff; color: var(--theme-primary); } .gui-kid__menu-bar-btn_link__3L8WB:hover { background-color: #b6c7ff; } .gui-kid__menu-bar-btn_link__3L8WB:active { background-color: #cfdcff; } .gui-kid__menu-bar-btn_disabled__22yK1 { color: #565266; background-color: #e6e9ed; } .gui-kid__menu-bar-btn_disabled__22yK1:hover { cursor: not-allowed; } .gui-kid__menu-bar-btn_help__2aKKK { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .gui-kid__menu-bar-btn_help__2aKKK:hover { background-color: #8398ff; } .gui-kid__menu-bar-btn_help__2aKKK:active { background-color: #8ca3ff; } .gui-kid__menu-bar-separator__mZ4Ba { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .gui-kid__page__3Pj27 { width: 100%; height: 100%; background-color: #84c4fd; overflow: auto; } .gui-kid__page__3Pj27 .gui-kid__content__KdRwI { width: 100%; height: 100%; min-width: 1226px; min-height: 789px; display: flex; flex-direction: row; align-items: center; } .gui-kid__page__3Pj27 .gui-kid__running-mask__3qukI { width: 100%; height: 100%; box-sizing: border-box; position: absolute; top: 0; left: 0; z-index: 5003; background: rgba(255, 255, 255, 0.5); } .gui-kid__page__3Pj27 .gui-kid__guide-mask__n8y7z { width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); position: fixed; z-index: 5001; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ { width: 638px; height: 100%; display: flex; flex-direction: column; align-items: center; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx { width: 100%; height: 673px; box-sizing: border-box; padding: 16px; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU { width: 100%; height: 100%; position: relative; background-color: #e7f5ff; border-radius: 8px; box-shadow: 0px 0px 8px 0px rgba(155, 215, 255, 0.9) inset; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__screenList__3pxMb { width: 572px; height: 103px; margin: 0 16px 12px; padding: 10px; border-radius: 8px; background: #d4edff; box-shadow: inset 0px 2px 4px 0px #98d5ff, inset 0px -2px 4px 0px #95d4ff; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__screenList__3pxMb .gui-kid__screen-item__30Cvy { width: 106px; height: 83px; margin-left: 8px; border-radius: 8px; background: #ffffff; box-shadow: inset 0px -1.01px 2.02px 0px #c9dff9, 0px 1.01px 2.02px 0px rgba(0, 0, 0, 0.11); display: flex; flex-direction: row; justify-content: center; align-items: center; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__screenList__3pxMb .gui-kid__screen-item__30Cvy.gui-kid__screenActive__2hE0h { background: #99b8ff; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__screenList__3pxMb .gui-kid__screen-item__30Cvy.gui-kid__screenActive__2hE0h img { border: 2px solid #467eff; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__screenList__3pxMb .gui-kid__screen-item__30Cvy img { width: 92px; border-radius: 3px; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue { width: 100%; height: 78px; display: flex; flex-direction: row; justify-content: space-between; align-items: center; padding: 15px 22px 14px; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue .gui-kid__btn__2NlXD { width: 106px; height: 46px; background: #ffffff; border: 4px solid #d9ecf8; border-radius: 23px; font-weight: 600; font-size: 18px; display: flex; align-items: center; justify-content: center; position: relative; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue .gui-kid__btn__2NlXD.gui-kid__identify__eCNmh { color: #6ad7ef; position: relative; z-index: 5002; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue .gui-kid__btn__2NlXD.gui-kid__identify__eCNmh.gui-kid__disabled__2BswO { pointer-events: none; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue .gui-kid__btn__2NlXD.gui-kid__identify__eCNmh .gui-kid__disabled__2BswO { width: 106px; height: 46px; position: absolute; top: -4px; left: -4px; border-radius: 23px; background: rgba(0, 0, 0, 0.3); z-index: 5002; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue .gui-kid__btn__2NlXD.gui-kid__identify__eCNmh .gui-kid__identify-message__1MRgS { width: 232px; position: absolute; left: -5px; top: 18px; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue .gui-kid__btn__2NlXD.gui-kid__identify__eCNmh .gui-kid__identify-message__1MRgS img { width: 130%; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue .gui-kid__btn__2NlXD.gui-kid__identify__eCNmh:hover { background-color: #dcf8ff; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue .gui-kid__btn__2NlXD.gui-kid__run__2ZTiJ { color: #05cf4b; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue .gui-kid__btn__2NlXD.gui-kid__run__2ZTiJ:hover { background-color: rgba(5, 207, 75, 0.1); } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue .gui-kid__btn__2NlXD.gui-kid__run__2ZTiJ:active { background-color: rgba(5, 207, 75, 0.2); } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue .gui-kid__btn__2NlXD.gui-kid__running__nycuk { color: #ff8b49; border-color: #ff8b49; position: relative; z-index: 5004; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue .gui-kid__btn__2NlXD.gui-kid__running__nycuk:hover { background-color: rgba(255, 139, 73, 0.3); } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue .gui-kid__btn__2NlXD.gui-kid__running__nycuk:active { background-color: rgba(255, 139, 73, 0.5); } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue .gui-kid__btn__2NlXD .gui-kid__icon__gtD7A { margin-right: 4px; font-size: 24px; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue .gui-kid__btn__2NlXD:hover .gui-kid__drop__354Ib { display: block; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue .gui-kid__btn__2NlXD .gui-kid__drop__354Ib { width: 155px; height: 94px; padding-top: 15px; display: none; position: absolute; top: 35px; left: 0; font-weight: 400; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue .gui-kid__btn__2NlXD .gui-kid__drop__354Ib .gui-kid__drop-down-box__1kpKM { width: 140px; height: 94px; padding: 6px; background: #ffffff; border-radius: 4px; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue .gui-kid__btn__2NlXD .gui-kid__drop__354Ib .gui-kid__drop-down-box__1kpKM .gui-kid__box-item__11Jdc { width: 128px; height: 41px; display: flex; align-items: center; justify-content: center; border-radius: 4px; font-size: 16px; line-height: 16px; letter-spacing: 0px; color: #666666; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue .gui-kid__btn__2NlXD .gui-kid__drop__354Ib .gui-kid__drop-down-box__1kpKM .gui-kid__box-item__11Jdc:hover { background: rgba(209, 215, 225, 0.3); } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue .gui-kid__btn__2NlXD .gui-kid__drop__354Ib .gui-kid__drop-down-box__1kpKM .gui-kid__box-item__11Jdc:active { background: rgba(209, 215, 225, 0.6); } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__btns__GIjue .gui-kid__btn__2NlXD .gui-kid__drop__354Ib .gui-kid__drop-down-box__1kpKM .gui-kid__box-item__11Jdc .gui-kid__icon__gtD7A { font-size: 20px; color: #757c8a; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__gui-container__28zqF { width: 100%; height: 448px; padding: 0 16px 16px; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__gui-container__28zqF .gui-kid__gui-main__rUw3r { width: 100%; height: 100%; border: 4px solid #b0dfff; border-radius: 14px; overflow: hidden; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__stage-wrapper__3T_sx .gui-kid__stage-wrapperBg__2gozU .gui-kid__gui-container__28zqF .gui-kid__gui-main__rUw3r.gui-kid__main-running__3eiyf { position: relative; z-index: 5004; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__target-wrapper__8eIvy { width: 100%; min-width: 558px; min-height: 116px; flex: 1; box-sizing: border-box; padding: 0 16px 16px; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__target-wrapper__8eIvy .gui-kid__target-wrapper-bg__O1wNo { width: 100%; height: 100%; position: relative; padding: 16px; background-color: #e7f5ff; border-radius: 8px; box-shadow: 0px 0px 7.60784292px 0px rgba(155, 215, 255, 0.93) inset; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__target-wrapper__8eIvy .gui-kid__target-wrapper-bg__O1wNo .gui-kid__target-wrapper-content__27x-G { width: 100%; height: 100%; display: flex; flex-direction: row; flex-wrap: wrap; align-content: flex-start; justify-content: start; padding: 14px; background-color: #d4edff; border-radius: 8px; box-shadow: 0px 2px 4px 0px #98d5ff inset, 0px -2px 4px 0px #95d4ff inset; overflow: auto; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__target-wrapper__8eIvy .gui-kid__target-wrapper-bg__O1wNo .gui-kid__target-wrapper-content__27x-G .gui-kid__sprites-item__iSXuF { width: 98px; height: 116px; display: flex; flex-direction: column; align-items: center; justify-content: space-between; padding: 6px 6px 2px; margin-right: 12px; margin-bottom: 12px; background: #ffffff; box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.11), inset 0px -1px 2px #c9dff9; border-radius: 9.11111px; cursor: url(static/cursor/cursor-pointer.cur), pointer; position: relative; overflow: hidden; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__target-wrapper__8eIvy .gui-kid__target-wrapper-bg__O1wNo .gui-kid__target-wrapper-content__27x-G .gui-kid__sprites-item__iSXuF:nth-child(5n) { margin-right: 0; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__target-wrapper__8eIvy .gui-kid__target-wrapper-bg__O1wNo .gui-kid__target-wrapper-content__27x-G .gui-kid__sprites-item__iSXuF.gui-kid__active-sprite__T_YEj .gui-kid__item-img__3BWTZ { border-color: #6a7fff; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__target-wrapper__8eIvy .gui-kid__target-wrapper-bg__O1wNo .gui-kid__target-wrapper-content__27x-G .gui-kid__sprites-item__iSXuF .gui-kid__item-running__2LeRX { width: 98px; height: 116px; position: absolute; top: 0; left: 0; background: rgba(0, 0, 0, 0.3); z-index: 5002; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__target-wrapper__8eIvy .gui-kid__target-wrapper-bg__O1wNo .gui-kid__target-wrapper-content__27x-G .gui-kid__sprites-item__iSXuF .gui-kid__item-img__3BWTZ { width: 82px; height: 82px; display: flex; align-items: center; justify-content: center; padding: 5px; background: #f5f8ff; border: 2px solid #dae2f4; border-radius: 6px; position: relative; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__target-wrapper__8eIvy .gui-kid__target-wrapper-bg__O1wNo .gui-kid__target-wrapper-content__27x-G .gui-kid__sprites-item__iSXuF .gui-kid__item-img__3BWTZ img { max-width: 70px; max-height: 70px; object-fit: contain; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__target-wrapper__8eIvy .gui-kid__target-wrapper-bg__O1wNo .gui-kid__target-wrapper-content__27x-G .gui-kid__sprites-item__iSXuF .gui-kid__item-img__3BWTZ .gui-kid__sign__23PcW { width: 18px; height: 18px; display: flex; align-items: center; justify-content: center; position: absolute; right: -4px; bottom: -4px; border-radius: 100%; background-color: #6a7fff; border: 2px solid #ffffff; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__target-wrapper__8eIvy .gui-kid__target-wrapper-bg__O1wNo .gui-kid__target-wrapper-content__27x-G .gui-kid__sprites-item__iSXuF .gui-kid__item-img__3BWTZ .gui-kid__sign__23PcW.gui-kid__is-error__GELFn { background-color: #ff6363; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__target-wrapper__8eIvy .gui-kid__target-wrapper-bg__O1wNo .gui-kid__target-wrapper-content__27x-G .gui-kid__sprites-item__iSXuF .gui-kid__item-img__3BWTZ .gui-kid__sign__23PcW .gui-kid__icon__gtD7A { font-size: 12px; color: #ffffff; } .gui-kid__page__3Pj27 .gui-kid__stage-and-target-wrapper__3YnoZ .gui-kid__target-wrapper__8eIvy .gui-kid__target-wrapper-bg__O1wNo .gui-kid__target-wrapper-content__27x-G .gui-kid__sprites-item__iSXuF .gui-kid__item-name__1oS2_ { font-weight: 400; font-size: 15px; line-height: 20px; color: #5e6b81; } .gui-kid__page__3Pj27 .gui-kid__editor-wrapper__1sXoj { flex: 1; height: 100%; box-sizing: border-box; padding: 16px 16px 16px 0; } .gui-kid__page__3Pj27 .gui-kid__editor-wrapper__1sXoj .gui-kid__editor-wrapper-bg__3exUa { width: 100%; height: 100%; position: relative; padding: 16px; background-color: #e7f5ff; border-radius: 8px; box-shadow: 0px 0px 7.60784292px 0px rgba(155, 215, 255, 0.93) inset; } .gui-kid__page__3Pj27 .gui-kid__editor-wrapper__1sXoj .gui-kid__editor-wrapper-bg__3exUa .gui-kid__editor-wrapper-content__l_9BZ { width: 100%; height: 100%; position: relative; background-color: #ffffff; border-radius: 8px; box-shadow: 0px 2px 4px 0px #98d5ff inset, 0px -2px 4px 0px #95d4ff inset; } .gui-kid__page__3Pj27 .gui-kid__editor-wrapper__1sXoj .gui-kid__editor-wrapper-bg__3exUa .gui-kid__editor-wrapper-content__l_9BZ .gui-kid__editor-wrapper-content-sprite__2HE4_ { max-width: 100px; max-height: 100px; position: absolute; bottom: 20px; right: 20px; opacity: 0.5; } .gui-kid__page__3Pj27 .gui-kid__editor-wrapper__1sXoj .gui-kid__editor-wrapper-bg__3exUa .gui-kid__editor-wrapper-content__l_9BZ .gui-kid__modal-main__3-BMH { width: 100%; display: flex; align-items: start; justify-content: center; padding-top: 150px; overflow-x: hidden; overflow-y: overlay; } .gui-kid__page__3Pj27 .gui-kid__editor-wrapper__1sXoj .gui-kid__editor-wrapper-bg__3exUa .gui-kid__editor-wrapper-content__l_9BZ .gui-kid__modal-main__3-BMH .gui-kid__main-blocks__2PCPg { width: 126px; height: 100%; margin: 0 30px; } .gui-kid__page__3Pj27 .gui-kid__editor-wrapper__1sXoj .gui-kid__editor-wrapper-bg__3exUa .gui-kid__editor-wrapper-content__l_9BZ .gui-kid__modal-main__3-BMH .gui-kid__main-blocks__2PCPg .gui-kid__block__lneID { height: 80.2px; position: relative; top: 0px; } .gui-kid__page__3Pj27 .gui-kid__editor-wrapper__1sXoj .gui-kid__editor-wrapper-bg__3exUa .gui-kid__editor-wrapper-content__l_9BZ .gui-kid__modal-main__3-BMH .gui-kid__main-blocks__2PCPg .gui-kid__block__lneID.gui-kid__is-control__1sJDc { width: 140px; } .gui-kid__page__3Pj27 .gui-kid__editor-wrapper__1sXoj .gui-kid__editor-wrapper-bg__3exUa .gui-kid__editor-wrapper-content__l_9BZ .gui-kid__modal-main__3-BMH .gui-kid__main-blocks__2PCPg .gui-kid__block__lneID.gui-kid__is-control-stop__1vpm9 { height: 39px; top: -19px; } .gui-kid__page__3Pj27 .gui-kid__editor-wrapper__1sXoj .gui-kid__editor-wrapper-bg__3exUa .gui-kid__editor-wrapper-content__l_9BZ .gui-kid__modal-main__3-BMH .gui-kid__main-blocks__2PCPg .gui-kid__block__lneID .gui-kid__control-range__1bqfX { width: 15px; height: 110%; position: absolute; min-height: 82px; top: -3px; } .gui-kid__page__3Pj27 .gui-kid__editor-wrapper__1sXoj .gui-kid__editor-wrapper-bg__3exUa .gui-kid__editor-wrapper-content__l_9BZ .gui-kid__modal-main__3-BMH .gui-kid__main-blocks__2PCPg .gui-kid__block__lneID:last-of-type { height: 92.7px; } .gui-kid__page__3Pj27 .gui-kid__editor-wrapper__1sXoj .gui-kid__editor-wrapper-bg__3exUa .gui-kid__editor-wrapper-content__l_9BZ .gui-kid__modal-main__3-BMH .gui-kid__main-blocks__2PCPg .gui-kid__block__lneID .gui-kid__block-img__2ijW9 { height: 92.7px; position: absolute; top: 0px; z-index: 1001; } .gui-kid__page__3Pj27 .gui-kid__editor-wrapper__1sXoj .gui-kid__editor-wrapper-bg__3exUa .gui-kid__editor-wrapper-content__l_9BZ .gui-kid__modal-main__3-BMH .gui-kid__main-blocks__2PCPg .gui-kid__block__lneID .gui-kid__block-img__2ijW9.gui-kid__control_forever__3DOIa { height: 98px; } .gui-kid__page__3Pj27 .gui-kid__editor-wrapper__1sXoj .gui-kid__editor-wrapper-bg__3exUa .gui-kid__editor-wrapper-content__l_9BZ .gui-kid__modal-main__3-BMH .gui-kid__main-blocks__2PCPg .gui-kid__block__lneID .gui-kid__block-img__2ijW9.gui-kid__control-forever-stop__1sVKk { height: 64px; z-index: 1000; } .gui-kid__page__3Pj27 .gui-kid__editor-wrapper__1sXoj .gui-kid__editor-wrapper-bg__3exUa .gui-kid__editor-wrapper-content__l_9BZ .gui-kid__modal-main__3-BMH .gui-kid__main-blocks__2PCPg .gui-kid__block__lneID .gui-kid__block-img__2ijW9.gui-kid__control-stop__31dIU { height: 70px; z-index: 1000; } .gui-kid__page__3Pj27 .gui-kid__editor-wrapper__1sXoj .gui-kid__editor-wrapper-bg__3exUa .gui-kid__editor-wrapper-content__l_9BZ .gui-kid__modal-main__3-BMH .gui-kid__main-blocks__2PCPg .gui-kid__block__lneID .gui-kid__block-num__2m-93 { width: 27px; height: 21.2px; display: flex; align-items: center; justify-content: center; position: absolute; right: 10px; top: 32px; z-index: 1002; font-size: 20px; color: #000000; } .gui-kid__page__3Pj27 .gui-kid__editor-wrapper__1sXoj .gui-kid__editor-wrapper-bg__3exUa .gui-kid__editor-wrapper-content__l_9BZ .gui-kid__modal-main__3-BMH .gui-kid__main-blocks__2PCPg .gui-kid__block__lneID .gui-kid__content-img__1foyZ { width: 28px; height: 28px; position: absolute; right: 10px; top: 29px; z-index: 1002; } .gui-kid__page__3Pj27 .gui-kid__editor-wrapper__1sXoj .gui-kid__editor-wrapper-bg__3exUa .gui-kid__editor-wrapper-content__l_9BZ .gui-kid__modal-main__3-BMH .gui-kid__main-blocks__2PCPg .gui-kid__block__lneID .gui-kid__content-img__1foyZ.gui-kid__screen-img__U61gK { width: 22px; height: 22px; right: 13px; top: 33px; } .gui-kid__page__3Pj27 .gui-kid__editor-wrapper__1sXoj .gui-kid__editor-wrapper-bg__3exUa .gui-kid__editor-wrapper-content__l_9BZ .gui-kid__modal-main__3-BMH .gui-kid__empty__2wJGf { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: start; } .gui-kid__page__3Pj27 .gui-kid__editor-wrapper__1sXoj .gui-kid__editor-wrapper-bg__3exUa .gui-kid__editor-wrapper-content__l_9BZ .gui-kid__modal-main__3-BMH .gui-kid__empty__2wJGf .gui-kid__empty-img__2MX7N { width: 200px; } .gui-kid__page__3Pj27 .gui-kid__editor-wrapper__1sXoj .gui-kid__editor-wrapper-bg__3exUa .gui-kid__editor-wrapper-content__l_9BZ .gui-kid__modal-main__3-BMH .gui-kid__empty__2wJGf .gui-kid__empty-info__2_LAZ { font-weight: 400; font-size: 14px; color: #98a2b4; } .gui-kid__page__3Pj27 .gui-kid__mask__1OGIW { width: 100%; height: 100%; position: fixed; top: 0; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, 0.6); transition: opacity 0.2s linear; } .gui-kid__page__3Pj27 .gui-kid__mask__1OGIW .gui-kid__modal__3_jXJ { width: 700px; height: 586px; position: relative; padding: 30px 30px 0; display: flex; flex-direction: column; background: #ffffff; border: 6px solid #979797; border-radius: 17px; } .gui-kid__page__3Pj27 .gui-kid__mask__1OGIW .gui-kid__modal__3_jXJ .gui-kid__camera-video__3pTsn { width: 100%; height: 473px; border-radius: 12px; background: #ffffff; border: 4px solid #d9edf9; position: relative; } .gui-kid__page__3Pj27 .gui-kid__mask__1OGIW .gui-kid__modal__3_jXJ .gui-kid__camera-video__3pTsn .gui-kid__canvas-img__1FgdF { width: 100%; height: 100%; border-radius: 8px; } .gui-kid__page__3Pj27 .gui-kid__mask__1OGIW .gui-kid__modal__3_jXJ .gui-kid__camera-video__3pTsn .gui-kid__video__1zzUm { width: 100%; height: 100%; border-radius: 8px; } .gui-kid__page__3Pj27 .gui-kid__mask__1OGIW .gui-kid__modal__3_jXJ .gui-kid__camera-video__3pTsn .gui-kid__video-loading__3usvz { width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; position: absolute; top: 0; left: 0; z-index: 5002; background-color: #ffffff; font-weight: 400; font-size: 20px; color: #6ad7ef; } .gui-kid__page__3Pj27 .gui-kid__mask__1OGIW .gui-kid__modal__3_jXJ .gui-kid__camera-video__3pTsn .gui-kid__video-loading__3usvz .gui-kid__icon__gtD7A { font-size: 90px; } .gui-kid__page__3Pj27 .gui-kid__mask__1OGIW .gui-kid__modal__3_jXJ .gui-kid__camera-btns__3RdPU { width: 100%; height: 71px; display: flex; flex-direction: row; align-items: center; justify-content: space-between; } .gui-kid__page__3Pj27 .gui-kid__mask__1OGIW .gui-kid__modal__3_jXJ .gui-kid__camera-btns__3RdPU .gui-kid__camera-btn__1g_DO { width: 111px; height: 46px; display: flex; align-items: center; justify-content: center; border-radius: 24px; font-weight: 400; font-size: 18px; color: #ffffff; } .gui-kid__page__3Pj27 .gui-kid__mask__1OGIW .gui-kid__modal__3_jXJ .gui-kid__camera-btns__3RdPU .gui-kid__camera-btn__1g_DO:first-of-type { background: #f2952f; border: 3.9px solid #ffe4c6; } .gui-kid__page__3Pj27 .gui-kid__mask__1OGIW .gui-kid__modal__3_jXJ .gui-kid__camera-btns__3RdPU .gui-kid__camera-btn__1g_DO:first-of-type:hover { background: #e5851c; } .gui-kid__page__3Pj27 .gui-kid__mask__1OGIW .gui-kid__modal__3_jXJ .gui-kid__camera-btns__3RdPU .gui-kid__camera-btn__1g_DO:first-of-type:active { background: #d37003; } .gui-kid__page__3Pj27 .gui-kid__mask__1OGIW .gui-kid__modal__3_jXJ .gui-kid__camera-btns__3RdPU .gui-kid__camera-btn__1g_DO:last-of-type { background: #2e91ff; border: 4px solid #d9ecf8; } .gui-kid__page__3Pj27 .gui-kid__mask__1OGIW .gui-kid__modal__3_jXJ .gui-kid__camera-btns__3RdPU .gui-kid__camera-btn__1g_DO:last-of-type:hover { background: #2182f0; } .gui-kid__page__3Pj27 .gui-kid__mask__1OGIW .gui-kid__modal__3_jXJ .gui-kid__camera-btns__3RdPU .gui-kid__camera-btn__1g_DO:last-of-type:active { background: #0a6ddd; } .gui-kid__page__3Pj27 .gui-kid__mask__1OGIW .gui-kid__modal__3_jXJ .gui-kid__close__2gP87 { width: 42px; height: 42px; display: flex; align-items: center; justify-content: center; position: absolute; right: -21px; top: -21px; background: #f66e55; border-radius: 100%; } .gui-kid__page__3Pj27 .gui-kid__mask__1OGIW .gui-kid__modal__3_jXJ .gui-kid__close__2gP87 .gui-kid__icon__gtD7A { color: #ffffff; font-size: 26px; } .gui-kid__page__3Pj27 .gui-kid__mask__1OGIW .gui-kid__modal__3_jXJ .gui-kid__close__2gP87:hover { background: #e54f33; } .gui-kid__page__3Pj27 .gui-kid__mask__1OGIW .gui-kid__modal__3_jXJ .gui-kid__close__2gP87:active { background: #da4226; } .gui-kid__page__3Pj27 .gui-kid__custom-loading__TGApS { width: 100%; height: 100%; position: fixed; top: 0; left: 0; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, 0.6); } .gui-kid__page__3Pj27 .gui-kid__custom-loading__TGApS .gui-kid__loading-content__fQGxz { width: 300px; height: 300px; display: flex; flex-direction: column; align-items: center; justify-content: center; transition: all 0.2s linear; } .gui-kid__page__3Pj27 .gui-kid__custom-loading__TGApS .gui-kid__loading-content__fQGxz img { width: 36px; height: 36px; margin-bottom: 16px; animation: gui-kid__rotate__vGN-S 1.5s linear infinite; } @keyframes gui-kid__rotate__vGN-S { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } .gui-kid__page__3Pj27 .gui-kid__bgRadius__Eav0G { width: 6px; height: 6px; background-color: #bfe5ff; border-radius: 6px; border: 1px solid #b1e0ff; position: absolute; } .gui-kid__page__3Pj27 .gui-kid__bgRadius__Eav0G.gui-kid__bgRadiusTL__3Gpgw { top: 7px; left: 7px; } .gui-kid__page__3Pj27 .gui-kid__bgRadius__Eav0G.gui-kid__bgRadiusTR__102bF { top: 7px; right: 7px; } .gui-kid__page__3Pj27 .gui-kid__bgRadius__Eav0G.gui-kid__bgRadiusBL__2NuEc { bottom: 7px; left: 7px; } .gui-kid__page__3Pj27 .gui-kid__bgRadius__Eav0G.gui-kid__bgRadiusBR__1NHT1 { bottom: 7px; right: 7px; } .gui-kid__page__3Pj27 .gui-kid__bgBox__16wZO { background-color: #bfe5ff; position: absolute; } .gui-kid__page__3Pj27 .gui-kid__bgBox__16wZO.gui-kid__bgBoxTop__1s06F { width: 146px; height: 8px; border-radius: 0 0 8px 8px; top: 0; right: 50%; transform: translate(50%, 0); } .gui-kid__page__3Pj27 .gui-kid__bgBox__16wZO.gui-kid__bgBoxBottom__3pRMK { width: 146px; height: 8px; border-radius: 8px 8px 0 0; bottom: 0; right: 50%; transform: translate(50%, 0); } .gui-kid__page__3Pj27 .gui-kid__bgBox__16wZO.gui-kid__bgBoxLeft__a-QJT { width: 8px; height: 146px; border-radius: 0 8px 8px 0; bottom: 10%; left: 0; } .gui-kid__page__3Pj27 .gui-kid__bgBox__16wZO.gui-kid__bgBoxRight__3n1CE { width: 8px; height: 146px; border-radius: 8px 0 0 8px; top: 10%; right: 0; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .work-name-input__flex-center__123QD { display: flex; align-items: center; justify-content: center; } .work-name-input__full-filled__3XMRc { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .work-name-input__modal-mask__3v2CW { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .work-name-input__modal-mask__3v2CW .work-name-input__modal-wrap__8FInI { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .work-name-input__modal-mask__3v2CW .work-name-input__modal-wrap__8FInI .work-name-input__modal-header-wrap__2TsXx { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .work-name-input__modal-mask__3v2CW .work-name-input__modal-wrap__8FInI .work-name-input__modal-header-wrap__2TsXx .work-name-input__modal-header-bg__kPrbr { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .work-name-input__modal-mask__3v2CW .work-name-input__modal-wrap__8FInI .work-name-input__modal-header-wrap__2TsXx .work-name-input__modal-header-label__2y6_U { flex-shrink: 0; font-size: 16px; font-weight: bold; } .work-name-input__modal-mask__3v2CW .work-name-input__modal-wrap__8FInI .work-name-input__modal-header-wrap__2TsXx .work-name-input__modal-header-close__LMasq { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .work-name-input__modal-mask__3v2CW .work-name-input__modal-wrap__8FInI .work-name-input__modal-header-wrap__2TsXx .work-name-input__modal-header-close__LMasq:hover { color: #98a2b4; } .work-name-input__modal-mask__3v2CW .work-name-input__modal-wrap__8FInI .work-name-input__modal-body-wrap__8JcZY { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .work-name-input__modal-mask__3v2CW .work-name-input__modal-wrap__8FInI .work-name-input__modal-footer-wrap__35x0c { flex-shrink: 0; display: flex; } .work-name-input__modal-header__34eLB { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .work-name-input__modal-header__34eLB .work-name-input__modal-header-upload__1alyy { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .work-name-input__modal-header__34eLB .work-name-input__modal-header-upload__1alyy:hover { background-color: #e0e9ff; } .work-name-input__modal-header__34eLB .work-name-input__modal-header-upload__1alyy:active { background-color: #ccdaff; } .work-name-input__modal-header__34eLB .work-name-input__modal-header-upload__1alyy .work-name-input__upload-img__2qtPm { font-size: 16px; margin-right: calc(2px); } .work-name-input__modal-header__34eLB .work-name-input__modal-header-upload__1alyy .work-name-input__upload-label__39lr8 { font-size: 14px; } .work-name-input__modal-header__34eLB .work-name-input__modal-header-upload__1alyy .work-name-input__upload-input__3AFfm { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .work-name-input__modal-header__34eLB .work-name-input__modal-header-search__28LoN { position: relative; } .work-name-input__modal-header__34eLB .work-name-input__modal-header-search__28LoN .work-name-input__search-input__1J3ak { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .work-name-input__modal-header__34eLB .work-name-input__modal-header-search__28LoN .work-name-input__search-input__1J3ak::-webkit-input-placeholder { color: #98a2b4; } .work-name-input__modal-header__34eLB .work-name-input__modal-header-search__28LoN .work-name-input__search-input__1J3ak::-moz-placeholder { color: #98a2b4; } .work-name-input__modal-header__34eLB .work-name-input__modal-header-search__28LoN .work-name-input__search-input__1J3ak:-ms-input-placeholder { color: #98a2b4; } .work-name-input__modal-header__34eLB .work-name-input__modal-header-search__28LoN .work-name-input__search-input__1J3ak:hover { border-color: #d1d7e1; } .work-name-input__modal-header__34eLB .work-name-input__modal-header-search__28LoN .work-name-input__search-input__1J3ak:active { border-color: #d1d7e1; } .work-name-input__modal-header__34eLB .work-name-input__modal-header-search__28LoN .work-name-input__search-img__19lQn { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .work-name-input__modal-body__1K7E1 { flex-grow: 1; display: flex; } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-left__3Prvy, .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-main__1tEbh { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-left__3Prvy { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-left__3Prvy .work-name-input__modal-body-left-scroll__31aE1 { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-left__3Prvy .work-name-input__modal-body-left-scroll__31aE1 .work-name-input__modal-body-left-inner__2dKmy { width: 121px; padding: calc(12px); color: #5e6b81; } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-left__3Prvy .work-name-input__modal-body-left-scroll__31aE1 .work-name-input__modal-body-left-inner__2dKmy .work-name-input__menu-item-current__34bFB { color: var(--theme-primary); background-color: #e0e9ff; } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-left__3Prvy .work-name-input__modal-body-left-scroll__31aE1 .work-name-input__modal-body-left-inner__2dKmy .work-name-input__menu-item__1JHFp { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-left__3Prvy .work-name-input__modal-body-left-scroll__31aE1 .work-name-input__modal-body-left-inner__2dKmy .work-name-input__menu-item__1JHFp:hover { background-color: #edeff5; } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-left__3Prvy .work-name-input__modal-body-left-scroll__31aE1 .work-name-input__modal-body-left-inner__2dKmy .work-name-input__menu-item__1JHFp .work-name-input__menu-item-img__2YBLP { flex-shrink: 0; width: 20px; margin-right: 8px; } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-left__3Prvy .work-name-input__modal-body-left-scroll__31aE1 .work-name-input__modal-body-left-inner__2dKmy .work-name-input__menu-item__1JHFp .work-name-input__menu-item-label__3KZBe { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-main__1tEbh { padding: calc(12px) 0; } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-main__1tEbh .work-name-input__modal-body-main-scroll__1eo-0 { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-main__1tEbh .work-name-input__modal-body-main-scroll__1eo-0 .work-name-input__modal-body-main-inner__2fhvI { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-main__1tEbh .work-name-input__modal-body-main-scroll__1eo-0 .work-name-input__modal-body-main-inner__2fhvI .work-name-input__selector-btn-add__YYmz3, .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-main__1tEbh .work-name-input__modal-body-main-scroll__1eo-0 .work-name-input__modal-body-main-inner__2fhvI .work-name-input__selector-btn-item__3_5Os { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-main__1tEbh .work-name-input__modal-body-main-scroll__1eo-0 .work-name-input__modal-body-main-inner__2fhvI .work-name-input__selector-btn-add__YYmz3:hover, .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-main__1tEbh .work-name-input__modal-body-main-scroll__1eo-0 .work-name-input__modal-body-main-inner__2fhvI .work-name-input__selector-btn-item__3_5Os:hover { background-color: #e0e9ff; } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-main__1tEbh .work-name-input__modal-body-main-scroll__1eo-0 .work-name-input__modal-body-main-inner__2fhvI .work-name-input__selector-btn-add__YYmz3:active, .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-main__1tEbh .work-name-input__modal-body-main-scroll__1eo-0 .work-name-input__modal-body-main-inner__2fhvI .work-name-input__selector-btn-item__3_5Os:active { background-color: #ccdaff; } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-main__1tEbh .work-name-input__modal-body-main-scroll__1eo-0 .work-name-input__modal-body-main-inner__2fhvI .work-name-input__selector-btn-add__YYmz3:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-main__1tEbh .work-name-input__modal-body-main-scroll__1eo-0 .work-name-input__modal-body-main-inner__2fhvI .work-name-input__selector-btn-add__YYmz3:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-main__1tEbh .work-name-input__modal-body-main-scroll__1eo-0 .work-name-input__modal-body-main-inner__2fhvI .work-name-input__selector-btn-add__YYmz3 .work-name-input__add-img__2u1Iu { font-size: 28px; height: auto; margin-bottom: 8px; } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-main__1tEbh .work-name-input__modal-body-main-scroll__1eo-0 .work-name-input__modal-body-main-inner__2fhvI .work-name-input__selector-btn-add__YYmz3 .work-name-input__add-label__2CuHN { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-main__1tEbh .work-name-input__modal-body-main-scroll__1eo-0 .work-name-input__modal-body-main-inner__2fhvI .work-name-input__selector-btn-item__3_5Os { justify-content: space-between; } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-main__1tEbh .work-name-input__modal-body-main-scroll__1eo-0 .work-name-input__modal-body-main-inner__2fhvI .work-name-input__selector-btn-item__3_5Os .work-name-input__item-img__2NWhq { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-main__1tEbh .work-name-input__modal-body-main-scroll__1eo-0 .work-name-input__modal-body-main-inner__2fhvI .work-name-input__selector-btn-item__3_5Os .work-name-input__item-img__2NWhq img { width: auto; height: 105px; } .work-name-input__modal-body__1K7E1 .work-name-input__modal-body-main__1tEbh .work-name-input__modal-body-main-scroll__1eo-0 .work-name-input__modal-body-main-inner__2fhvI .work-name-input__selector-btn-item__3_5Os .work-name-input__item-label__3KmBD { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .work-name-input__modal-footer__2_2qY { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .work-name-input__selector-btn-add__YYmz3, .work-name-input__selector-btn-item__3_5Os { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .work-name-input__selector-btn-add__YYmz3 { background-color: var(--selector-sprite-bg_primary); } .work-name-input__selector-btn-add__YYmz3:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .work-name-input__selector-btn-add__YYmz3:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .work-name-input__selector-btn-add__YYmz3 .work-name-input__add-img__2u1Iu { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .work-name-input__selector-btn-add__YYmz3 .work-name-input__add-label__2CuHN { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .work-name-input__selector-btn-item__3_5Os { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .work-name-input__selector-btn-item__3_5Os .work-name-input__item-img__2NWhq { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .work-name-input__selector-btn-item__3_5Os .work-name-input__item-img__2NWhq img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .work-name-input__selector-btn-item__3_5Os .work-name-input__item-label__3KmBD { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .work-name-input__selector-btn-item__3_5Os:hover { background-color: var(--selector-sprite-bg_primary); } .work-name-input__selector-btn-item__3_5Os:hover .work-name-input__item-img__2NWhq { border-color: var(--selector-sprite-bg_primary); } .work-name-input__selector-btn-item_selected__2dbMD { background-color: var(--selector-sprite-bg_primary); } .work-name-input__selector-btn-item_selected__2dbMD .work-name-input__item-img__2NWhq { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .work-name-input__menu-bar-btn__2Sw3Q { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .work-name-input__menu-bar-btn_green__3nQ27, .work-name-input__menu-bar-btn_create__2s1VF { background-color: #3cdc8f; } .work-name-input__menu-bar-btn_green__3nQ27:hover, .work-name-input__menu-bar-btn_create__2s1VF:hover { background-color: #00d374; } .work-name-input__menu-bar-btn_green__3nQ27:active, .work-name-input__menu-bar-btn_create__2s1VF:active { background-color: #00d374; } .work-name-input__menu-bar-btn_save__3RYMH, .work-name-input__menu-bar-btn_reset__UDZfK { background-color: #6ac8ff; } .work-name-input__menu-bar-btn_save__3RYMH:hover, .work-name-input__menu-bar-btn_reset__UDZfK:hover { background-color: #57bcfe; } .work-name-input__menu-bar-btn_save__3RYMH:active, .work-name-input__menu-bar-btn_reset__UDZfK:active { background-color: #4fb0fc; } .work-name-input__menu-bar-btn_submit__2dSZl, .work-name-input__menu-bar-btn_open__2tjbs { background-color: #ff9e23; } .work-name-input__menu-bar-btn_submit__2dSZl:hover, .work-name-input__menu-bar-btn_open__2tjbs:hover { background-color: #f47b04; } .work-name-input__menu-bar-btn_submit__2dSZl:active, .work-name-input__menu-bar-btn_open__2tjbs:active { background-color: #fe8f22; } .work-name-input__menu-bar-btn_link__30qgB { background-color: #e8efff; color: var(--theme-primary); } .work-name-input__menu-bar-btn_link__30qgB:hover { background-color: #b6c7ff; } .work-name-input__menu-bar-btn_link__30qgB:active { background-color: #cfdcff; } .work-name-input__menu-bar-btn_disabled__2Hzur { color: #565266; background-color: #e6e9ed; } .work-name-input__menu-bar-btn_disabled__2Hzur:hover { cursor: not-allowed; } .work-name-input__menu-bar-btn_help__B-Fbl { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .work-name-input__menu-bar-btn_help__B-Fbl:hover { background-color: #8398ff; } .work-name-input__menu-bar-btn_help__B-Fbl:active { background-color: #8ca3ff; } .work-name-input__menu-bar-separator__3AhN6 { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* If work-name-input.jsx is part of a menu bar say menu-bar.jsx, it can have additional css classes that can set a width for example or what it should do in a flex box (eg. grow). */ .work-name-input__work-name-input__2_rgK { border: none; width: 160px; height: 24px; background-color: #586ef5; font-size: 14px; color: #e8efff; border-radius: 6px; } .work-name-input__work-name-input__2_rgK:focus { box-shadow: 0px 0px 0px 2px #8899ff inset; color: #e8efff; } .work-name-input__work-name-input__2_rgK:hover { color: #e8efff; box-shadow: 0px 0px 0px 2px #8899ff inset; } .work-name-input__work-name-input__2_rgK:-ms-input-placeholder { color: #98a2b4; } .work-name-input__work-name-input__2_rgK::placeholder { color: #98a2b4; } .work-name-input__work-name-input__2_rgK:focus-visible { outline: none; } .work-name-input__work-name-input-disabled__2BEUp { position: relative; display: flex; align-items: center; height: 24px; padding: 0 12px; font-size: 14px; color: #ffffff; } .work-name-input__work-name-input-disabled__2BEUp .work-name-input__work-name-icon-left__26JMz { margin-right: 4px; font-size: 18px; color: #c3ccff; } .work-name-input__work-name-input-disabled__2BEUp .work-name-input__work-name-text__1xhmo { flex: 1; max-width: 140px; overflow: hidden; text-overflow: ellipsis; } .work-name-input__work-name-input-disabled__2BEUp .work-name-input__work-name-icon-star__2aU6g { width: 12px; margin-left: 2px; } .work-name-input__work-name-input-disabled__2BEUp::before { position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 14px; background-color: #e8efff; content: ''; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .mission-countdown__flex-center__1vtNv { display: flex; align-items: center; justify-content: center; } .mission-countdown__full-filled__35ER_ { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .mission-countdown__modal-mask__3zso- { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .mission-countdown__modal-mask__3zso- .mission-countdown__modal-wrap__2ODTD { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .mission-countdown__modal-mask__3zso- .mission-countdown__modal-wrap__2ODTD .mission-countdown__modal-header-wrap__3JVp5 { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .mission-countdown__modal-mask__3zso- .mission-countdown__modal-wrap__2ODTD .mission-countdown__modal-header-wrap__3JVp5 .mission-countdown__modal-header-bg__12JE4 { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .mission-countdown__modal-mask__3zso- .mission-countdown__modal-wrap__2ODTD .mission-countdown__modal-header-wrap__3JVp5 .mission-countdown__modal-header-label__kvioW { flex-shrink: 0; font-size: 16px; font-weight: bold; } .mission-countdown__modal-mask__3zso- .mission-countdown__modal-wrap__2ODTD .mission-countdown__modal-header-wrap__3JVp5 .mission-countdown__modal-header-close__1GkBd { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mission-countdown__modal-mask__3zso- .mission-countdown__modal-wrap__2ODTD .mission-countdown__modal-header-wrap__3JVp5 .mission-countdown__modal-header-close__1GkBd:hover { color: #98a2b4; } .mission-countdown__modal-mask__3zso- .mission-countdown__modal-wrap__2ODTD .mission-countdown__modal-body-wrap__1AZFR { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .mission-countdown__modal-mask__3zso- .mission-countdown__modal-wrap__2ODTD .mission-countdown__modal-footer-wrap__3W49F { flex-shrink: 0; display: flex; } .mission-countdown__modal-header__3je_7 { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .mission-countdown__modal-header__3je_7 .mission-countdown__modal-header-upload__3cr57 { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .mission-countdown__modal-header__3je_7 .mission-countdown__modal-header-upload__3cr57:hover { background-color: #e0e9ff; } .mission-countdown__modal-header__3je_7 .mission-countdown__modal-header-upload__3cr57:active { background-color: #ccdaff; } .mission-countdown__modal-header__3je_7 .mission-countdown__modal-header-upload__3cr57 .mission-countdown__upload-img__27BM2 { font-size: 16px; margin-right: calc(2px); } .mission-countdown__modal-header__3je_7 .mission-countdown__modal-header-upload__3cr57 .mission-countdown__upload-label__d2pDt { font-size: 14px; } .mission-countdown__modal-header__3je_7 .mission-countdown__modal-header-upload__3cr57 .mission-countdown__upload-input__2S-6L { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mission-countdown__modal-header__3je_7 .mission-countdown__modal-header-search__2Hfya { position: relative; } .mission-countdown__modal-header__3je_7 .mission-countdown__modal-header-search__2Hfya .mission-countdown__search-input__9E52k { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .mission-countdown__modal-header__3je_7 .mission-countdown__modal-header-search__2Hfya .mission-countdown__search-input__9E52k::-webkit-input-placeholder { color: #98a2b4; } .mission-countdown__modal-header__3je_7 .mission-countdown__modal-header-search__2Hfya .mission-countdown__search-input__9E52k::-moz-placeholder { color: #98a2b4; } .mission-countdown__modal-header__3je_7 .mission-countdown__modal-header-search__2Hfya .mission-countdown__search-input__9E52k:-ms-input-placeholder { color: #98a2b4; } .mission-countdown__modal-header__3je_7 .mission-countdown__modal-header-search__2Hfya .mission-countdown__search-input__9E52k:hover { border-color: #d1d7e1; } .mission-countdown__modal-header__3je_7 .mission-countdown__modal-header-search__2Hfya .mission-countdown__search-input__9E52k:active { border-color: #d1d7e1; } .mission-countdown__modal-header__3je_7 .mission-countdown__modal-header-search__2Hfya .mission-countdown__search-img__3oUYw { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mission-countdown__modal-body__jwTXQ { flex-grow: 1; display: flex; } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-left__3DJzF, .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-main__1pKji { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-left__3DJzF { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-left__3DJzF .mission-countdown__modal-body-left-scroll__77arJ { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-left__3DJzF .mission-countdown__modal-body-left-scroll__77arJ .mission-countdown__modal-body-left-inner__3TYVk { width: 121px; padding: calc(12px); color: #5e6b81; } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-left__3DJzF .mission-countdown__modal-body-left-scroll__77arJ .mission-countdown__modal-body-left-inner__3TYVk .mission-countdown__menu-item-current__23rSq { color: var(--theme-primary); background-color: #e0e9ff; } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-left__3DJzF .mission-countdown__modal-body-left-scroll__77arJ .mission-countdown__modal-body-left-inner__3TYVk .mission-countdown__menu-item__1PQ9m { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-left__3DJzF .mission-countdown__modal-body-left-scroll__77arJ .mission-countdown__modal-body-left-inner__3TYVk .mission-countdown__menu-item__1PQ9m:hover { background-color: #edeff5; } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-left__3DJzF .mission-countdown__modal-body-left-scroll__77arJ .mission-countdown__modal-body-left-inner__3TYVk .mission-countdown__menu-item__1PQ9m .mission-countdown__menu-item-img__2uF3Y { flex-shrink: 0; width: 20px; margin-right: 8px; } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-left__3DJzF .mission-countdown__modal-body-left-scroll__77arJ .mission-countdown__modal-body-left-inner__3TYVk .mission-countdown__menu-item__1PQ9m .mission-countdown__menu-item-label__1hj8S { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-main__1pKji { padding: calc(12px) 0; } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-main__1pKji .mission-countdown__modal-body-main-scroll__smlB3 { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-main__1pKji .mission-countdown__modal-body-main-scroll__smlB3 .mission-countdown__modal-body-main-inner__uHTFf { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-main__1pKji .mission-countdown__modal-body-main-scroll__smlB3 .mission-countdown__modal-body-main-inner__uHTFf .mission-countdown__selector-btn-add__cA98x, .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-main__1pKji .mission-countdown__modal-body-main-scroll__smlB3 .mission-countdown__modal-body-main-inner__uHTFf .mission-countdown__selector-btn-item__1PG8V { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-main__1pKji .mission-countdown__modal-body-main-scroll__smlB3 .mission-countdown__modal-body-main-inner__uHTFf .mission-countdown__selector-btn-add__cA98x:hover, .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-main__1pKji .mission-countdown__modal-body-main-scroll__smlB3 .mission-countdown__modal-body-main-inner__uHTFf .mission-countdown__selector-btn-item__1PG8V:hover { background-color: #e0e9ff; } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-main__1pKji .mission-countdown__modal-body-main-scroll__smlB3 .mission-countdown__modal-body-main-inner__uHTFf .mission-countdown__selector-btn-add__cA98x:active, .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-main__1pKji .mission-countdown__modal-body-main-scroll__smlB3 .mission-countdown__modal-body-main-inner__uHTFf .mission-countdown__selector-btn-item__1PG8V:active { background-color: #ccdaff; } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-main__1pKji .mission-countdown__modal-body-main-scroll__smlB3 .mission-countdown__modal-body-main-inner__uHTFf .mission-countdown__selector-btn-add__cA98x:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-main__1pKji .mission-countdown__modal-body-main-scroll__smlB3 .mission-countdown__modal-body-main-inner__uHTFf .mission-countdown__selector-btn-add__cA98x:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-main__1pKji .mission-countdown__modal-body-main-scroll__smlB3 .mission-countdown__modal-body-main-inner__uHTFf .mission-countdown__selector-btn-add__cA98x .mission-countdown__add-img__3yJ-9 { font-size: 28px; height: auto; margin-bottom: 8px; } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-main__1pKji .mission-countdown__modal-body-main-scroll__smlB3 .mission-countdown__modal-body-main-inner__uHTFf .mission-countdown__selector-btn-add__cA98x .mission-countdown__add-label__1bg5J { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-main__1pKji .mission-countdown__modal-body-main-scroll__smlB3 .mission-countdown__modal-body-main-inner__uHTFf .mission-countdown__selector-btn-item__1PG8V { justify-content: space-between; } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-main__1pKji .mission-countdown__modal-body-main-scroll__smlB3 .mission-countdown__modal-body-main-inner__uHTFf .mission-countdown__selector-btn-item__1PG8V .mission-countdown__item-img__2Nqrr { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-main__1pKji .mission-countdown__modal-body-main-scroll__smlB3 .mission-countdown__modal-body-main-inner__uHTFf .mission-countdown__selector-btn-item__1PG8V .mission-countdown__item-img__2Nqrr img { width: auto; height: 105px; } .mission-countdown__modal-body__jwTXQ .mission-countdown__modal-body-main__1pKji .mission-countdown__modal-body-main-scroll__smlB3 .mission-countdown__modal-body-main-inner__uHTFf .mission-countdown__selector-btn-item__1PG8V .mission-countdown__item-label__1uV2P { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .mission-countdown__modal-footer__31IhU { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .mission-countdown__selector-btn-add__cA98x, .mission-countdown__selector-btn-item__1PG8V { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .mission-countdown__selector-btn-add__cA98x { background-color: var(--selector-sprite-bg_primary); } .mission-countdown__selector-btn-add__cA98x:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .mission-countdown__selector-btn-add__cA98x:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .mission-countdown__selector-btn-add__cA98x .mission-countdown__add-img__3yJ-9 { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .mission-countdown__selector-btn-add__cA98x .mission-countdown__add-label__1bg5J { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .mission-countdown__selector-btn-item__1PG8V { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .mission-countdown__selector-btn-item__1PG8V .mission-countdown__item-img__2Nqrr { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .mission-countdown__selector-btn-item__1PG8V .mission-countdown__item-img__2Nqrr img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .mission-countdown__selector-btn-item__1PG8V .mission-countdown__item-label__1uV2P { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .mission-countdown__selector-btn-item__1PG8V:hover { background-color: var(--selector-sprite-bg_primary); } .mission-countdown__selector-btn-item__1PG8V:hover .mission-countdown__item-img__2Nqrr { border-color: var(--selector-sprite-bg_primary); } .mission-countdown__selector-btn-item_selected__3izx1 { background-color: var(--selector-sprite-bg_primary); } .mission-countdown__selector-btn-item_selected__3izx1 .mission-countdown__item-img__2Nqrr { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .mission-countdown__menu-bar-btn__2Wp8B { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .mission-countdown__menu-bar-btn_green__2RBQj, .mission-countdown__menu-bar-btn_create__2PGX5 { background-color: #3cdc8f; } .mission-countdown__menu-bar-btn_green__2RBQj:hover, .mission-countdown__menu-bar-btn_create__2PGX5:hover { background-color: #00d374; } .mission-countdown__menu-bar-btn_green__2RBQj:active, .mission-countdown__menu-bar-btn_create__2PGX5:active { background-color: #00d374; } .mission-countdown__menu-bar-btn_save__2GpO9, .mission-countdown__menu-bar-btn_reset__1KV-E { background-color: #6ac8ff; } .mission-countdown__menu-bar-btn_save__2GpO9:hover, .mission-countdown__menu-bar-btn_reset__1KV-E:hover { background-color: #57bcfe; } .mission-countdown__menu-bar-btn_save__2GpO9:active, .mission-countdown__menu-bar-btn_reset__1KV-E:active { background-color: #4fb0fc; } .mission-countdown__menu-bar-btn_submit__vY-Jg, .mission-countdown__menu-bar-btn_open__3vL4V { background-color: #ff9e23; } .mission-countdown__menu-bar-btn_submit__vY-Jg:hover, .mission-countdown__menu-bar-btn_open__3vL4V:hover { background-color: #f47b04; } .mission-countdown__menu-bar-btn_submit__vY-Jg:active, .mission-countdown__menu-bar-btn_open__3vL4V:active { background-color: #fe8f22; } .mission-countdown__menu-bar-btn_link__36Ka1 { background-color: #e8efff; color: var(--theme-primary); } .mission-countdown__menu-bar-btn_link__36Ka1:hover { background-color: #b6c7ff; } .mission-countdown__menu-bar-btn_link__36Ka1:active { background-color: #cfdcff; } .mission-countdown__menu-bar-btn_disabled__3CbsJ { color: #565266; background-color: #e6e9ed; } .mission-countdown__menu-bar-btn_disabled__3CbsJ:hover { cursor: not-allowed; } .mission-countdown__menu-bar-btn_help__Hl0p9 { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .mission-countdown__menu-bar-btn_help__Hl0p9:hover { background-color: #8398ff; } .mission-countdown__menu-bar-btn_help__Hl0p9:active { background-color: #8ca3ff; } .mission-countdown__menu-bar-separator__195Dk { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ @font-face { font-family: YBCGrowthFont; src: url("static/font/YBC-Growth Font V3.1.woff"); } .mission-countdown__mission-countdown__18e6J .mission-countdown__mission-countdown-content__3pvcd { width: 148px; height: 24px; display: flex; flex-direction: row; align-items: center; justify-content: space-between; padding: 0 6px; border-radius: 52px; background: #586ef5; } .mission-countdown__mission-countdown__18e6J .mission-countdown__mission-countdown-content__3pvcd .mission-countdown__title__vr4zn { display: flex; flex-direction: row; align-items: center; font-weight: 400; font-size: 14px; line-height: 14px; letter-spacing: 0px; color: #ffffff; } .mission-countdown__mission-countdown__18e6J .mission-countdown__mission-countdown-content__3pvcd .mission-countdown__title__vr4zn .mission-countdown__icon__3btYB { font-size: 15px; margin-right: 4px; } .mission-countdown__mission-countdown__18e6J .mission-countdown__mission-countdown-content__3pvcd .mission-countdown__time__3TolK { font-weight: 600; font-size: 16px; line-height: 16px; color: #ff9e23; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .connection-status__flex-center__xIa3v { display: flex; align-items: center; justify-content: center; } .connection-status__full-filled__218M9 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .connection-status__modal-mask___wTLz { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .connection-status__modal-mask___wTLz .connection-status__modal-wrap__PpoGr { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .connection-status__modal-mask___wTLz .connection-status__modal-wrap__PpoGr .connection-status__modal-header-wrap__3CBbQ { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .connection-status__modal-mask___wTLz .connection-status__modal-wrap__PpoGr .connection-status__modal-header-wrap__3CBbQ .connection-status__modal-header-bg__39nTw { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .connection-status__modal-mask___wTLz .connection-status__modal-wrap__PpoGr .connection-status__modal-header-wrap__3CBbQ .connection-status__modal-header-label__1r0q4 { flex-shrink: 0; font-size: 16px; font-weight: bold; } .connection-status__modal-mask___wTLz .connection-status__modal-wrap__PpoGr .connection-status__modal-header-wrap__3CBbQ .connection-status__modal-header-close__1usXj { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .connection-status__modal-mask___wTLz .connection-status__modal-wrap__PpoGr .connection-status__modal-header-wrap__3CBbQ .connection-status__modal-header-close__1usXj:hover { color: #98a2b4; } .connection-status__modal-mask___wTLz .connection-status__modal-wrap__PpoGr .connection-status__modal-body-wrap__1JiX1 { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .connection-status__modal-mask___wTLz .connection-status__modal-wrap__PpoGr .connection-status__modal-footer-wrap__3OKlE { flex-shrink: 0; display: flex; } .connection-status__modal-header__17Gef { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .connection-status__modal-header__17Gef .connection-status__modal-header-upload__2s7TC { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .connection-status__modal-header__17Gef .connection-status__modal-header-upload__2s7TC:hover { background-color: #e0e9ff; } .connection-status__modal-header__17Gef .connection-status__modal-header-upload__2s7TC:active { background-color: #ccdaff; } .connection-status__modal-header__17Gef .connection-status__modal-header-upload__2s7TC .connection-status__upload-img__3pbnj { font-size: 16px; margin-right: calc(2px); } .connection-status__modal-header__17Gef .connection-status__modal-header-upload__2s7TC .connection-status__upload-label__3naDL { font-size: 14px; } .connection-status__modal-header__17Gef .connection-status__modal-header-upload__2s7TC .connection-status__upload-input__NoHC_ { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .connection-status__modal-header__17Gef .connection-status__modal-header-search__3dhEc { position: relative; } .connection-status__modal-header__17Gef .connection-status__modal-header-search__3dhEc .connection-status__search-input__3u65O { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .connection-status__modal-header__17Gef .connection-status__modal-header-search__3dhEc .connection-status__search-input__3u65O::-webkit-input-placeholder { color: #98a2b4; } .connection-status__modal-header__17Gef .connection-status__modal-header-search__3dhEc .connection-status__search-input__3u65O::-moz-placeholder { color: #98a2b4; } .connection-status__modal-header__17Gef .connection-status__modal-header-search__3dhEc .connection-status__search-input__3u65O:-ms-input-placeholder { color: #98a2b4; } .connection-status__modal-header__17Gef .connection-status__modal-header-search__3dhEc .connection-status__search-input__3u65O:hover { border-color: #d1d7e1; } .connection-status__modal-header__17Gef .connection-status__modal-header-search__3dhEc .connection-status__search-input__3u65O:active { border-color: #d1d7e1; } .connection-status__modal-header__17Gef .connection-status__modal-header-search__3dhEc .connection-status__search-img__1hSsA { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .connection-status__modal-body__bowyO { flex-grow: 1; display: flex; } .connection-status__modal-body__bowyO .connection-status__modal-body-left__GN3GR, .connection-status__modal-body__bowyO .connection-status__modal-body-main__26nZk { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .connection-status__modal-body__bowyO .connection-status__modal-body-left__GN3GR { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .connection-status__modal-body__bowyO .connection-status__modal-body-left__GN3GR .connection-status__modal-body-left-scroll__mhQCA { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .connection-status__modal-body__bowyO .connection-status__modal-body-left__GN3GR .connection-status__modal-body-left-scroll__mhQCA .connection-status__modal-body-left-inner__1-kk7 { width: 121px; padding: calc(12px); color: #5e6b81; } .connection-status__modal-body__bowyO .connection-status__modal-body-left__GN3GR .connection-status__modal-body-left-scroll__mhQCA .connection-status__modal-body-left-inner__1-kk7 .connection-status__menu-item-current__TasG5 { color: var(--theme-primary); background-color: #e0e9ff; } .connection-status__modal-body__bowyO .connection-status__modal-body-left__GN3GR .connection-status__modal-body-left-scroll__mhQCA .connection-status__modal-body-left-inner__1-kk7 .connection-status__menu-item__1eV9A { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .connection-status__modal-body__bowyO .connection-status__modal-body-left__GN3GR .connection-status__modal-body-left-scroll__mhQCA .connection-status__modal-body-left-inner__1-kk7 .connection-status__menu-item__1eV9A:hover { background-color: #edeff5; } .connection-status__modal-body__bowyO .connection-status__modal-body-left__GN3GR .connection-status__modal-body-left-scroll__mhQCA .connection-status__modal-body-left-inner__1-kk7 .connection-status__menu-item__1eV9A .connection-status__menu-item-img__1km7q { flex-shrink: 0; width: 20px; margin-right: 8px; } .connection-status__modal-body__bowyO .connection-status__modal-body-left__GN3GR .connection-status__modal-body-left-scroll__mhQCA .connection-status__modal-body-left-inner__1-kk7 .connection-status__menu-item__1eV9A .connection-status__menu-item-label__hpLr1 { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .connection-status__modal-body__bowyO .connection-status__modal-body-main__26nZk { padding: calc(12px) 0; } .connection-status__modal-body__bowyO .connection-status__modal-body-main__26nZk .connection-status__modal-body-main-scroll__1jWpJ { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .connection-status__modal-body__bowyO .connection-status__modal-body-main__26nZk .connection-status__modal-body-main-scroll__1jWpJ .connection-status__modal-body-main-inner__LZlGY { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .connection-status__modal-body__bowyO .connection-status__modal-body-main__26nZk .connection-status__modal-body-main-scroll__1jWpJ .connection-status__modal-body-main-inner__LZlGY .connection-status__selector-btn-add__3bdI_, .connection-status__modal-body__bowyO .connection-status__modal-body-main__26nZk .connection-status__modal-body-main-scroll__1jWpJ .connection-status__modal-body-main-inner__LZlGY .connection-status__selector-btn-item__3LSjA { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .connection-status__modal-body__bowyO .connection-status__modal-body-main__26nZk .connection-status__modal-body-main-scroll__1jWpJ .connection-status__modal-body-main-inner__LZlGY .connection-status__selector-btn-add__3bdI_:hover, .connection-status__modal-body__bowyO .connection-status__modal-body-main__26nZk .connection-status__modal-body-main-scroll__1jWpJ .connection-status__modal-body-main-inner__LZlGY .connection-status__selector-btn-item__3LSjA:hover { background-color: #e0e9ff; } .connection-status__modal-body__bowyO .connection-status__modal-body-main__26nZk .connection-status__modal-body-main-scroll__1jWpJ .connection-status__modal-body-main-inner__LZlGY .connection-status__selector-btn-add__3bdI_:active, .connection-status__modal-body__bowyO .connection-status__modal-body-main__26nZk .connection-status__modal-body-main-scroll__1jWpJ .connection-status__modal-body-main-inner__LZlGY .connection-status__selector-btn-item__3LSjA:active { background-color: #ccdaff; } .connection-status__modal-body__bowyO .connection-status__modal-body-main__26nZk .connection-status__modal-body-main-scroll__1jWpJ .connection-status__modal-body-main-inner__LZlGY .connection-status__selector-btn-add__3bdI_:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .connection-status__modal-body__bowyO .connection-status__modal-body-main__26nZk .connection-status__modal-body-main-scroll__1jWpJ .connection-status__modal-body-main-inner__LZlGY .connection-status__selector-btn-add__3bdI_:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .connection-status__modal-body__bowyO .connection-status__modal-body-main__26nZk .connection-status__modal-body-main-scroll__1jWpJ .connection-status__modal-body-main-inner__LZlGY .connection-status__selector-btn-add__3bdI_ .connection-status__add-img__a0fdT { font-size: 28px; height: auto; margin-bottom: 8px; } .connection-status__modal-body__bowyO .connection-status__modal-body-main__26nZk .connection-status__modal-body-main-scroll__1jWpJ .connection-status__modal-body-main-inner__LZlGY .connection-status__selector-btn-add__3bdI_ .connection-status__add-label__2Qorw { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .connection-status__modal-body__bowyO .connection-status__modal-body-main__26nZk .connection-status__modal-body-main-scroll__1jWpJ .connection-status__modal-body-main-inner__LZlGY .connection-status__selector-btn-item__3LSjA { justify-content: space-between; } .connection-status__modal-body__bowyO .connection-status__modal-body-main__26nZk .connection-status__modal-body-main-scroll__1jWpJ .connection-status__modal-body-main-inner__LZlGY .connection-status__selector-btn-item__3LSjA .connection-status__item-img__2l17Q { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .connection-status__modal-body__bowyO .connection-status__modal-body-main__26nZk .connection-status__modal-body-main-scroll__1jWpJ .connection-status__modal-body-main-inner__LZlGY .connection-status__selector-btn-item__3LSjA .connection-status__item-img__2l17Q img { width: auto; height: 105px; } .connection-status__modal-body__bowyO .connection-status__modal-body-main__26nZk .connection-status__modal-body-main-scroll__1jWpJ .connection-status__modal-body-main-inner__LZlGY .connection-status__selector-btn-item__3LSjA .connection-status__item-label__ty5h2 { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .connection-status__modal-footer__zVSEs { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .connection-status__selector-btn-add__3bdI_, .connection-status__selector-btn-item__3LSjA { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .connection-status__selector-btn-add__3bdI_ { background-color: var(--selector-sprite-bg_primary); } .connection-status__selector-btn-add__3bdI_:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .connection-status__selector-btn-add__3bdI_:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .connection-status__selector-btn-add__3bdI_ .connection-status__add-img__a0fdT { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .connection-status__selector-btn-add__3bdI_ .connection-status__add-label__2Qorw { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .connection-status__selector-btn-item__3LSjA { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .connection-status__selector-btn-item__3LSjA .connection-status__item-img__2l17Q { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .connection-status__selector-btn-item__3LSjA .connection-status__item-img__2l17Q img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .connection-status__selector-btn-item__3LSjA .connection-status__item-label__ty5h2 { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .connection-status__selector-btn-item__3LSjA:hover { background-color: var(--selector-sprite-bg_primary); } .connection-status__selector-btn-item__3LSjA:hover .connection-status__item-img__2l17Q { border-color: var(--selector-sprite-bg_primary); } .connection-status__selector-btn-item_selected__3vJM3 { background-color: var(--selector-sprite-bg_primary); } .connection-status__selector-btn-item_selected__3vJM3 .connection-status__item-img__2l17Q { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .connection-status__menu-bar-btn__3P5Uv { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .connection-status__menu-bar-btn_green__1REob, .connection-status__menu-bar-btn_create__1huXq { background-color: #3cdc8f; } .connection-status__menu-bar-btn_green__1REob:hover, .connection-status__menu-bar-btn_create__1huXq:hover { background-color: #00d374; } .connection-status__menu-bar-btn_green__1REob:active, .connection-status__menu-bar-btn_create__1huXq:active { background-color: #00d374; } .connection-status__menu-bar-btn_save__3gIyM, .connection-status__menu-bar-btn_reset__2ikgU { background-color: #6ac8ff; } .connection-status__menu-bar-btn_save__3gIyM:hover, .connection-status__menu-bar-btn_reset__2ikgU:hover { background-color: #57bcfe; } .connection-status__menu-bar-btn_save__3gIyM:active, .connection-status__menu-bar-btn_reset__2ikgU:active { background-color: #4fb0fc; } .connection-status__menu-bar-btn_submit__2YELW, .connection-status__menu-bar-btn_open__2n07x { background-color: #ff9e23; } .connection-status__menu-bar-btn_submit__2YELW:hover, .connection-status__menu-bar-btn_open__2n07x:hover { background-color: #f47b04; } .connection-status__menu-bar-btn_submit__2YELW:active, .connection-status__menu-bar-btn_open__2n07x:active { background-color: #fe8f22; } .connection-status__menu-bar-btn_link__2UBZD { background-color: #e8efff; color: var(--theme-primary); } .connection-status__menu-bar-btn_link__2UBZD:hover { background-color: #b6c7ff; } .connection-status__menu-bar-btn_link__2UBZD:active { background-color: #cfdcff; } .connection-status__menu-bar-btn_disabled__2AzOJ { color: #565266; background-color: #e6e9ed; } .connection-status__menu-bar-btn_disabled__2AzOJ:hover { cursor: not-allowed; } .connection-status__menu-bar-btn_help__3tXKo { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .connection-status__menu-bar-btn_help__3tXKo:hover { background-color: #8398ff; } .connection-status__menu-bar-btn_help__3tXKo:active { background-color: #8ca3ff; } .connection-status__menu-bar-separator__En24t { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .connection-status__connection-status__11ZmB { display: flex; align-items: center; border-radius: 36px; font-size: 14px; height: 24px; margin-right: 12px; background-color: #ffffff; color: var(--theme-primary); } .connection-status__connection-status__11ZmB.connection-status__connection-status_un-connected__V-np3 .connection-status__connection-status-btn__34O3R { color: #b5bccb; } .connection-status__connection-status__11ZmB.connection-status__connection-status_connected__2sHCW .connection-status__connection-status-btn__34O3R { color: #3cdc8f; } .connection-status__connection-status__11ZmB.connection-status__connection-status_un-updated__3sjjW .connection-status__connection-status-btn__34O3R { color: #fab600; } .connection-status__connection-status__11ZmB .connection-status__connection-link-btn__1KLim { display: flex; align-items: center; justify-content: center; height: 24px; padding: 0px 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .connection-status__connection-status__11ZmB .connection-status__connection-link-btn__1KLim:hover { background-color: rgba(106, 127, 255, 0.1); } .connection-status__connection-status__11ZmB .connection-status__connection-status-btn__34O3R { display: flex; align-items: center; justify-content: center; height: 24px; padding: 0px 8px; } .connection-status__connection-status__11ZmB .connection-status__connection-status-btn__34O3R .connection-status__btn-icon__mwu8g { margin-right: 5px; } .connection-status__connection-status__11ZmB .connection-status__connection-status-btn__34O3R .connection-status__btn-label__LMgAF { line-height: 24px; } .connection-status__connection-status__11ZmB .connection-status__wifi-open-popover__XlB05 { display: flex; background: #6771a9; border-radius: 36px; margin-left: 8px; padding: 3px; height: 20px; align-items: center; margin-right: 3px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .connection-status__connection-status__11ZmB .connection-status__wifi-open-popover__XlB05 span { color: #ffffff; font-size: 14px; margin: 0 4px; } .connection-status__connection-status__11ZmB .connection-status__wifi-open-popover__XlB05 .connection-status__wifi-open-popover-icon__2SamE { width: 14px; height: 14px; overflow: hidden; display: flex; justify-content: center; align-items: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .connection-status__connection-status__11ZmB .connection-status__connection-link-btn__1KLim { line-height: 24px; } .connection-status__connection-status__11ZmB .connection-status__connection-link-btn__1KLim:active { background-color: rgba(106, 127, 255, 0.15); } .connection-status__connection-status__11ZmB .connection-status__connection-delimiter__3Z5gd { width: 1px; height: 14px; background-color: #e8efff; } .connection-status__connection-status-popover__3Yn47 .ant-popover-content .ant-popover-inner { padding: 0; background-color: #ffffff; box-shadow: 0px 16px 12px rgba(218, 218, 218, 0.21); border-radius: 36px; } .connection-status__connection-status-popover__3Yn47 .ant-popover-content .ant-popover-inner .ant-popover-inner-content { padding: inherit; min-width: 194px; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ { width: 254px; padding: 12px; background-color: #ffffff; box-shadow: 0px 16px 12px rgba(218, 218, 218, 0.21); border-radius: 8px; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ.connection-status__popover-content_un-connected__2IQ7Q .connection-status__popover-content-indicator__3FpPW.connection-status__popover-content-indicator_link__3_6cB .connection-status__indicator-block__2pZL7, .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ.connection-status__popover-content_un-connected__2IQ7Q .connection-status__popover-content-indicator__3FpPW.connection-status__popover-content-indicator_device__1-cuD .connection-status__indicator-block__2pZL7, .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ.connection-status__popover-content_un-connected__2IQ7Q .connection-status__popover-content-indicator__3FpPW.connection-status__popover-content-indicator_arduino__q5aw9 .connection-status__indicator-block__2pZL7 { background-color: #d1d7e1; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ.connection-status__popover-content_un-connected__2IQ7Q .connection-status__popover-content-indicator__3FpPW.connection-status__popover-content-indicator_link__3_6cB .connection-status__indicator-btn__ZxUIw, .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ.connection-status__popover-content_un-connected__2IQ7Q .connection-status__popover-content-indicator__3FpPW.connection-status__popover-content-indicator_device__1-cuD .connection-status__indicator-btn__ZxUIw, .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ.connection-status__popover-content_un-connected__2IQ7Q .connection-status__popover-content-indicator__3FpPW.connection-status__popover-content-indicator_arduino__q5aw9 .connection-status__indicator-btn__ZxUIw { color: #828da3; background-color: #edeff5; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ.connection-status__popover-content_connected__3S-Ot .connection-status__popover-content-indicator__3FpPW.connection-status__popover-content-indicator_link__3_6cB .connection-status__indicator-block__2pZL7, .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ.connection-status__popover-content_connected__3S-Ot .connection-status__popover-content-indicator__3FpPW.connection-status__popover-content-indicator_device__1-cuD .connection-status__indicator-block__2pZL7, .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ.connection-status__popover-content_connected__3S-Ot .connection-status__popover-content-indicator__3FpPW.connection-status__popover-content-indicator_arduino__q5aw9 .connection-status__indicator-block__2pZL7 { background-color: #3cd953; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ.connection-status__popover-content_connected__3S-Ot .connection-status__popover-content-indicator__3FpPW.connection-status__popover-content-indicator_link__3_6cB .connection-status__indicator-btn__ZxUIw, .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ.connection-status__popover-content_connected__3S-Ot .connection-status__popover-content-indicator__3FpPW.connection-status__popover-content-indicator_device__1-cuD .connection-status__indicator-btn__ZxUIw, .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ.connection-status__popover-content_connected__3S-Ot .connection-status__popover-content-indicator__3FpPW.connection-status__popover-content-indicator_arduino__q5aw9 .connection-status__indicator-btn__ZxUIw { color: #3cd953; background-color: rgba(60, 217, 83, 0.1); } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ.connection-status__popover-content_un-updated__3Spz9 .connection-status__popover-content-indicator__3FpPW.connection-status__popover-content-indicator_link__3_6cB .connection-status__indicator-block__2pZL7, .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ.connection-status__popover-content_un-updated__3Spz9 .connection-status__popover-content-indicator__3FpPW.connection-status__popover-content-indicator_device__1-cuD .connection-status__indicator-block__2pZL7 { background-color: #3cd953; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ.connection-status__popover-content_un-updated__3Spz9 .connection-status__popover-content-indicator__3FpPW.connection-status__popover-content-indicator_link__3_6cB .connection-status__indicator-btn__ZxUIw, .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ.connection-status__popover-content_un-updated__3Spz9 .connection-status__popover-content-indicator__3FpPW.connection-status__popover-content-indicator_device__1-cuD .connection-status__indicator-btn__ZxUIw { color: #3cd953; background-color: rgba(60, 217, 83, 0.1); } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ.connection-status__popover-content_un-updated__3Spz9 .connection-status__popover-content-indicator__3FpPW.connection-status__popover-content-indicator_arduino__q5aw9 .connection-status__indicator-block__2pZL7 { background-color: #d1d7e1; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ.connection-status__popover-content_un-updated__3Spz9 .connection-status__popover-content-indicator__3FpPW.connection-status__popover-content-indicator_arduino__q5aw9 .connection-status__indicator-btn__ZxUIw { color: #828da3; background-color: #edeff5; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ .connection-status__popover-content-indicator__3FpPW { width: 100%; display: flex; align-items: center; margin-top: 20px; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ .connection-status__popover-content-indicator__3FpPW .connection-status__indicator-block__2pZL7 { width: 6px; height: 20px; border-radius: 3px; margin-right: calc(16px); flex-grow: 0; flex-shrink: 0; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ .connection-status__popover-content-indicator__3FpPW .connection-status__indicator-label__1gKcK { max-width: 88px; font-weight: 600; font-size: 16px; color: #565266; white-space: nowrap; flex-grow: 1; flex-shrink: 0; overflow: hidden; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ .connection-status__popover-content-indicator__3FpPW .connection-status__indicator-btn__ZxUIw { width: 74px; height: 30px; border-radius: 15px; flex-grow: 0; flex-shrink: 0; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ .connection-status__popover-content-control__2ioNH { width: 100%; height: 32px; line-height: 32px; background-color: rgba(106, 127, 255, 0.1); border-radius: 8px; margin-top: 24px; font-weight: 600; font-size: 13px; color: var(--theme-primary); } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ .connection-status__popover-content-loading__3BouP { background: #f5f9ff; border-radius: 8px; display: flex; align-items: center; justify-content: center; padding: 8px 0; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ .connection-status__popover-content-loading__3BouP .connection-status__popover-content-img__3FVQp { width: 16px; height: 16px; margin-right: 4px; position: relative; line-height: 16px; font-size: 16px; display: flex; align-items: center; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ .connection-status__popover-content-loading__3BouP .connection-status__popover-content-img__3FVQp .connection-status__icon__359XU { color: #ff7070; display: flex; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ .connection-status__popover-content-loading__3BouP .connection-status__popover-content-img__3FVQp img { width: 16px; height: 16px; display: block; position: absolute; left: 0; top: 0; animation: connection-status__spin__zZ5y8 1s linear infinite; } @keyframes connection-status__spin__zZ5y8 { from { transform: rotate(0deg); /* 起始角度 */ } to { transform: rotate(360deg); /* 结束角度 */ } } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ .connection-status__popover-content-loading__3BouP span { color: #5e6b81; font-size: 14px; line-height: 22px; /* 1.571 */ } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ .connection-status__popover-wifi-list__Lgi-h { max-height: 252px; overflow-y: auto; overflow-x: hidden; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ .connection-status__popover-wifi-list__Lgi-h .connection-status__popover-wifi-item__1Ycjt { line-height: 38px; display: flex; padding: 0 12px; margin-top: 4px; border-radius: 8px; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ .connection-status__popover-wifi-list__Lgi-h .connection-status__popover-wifi-item__1Ycjt:hover { background: #f5f9ff; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ .connection-status__popover-wifi-list__Lgi-h .connection-status__popover-wifi-item__1Ycjt .connection-status__popover-wifi-item-name__3hRGz { color: #5e6b81; font-family: 'PingFang SC'; font-size: 14px; width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex-shrink: 0; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ .connection-status__popover-wifi-list__Lgi-h .connection-status__popover-wifi-item__1Ycjt .connection-status__popover-wifi-item-icon__1rLAx { font-size: 14px; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ .connection-status__popover-wifi-list__Lgi-h .connection-status__popover-wifi-item__1Ycjt .connection-status__connection-delimiter__3Z5gd { width: 1px; height: 12px; background-color: #e8efff; margin: 13px 12px; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ .connection-status__popover-wifi-list__Lgi-h .connection-status__popover-wifi-item__1Ycjt .connection-status__popover-wifi-item-btn__3IQcS { cursor: url(static/cursor/cursor-pointer.cur), pointer; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ .connection-status__popover-wifi-list__Lgi-h .connection-status__popover-wifi-item__1Ycjt .connection-status__popover-wifi-item-link__ZrVPe { color: #6a7fff; font-size: 14px; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ .connection-status__popover-wifi-list__Lgi-h .connection-status__popover-wifi-item__1Ycjt .connection-status__popover-wifi-item-disconnect__3HHYs { color: #ff7070; font-size: 14px; font-weight: 500; } .connection-status__connection-status-popover__3Yn47 .connection-status__popover-content__3V_RQ .connection-status__popover-content-reset__1cptN { margin-top: 12px; line-height: 36px; color: #6a7fff; font-size: 14px; text-align: center; background: rgba(106, 127, 255, 0.04); border: 1px solid rgba(106, 127, 255, 0.5); border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .link-wifi-modal__link-wifi-modal-mask__o01oM .link-wifi-modal__link-wifi-modal__1XuH1 { width: 432px; height: auto; font-family: 'PingFang SC'; } .link-wifi-modal__link-wifi-modal-mask__o01oM .link-wifi-modal__link-wifi-modal__1XuH1 .link-wifi-modal__link-wifi-modal-content__2wrW2 { width: 100%; } .link-wifi-modal__link-wifi-modal-mask__o01oM .link-wifi-modal__link-wifi-modal__1XuH1 .link-wifi-modal__link-wifi-modal-content__2wrW2 .link-wifi-modal__link-wifi-modal-header__3LnB1 { height: 74px; display: flex; justify-content: center; align-items: center; color: #3d4554; font-size: 18px; line-height: 26px; /* 1.444 */ font-style: normal; font-weight: 600; } .link-wifi-modal__link-wifi-modal-mask__o01oM .link-wifi-modal__link-wifi-modal__1XuH1 .link-wifi-modal__link-wifi-modal-body__3SaSJ { padding: 4px 24px 24px; } .link-wifi-modal__link-wifi-modal-mask__o01oM .link-wifi-modal__link-wifi-modal__1XuH1 .link-wifi-modal__link-wifi-modal-body__3SaSJ .link-wifi-modal__link-wifi-modal-input__GbNjb { padding: 12px 20px; color: rgba(94, 102, 129, 0.5); border: 1px solid #edeff5; border-radius: 8px; } .link-wifi-modal__link-wifi-modal-mask__o01oM .link-wifi-modal__link-wifi-modal__1XuH1 .link-wifi-modal__link-wifi-modal-footer__1WhYM { flex: 1 0; padding: 0 24px 24px; display: flex; justify-content: space-between; } .link-wifi-modal__link-wifi-modal-mask__o01oM .link-wifi-modal__link-wifi-modal__1XuH1 .link-wifi-modal__link-wifi-modal-footer__1WhYM .link-wifi-modal__link-wifi-modal-cancel-btn__2eAE8, .link-wifi-modal__link-wifi-modal-mask__o01oM .link-wifi-modal__link-wifi-modal__1XuH1 .link-wifi-modal__link-wifi-modal-footer__1WhYM .link-wifi-modal__link-wifi-modal-confirm-btn__2syoK { width: 182px; height: 48px; border-radius: 8px; font-size: 16px; font-weight: 500; cursor: url(static/cursor/cursor-pointer.cur), pointer; border: none; } .link-wifi-modal__link-wifi-modal-mask__o01oM .link-wifi-modal__link-wifi-modal__1XuH1 .link-wifi-modal__link-wifi-modal-footer__1WhYM .link-wifi-modal__link-wifi-modal-cancel-btn__2eAE8 { background: #eff1f6; color: #4d586a; } .link-wifi-modal__link-wifi-modal-mask__o01oM .link-wifi-modal__link-wifi-modal__1XuH1 .link-wifi-modal__link-wifi-modal-footer__1WhYM .link-wifi-modal__link-wifi-modal-cancel-btn__2eAE8:disabled { background: #f5f5f5; color: #bfbfbf; cursor: not-allowed; } .link-wifi-modal__link-wifi-modal-mask__o01oM .link-wifi-modal__link-wifi-modal__1XuH1 .link-wifi-modal__link-wifi-modal-footer__1WhYM .link-wifi-modal__link-wifi-modal-confirm-btn__2syoK { background: #6a7fff; color: #ffffff; } .link-wifi-modal__link-wifi-modal-mask__o01oM .link-wifi-modal__link-wifi-modal__1XuH1 .link-wifi-modal__link-wifi-modal-footer__1WhYM .link-wifi-modal__link-wifi-modal-confirm-btn__2syoK:disabled { background: #6a7eff70; cursor: not-allowed; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .menu-bar__flex-center__2xwzG { display: flex; align-items: center; justify-content: center; } .menu-bar__full-filled__XfGTc { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .menu-bar__modal-mask__302_5 { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .menu-bar__modal-mask__302_5 .menu-bar__modal-wrap__b0Sd1 { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .menu-bar__modal-mask__302_5 .menu-bar__modal-wrap__b0Sd1 .menu-bar__modal-header-wrap__tMS7A { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .menu-bar__modal-mask__302_5 .menu-bar__modal-wrap__b0Sd1 .menu-bar__modal-header-wrap__tMS7A .menu-bar__modal-header-bg__NcRev { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .menu-bar__modal-mask__302_5 .menu-bar__modal-wrap__b0Sd1 .menu-bar__modal-header-wrap__tMS7A .menu-bar__modal-header-label__3YyYi { flex-shrink: 0; font-size: 16px; font-weight: bold; } .menu-bar__modal-mask__302_5 .menu-bar__modal-wrap__b0Sd1 .menu-bar__modal-header-wrap__tMS7A .menu-bar__modal-header-close__1OFaF { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .menu-bar__modal-mask__302_5 .menu-bar__modal-wrap__b0Sd1 .menu-bar__modal-header-wrap__tMS7A .menu-bar__modal-header-close__1OFaF:hover { color: #98a2b4; } .menu-bar__modal-mask__302_5 .menu-bar__modal-wrap__b0Sd1 .menu-bar__modal-body-wrap__OH_M1 { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .menu-bar__modal-mask__302_5 .menu-bar__modal-wrap__b0Sd1 .menu-bar__modal-footer-wrap__71J1o { flex-shrink: 0; display: flex; } .menu-bar__modal-header__1pFQU { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .menu-bar__modal-header__1pFQU .menu-bar__modal-header-upload__EEh1B { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .menu-bar__modal-header__1pFQU .menu-bar__modal-header-upload__EEh1B:hover { background-color: #e0e9ff; } .menu-bar__modal-header__1pFQU .menu-bar__modal-header-upload__EEh1B:active { background-color: #ccdaff; } .menu-bar__modal-header__1pFQU .menu-bar__modal-header-upload__EEh1B .menu-bar__upload-img__1rBp8 { font-size: 16px; margin-right: calc(2px); } .menu-bar__modal-header__1pFQU .menu-bar__modal-header-upload__EEh1B .menu-bar__upload-label__3DTh2 { font-size: 14px; } .menu-bar__modal-header__1pFQU .menu-bar__modal-header-upload__EEh1B .menu-bar__upload-input__1TYVl { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .menu-bar__modal-header__1pFQU .menu-bar__modal-header-search__1GKpL { position: relative; } .menu-bar__modal-header__1pFQU .menu-bar__modal-header-search__1GKpL .menu-bar__search-input__19CiL { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .menu-bar__modal-header__1pFQU .menu-bar__modal-header-search__1GKpL .menu-bar__search-input__19CiL::-webkit-input-placeholder { color: #98a2b4; } .menu-bar__modal-header__1pFQU .menu-bar__modal-header-search__1GKpL .menu-bar__search-input__19CiL::-moz-placeholder { color: #98a2b4; } .menu-bar__modal-header__1pFQU .menu-bar__modal-header-search__1GKpL .menu-bar__search-input__19CiL:-ms-input-placeholder { color: #98a2b4; } .menu-bar__modal-header__1pFQU .menu-bar__modal-header-search__1GKpL .menu-bar__search-input__19CiL:hover { border-color: #d1d7e1; } .menu-bar__modal-header__1pFQU .menu-bar__modal-header-search__1GKpL .menu-bar__search-input__19CiL:active { border-color: #d1d7e1; } .menu-bar__modal-header__1pFQU .menu-bar__modal-header-search__1GKpL .menu-bar__search-img__3KZkP { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .menu-bar__modal-body__KkgfK { flex-grow: 1; display: flex; } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-left__nFS0P, .menu-bar__modal-body__KkgfK .menu-bar__modal-body-main__2kXdf { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-left__nFS0P { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-left__nFS0P .menu-bar__modal-body-left-scroll__2UxPB { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-left__nFS0P .menu-bar__modal-body-left-scroll__2UxPB .menu-bar__modal-body-left-inner__1Xlfd { width: 121px; padding: calc(12px); color: #5e6b81; } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-left__nFS0P .menu-bar__modal-body-left-scroll__2UxPB .menu-bar__modal-body-left-inner__1Xlfd .menu-bar__menu-item-current__33wwc { color: var(--theme-primary); background-color: #e0e9ff; } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-left__nFS0P .menu-bar__modal-body-left-scroll__2UxPB .menu-bar__modal-body-left-inner__1Xlfd .menu-bar__menu-item__1ro-l { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-left__nFS0P .menu-bar__modal-body-left-scroll__2UxPB .menu-bar__modal-body-left-inner__1Xlfd .menu-bar__menu-item__1ro-l:hover { background-color: #edeff5; } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-left__nFS0P .menu-bar__modal-body-left-scroll__2UxPB .menu-bar__modal-body-left-inner__1Xlfd .menu-bar__menu-item__1ro-l .menu-bar__menu-item-img__3IHJN { flex-shrink: 0; width: 20px; margin-right: 8px; } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-left__nFS0P .menu-bar__modal-body-left-scroll__2UxPB .menu-bar__modal-body-left-inner__1Xlfd .menu-bar__menu-item__1ro-l .menu-bar__menu-item-label__2GeYS { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-main__2kXdf { padding: calc(12px) 0; } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-main__2kXdf .menu-bar__modal-body-main-scroll__3TM6D { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-main__2kXdf .menu-bar__modal-body-main-scroll__3TM6D .menu-bar__modal-body-main-inner__2_Gpm { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-main__2kXdf .menu-bar__modal-body-main-scroll__3TM6D .menu-bar__modal-body-main-inner__2_Gpm .menu-bar__selector-btn-add__28Lvr, .menu-bar__modal-body__KkgfK .menu-bar__modal-body-main__2kXdf .menu-bar__modal-body-main-scroll__3TM6D .menu-bar__modal-body-main-inner__2_Gpm .menu-bar__selector-btn-item__vCVPL { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-main__2kXdf .menu-bar__modal-body-main-scroll__3TM6D .menu-bar__modal-body-main-inner__2_Gpm .menu-bar__selector-btn-add__28Lvr:hover, .menu-bar__modal-body__KkgfK .menu-bar__modal-body-main__2kXdf .menu-bar__modal-body-main-scroll__3TM6D .menu-bar__modal-body-main-inner__2_Gpm .menu-bar__selector-btn-item__vCVPL:hover { background-color: #e0e9ff; } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-main__2kXdf .menu-bar__modal-body-main-scroll__3TM6D .menu-bar__modal-body-main-inner__2_Gpm .menu-bar__selector-btn-add__28Lvr:active, .menu-bar__modal-body__KkgfK .menu-bar__modal-body-main__2kXdf .menu-bar__modal-body-main-scroll__3TM6D .menu-bar__modal-body-main-inner__2_Gpm .menu-bar__selector-btn-item__vCVPL:active { background-color: #ccdaff; } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-main__2kXdf .menu-bar__modal-body-main-scroll__3TM6D .menu-bar__modal-body-main-inner__2_Gpm .menu-bar__selector-btn-add__28Lvr:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-main__2kXdf .menu-bar__modal-body-main-scroll__3TM6D .menu-bar__modal-body-main-inner__2_Gpm .menu-bar__selector-btn-add__28Lvr:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-main__2kXdf .menu-bar__modal-body-main-scroll__3TM6D .menu-bar__modal-body-main-inner__2_Gpm .menu-bar__selector-btn-add__28Lvr .menu-bar__add-img__3tgMO { font-size: 28px; height: auto; margin-bottom: 8px; } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-main__2kXdf .menu-bar__modal-body-main-scroll__3TM6D .menu-bar__modal-body-main-inner__2_Gpm .menu-bar__selector-btn-add__28Lvr .menu-bar__add-label__1rNC7 { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-main__2kXdf .menu-bar__modal-body-main-scroll__3TM6D .menu-bar__modal-body-main-inner__2_Gpm .menu-bar__selector-btn-item__vCVPL { justify-content: space-between; } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-main__2kXdf .menu-bar__modal-body-main-scroll__3TM6D .menu-bar__modal-body-main-inner__2_Gpm .menu-bar__selector-btn-item__vCVPL .menu-bar__item-img__jx9ZV { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-main__2kXdf .menu-bar__modal-body-main-scroll__3TM6D .menu-bar__modal-body-main-inner__2_Gpm .menu-bar__selector-btn-item__vCVPL .menu-bar__item-img__jx9ZV img { width: auto; height: 105px; } .menu-bar__modal-body__KkgfK .menu-bar__modal-body-main__2kXdf .menu-bar__modal-body-main-scroll__3TM6D .menu-bar__modal-body-main-inner__2_Gpm .menu-bar__selector-btn-item__vCVPL .menu-bar__item-label__2Dion { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .menu-bar__modal-footer__3S8po { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .menu-bar__selector-btn-add__28Lvr, .menu-bar__selector-btn-item__vCVPL { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .menu-bar__selector-btn-add__28Lvr { background-color: var(--selector-sprite-bg_primary); } .menu-bar__selector-btn-add__28Lvr:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .menu-bar__selector-btn-add__28Lvr:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .menu-bar__selector-btn-add__28Lvr .menu-bar__add-img__3tgMO { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .menu-bar__selector-btn-add__28Lvr .menu-bar__add-label__1rNC7 { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .menu-bar__selector-btn-item__vCVPL { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .menu-bar__selector-btn-item__vCVPL .menu-bar__item-img__jx9ZV { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .menu-bar__selector-btn-item__vCVPL .menu-bar__item-img__jx9ZV img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .menu-bar__selector-btn-item__vCVPL .menu-bar__item-label__2Dion { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .menu-bar__selector-btn-item__vCVPL:hover { background-color: var(--selector-sprite-bg_primary); } .menu-bar__selector-btn-item__vCVPL:hover .menu-bar__item-img__jx9ZV { border-color: var(--selector-sprite-bg_primary); } .menu-bar__selector-btn-item_selected__2zZ_i { background-color: var(--selector-sprite-bg_primary); } .menu-bar__selector-btn-item_selected__2zZ_i .menu-bar__item-img__jx9ZV { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .menu-bar__menu-bar-btn__37h_6 { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .menu-bar__menu-bar-btn_green__1zj14, .menu-bar__menu-bar-btn_create__2hvij { background-color: #3cdc8f; } .menu-bar__menu-bar-btn_green__1zj14:hover, .menu-bar__menu-bar-btn_create__2hvij:hover { background-color: #00d374; } .menu-bar__menu-bar-btn_green__1zj14:active, .menu-bar__menu-bar-btn_create__2hvij:active { background-color: #00d374; } .menu-bar__menu-bar-btn_save__TMiC6, .menu-bar__menu-bar-btn_reset__1pbc7 { background-color: #6ac8ff; } .menu-bar__menu-bar-btn_save__TMiC6:hover, .menu-bar__menu-bar-btn_reset__1pbc7:hover { background-color: #57bcfe; } .menu-bar__menu-bar-btn_save__TMiC6:active, .menu-bar__menu-bar-btn_reset__1pbc7:active { background-color: #4fb0fc; } .menu-bar__menu-bar-btn_submit__25Cuy, .menu-bar__menu-bar-btn_open__1-rgq { background-color: #ff9e23; } .menu-bar__menu-bar-btn_submit__25Cuy:hover, .menu-bar__menu-bar-btn_open__1-rgq:hover { background-color: #f47b04; } .menu-bar__menu-bar-btn_submit__25Cuy:active, .menu-bar__menu-bar-btn_open__1-rgq:active { background-color: #fe8f22; } .menu-bar__menu-bar-btn_link__1bR4B { background-color: #e8efff; color: var(--theme-primary); } .menu-bar__menu-bar-btn_link__1bR4B:hover { background-color: #b6c7ff; } .menu-bar__menu-bar-btn_link__1bR4B:active { background-color: #cfdcff; } .menu-bar__menu-bar-btn_disabled__2Dvw9 { color: #565266; background-color: #e6e9ed; } .menu-bar__menu-bar-btn_disabled__2Dvw9:hover { cursor: not-allowed; } .menu-bar__menu-bar-btn_help__2mzPQ { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .menu-bar__menu-bar-btn_help__2mzPQ:hover { background-color: #8398ff; } .menu-bar__menu-bar-btn_help__2mzPQ:active { background-color: #8ca3ff; } .menu-bar__menu-bar-separator__1U119 { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .menu-bar__menu-bar__13aep { display: flex; justify-content: space-between; flex-wrap: nowrap; align-items: center; width: 100%; height: var(--menu-bar-height); flex-shrink: 0; position: relative; white-space: nowrap; background-size: auto 100%; background-repeat: no-repeat; font-size: 14px; background-color: var(--menu-bar-bg-color); color: #ffffff; } .menu-bar__menu-bar-btn-wrapper__ld4Aa { position: relative; display: flex; flex-direction: row; flex-shrink: 0; /* 新按钮样式设置 */ } .menu-bar__menu-bar-btn-wrapper__ld4Aa:hover .menu-bar__menu-bar-btn_save-popup__3yx07 { display: block; } .menu-bar__menu-bar-btn-wrapper__ld4Aa .menu-bar__menu-bar-btn__37h_6 .menu-bar__menu-bar-btn_save__TMiC6 { margin-right: 8px; } .menu-bar__menu-bar-btn-wrapper__ld4Aa .menu-bar__menu-bar-btn__37h_6 .menu-bar__menu-bar-btn_save_loading__ZZLmX { width: 14px; height: 14px; animation: menu-bar__loading__1aoaY 2s linear infinite; } @keyframes menu-bar__loading__1aoaY { 0% { transform: rotate(360deg); } 100% { transform: rotate(0deg); } } .menu-bar__menu-bar-btn-wrapper__ld4Aa .menu-bar__menu-bar-btn__37h_6 .menu-bar__menu-bar-btn_submit__25Cuy { margin-right: 8px; } .menu-bar__menu-bar-btn-wrapper__ld4Aa .menu-bar__menu-bar-btn__37h_6 .menu-bar__menu-bar-btn_link__1bR4B { margin-right: 12px; } .menu-bar__menu-bar-btn-wrapper__ld4Aa .menu-bar__menu-bar-btn__37h_6.menu-bar__menu-bar-btn_firmware__3wosl { background-color: #ff9e1d; margin-right: 14px; } .menu-bar__menu-bar-btn-wrapper__ld4Aa .menu-bar__menu-bar-btn__37h_6.menu-bar__disabled__294pL { color: #565266; background-color: #e6e9ed; cursor: not-allowed; } .menu-bar__menu-bar-btn-wrapper__ld4Aa .menu-bar__menu-bar-btn_save-popup__3yx07 { position: absolute; top: 30px; left: -40px; background: #ffffff; box-shadow: 0px 4px 16px rgba(176, 185, 222, 0.13); border-radius: 12px; padding: 12px; font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 14px; line-height: 14px; color: #6c7a92; display: none; z-index: 99; } .menu-bar__menu-bar-btn-wrapper__ld4Aa .menu-bar__menu-bar-btn_save-popup__3yx07.menu-bar__menu-bar-btn_save_loading-popup__2dBrr { left: 3px; } /* 菜单栏左侧 */ .menu-bar__main-menu-left__k7eY- { display: flex; justify-content: flex-start; align-items: center; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-mission-icon__GD8hb { display: flex; justify-content: space-between; align-items: center; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-mission-icon__GD8hb .menu-bar__icon-fillhome__1wusP { display: inline-block; margin: 0 15px; font-size: 24px; background-color: #6a7fff; color: #9cb0ff; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-mission-icon__GD8hb .menu-bar__icon-fillhome__1wusP:hover { color: #8398ff; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-mission-icon__GD8hb .menu-bar__line__3mi2u { width: 1px; height: 16px; border-right: 1px solid #889cff; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-title__1-4F3 { height: 26px; font-weight: 600; font-size: 14px; margin: 0 20px 0 8px; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-title__1-4F3.menu-bar__menu-title-open__2xELL { margin-right: 8px; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-bar-btn_submit_disabled__1zMQF { color: #ffffff; background-color: #e6e9ed; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-bar-btn_submit_disabled__1zMQF:hover { cursor: not-allowed; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-workcomment-icon__3C1iC { width: 24px; height: 24px; padding: 2px; border-radius: 6px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-workcomment-icon__3C1iC:hover { background-color: #7d8eff; } .menu-bar__main-menu-left__k7eY- .menu-bar__open-logo__3DcDJ { width: 38px; margin-right: 20px; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-bar-item__1JM5T { display: flex; align-items: center; justify-content: center; height: var(--menu-bar-height); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-bar-item__1JM5T:hover { background-color: #505ed9; } .menu-bar__main-menu-left__k7eY- .menu-bar__program-mode-switch__Njs80 { vertical-align: middle; } .menu-bar__main-menu-left__k7eY- .menu-bar__program-mode-switch__Njs80 .menu-bar__mode-switch-upload__33KGW { display: flex; justify-content: center; align-items: center; height: 100%; vertical-align: middle; padding-left: 2rem; } .menu-bar__main-menu-left__k7eY- .menu-bar__program-mode-switch__Njs80 .menu-bar__mode-switch-realtime__Og1iU { display: flex; justify-content: center; align-items: center; height: 100%; vertical-align: middle; padding-right: 2rem; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-mission-wrap__3ywft { display: flex; align-items: center; justify-content: center; margin-left: 12px; height: 24px; background-color: #586ef5; border-radius: 6px; padding: 0 6px; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-mission-wrap__3ywft .menu-bar__menu-mission-title__1rcWn { display: flex; align-items: center; font-weight: 600; font-size: 14px; color: #d6e2ff; max-width: 154px; text-overflow: ellipsis; overflow: hidden; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-mission-wrap__3ywft .menu-bar__menu-mission-title__1rcWn .menu-bar__menu-mission-title-icon__1Dgjq { margin-right: 5px; font-size: 16px; color: #889cff; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-mission-wrap__3ywft .menu-bar__menu-mission-item-wrap__29e9_ { display: flex; align-items: center; justify-content: center; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-mission-wrap__3ywft .menu-bar__menu-mission-item-wrap__29e9_ .menu-bar__menu-mission-item__qzhAl { display: flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: 2px; color: #ffffff; font-weight: 600; font-size: 13px; margin-left: 10px; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-mission-wrap__3ywft .menu-bar__menu-mission-item-wrap__29e9_ .menu-bar__menu-mission-item__qzhAl:hover { cursor: url(static/cursor/cursor-pointer.cur), pointer; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-mission-wrap__3ywft .menu-bar__menu-mission-item-wrap__29e9_ .menu-bar__menu-mission-item__qzhAl.menu-bar__menu-mission-item_locked__2rZWg { color: #dee2fd80; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-mission-wrap__3ywft .menu-bar__menu-mission-item-wrap__29e9_ .menu-bar__menu-mission-item__qzhAl.menu-bar__menu-mission-item_locked-icon__1D5OA { color: rgba(255, 255, 255, 0.8); font-size: 16px; pointer-events: none; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-mission-wrap__3ywft .menu-bar__menu-mission-item-wrap__29e9_ .menu-bar__menu-mission-item__qzhAl.menu-bar__menu-mission-item_selected__2vC9x { background-color: #6ac8ff; } .menu-bar__main-menu-left__k7eY- .menu-bar__menu-mission-wrap__3ywft .menu-bar__menu-mission-pager__3WDmT { color: #ffffff; } /* 菜单栏右侧 */ .menu-bar__main-menu-right__2WInV { position: relative; display: flex; justify-content: flex-start; align-items: center; height: 100%; /* 用户名 */ } .menu-bar__main-menu-right__2WInV .menu-bar__mission-info__3dfb9 { display: flex; align-items: center; margin-right: 12px; } .menu-bar__main-menu-right__2WInV .menu-bar__mission-info__3dfb9 .menu-bar__menu-bar-btn_help__2mzPQ { font-size: 24px; font-weight: bold; } .menu-bar__main-menu-right__2WInV .menu-bar__mission-info__3dfb9 .menu-bar__mission-info-line__1ExW6 { width: 1px; height: 16px; border-right: 1px solid #889cff; margin: 0 12px; } .menu-bar__main-menu-right__2WInV .ant-select { width: 92px; height: 24px; background-color: var(--theme-primary); border-color: #ffffff; color: #ffffff; border-radius: 12px; font-size: 14px; } .menu-bar__main-menu-right__2WInV .ant-select:hover { border-color: #aac4ff; } .menu-bar__main-menu-right__2WInV .ant-select:active { border-color: #ffffff; } .menu-bar__main-menu-right__2WInV .ant-select.ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) { border-color: #ffffff; } .menu-bar__main-menu-right__2WInV .ant-select .ant-select-selector { width: 100%; height: 24px; padding: 0 8px 0 14px; } .menu-bar__main-menu-right__2WInV .ant-select .ant-select-selector .ant-select-selection-item { padding-right: 0; line-height: 24px; color: #e8efff; } .menu-bar__main-menu-right__2WInV .ant-select.ant-select-open .ant-select-selection-item { color: #ffffff; } .menu-bar__main-menu-right__2WInV .ant-select .ant-select-arrow svg { margin-left: 4px; color: #ffffff; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv { display: flex; align-items: center; justify-content: center; position: relative; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__menu-bar-btn_help__2mzPQ { font-size: 24px; font-weight: bold; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__main-menu-group__3Kbhf { height: 16px; line-height: 16px; margin-left: 12px; padding: 0 4px; background-color: #b6c7ff; font-size: 14px; color: var(--theme-primary); border-radius: 3px; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh { display: flex; align-items: center; height: 30px; margin: 0 4px; padding: 0 8px; font-size: 14px; color: #ffffff; border-radius: 15px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__user-level-wrap__1jwSm { position: relative; display: flex; justify-content: center; align-items: center; width: 30px; height: 30px; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__user-level-wrap__1jwSm .menu-bar__user-level-icon__3NHK- { width: 22px; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__user-level-wrap__1jwSm .menu-bar__user-level-num__2H13J { position: absolute; bottom: 3px; right: 2px; width: 16px; height: 16px; line-height: 16px; background-repeat: no-repeat; background-size: 100%; font-size: 12px; font-weight: bold; color: #fe811b; text-align: center; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB { position: fixed; top: 38px; right: 2px; z-index: calc(1049); display: none; flex-flow: column; align-items: center; width: 235px; height: 245px; padding: 10px 0 21px; background-repeat: no-repeat; background-size: 100%; cursor: url(static/cursor/cursor-auto.cur), auto; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-title__3TJYC { max-width: 150px; height: 24px; padding: 0 10px; line-height: 24px; background: rgba(255, 255, 255, 0.1); font-size: 12px; color: #c7ccff; text-align: center; overflow: hidden; text-overflow: ellipsis; border-radius: 0px 0px 7px 7px; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-level-all__2oAtW { display: flex; flex-flow: column; align-items: center; margin-top: 20px; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-level-all__2oAtW .menu-bar__userLevel-level-item__3-IZe { display: flex; justify-content: center; align-items: center; width: 116px; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-level-all__2oAtW .menu-bar__userLevel-level-item__3-IZe .menu-bar__user-level-wrap__1jwSm { width: 36px; height: 36px; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-level-all__2oAtW .menu-bar__userLevel-level-item__3-IZe .menu-bar__user-level-wrap__1jwSm .menu-bar__user-level-icon__3NHK- { width: 26px; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-level-all__2oAtW .menu-bar__userLevel-level-item__3-IZe.menu-bar__userLevel-level-item-star__2KgU0 { margin-top: 7px; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-level-all__2oAtW .menu-bar__userLevel-level-item__3-IZe.menu-bar__userLevel-level-item-star__2KgU0 .menu-bar__user-level-wrap__1jwSm { width: 24px; height: 24px; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-level-all__2oAtW .menu-bar__userLevel-level-item__3-IZe.menu-bar__userLevel-level-item-star__2KgU0 .menu-bar__user-level-wrap__1jwSm .menu-bar__user-level-icon__3NHK- { width: 16px; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-level-all__2oAtW .menu-bar__userLevel-level-item__3-IZe.menu-bar__userLevel-level-item-onlyStar__3bI3Z { width: 144px; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-level-all__2oAtW .menu-bar__userLevel-level-item__3-IZe.menu-bar__userLevel-level-item-onlyStar__3bI3Z .menu-bar__user-level-wrap__1jwSm { width: 36px; height: 36px; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-level-all__2oAtW .menu-bar__userLevel-level-item__3-IZe.menu-bar__userLevel-level-item-onlyStar__3bI3Z .menu-bar__user-level-wrap__1jwSm .menu-bar__user-level-icon__3NHK- { width: 26px; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-info__3GeD4 { width: 165px; font-size: 12px; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-info__3GeD4 .menu-bar__userLevel-info-item__2v7tX { display: flex; justify-content: space-between; align-items: center; width: 100%; margin-top: 10px; color: rgba(255, 255, 255, 0.5); } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-info__3GeD4 .menu-bar__userLevel-info-item__2v7tX .menu-bar__userLevel-info-item-left__1PAKs { flex: 1; display: flex; align-items: center; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-info__3GeD4 .menu-bar__userLevel-info-item__2v7tX .menu-bar__userLevel-info-item-left__1PAKs .menu-bar__userLevel-info-item-content__3SLub { width: 100px; margin-left: 5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-info__3GeD4 .menu-bar__userLevel-info-item__2v7tX .menu-bar__userLevel-info-item-left__1PAKs.menu-bar__userLevel-info-item-left-white__woOtC { color: #ffffff; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-info__3GeD4 .menu-bar__userLevel-info-item__2v7tX .menu-bar__userLevel-info-item-right__3SxgS { cursor: url(static/cursor/cursor-pointer.cur), pointer; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-info__3GeD4 .menu-bar__userLevel-info-item__2v7tX .menu-bar__userLevel-info-item-right__3SxgS svg { margin-left: 5px; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-info__3GeD4 .menu-bar__userLevel-info-item__2v7tX .menu-bar__userLevel-info-item-right__3SxgS:hover { color: rgba(255, 255, 255, 0.8); } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-info__3GeD4 .menu-bar__userLevel-info-item__2v7tX .menu-bar__userLevel-info-item-right__3SxgS:active { color: #ffffff; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-info__3GeD4 .menu-bar__userLevel-info-item__2v7tX.menu-bar__userLevel-info-item-long__2QRjl .menu-bar__userLevel-info-item-content__3SLub { width: 150px; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-btns__24W5i { display: flex; justify-content: center; margin-top: auto; padding-bottom: 20px; color: var(--theme-primary); } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-btns__24W5i .menu-bar__userLevel-line__2XUqh { margin: 0 16px; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-btns__24W5i .menu-bar__userLevel-btn__23yn2 { cursor: url(static/cursor/cursor-pointer.cur), pointer; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-btns__24W5i .menu-bar__userLevel-btn__23yn2:hover { color: #4c62e4; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__userLevel-modal__2E-fB .menu-bar__userLevel-btns__24W5i .menu-bar__userLevel-btn__23yn2:active { color: #364dd6; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh:hover { background-color: rgba(255, 255, 255, 0.1); } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh:hover .menu-bar__userLevel-modal__2E-fB, .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh:hover .menu-bar__openInfoModal__3AANm { display: flex; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh:not('.menu-bar__userLevel-modal__2E-fB'):active { background-color: rgba(255, 255, 255, 0.2); } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__openInfoModal__3AANm { position: fixed; top: 38px; right: 12px; z-index: calc(1049); display: none; width: 134px; height: 159px; cursor: url(static/cursor/cursor-auto.cur), auto; background: #f7faff; box-shadow: 0px 8px 24px rgba(27, 46, 94, 0.08); border-radius: 8px; font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 14px; line-height: 22px; color: #5e6b81; flex-direction: column; align-items: center; padding: 19px 12px 0; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__openInfoModal__3AANm .menu-bar__openInfoModal_item__3rDpy { width: 100%; height: 40px; border-radius: 8px; display: flex; align-items: center; justify-content: center; margin-bottom: 4px; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__openInfoModal__3AANm .menu-bar__openInfoModal_item__3rDpy:hover { background: #e8efff; color: #6a7fff; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__openInfoModal__3AANm .menu-bar__openInfoModal_item__3rDpy:hover .menu-bar__openInfoModal_item_icon__WfsL4 { color: #6a7fff; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-self__1-zzv .menu-bar__user-nameAndLevel__2jWCh .menu-bar__openInfoModal__3AANm .menu-bar__openInfoModal_item__3rDpy .menu-bar__openInfoModal_item_text__jxNiJ { margin-left: 5.75px; } .menu-bar__main-menu-right__2WInV .menu-bar__menu-bar-dropdown__12POh { float: right; height: var(--menu-bar-height); font-size: 13px; display: flex; align-items: center; color: #ffffff; padding: 0 10px; cursor: url(static/cursor/cursor-pointer.cur), pointer; position: relative; } .menu-bar__main-menu-right__2WInV .menu-bar__menu-bar-dropdown__12POh:hover { background-color: rgba(80, 94, 217, 0.5); } .menu-bar__main-menu-right__2WInV .menu-bar__menu-bar-dropdown__12POh .menu-bar__dropdown-icon__3QNO8 { margin-left: 10px; } .menu-bar__main-menu-right__2WInV .menu-bar__menu-bar-username__1na6b { padding: 0 15px; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-name__PgT5O { padding: 0 10px; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-login__tM9dv { margin: 0 12px; padding: 0 8px; border-radius: 12px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .menu-bar__main-menu-right__2WInV .menu-bar__main-menu-login__tM9dv:hover { background-color: #889cff; } .menu-bar__main-menu-right__2WInV .ant-dropdown-trigger { height: 30px; margin: 0 12px; padding: 0 8px; border-radius: 15px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .menu-bar__main-menu-right__2WInV .ant-dropdown-trigger:hover { background-color: #889cff; } .menu-header-mode-drop .ant-select-item { padding: 5px 0; font-size: 14px; text-align: center; } .menu-bar__menu-workcomment-popover__2lzVK .ant-popover-content { max-width: 380px; } .menu-bar__menu-workcomment-popover__2lzVK .ant-popover-content .ant-popover-inner { border-radius: 12px; } .menu-bar__menu-workcomment-popover__2lzVK .ant-popover-content .ant-popover-inner .ant-popover-title { height: 36px; line-height: 36px; font-weight: 600; font-size: 14px; color: #6c7a92; padding: 0 12px; } .menu-bar__menu-workcomment-popover__2lzVK .ant-popover-content .ant-popover-inner .ant-popover-inner-content { padding: 12px; } .menu-bar__menu-workcomment-popover__2lzVK .ant-popover-content .ant-popover-inner .ant-popover-inner-content div { max-height: 290px; font-size: 14px; line-height: 22px; color: #6c7a92; overflow-y: scroll; word-break: keep-all; } .menu-bar__dropdown-menu__2VRzw { display: flex; flex-direction: column; align-items: center; justify-content: center; min-width: 134px; background-color: var(--menu-bar-bg-color); padding: 0; text-align: center; overflow: visible; background: #f7faff; box-shadow: 0px 8px 24px rgba(27, 46, 94, 0.08); border-radius: 8px; } .menu-bar__dropdown-menu__2VRzw .menu-bar__dropdown-menu-item__2VV2x { display: flex; align-items: center; justify-content: center; width: 110px; height: 40px; font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 14px; line-height: 22px; color: #5e6b81; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .menu-bar__dropdown-menu__2VRzw .menu-bar__dropdown-menu-item__2VV2x .ant-dropdown-menu-title-content .anticon { display: inline-block; margin-right: 3px; } .menu-bar__dropdown-menu__2VRzw .menu-bar__dropdown-menu-item__2VV2x .ant-dropdown-menu-title-content .anticon.drop-bar-item-icon:hover { color: #6a7fff; } .menu-bar__dropdown-menu__2VRzw .menu-bar__dropdown-menu-item__2VV2x:hover { background: #e8efff; color: #6a7fff; border-radius: 8px; } .menu-bar__dropdown-menu__2VRzw .menu-bar__dropdown-menu-item__2VV2x:first-child { margin-top: 12px; } .menu-bar__dropdown-menu__2VRzw .menu-bar__dropdown-menu-item__2VV2x:last-child { margin-bottom: 12px; } .menu-bar__dropdown-menu__2VRzw::after { position: absolute; top: -16px; right: 24%; width: 0; height: 0; border: 8px solid transparent; border-bottom-color: #ffffff; content: ''; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .file-menu__flex-center__2_mEI { display: flex; align-items: center; justify-content: center; } .file-menu__full-filled__2Opm1 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .file-menu__modal-mask__CpAsp { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .file-menu__modal-mask__CpAsp .file-menu__modal-wrap__35583 { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .file-menu__modal-mask__CpAsp .file-menu__modal-wrap__35583 .file-menu__modal-header-wrap__3QkKO { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .file-menu__modal-mask__CpAsp .file-menu__modal-wrap__35583 .file-menu__modal-header-wrap__3QkKO .file-menu__modal-header-bg__20wTc { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .file-menu__modal-mask__CpAsp .file-menu__modal-wrap__35583 .file-menu__modal-header-wrap__3QkKO .file-menu__modal-header-label__34xQj { flex-shrink: 0; font-size: 16px; font-weight: bold; } .file-menu__modal-mask__CpAsp .file-menu__modal-wrap__35583 .file-menu__modal-header-wrap__3QkKO .file-menu__modal-header-close__3KANm { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .file-menu__modal-mask__CpAsp .file-menu__modal-wrap__35583 .file-menu__modal-header-wrap__3QkKO .file-menu__modal-header-close__3KANm:hover { color: #98a2b4; } .file-menu__modal-mask__CpAsp .file-menu__modal-wrap__35583 .file-menu__modal-body-wrap__67k-V { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .file-menu__modal-mask__CpAsp .file-menu__modal-wrap__35583 .file-menu__modal-footer-wrap__3yW2a { flex-shrink: 0; display: flex; } .file-menu__modal-header__A7NX5 { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .file-menu__modal-header__A7NX5 .file-menu__modal-header-upload__2ysFW { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .file-menu__modal-header__A7NX5 .file-menu__modal-header-upload__2ysFW:hover { background-color: #e0e9ff; } .file-menu__modal-header__A7NX5 .file-menu__modal-header-upload__2ysFW:active { background-color: #ccdaff; } .file-menu__modal-header__A7NX5 .file-menu__modal-header-upload__2ysFW .file-menu__upload-img__2O_KH { font-size: 16px; margin-right: calc(2px); } .file-menu__modal-header__A7NX5 .file-menu__modal-header-upload__2ysFW .file-menu__upload-label__q8O3m { font-size: 14px; } .file-menu__modal-header__A7NX5 .file-menu__modal-header-upload__2ysFW .file-menu__upload-input__Zko0g { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .file-menu__modal-header__A7NX5 .file-menu__modal-header-search__1AV1f { position: relative; } .file-menu__modal-header__A7NX5 .file-menu__modal-header-search__1AV1f .file-menu__search-input__1KMhD { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .file-menu__modal-header__A7NX5 .file-menu__modal-header-search__1AV1f .file-menu__search-input__1KMhD::-webkit-input-placeholder { color: #98a2b4; } .file-menu__modal-header__A7NX5 .file-menu__modal-header-search__1AV1f .file-menu__search-input__1KMhD::-moz-placeholder { color: #98a2b4; } .file-menu__modal-header__A7NX5 .file-menu__modal-header-search__1AV1f .file-menu__search-input__1KMhD:-ms-input-placeholder { color: #98a2b4; } .file-menu__modal-header__A7NX5 .file-menu__modal-header-search__1AV1f .file-menu__search-input__1KMhD:hover { border-color: #d1d7e1; } .file-menu__modal-header__A7NX5 .file-menu__modal-header-search__1AV1f .file-menu__search-input__1KMhD:active { border-color: #d1d7e1; } .file-menu__modal-header__A7NX5 .file-menu__modal-header-search__1AV1f .file-menu__search-img__1ThPB { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .file-menu__modal-body__kE4-E { flex-grow: 1; display: flex; } .file-menu__modal-body__kE4-E .file-menu__modal-body-left__1-qqI, .file-menu__modal-body__kE4-E .file-menu__modal-body-main__1iUIS { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .file-menu__modal-body__kE4-E .file-menu__modal-body-left__1-qqI { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .file-menu__modal-body__kE4-E .file-menu__modal-body-left__1-qqI .file-menu__modal-body-left-scroll__1Aa19 { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .file-menu__modal-body__kE4-E .file-menu__modal-body-left__1-qqI .file-menu__modal-body-left-scroll__1Aa19 .file-menu__modal-body-left-inner__UdXx3 { width: 121px; padding: calc(12px); color: #5e6b81; } .file-menu__modal-body__kE4-E .file-menu__modal-body-left__1-qqI .file-menu__modal-body-left-scroll__1Aa19 .file-menu__modal-body-left-inner__UdXx3 .file-menu__menu-item-current__Al9NT { color: var(--theme-primary); background-color: #e0e9ff; } .file-menu__modal-body__kE4-E .file-menu__modal-body-left__1-qqI .file-menu__modal-body-left-scroll__1Aa19 .file-menu__modal-body-left-inner__UdXx3 .file-menu__menu-item__a3a6s { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .file-menu__modal-body__kE4-E .file-menu__modal-body-left__1-qqI .file-menu__modal-body-left-scroll__1Aa19 .file-menu__modal-body-left-inner__UdXx3 .file-menu__menu-item__a3a6s:hover { background-color: #edeff5; } .file-menu__modal-body__kE4-E .file-menu__modal-body-left__1-qqI .file-menu__modal-body-left-scroll__1Aa19 .file-menu__modal-body-left-inner__UdXx3 .file-menu__menu-item__a3a6s .file-menu__menu-item-img__1d7nH { flex-shrink: 0; width: 20px; margin-right: 8px; } .file-menu__modal-body__kE4-E .file-menu__modal-body-left__1-qqI .file-menu__modal-body-left-scroll__1Aa19 .file-menu__modal-body-left-inner__UdXx3 .file-menu__menu-item__a3a6s .file-menu__menu-item-label__20dAV { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .file-menu__modal-body__kE4-E .file-menu__modal-body-main__1iUIS { padding: calc(12px) 0; } .file-menu__modal-body__kE4-E .file-menu__modal-body-main__1iUIS .file-menu__modal-body-main-scroll__1CGBk { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .file-menu__modal-body__kE4-E .file-menu__modal-body-main__1iUIS .file-menu__modal-body-main-scroll__1CGBk .file-menu__modal-body-main-inner__1pdYz { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .file-menu__modal-body__kE4-E .file-menu__modal-body-main__1iUIS .file-menu__modal-body-main-scroll__1CGBk .file-menu__modal-body-main-inner__1pdYz .file-menu__selector-btn-add__2peLL, .file-menu__modal-body__kE4-E .file-menu__modal-body-main__1iUIS .file-menu__modal-body-main-scroll__1CGBk .file-menu__modal-body-main-inner__1pdYz .file-menu__selector-btn-item__1-ULS { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .file-menu__modal-body__kE4-E .file-menu__modal-body-main__1iUIS .file-menu__modal-body-main-scroll__1CGBk .file-menu__modal-body-main-inner__1pdYz .file-menu__selector-btn-add__2peLL:hover, .file-menu__modal-body__kE4-E .file-menu__modal-body-main__1iUIS .file-menu__modal-body-main-scroll__1CGBk .file-menu__modal-body-main-inner__1pdYz .file-menu__selector-btn-item__1-ULS:hover { background-color: #e0e9ff; } .file-menu__modal-body__kE4-E .file-menu__modal-body-main__1iUIS .file-menu__modal-body-main-scroll__1CGBk .file-menu__modal-body-main-inner__1pdYz .file-menu__selector-btn-add__2peLL:active, .file-menu__modal-body__kE4-E .file-menu__modal-body-main__1iUIS .file-menu__modal-body-main-scroll__1CGBk .file-menu__modal-body-main-inner__1pdYz .file-menu__selector-btn-item__1-ULS:active { background-color: #ccdaff; } .file-menu__modal-body__kE4-E .file-menu__modal-body-main__1iUIS .file-menu__modal-body-main-scroll__1CGBk .file-menu__modal-body-main-inner__1pdYz .file-menu__selector-btn-add__2peLL:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .file-menu__modal-body__kE4-E .file-menu__modal-body-main__1iUIS .file-menu__modal-body-main-scroll__1CGBk .file-menu__modal-body-main-inner__1pdYz .file-menu__selector-btn-add__2peLL:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .file-menu__modal-body__kE4-E .file-menu__modal-body-main__1iUIS .file-menu__modal-body-main-scroll__1CGBk .file-menu__modal-body-main-inner__1pdYz .file-menu__selector-btn-add__2peLL .file-menu__add-img__3IzuH { font-size: 28px; height: auto; margin-bottom: 8px; } .file-menu__modal-body__kE4-E .file-menu__modal-body-main__1iUIS .file-menu__modal-body-main-scroll__1CGBk .file-menu__modal-body-main-inner__1pdYz .file-menu__selector-btn-add__2peLL .file-menu__add-label__wy_UX { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .file-menu__modal-body__kE4-E .file-menu__modal-body-main__1iUIS .file-menu__modal-body-main-scroll__1CGBk .file-menu__modal-body-main-inner__1pdYz .file-menu__selector-btn-item__1-ULS { justify-content: space-between; } .file-menu__modal-body__kE4-E .file-menu__modal-body-main__1iUIS .file-menu__modal-body-main-scroll__1CGBk .file-menu__modal-body-main-inner__1pdYz .file-menu__selector-btn-item__1-ULS .file-menu__item-img__R9-vL { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .file-menu__modal-body__kE4-E .file-menu__modal-body-main__1iUIS .file-menu__modal-body-main-scroll__1CGBk .file-menu__modal-body-main-inner__1pdYz .file-menu__selector-btn-item__1-ULS .file-menu__item-img__R9-vL img { width: auto; height: 105px; } .file-menu__modal-body__kE4-E .file-menu__modal-body-main__1iUIS .file-menu__modal-body-main-scroll__1CGBk .file-menu__modal-body-main-inner__1pdYz .file-menu__selector-btn-item__1-ULS .file-menu__item-label__3e8z0 { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .file-menu__modal-footer__2K1XW { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .file-menu__selector-btn-add__2peLL, .file-menu__selector-btn-item__1-ULS { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .file-menu__selector-btn-add__2peLL { background-color: var(--selector-sprite-bg_primary); } .file-menu__selector-btn-add__2peLL:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .file-menu__selector-btn-add__2peLL:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .file-menu__selector-btn-add__2peLL .file-menu__add-img__3IzuH { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .file-menu__selector-btn-add__2peLL .file-menu__add-label__wy_UX { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .file-menu__selector-btn-item__1-ULS { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .file-menu__selector-btn-item__1-ULS .file-menu__item-img__R9-vL { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .file-menu__selector-btn-item__1-ULS .file-menu__item-img__R9-vL img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .file-menu__selector-btn-item__1-ULS .file-menu__item-label__3e8z0 { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .file-menu__selector-btn-item__1-ULS:hover { background-color: var(--selector-sprite-bg_primary); } .file-menu__selector-btn-item__1-ULS:hover .file-menu__item-img__R9-vL { border-color: var(--selector-sprite-bg_primary); } .file-menu__selector-btn-item_selected__3f25C { background-color: var(--selector-sprite-bg_primary); } .file-menu__selector-btn-item_selected__3f25C .file-menu__item-img__R9-vL { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .file-menu__menu-bar-btn__2UZy9 { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .file-menu__menu-bar-btn_green__2McRf, .file-menu__menu-bar-btn_create__1YUR6 { background-color: #3cdc8f; } .file-menu__menu-bar-btn_green__2McRf:hover, .file-menu__menu-bar-btn_create__1YUR6:hover { background-color: #00d374; } .file-menu__menu-bar-btn_green__2McRf:active, .file-menu__menu-bar-btn_create__1YUR6:active { background-color: #00d374; } .file-menu__menu-bar-btn_save__3KM4h, .file-menu__menu-bar-btn_reset__3wFh_ { background-color: #6ac8ff; } .file-menu__menu-bar-btn_save__3KM4h:hover, .file-menu__menu-bar-btn_reset__3wFh_:hover { background-color: #57bcfe; } .file-menu__menu-bar-btn_save__3KM4h:active, .file-menu__menu-bar-btn_reset__3wFh_:active { background-color: #4fb0fc; } .file-menu__menu-bar-btn_submit__23N6H, .file-menu__menu-bar-btn_open__2_JLS { background-color: #ff9e23; } .file-menu__menu-bar-btn_submit__23N6H:hover, .file-menu__menu-bar-btn_open__2_JLS:hover { background-color: #f47b04; } .file-menu__menu-bar-btn_submit__23N6H:active, .file-menu__menu-bar-btn_open__2_JLS:active { background-color: #fe8f22; } .file-menu__menu-bar-btn_link__Q1qDn { background-color: #e8efff; color: var(--theme-primary); } .file-menu__menu-bar-btn_link__Q1qDn:hover { background-color: #b6c7ff; } .file-menu__menu-bar-btn_link__Q1qDn:active { background-color: #cfdcff; } .file-menu__menu-bar-btn_disabled__1OAiV { color: #565266; background-color: #e6e9ed; } .file-menu__menu-bar-btn_disabled__1OAiV:hover { cursor: not-allowed; } .file-menu__menu-bar-btn_help__1S9ry { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .file-menu__menu-bar-btn_help__1S9ry:hover { background-color: #8398ff; } .file-menu__menu-bar-btn_help__1S9ry:active { background-color: #8ca3ff; } .file-menu__menu-bar-separator__2zc6v { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .file-menu__file-btn__2DiJi { height: 28px; margin-right: 4px; padding: 0 8px; font-size: 14px; border-radius: 14px; cursor: url(static/cursor/cursor-pointer.cur), pointer; display: flex; align-items: center; justify-content: center; } .file-menu__file-btn__2DiJi .file-menu__icon-open__Fj9gI { margin-right: 5px; font-size: 24px; color: #e8efff; } .file-menu__file-btn__2DiJi:hover { background-color: rgba(255, 255, 255, 0.1); } .file-menu__file-btn__2DiJi:active { background-color: rgba(255, 255, 255, 0.2); } .file-menu__file-dropdown-menu__2w-ju { padding-inline: 10px; align-items: flex-start; } .file-menu__file-dropdown-menu__2w-ju .file-menu__file-dropdown-menu-item__2cHx_ { width: auto; justify-content: flex-start; } .file-menu__file-dropdown-menu__2w-ju::after { position: absolute; top: -16px; left: 24%; width: 0; height: 0; border: 8px solid transparent; border-bottom-color: #ffffff; content: ''; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .connection-modal__flex-center__NT8im { display: flex; align-items: center; justify-content: center; } .connection-modal__full-filled__12Pwa { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .connection-modal__modal-mask__3fE6d { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .connection-modal__modal-mask__3fE6d .connection-modal__modal-wrap__1ZYT0 { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .connection-modal__modal-mask__3fE6d .connection-modal__modal-wrap__1ZYT0 .connection-modal__modal-header-wrap__3uR1x { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .connection-modal__modal-mask__3fE6d .connection-modal__modal-wrap__1ZYT0 .connection-modal__modal-header-wrap__3uR1x .connection-modal__modal-header-bg__1VEM- { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .connection-modal__modal-mask__3fE6d .connection-modal__modal-wrap__1ZYT0 .connection-modal__modal-header-wrap__3uR1x .connection-modal__modal-header-label__3uiZK { flex-shrink: 0; font-size: 16px; font-weight: bold; } .connection-modal__modal-mask__3fE6d .connection-modal__modal-wrap__1ZYT0 .connection-modal__modal-header-wrap__3uR1x .connection-modal__modal-header-close__MT4Ke { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .connection-modal__modal-mask__3fE6d .connection-modal__modal-wrap__1ZYT0 .connection-modal__modal-header-wrap__3uR1x .connection-modal__modal-header-close__MT4Ke:hover { color: #98a2b4; } .connection-modal__modal-mask__3fE6d .connection-modal__modal-wrap__1ZYT0 .connection-modal__modal-body-wrap__OopLv { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .connection-modal__modal-mask__3fE6d .connection-modal__modal-wrap__1ZYT0 .connection-modal__modal-footer-wrap__3Cwvk { flex-shrink: 0; display: flex; } .connection-modal__modal-header__2sXWg { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .connection-modal__modal-header__2sXWg .connection-modal__modal-header-upload__1xFNq { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .connection-modal__modal-header__2sXWg .connection-modal__modal-header-upload__1xFNq:hover { background-color: #e0e9ff; } .connection-modal__modal-header__2sXWg .connection-modal__modal-header-upload__1xFNq:active { background-color: #ccdaff; } .connection-modal__modal-header__2sXWg .connection-modal__modal-header-upload__1xFNq .connection-modal__upload-img__VUyGl { font-size: 16px; margin-right: calc(2px); } .connection-modal__modal-header__2sXWg .connection-modal__modal-header-upload__1xFNq .connection-modal__upload-label__28C_R { font-size: 14px; } .connection-modal__modal-header__2sXWg .connection-modal__modal-header-upload__1xFNq .connection-modal__upload-input__32EBR { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .connection-modal__modal-header__2sXWg .connection-modal__modal-header-search__Xe8zA { position: relative; } .connection-modal__modal-header__2sXWg .connection-modal__modal-header-search__Xe8zA .connection-modal__search-input__13BWb { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .connection-modal__modal-header__2sXWg .connection-modal__modal-header-search__Xe8zA .connection-modal__search-input__13BWb::-webkit-input-placeholder { color: #98a2b4; } .connection-modal__modal-header__2sXWg .connection-modal__modal-header-search__Xe8zA .connection-modal__search-input__13BWb::-moz-placeholder { color: #98a2b4; } .connection-modal__modal-header__2sXWg .connection-modal__modal-header-search__Xe8zA .connection-modal__search-input__13BWb:-ms-input-placeholder { color: #98a2b4; } .connection-modal__modal-header__2sXWg .connection-modal__modal-header-search__Xe8zA .connection-modal__search-input__13BWb:hover { border-color: #d1d7e1; } .connection-modal__modal-header__2sXWg .connection-modal__modal-header-search__Xe8zA .connection-modal__search-input__13BWb:active { border-color: #d1d7e1; } .connection-modal__modal-header__2sXWg .connection-modal__modal-header-search__Xe8zA .connection-modal__search-img__2JZlH { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .connection-modal__modal-body__2ojIh { flex-grow: 1; display: flex; } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-left__kdOoP, .connection-modal__modal-body__2ojIh .connection-modal__modal-body-main__3v2lz { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-left__kdOoP { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-left__kdOoP .connection-modal__modal-body-left-scroll__11G2u { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-left__kdOoP .connection-modal__modal-body-left-scroll__11G2u .connection-modal__modal-body-left-inner__1unCO { width: 121px; padding: calc(12px); color: #5e6b81; } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-left__kdOoP .connection-modal__modal-body-left-scroll__11G2u .connection-modal__modal-body-left-inner__1unCO .connection-modal__menu-item-current__1CbXx { color: var(--theme-primary); background-color: #e0e9ff; } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-left__kdOoP .connection-modal__modal-body-left-scroll__11G2u .connection-modal__modal-body-left-inner__1unCO .connection-modal__menu-item__2xDYY { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-left__kdOoP .connection-modal__modal-body-left-scroll__11G2u .connection-modal__modal-body-left-inner__1unCO .connection-modal__menu-item__2xDYY:hover { background-color: #edeff5; } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-left__kdOoP .connection-modal__modal-body-left-scroll__11G2u .connection-modal__modal-body-left-inner__1unCO .connection-modal__menu-item__2xDYY .connection-modal__menu-item-img__1EED6 { flex-shrink: 0; width: 20px; margin-right: 8px; } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-left__kdOoP .connection-modal__modal-body-left-scroll__11G2u .connection-modal__modal-body-left-inner__1unCO .connection-modal__menu-item__2xDYY .connection-modal__menu-item-label__1zCUY { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-main__3v2lz { padding: calc(12px) 0; } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-main__3v2lz .connection-modal__modal-body-main-scroll__19Zkc { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-main__3v2lz .connection-modal__modal-body-main-scroll__19Zkc .connection-modal__modal-body-main-inner__2O5uY { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-main__3v2lz .connection-modal__modal-body-main-scroll__19Zkc .connection-modal__modal-body-main-inner__2O5uY .connection-modal__selector-btn-add__1JVjG, .connection-modal__modal-body__2ojIh .connection-modal__modal-body-main__3v2lz .connection-modal__modal-body-main-scroll__19Zkc .connection-modal__modal-body-main-inner__2O5uY .connection-modal__selector-btn-item__30WlO { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-main__3v2lz .connection-modal__modal-body-main-scroll__19Zkc .connection-modal__modal-body-main-inner__2O5uY .connection-modal__selector-btn-add__1JVjG:hover, .connection-modal__modal-body__2ojIh .connection-modal__modal-body-main__3v2lz .connection-modal__modal-body-main-scroll__19Zkc .connection-modal__modal-body-main-inner__2O5uY .connection-modal__selector-btn-item__30WlO:hover { background-color: #e0e9ff; } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-main__3v2lz .connection-modal__modal-body-main-scroll__19Zkc .connection-modal__modal-body-main-inner__2O5uY .connection-modal__selector-btn-add__1JVjG:active, .connection-modal__modal-body__2ojIh .connection-modal__modal-body-main__3v2lz .connection-modal__modal-body-main-scroll__19Zkc .connection-modal__modal-body-main-inner__2O5uY .connection-modal__selector-btn-item__30WlO:active { background-color: #ccdaff; } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-main__3v2lz .connection-modal__modal-body-main-scroll__19Zkc .connection-modal__modal-body-main-inner__2O5uY .connection-modal__selector-btn-add__1JVjG:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-main__3v2lz .connection-modal__modal-body-main-scroll__19Zkc .connection-modal__modal-body-main-inner__2O5uY .connection-modal__selector-btn-add__1JVjG:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-main__3v2lz .connection-modal__modal-body-main-scroll__19Zkc .connection-modal__modal-body-main-inner__2O5uY .connection-modal__selector-btn-add__1JVjG .connection-modal__add-img__2khWD { font-size: 28px; height: auto; margin-bottom: 8px; } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-main__3v2lz .connection-modal__modal-body-main-scroll__19Zkc .connection-modal__modal-body-main-inner__2O5uY .connection-modal__selector-btn-add__1JVjG .connection-modal__add-label__24R7E { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-main__3v2lz .connection-modal__modal-body-main-scroll__19Zkc .connection-modal__modal-body-main-inner__2O5uY .connection-modal__selector-btn-item__30WlO { justify-content: space-between; } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-main__3v2lz .connection-modal__modal-body-main-scroll__19Zkc .connection-modal__modal-body-main-inner__2O5uY .connection-modal__selector-btn-item__30WlO .connection-modal__item-img__3QP2S { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-main__3v2lz .connection-modal__modal-body-main-scroll__19Zkc .connection-modal__modal-body-main-inner__2O5uY .connection-modal__selector-btn-item__30WlO .connection-modal__item-img__3QP2S img { width: auto; height: 105px; } .connection-modal__modal-body__2ojIh .connection-modal__modal-body-main__3v2lz .connection-modal__modal-body-main-scroll__19Zkc .connection-modal__modal-body-main-inner__2O5uY .connection-modal__selector-btn-item__30WlO .connection-modal__item-label__3qfQk { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .connection-modal__modal-footer__13ntO { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .connection-modal__selector-btn-add__1JVjG, .connection-modal__selector-btn-item__30WlO { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .connection-modal__selector-btn-add__1JVjG { background-color: var(--selector-sprite-bg_primary); } .connection-modal__selector-btn-add__1JVjG:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .connection-modal__selector-btn-add__1JVjG:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .connection-modal__selector-btn-add__1JVjG .connection-modal__add-img__2khWD { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .connection-modal__selector-btn-add__1JVjG .connection-modal__add-label__24R7E { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .connection-modal__selector-btn-item__30WlO { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .connection-modal__selector-btn-item__30WlO .connection-modal__item-img__3QP2S { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .connection-modal__selector-btn-item__30WlO .connection-modal__item-img__3QP2S img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .connection-modal__selector-btn-item__30WlO .connection-modal__item-label__3qfQk { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .connection-modal__selector-btn-item__30WlO:hover { background-color: var(--selector-sprite-bg_primary); } .connection-modal__selector-btn-item__30WlO:hover .connection-modal__item-img__3QP2S { border-color: var(--selector-sprite-bg_primary); } .connection-modal__selector-btn-item_selected__QlY0G { background-color: var(--selector-sprite-bg_primary); } .connection-modal__selector-btn-item_selected__QlY0G .connection-modal__item-img__3QP2S { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .connection-modal__menu-bar-btn__1oRGn { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .connection-modal__menu-bar-btn_green__bR2xy, .connection-modal__menu-bar-btn_create__2I0Fe { background-color: #3cdc8f; } .connection-modal__menu-bar-btn_green__bR2xy:hover, .connection-modal__menu-bar-btn_create__2I0Fe:hover { background-color: #00d374; } .connection-modal__menu-bar-btn_green__bR2xy:active, .connection-modal__menu-bar-btn_create__2I0Fe:active { background-color: #00d374; } .connection-modal__menu-bar-btn_save__1GcLA, .connection-modal__menu-bar-btn_reset__1GX19 { background-color: #6ac8ff; } .connection-modal__menu-bar-btn_save__1GcLA:hover, .connection-modal__menu-bar-btn_reset__1GX19:hover { background-color: #57bcfe; } .connection-modal__menu-bar-btn_save__1GcLA:active, .connection-modal__menu-bar-btn_reset__1GX19:active { background-color: #4fb0fc; } .connection-modal__menu-bar-btn_submit__3zX3A, .connection-modal__menu-bar-btn_open__1ymL0 { background-color: #ff9e23; } .connection-modal__menu-bar-btn_submit__3zX3A:hover, .connection-modal__menu-bar-btn_open__1ymL0:hover { background-color: #f47b04; } .connection-modal__menu-bar-btn_submit__3zX3A:active, .connection-modal__menu-bar-btn_open__1ymL0:active { background-color: #fe8f22; } .connection-modal__menu-bar-btn_link__2UdRF { background-color: #e8efff; color: var(--theme-primary); } .connection-modal__menu-bar-btn_link__2UdRF:hover { background-color: #b6c7ff; } .connection-modal__menu-bar-btn_link__2UdRF:active { background-color: #cfdcff; } .connection-modal__menu-bar-btn_disabled__1A5jN { color: #565266; background-color: #e6e9ed; } .connection-modal__menu-bar-btn_disabled__1A5jN:hover { cursor: not-allowed; } .connection-modal__menu-bar-btn_help__gZ_w7 { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .connection-modal__menu-bar-btn_help__gZ_w7:hover { background-color: #8398ff; } .connection-modal__menu-bar-btn_help__gZ_w7:active { background-color: #8ca3ff; } .connection-modal__menu-bar-separator__2D5NT { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* #FF8C1A */ /* #FFB366 */ /* #FF8C1A */ .connection-modal__connection-font__21Zx8 { font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-style: normal; font-weight: normal; font-size: 14px; line-height: 14px; text-align: center; color: #828da3; letter-spacing: 1px; } .connection-modal__connection-link__2vJSI { margin-top: 10px; font-size: 13px; color: var(--theme-primary); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .connection-modal__connection-link-mac__1OC4B { font-size: 13px; color: var(--theme-primary); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .connection-modal__connection-link-tip__3EBW8 { position: absolute; left: 0; bottom: 0; width: 93.5px; height: 30px; background: #f0f2ff; border-top-right-radius: 10px; display: flex; justify-content: center; align-items: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .connection-modal__connection-link-tip__3EBW8 span { font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-style: normal; font-weight: normal; font-size: 14px; line-height: 150%; color: #6a7fff; } .connection-modal__connection-research__mUuyW { padding: 8px 16px; background: #f0f2ff; border-radius: 34px; margin-top: 16px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .connection-modal__connection-research__mUuyW:hover { background: #e7ebff; } .connection-modal__connection-research__mUuyW:active { background: #dee3ff; } .connection-modal__connection-research__mUuyW span { font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-style: normal; font-weight: 600; font-size: 14px; line-height: 14px; color: #6a7fff; letter-spacing: 1px; } .connection-modal__connection-mask__3Ceb1 { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .connection-modal__connection-mask__3Ceb1 .connection-modal__modal-wrap__1ZYT0 { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .connection-modal__connection-mask__3Ceb1 .connection-modal__modal-wrap__1ZYT0 .connection-modal__modal-header-wrap__3uR1x { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .connection-modal__connection-mask__3Ceb1 .connection-modal__modal-wrap__1ZYT0 .connection-modal__modal-header-wrap__3uR1x .connection-modal__modal-header-bg__1VEM- { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .connection-modal__connection-mask__3Ceb1 .connection-modal__modal-wrap__1ZYT0 .connection-modal__modal-header-wrap__3uR1x .connection-modal__modal-header-label__3uiZK { flex-shrink: 0; font-size: 16px; font-weight: bold; } .connection-modal__connection-mask__3Ceb1 .connection-modal__modal-wrap__1ZYT0 .connection-modal__modal-header-wrap__3uR1x .connection-modal__modal-header-close__MT4Ke { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .connection-modal__connection-mask__3Ceb1 .connection-modal__modal-wrap__1ZYT0 .connection-modal__modal-header-wrap__3uR1x .connection-modal__modal-header-close__MT4Ke:hover { color: #98a2b4; } .connection-modal__connection-mask__3Ceb1 .connection-modal__modal-wrap__1ZYT0 .connection-modal__modal-body-wrap__OopLv { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .connection-modal__connection-mask__3Ceb1 .connection-modal__modal-wrap__1ZYT0 .connection-modal__modal-footer-wrap__3Cwvk { flex-shrink: 0; display: flex; } .connection-modal__body__3t-Ue { width: 425px; height: 230px; overflow: hidden; position: relative; border-bottom-left-radius: 12px; border-bottom-right-radius: 12px; display: flex; } .connection-modal__body__3t-Ue .connection-modal__lottie__3N7wY { position: absolute; top: 33px; left: 78px; } .connection-modal__body__3t-Ue .connection-modal__status-icon__3ghO8 { position: absolute; top: 50px; left: 202px; z-index: 1; width: 24px; opacity: 0; } .connection-modal__body__3t-Ue .connection-modal__status-icon__3ghO8 img { width: inherit; object-fit: contain; } .connection-modal__body__3t-Ue .connection-modal__status-icon__3ghO8.connection-modal__show__3qUU5 { opacity: 1; } @keyframes connection-modal__loading__1JGML { 0% { width: 0; } to { width: 99%; } } .connection-modal__body__3t-Ue .connection-modal__connection-loading-wrapper__24uz3 { width: 100%; position: absolute; bottom: 0; height: 6px; background-color: transparent; } .connection-modal__body__3t-Ue .connection-modal__connection-loading-wrapper__24uz3 span { display: block; width: 0; height: 100%; background-color: var(--theme-primary); transition: width 0s; } .connection-modal__body__3t-Ue .connection-modal__connection-loading-wrapper__24uz3 .connection-modal__connection-loading-playing__3m-UK { animation: connection-modal__loading__1JGML 30s forwards; } .connection-modal__wrapper__3k5Ol { background: #ffffff; border-radius: 12px; position: relative; } .connection-modal__wrapper__3k5Ol .connection-modal__monkey-head__2AxPN { position: absolute; z-index: -1; top: -76px; left: 50%; transform: translate(-50%, 0); } .connection-modal__wrapper__3k5Ol .connection-modal__monkey-head__2AxPN img { width: 132px; object-fit: contain; } .connection-modal__wrapper__3k5Ol .connection-modal__monkey-hand__1jiRA { position: absolute; top: -15px; left: 50%; transform: translate(calc(-50% + 3px), 0); } .connection-modal__wrapper__3k5Ol .connection-modal__monkey-hand__1jiRA img { width: 96px; object-fit: contain; } .connection-modal__wrapper__3k5Ol .connection-modal__header__3QI3v { background-color: transparent; width: 100%; height: 40px; position: relative; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #e8efff; padding: 0 20px; } .connection-modal__wrapper__3k5Ol .connection-modal__header__3QI3v h2 { font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-style: normal; font-weight: 600; font-size: 16px; line-height: 16px; color: #3d4554; margin: 0; padding: 0; } .connection-modal__wrapper__3k5Ol .connection-modal__header__3QI3v span { color: #b5bccb; font-size: 16px; } .connection-modal__active-area__1L79m { display: flex; justify-content: center; align-items: center; flex-direction: column; align-self: flex-end; width: 100%; } .connection-modal__active-area__1L79m .connection-modal__scratch-link-announcement__GDJQx { position: absolute; width: 167px; top: -48px; } .connection-modal__active-area__1L79m .connection-modal__scratch-link-announcement__GDJQx img { object-fit: contain; width: 100%; } .connection-modal__connection-text__3Mgqj { font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-style: normal; font-weight: normal; font-size: 14px; line-height: 14px; text-align: center; color: #828da3; letter-spacing: 1px; display: inline-block; vertical-align: middle; } .connection-modal__connection-text__3Mgqj .connection-modal__connection-text-item-mac__2p_3T { padding-left: 14px; } .connection-modal__connection-text__3Mgqj span { display: inline-block; vertical-align: inherit; } .connection-modal__connection-text__3Mgqj span img { display: inline-block; width: 18px; height: 18px; object-fit: cover; margin-left: 5px; } .connection-modal__connection-form__3T_WD { margin-top: -40px; display: flex; flex-direction: column; } .connection-modal__connection-form__3T_WD button { border: none; outline: none; height: 40px; width: 100%; background-color: var(--theme-primary); font-size: 14px; font-weight: 600; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; color: #ffffff; margin-top: 22px; margin-bottom: 32px; } .connection-modal__connection-form__3T_WD button:disabled { background-color: #b3beff; } .connection-modal__connection-form__3T_WD .ant-select { height: 30px; width: 285px; } .connection-modal__connection-form__3T_WD .ant-select-selection-placeholder { font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-style: normal; font-weight: normal; font-size: 14px; line-height: 14px; color: #b5bccb; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .mission-list-modal__flex-center__3Nsqf { display: flex; align-items: center; justify-content: center; } .mission-list-modal__full-filled__1NNOi { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .mission-list-modal__modal-mask__bRnMP { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .mission-list-modal__modal-mask__bRnMP .mission-list-modal__modal-wrap__1S0Dp { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .mission-list-modal__modal-mask__bRnMP .mission-list-modal__modal-wrap__1S0Dp .mission-list-modal__modal-header-wrap__2hFKL { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .mission-list-modal__modal-mask__bRnMP .mission-list-modal__modal-wrap__1S0Dp .mission-list-modal__modal-header-wrap__2hFKL .mission-list-modal__modal-header-bg__35TiR { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .mission-list-modal__modal-mask__bRnMP .mission-list-modal__modal-wrap__1S0Dp .mission-list-modal__modal-header-wrap__2hFKL .mission-list-modal__modal-header-label__2toCz { flex-shrink: 0; font-size: 16px; font-weight: bold; } .mission-list-modal__modal-mask__bRnMP .mission-list-modal__modal-wrap__1S0Dp .mission-list-modal__modal-header-wrap__2hFKL .mission-list-modal__modal-header-close__2jUiw { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mission-list-modal__modal-mask__bRnMP .mission-list-modal__modal-wrap__1S0Dp .mission-list-modal__modal-header-wrap__2hFKL .mission-list-modal__modal-header-close__2jUiw:hover { color: #98a2b4; } .mission-list-modal__modal-mask__bRnMP .mission-list-modal__modal-wrap__1S0Dp .mission-list-modal__modal-body-wrap__cRCe7 { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .mission-list-modal__modal-mask__bRnMP .mission-list-modal__modal-wrap__1S0Dp .mission-list-modal__modal-footer-wrap__2fq30 { flex-shrink: 0; display: flex; } .mission-list-modal__modal-header__FTHOZ { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .mission-list-modal__modal-header__FTHOZ .mission-list-modal__modal-header-upload__2j1W- { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .mission-list-modal__modal-header__FTHOZ .mission-list-modal__modal-header-upload__2j1W-:hover { background-color: #e0e9ff; } .mission-list-modal__modal-header__FTHOZ .mission-list-modal__modal-header-upload__2j1W-:active { background-color: #ccdaff; } .mission-list-modal__modal-header__FTHOZ .mission-list-modal__modal-header-upload__2j1W- .mission-list-modal__upload-img__3l81Y { font-size: 16px; margin-right: calc(2px); } .mission-list-modal__modal-header__FTHOZ .mission-list-modal__modal-header-upload__2j1W- .mission-list-modal__upload-label__LUqv0 { font-size: 14px; } .mission-list-modal__modal-header__FTHOZ .mission-list-modal__modal-header-upload__2j1W- .mission-list-modal__upload-input__13PUm { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mission-list-modal__modal-header__FTHOZ .mission-list-modal__modal-header-search__1qZlE { position: relative; } .mission-list-modal__modal-header__FTHOZ .mission-list-modal__modal-header-search__1qZlE .mission-list-modal__search-input__2MxTQ { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .mission-list-modal__modal-header__FTHOZ .mission-list-modal__modal-header-search__1qZlE .mission-list-modal__search-input__2MxTQ::-webkit-input-placeholder { color: #98a2b4; } .mission-list-modal__modal-header__FTHOZ .mission-list-modal__modal-header-search__1qZlE .mission-list-modal__search-input__2MxTQ::-moz-placeholder { color: #98a2b4; } .mission-list-modal__modal-header__FTHOZ .mission-list-modal__modal-header-search__1qZlE .mission-list-modal__search-input__2MxTQ:-ms-input-placeholder { color: #98a2b4; } .mission-list-modal__modal-header__FTHOZ .mission-list-modal__modal-header-search__1qZlE .mission-list-modal__search-input__2MxTQ:hover { border-color: #d1d7e1; } .mission-list-modal__modal-header__FTHOZ .mission-list-modal__modal-header-search__1qZlE .mission-list-modal__search-input__2MxTQ:active { border-color: #d1d7e1; } .mission-list-modal__modal-header__FTHOZ .mission-list-modal__modal-header-search__1qZlE .mission-list-modal__search-img__2Y9H- { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mission-list-modal__modal-body__2OfIb { flex-grow: 1; display: flex; } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-left__3UVa0, .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-main__17XSM { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-left__3UVa0 { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-left__3UVa0 .mission-list-modal__modal-body-left-scroll__3mOM7 { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-left__3UVa0 .mission-list-modal__modal-body-left-scroll__3mOM7 .mission-list-modal__modal-body-left-inner__1EQxt { width: 121px; padding: calc(12px); color: #5e6b81; } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-left__3UVa0 .mission-list-modal__modal-body-left-scroll__3mOM7 .mission-list-modal__modal-body-left-inner__1EQxt .mission-list-modal__menu-item-current__3iJkW { color: var(--theme-primary); background-color: #e0e9ff; } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-left__3UVa0 .mission-list-modal__modal-body-left-scroll__3mOM7 .mission-list-modal__modal-body-left-inner__1EQxt .mission-list-modal__menu-item__11suO { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-left__3UVa0 .mission-list-modal__modal-body-left-scroll__3mOM7 .mission-list-modal__modal-body-left-inner__1EQxt .mission-list-modal__menu-item__11suO:hover { background-color: #edeff5; } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-left__3UVa0 .mission-list-modal__modal-body-left-scroll__3mOM7 .mission-list-modal__modal-body-left-inner__1EQxt .mission-list-modal__menu-item__11suO .mission-list-modal__menu-item-img__3lvSG { flex-shrink: 0; width: 20px; margin-right: 8px; } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-left__3UVa0 .mission-list-modal__modal-body-left-scroll__3mOM7 .mission-list-modal__modal-body-left-inner__1EQxt .mission-list-modal__menu-item__11suO .mission-list-modal__menu-item-label__2NZ9e { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-main__17XSM { padding: calc(12px) 0; } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-main__17XSM .mission-list-modal__modal-body-main-scroll__2allO { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-main__17XSM .mission-list-modal__modal-body-main-scroll__2allO .mission-list-modal__modal-body-main-inner__3UWUi { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-main__17XSM .mission-list-modal__modal-body-main-scroll__2allO .mission-list-modal__modal-body-main-inner__3UWUi .mission-list-modal__selector-btn-add__3WdIu, .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-main__17XSM .mission-list-modal__modal-body-main-scroll__2allO .mission-list-modal__modal-body-main-inner__3UWUi .mission-list-modal__selector-btn-item__hjRf4 { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-main__17XSM .mission-list-modal__modal-body-main-scroll__2allO .mission-list-modal__modal-body-main-inner__3UWUi .mission-list-modal__selector-btn-add__3WdIu:hover, .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-main__17XSM .mission-list-modal__modal-body-main-scroll__2allO .mission-list-modal__modal-body-main-inner__3UWUi .mission-list-modal__selector-btn-item__hjRf4:hover { background-color: #e0e9ff; } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-main__17XSM .mission-list-modal__modal-body-main-scroll__2allO .mission-list-modal__modal-body-main-inner__3UWUi .mission-list-modal__selector-btn-add__3WdIu:active, .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-main__17XSM .mission-list-modal__modal-body-main-scroll__2allO .mission-list-modal__modal-body-main-inner__3UWUi .mission-list-modal__selector-btn-item__hjRf4:active { background-color: #ccdaff; } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-main__17XSM .mission-list-modal__modal-body-main-scroll__2allO .mission-list-modal__modal-body-main-inner__3UWUi .mission-list-modal__selector-btn-add__3WdIu:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-main__17XSM .mission-list-modal__modal-body-main-scroll__2allO .mission-list-modal__modal-body-main-inner__3UWUi .mission-list-modal__selector-btn-add__3WdIu:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-main__17XSM .mission-list-modal__modal-body-main-scroll__2allO .mission-list-modal__modal-body-main-inner__3UWUi .mission-list-modal__selector-btn-add__3WdIu .mission-list-modal__add-img__3F05P { font-size: 28px; height: auto; margin-bottom: 8px; } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-main__17XSM .mission-list-modal__modal-body-main-scroll__2allO .mission-list-modal__modal-body-main-inner__3UWUi .mission-list-modal__selector-btn-add__3WdIu .mission-list-modal__add-label__oU9LZ { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-main__17XSM .mission-list-modal__modal-body-main-scroll__2allO .mission-list-modal__modal-body-main-inner__3UWUi .mission-list-modal__selector-btn-item__hjRf4 { justify-content: space-between; } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-main__17XSM .mission-list-modal__modal-body-main-scroll__2allO .mission-list-modal__modal-body-main-inner__3UWUi .mission-list-modal__selector-btn-item__hjRf4 .mission-list-modal__item-img__2h6uC { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-main__17XSM .mission-list-modal__modal-body-main-scroll__2allO .mission-list-modal__modal-body-main-inner__3UWUi .mission-list-modal__selector-btn-item__hjRf4 .mission-list-modal__item-img__2h6uC img { width: auto; height: 105px; } .mission-list-modal__modal-body__2OfIb .mission-list-modal__modal-body-main__17XSM .mission-list-modal__modal-body-main-scroll__2allO .mission-list-modal__modal-body-main-inner__3UWUi .mission-list-modal__selector-btn-item__hjRf4 .mission-list-modal__item-label__re_q7 { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .mission-list-modal__modal-footer__2BCy7 { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .mission-list-modal__selector-btn-add__3WdIu, .mission-list-modal__selector-btn-item__hjRf4 { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .mission-list-modal__selector-btn-add__3WdIu { background-color: var(--selector-sprite-bg_primary); } .mission-list-modal__selector-btn-add__3WdIu:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .mission-list-modal__selector-btn-add__3WdIu:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .mission-list-modal__selector-btn-add__3WdIu .mission-list-modal__add-img__3F05P { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .mission-list-modal__selector-btn-add__3WdIu .mission-list-modal__add-label__oU9LZ { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .mission-list-modal__selector-btn-item__hjRf4 { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .mission-list-modal__selector-btn-item__hjRf4 .mission-list-modal__item-img__2h6uC { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .mission-list-modal__selector-btn-item__hjRf4 .mission-list-modal__item-img__2h6uC img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .mission-list-modal__selector-btn-item__hjRf4 .mission-list-modal__item-label__re_q7 { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .mission-list-modal__selector-btn-item__hjRf4:hover { background-color: var(--selector-sprite-bg_primary); } .mission-list-modal__selector-btn-item__hjRf4:hover .mission-list-modal__item-img__2h6uC { border-color: var(--selector-sprite-bg_primary); } .mission-list-modal__selector-btn-item_selected__m4GDC { background-color: var(--selector-sprite-bg_primary); } .mission-list-modal__selector-btn-item_selected__m4GDC .mission-list-modal__item-img__2h6uC { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .mission-list-modal__menu-bar-btn__2ogiH { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .mission-list-modal__menu-bar-btn_green__1oWM_, .mission-list-modal__menu-bar-btn_create__18eUe { background-color: #3cdc8f; } .mission-list-modal__menu-bar-btn_green__1oWM_:hover, .mission-list-modal__menu-bar-btn_create__18eUe:hover { background-color: #00d374; } .mission-list-modal__menu-bar-btn_green__1oWM_:active, .mission-list-modal__menu-bar-btn_create__18eUe:active { background-color: #00d374; } .mission-list-modal__menu-bar-btn_save__XJeSi, .mission-list-modal__menu-bar-btn_reset__H9Ctg { background-color: #6ac8ff; } .mission-list-modal__menu-bar-btn_save__XJeSi:hover, .mission-list-modal__menu-bar-btn_reset__H9Ctg:hover { background-color: #57bcfe; } .mission-list-modal__menu-bar-btn_save__XJeSi:active, .mission-list-modal__menu-bar-btn_reset__H9Ctg:active { background-color: #4fb0fc; } .mission-list-modal__menu-bar-btn_submit__1LdK8, .mission-list-modal__menu-bar-btn_open__1dWYi { background-color: #ff9e23; } .mission-list-modal__menu-bar-btn_submit__1LdK8:hover, .mission-list-modal__menu-bar-btn_open__1dWYi:hover { background-color: #f47b04; } .mission-list-modal__menu-bar-btn_submit__1LdK8:active, .mission-list-modal__menu-bar-btn_open__1dWYi:active { background-color: #fe8f22; } .mission-list-modal__menu-bar-btn_link__20qha { background-color: #e8efff; color: var(--theme-primary); } .mission-list-modal__menu-bar-btn_link__20qha:hover { background-color: #b6c7ff; } .mission-list-modal__menu-bar-btn_link__20qha:active { background-color: #cfdcff; } .mission-list-modal__menu-bar-btn_disabled__1T9NE { color: #565266; background-color: #e6e9ed; } .mission-list-modal__menu-bar-btn_disabled__1T9NE:hover { cursor: not-allowed; } .mission-list-modal__menu-bar-btn_help__3EKAi { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .mission-list-modal__menu-bar-btn_help__3EKAi:hover { background-color: #8398ff; } .mission-list-modal__menu-bar-btn_help__3EKAi:active { background-color: #8ca3ff; } .mission-list-modal__menu-bar-separator__1D-dm { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ @font-face { font-family: CuntomPMZD; src: url('https://ybc-test.oss-cn-beijing.aliyuncs.com/ada-school/ada-school-mission/font/CuntomPMZD.ttf'); } @keyframes mission-list-modal__bounceIn__1UrEJ { from, 20%, 40%, 60%, 80%, to { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { transform: scale3d(0.8, 0.8, 0.8); } 20% { transform: scale3d(1.1, 1.1, 1.1); } 40% { transform: scale3d(1, 1, 1); } 60% { opacity: 1; transform: scale3d(1.03, 1.03, 1.03); } 80% { transform: scale3d(0.97, 0.97, 0.97); } to { opacity: 1; transform: scale3d(1, 1, 1); } } .mission-list-modal__width_58__34AkP { width: 58px; } .mission-list-modal__width_64__2Oy1b { width: 64px; } .mission-list-modal__height_30__2UP06 { height: 30px; } .mission-list-modal__mission-list-modal__12p7E { width: 100%; position: fixed; z-index: 1002; } .mission-list-modal__mission-list-modal__12p7E.mission-list-modal__show__254fZ { top: 0; transition: top 0.3s; } .mission-list-modal__mission-list-modal__12p7E.mission-list-modal__hide__2luZJ { top: -156px; transition: top 0.3s; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-go-back__2uCon { display: flex; align-items: center; justify-content: center; width: 90px; height: 35px; position: absolute; top: 0; left: 0; font-family: 'CuntomPMZD'; font-style: normal; font-weight: 400; font-size: 18px; color: #5af5fd; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-go-back__2uCon .mission-list-modal__icon__SRRjC { display: inline-block; font-size: 22px; padding: 0 8px 2px 0; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-go-back__2uCon:hover { color: #31dee7; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-go-back__2uCon:active { color: #00939a; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__misstion-title-content__NH_3C { display: flex; align-items: center; justify-content: center; min-width: 100px; height: 30px; position: absolute; top: 0; left: 50%; transform: translate(-50%, 0); font-family: 'CuntomPMZD'; font-style: normal; font-weight: 400; font-size: 20px; color: #5af5fd; pointer-events: none; z-index: 1003; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__misstion-title-content__NH_3C .mission-list-modal__misstion-title-content-left__2aFaW { width: 17px; height: 30px; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__misstion-title-content__NH_3C .mission-list-modal__misstion-title-content-center__2km9L { flex: 1; padding: 0 10px; height: 30px; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__misstion-title-content__NH_3C .mission-list-modal__misstion-title-content-right__12kTX { width: 17px; height: 30px; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-content__2NCeS { width: 100%; height: 156px; display: flex; flex-direction: row; justify-content: space-between; align-items: center; padding: 0 40px; background-color: #ffffff; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-content__2NCeS .mission-list-modal__mission-item-list-content__2S9_h { flex: 1; height: 100%; min-width: 764px; display: flex; flex-direction: row; justify-content: center; align-items: center; overflow: hidden; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-content__2NCeS .mission-list-modal__mission-item-list-content__2S9_h .mission-list-modal__item-list-content__Z4opi { height: 100%; display: flex; flex-direction: row; align-items: end; overflow: hidden; margin-bottom: 10px; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-content__2NCeS .mission-list-modal__mission-item-list-content__2S9_h .mission-list-modal__item-list-content__Z4opi .mission-list-modal__item-list-scroll-content__1aAy- { display: flex; flex-direction: row; justify-content: center; align-items: center; transition: transform 0.3s ease-in-out; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-content__2NCeS .mission-list-modal__mission-item-list-content__2S9_h .mission-list-modal__item-list-content__Z4opi .mission-list-modal__item-list-scroll-content__1aAy- .mission-list-modal__mission-item-content__3Gc6n { display: flex; flex-direction: row; justify-content: center; align-items: center; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-content__2NCeS .mission-list-modal__mission-item-list-content__2S9_h .mission-list-modal__item-list-content__Z4opi .mission-list-modal__item-list-scroll-content__1aAy- .mission-list-modal__mission-item-content__3Gc6n .mission-list-modal__mission-item__2jHdO { width: 68px; height: 116px; position: relative; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-content__2NCeS .mission-list-modal__mission-item-list-content__2S9_h .mission-list-modal__item-list-content__Z4opi .mission-list-modal__item-list-scroll-content__1aAy- .mission-list-modal__mission-item-content__3Gc6n .mission-list-modal__mission-item__2jHdO:hover .mission-list-modal__item-top__2KPPZ { animation-duration: 1.5s; animation-name: mission-list-modal__bounceIn__1UrEJ; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-content__2NCeS .mission-list-modal__mission-item-list-content__2S9_h .mission-list-modal__item-list-content__Z4opi .mission-list-modal__item-list-scroll-content__1aAy- .mission-list-modal__mission-item-content__3Gc6n .mission-list-modal__mission-item__2jHdO .mission-list-modal__item-top__2KPPZ { width: 64px; height: 68px; position: absolute; top: 10px; left: 2px; z-index: 1; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-content__2NCeS .mission-list-modal__mission-item-list-content__2S9_h .mission-list-modal__item-list-content__Z4opi .mission-list-modal__item-list-scroll-content__1aAy- .mission-list-modal__mission-item-content__3Gc6n .mission-list-modal__mission-item__2jHdO .mission-list-modal__item-top__2KPPZ .mission-list-modal__item-index__2w9j1 { display: block; position: absolute; left: 50%; bottom: 10px; z-index: 2; transform: translate(-50%, 0); font-family: 'CuntomPMZD'; font-style: normal; font-weight: 400; font-size: 11px; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-content__2NCeS .mission-list-modal__mission-item-list-content__2S9_h .mission-list-modal__item-list-content__Z4opi .mission-list-modal__item-list-scroll-content__1aAy- .mission-list-modal__mission-item-content__3Gc6n .mission-list-modal__mission-item__2jHdO .mission-list-modal__item-top__2KPPZ .mission-list-modal__missionItemNum_current__2GuLu { color: #ffffff; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-content__2NCeS .mission-list-modal__mission-item-list-content__2S9_h .mission-list-modal__item-list-content__Z4opi .mission-list-modal__item-list-scroll-content__1aAy- .mission-list-modal__mission-item-content__3Gc6n .mission-list-modal__mission-item__2jHdO .mission-list-modal__item-top__2KPPZ .mission-list-modal__missionItemNum_locked__dvSmq { color: #6c80f1; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-content__2NCeS .mission-list-modal__mission-item-list-content__2S9_h .mission-list-modal__item-list-content__Z4opi .mission-list-modal__item-list-scroll-content__1aAy- .mission-list-modal__mission-item-content__3Gc6n .mission-list-modal__mission-item__2jHdO .mission-list-modal__item-top__2KPPZ .mission-list-modal__missionItemNum_active__4kzb2 { color: #ffffff; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-content__2NCeS .mission-list-modal__mission-item-list-content__2S9_h .mission-list-modal__item-list-content__Z4opi .mission-list-modal__item-list-scroll-content__1aAy- .mission-list-modal__mission-item-content__3Gc6n .mission-list-modal__mission-item__2jHdO .mission-list-modal__item-bottom__3quh- { width: 58px; height: 58px; position: absolute; bottom: 0; left: 5px; z-index: 1; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-content__2NCeS .mission-list-modal__mission-item-list-content__2S9_h .mission-list-modal__item-list-content__Z4opi .mission-list-modal__item-list-scroll-content__1aAy- .mission-list-modal__mission-item-content__3Gc6n .mission-list-modal__line-item__2Wxm2 { width: 48px; height: 2px; height: 3px; background: linear-gradient(to right, #9feeff, #9feeff 6px, transparent 6px, transparent); background-size: 10px 100%; background-repeat: repeat-x; margin-bottom: 28px; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-content__2NCeS .mission-list-modal__left-btn__17XtS, .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-content__2NCeS .mission-list-modal__right-btn__2ex2g { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-content__2NCeS .mission-list-modal__left-btn__17XtS:hover img, .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-content__2NCeS .mission-list-modal__right-btn__2ex2g:hover img { animation-duration: 1s; animation-name: mission-list-modal__bounceIn__1UrEJ; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-btn__4qhXI { display: flex; align-items: center; justify-content: center; width: 167px; height: 39px; position: absolute; top: 154px; left: 50%; z-index: 1002; padding-bottom: 6px; transform: translate(-50%, 0); font-style: normal; font-weight: 600; font-size: 14px; line-height: 14px; color: #ffffff; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-btn__4qhXI .mission-list-modal__mission-list-btn-content__dpuRc { vertical-align: text-bottom; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-btn__4qhXI .mission-list-modal__mission-list-btn-content__dpuRc .mission-list-modal__mission-list-num__1FeZ- { font-size: 20px; color: #f4bc50; } .mission-list-modal__mission-list-modal__12p7E .mission-list-modal__mission-list-btn__4qhXI .mission-list-modal__mission-list-btn-content__dpuRc .mission-list-modal__mission-list-total__29_g9 { font-size: 13px; } .mission-list-modal__mission-content-mask__1u9Nr { position: fixed; width: 100%; height: 100%; } .mission-list-modal__mission-content-mask__1u9Nr.mission-list-modal__show-mask__9wQ-X { z-index: 1002; background-color: rgba(0, 0, 0, 0.5); transition: 0.3s; } .mission-list-modal__mission-content-mask__1u9Nr.mission-list-modal__hide-mask__3a5M8 { z-index: -1; background-color: rgba(0, 0, 0, 0); transition: 0.3s; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .custom-works-teacher__flex-center__27YNd { display: flex; align-items: center; justify-content: center; } .custom-works-teacher__full-filled__lmRrd { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .custom-works-teacher__modal-mask__2hq76 { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .custom-works-teacher__modal-mask__2hq76 .custom-works-teacher__modal-wrap__1438z { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .custom-works-teacher__modal-mask__2hq76 .custom-works-teacher__modal-wrap__1438z .custom-works-teacher__modal-header-wrap__1B7tb { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .custom-works-teacher__modal-mask__2hq76 .custom-works-teacher__modal-wrap__1438z .custom-works-teacher__modal-header-wrap__1B7tb .custom-works-teacher__modal-header-bg__T2xV9 { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .custom-works-teacher__modal-mask__2hq76 .custom-works-teacher__modal-wrap__1438z .custom-works-teacher__modal-header-wrap__1B7tb .custom-works-teacher__modal-header-label__3IAiw { flex-shrink: 0; font-size: 16px; font-weight: bold; } .custom-works-teacher__modal-mask__2hq76 .custom-works-teacher__modal-wrap__1438z .custom-works-teacher__modal-header-wrap__1B7tb .custom-works-teacher__modal-header-close__2tN-n { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-teacher__modal-mask__2hq76 .custom-works-teacher__modal-wrap__1438z .custom-works-teacher__modal-header-wrap__1B7tb .custom-works-teacher__modal-header-close__2tN-n:hover { color: #98a2b4; } .custom-works-teacher__modal-mask__2hq76 .custom-works-teacher__modal-wrap__1438z .custom-works-teacher__modal-body-wrap__2ul2M { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .custom-works-teacher__modal-mask__2hq76 .custom-works-teacher__modal-wrap__1438z .custom-works-teacher__modal-footer-wrap__1QhtM { flex-shrink: 0; display: flex; } .custom-works-teacher__modal-header__1OI9h { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .custom-works-teacher__modal-header__1OI9h .custom-works-teacher__modal-header-upload__186xf { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .custom-works-teacher__modal-header__1OI9h .custom-works-teacher__modal-header-upload__186xf:hover { background-color: #e0e9ff; } .custom-works-teacher__modal-header__1OI9h .custom-works-teacher__modal-header-upload__186xf:active { background-color: #ccdaff; } .custom-works-teacher__modal-header__1OI9h .custom-works-teacher__modal-header-upload__186xf .custom-works-teacher__upload-img__3lHeI { font-size: 16px; margin-right: calc(2px); } .custom-works-teacher__modal-header__1OI9h .custom-works-teacher__modal-header-upload__186xf .custom-works-teacher__upload-label__o6VZ2 { font-size: 14px; } .custom-works-teacher__modal-header__1OI9h .custom-works-teacher__modal-header-upload__186xf .custom-works-teacher__upload-input__3HuP_ { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-teacher__modal-header__1OI9h .custom-works-teacher__modal-header-search__r0lWy { position: relative; } .custom-works-teacher__modal-header__1OI9h .custom-works-teacher__modal-header-search__r0lWy .custom-works-teacher__search-input__3im7m { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .custom-works-teacher__modal-header__1OI9h .custom-works-teacher__modal-header-search__r0lWy .custom-works-teacher__search-input__3im7m::-webkit-input-placeholder { color: #98a2b4; } .custom-works-teacher__modal-header__1OI9h .custom-works-teacher__modal-header-search__r0lWy .custom-works-teacher__search-input__3im7m::-moz-placeholder { color: #98a2b4; } .custom-works-teacher__modal-header__1OI9h .custom-works-teacher__modal-header-search__r0lWy .custom-works-teacher__search-input__3im7m:-ms-input-placeholder { color: #98a2b4; } .custom-works-teacher__modal-header__1OI9h .custom-works-teacher__modal-header-search__r0lWy .custom-works-teacher__search-input__3im7m:hover { border-color: #d1d7e1; } .custom-works-teacher__modal-header__1OI9h .custom-works-teacher__modal-header-search__r0lWy .custom-works-teacher__search-input__3im7m:active { border-color: #d1d7e1; } .custom-works-teacher__modal-header__1OI9h .custom-works-teacher__modal-header-search__r0lWy .custom-works-teacher__search-img__2AMDD { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-teacher__modal-body__28eD8 { flex-grow: 1; display: flex; } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-left__Jt69y, .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-main__1CfuC { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-left__Jt69y { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-left__Jt69y .custom-works-teacher__modal-body-left-scroll__3vTHm { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-left__Jt69y .custom-works-teacher__modal-body-left-scroll__3vTHm .custom-works-teacher__modal-body-left-inner__19YLt { width: 121px; padding: calc(12px); color: #5e6b81; } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-left__Jt69y .custom-works-teacher__modal-body-left-scroll__3vTHm .custom-works-teacher__modal-body-left-inner__19YLt .custom-works-teacher__menu-item-current__CzxZ_ { color: var(--theme-primary); background-color: #e0e9ff; } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-left__Jt69y .custom-works-teacher__modal-body-left-scroll__3vTHm .custom-works-teacher__modal-body-left-inner__19YLt .custom-works-teacher__menu-item__2Z9JJ { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-left__Jt69y .custom-works-teacher__modal-body-left-scroll__3vTHm .custom-works-teacher__modal-body-left-inner__19YLt .custom-works-teacher__menu-item__2Z9JJ:hover { background-color: #edeff5; } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-left__Jt69y .custom-works-teacher__modal-body-left-scroll__3vTHm .custom-works-teacher__modal-body-left-inner__19YLt .custom-works-teacher__menu-item__2Z9JJ .custom-works-teacher__menu-item-img__39mcX { flex-shrink: 0; width: 20px; margin-right: 8px; } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-left__Jt69y .custom-works-teacher__modal-body-left-scroll__3vTHm .custom-works-teacher__modal-body-left-inner__19YLt .custom-works-teacher__menu-item__2Z9JJ .custom-works-teacher__menu-item-label__3ClCe { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-main__1CfuC { padding: calc(12px) 0; } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-main__1CfuC .custom-works-teacher__modal-body-main-scroll__2rGKT { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-main__1CfuC .custom-works-teacher__modal-body-main-scroll__2rGKT .custom-works-teacher__modal-body-main-inner__Wj9ME { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-main__1CfuC .custom-works-teacher__modal-body-main-scroll__2rGKT .custom-works-teacher__modal-body-main-inner__Wj9ME .custom-works-teacher__selector-btn-add__38tMC, .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-main__1CfuC .custom-works-teacher__modal-body-main-scroll__2rGKT .custom-works-teacher__modal-body-main-inner__Wj9ME .custom-works-teacher__selector-btn-item__1CA4d { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-main__1CfuC .custom-works-teacher__modal-body-main-scroll__2rGKT .custom-works-teacher__modal-body-main-inner__Wj9ME .custom-works-teacher__selector-btn-add__38tMC:hover, .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-main__1CfuC .custom-works-teacher__modal-body-main-scroll__2rGKT .custom-works-teacher__modal-body-main-inner__Wj9ME .custom-works-teacher__selector-btn-item__1CA4d:hover { background-color: #e0e9ff; } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-main__1CfuC .custom-works-teacher__modal-body-main-scroll__2rGKT .custom-works-teacher__modal-body-main-inner__Wj9ME .custom-works-teacher__selector-btn-add__38tMC:active, .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-main__1CfuC .custom-works-teacher__modal-body-main-scroll__2rGKT .custom-works-teacher__modal-body-main-inner__Wj9ME .custom-works-teacher__selector-btn-item__1CA4d:active { background-color: #ccdaff; } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-main__1CfuC .custom-works-teacher__modal-body-main-scroll__2rGKT .custom-works-teacher__modal-body-main-inner__Wj9ME .custom-works-teacher__selector-btn-add__38tMC:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-main__1CfuC .custom-works-teacher__modal-body-main-scroll__2rGKT .custom-works-teacher__modal-body-main-inner__Wj9ME .custom-works-teacher__selector-btn-add__38tMC:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-main__1CfuC .custom-works-teacher__modal-body-main-scroll__2rGKT .custom-works-teacher__modal-body-main-inner__Wj9ME .custom-works-teacher__selector-btn-add__38tMC .custom-works-teacher__add-img__34Rf- { font-size: 28px; height: auto; margin-bottom: 8px; } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-main__1CfuC .custom-works-teacher__modal-body-main-scroll__2rGKT .custom-works-teacher__modal-body-main-inner__Wj9ME .custom-works-teacher__selector-btn-add__38tMC .custom-works-teacher__add-label__3s6_e { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-main__1CfuC .custom-works-teacher__modal-body-main-scroll__2rGKT .custom-works-teacher__modal-body-main-inner__Wj9ME .custom-works-teacher__selector-btn-item__1CA4d { justify-content: space-between; } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-main__1CfuC .custom-works-teacher__modal-body-main-scroll__2rGKT .custom-works-teacher__modal-body-main-inner__Wj9ME .custom-works-teacher__selector-btn-item__1CA4d .custom-works-teacher__item-img__1gCIk { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-main__1CfuC .custom-works-teacher__modal-body-main-scroll__2rGKT .custom-works-teacher__modal-body-main-inner__Wj9ME .custom-works-teacher__selector-btn-item__1CA4d .custom-works-teacher__item-img__1gCIk img { width: auto; height: 105px; } .custom-works-teacher__modal-body__28eD8 .custom-works-teacher__modal-body-main__1CfuC .custom-works-teacher__modal-body-main-scroll__2rGKT .custom-works-teacher__modal-body-main-inner__Wj9ME .custom-works-teacher__selector-btn-item__1CA4d .custom-works-teacher__item-label__1cmYR { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .custom-works-teacher__modal-footer__YU8Di { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .custom-works-teacher__selector-btn-add__38tMC, .custom-works-teacher__selector-btn-item__1CA4d { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .custom-works-teacher__selector-btn-add__38tMC { background-color: var(--selector-sprite-bg_primary); } .custom-works-teacher__selector-btn-add__38tMC:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .custom-works-teacher__selector-btn-add__38tMC:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .custom-works-teacher__selector-btn-add__38tMC .custom-works-teacher__add-img__34Rf- { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .custom-works-teacher__selector-btn-add__38tMC .custom-works-teacher__add-label__3s6_e { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .custom-works-teacher__selector-btn-item__1CA4d { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .custom-works-teacher__selector-btn-item__1CA4d .custom-works-teacher__item-img__1gCIk { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .custom-works-teacher__selector-btn-item__1CA4d .custom-works-teacher__item-img__1gCIk img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .custom-works-teacher__selector-btn-item__1CA4d .custom-works-teacher__item-label__1cmYR { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .custom-works-teacher__selector-btn-item__1CA4d:hover { background-color: var(--selector-sprite-bg_primary); } .custom-works-teacher__selector-btn-item__1CA4d:hover .custom-works-teacher__item-img__1gCIk { border-color: var(--selector-sprite-bg_primary); } .custom-works-teacher__selector-btn-item_selected__5rdSB { background-color: var(--selector-sprite-bg_primary); } .custom-works-teacher__selector-btn-item_selected__5rdSB .custom-works-teacher__item-img__1gCIk { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .custom-works-teacher__menu-bar-btn__21i76 { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .custom-works-teacher__menu-bar-btn_green__3DjVc, .custom-works-teacher__menu-bar-btn_create__2lVdx { background-color: #3cdc8f; } .custom-works-teacher__menu-bar-btn_green__3DjVc:hover, .custom-works-teacher__menu-bar-btn_create__2lVdx:hover { background-color: #00d374; } .custom-works-teacher__menu-bar-btn_green__3DjVc:active, .custom-works-teacher__menu-bar-btn_create__2lVdx:active { background-color: #00d374; } .custom-works-teacher__menu-bar-btn_save__2bnNC, .custom-works-teacher__menu-bar-btn_reset__1GP0p { background-color: #6ac8ff; } .custom-works-teacher__menu-bar-btn_save__2bnNC:hover, .custom-works-teacher__menu-bar-btn_reset__1GP0p:hover { background-color: #57bcfe; } .custom-works-teacher__menu-bar-btn_save__2bnNC:active, .custom-works-teacher__menu-bar-btn_reset__1GP0p:active { background-color: #4fb0fc; } .custom-works-teacher__menu-bar-btn_submit__31iWf, .custom-works-teacher__menu-bar-btn_open__3E4ru { background-color: #ff9e23; } .custom-works-teacher__menu-bar-btn_submit__31iWf:hover, .custom-works-teacher__menu-bar-btn_open__3E4ru:hover { background-color: #f47b04; } .custom-works-teacher__menu-bar-btn_submit__31iWf:active, .custom-works-teacher__menu-bar-btn_open__3E4ru:active { background-color: #fe8f22; } .custom-works-teacher__menu-bar-btn_link__2AIfX { background-color: #e8efff; color: var(--theme-primary); } .custom-works-teacher__menu-bar-btn_link__2AIfX:hover { background-color: #b6c7ff; } .custom-works-teacher__menu-bar-btn_link__2AIfX:active { background-color: #cfdcff; } .custom-works-teacher__menu-bar-btn_disabled__1dmRU { color: #565266; background-color: #e6e9ed; } .custom-works-teacher__menu-bar-btn_disabled__1dmRU:hover { cursor: not-allowed; } .custom-works-teacher__menu-bar-btn_help__3FIFa { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .custom-works-teacher__menu-bar-btn_help__3FIFa:hover { background-color: #8398ff; } .custom-works-teacher__menu-bar-btn_help__3FIFa:active { background-color: #8ca3ff; } .custom-works-teacher__menu-bar-separator__1AoLZ { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .custom-works-teacher__works-modal__uujhm { position: relative; display: flex; flex-direction: column; width: 842px; height: 497px; background-color: #ffffff; border-radius: 12px; } .custom-works-teacher__workModal-header__cAm2u { display: flex; justify-content: space-between; align-items: center; width: 100%; height: 41px; padding: 0 48px 0 20px; border-bottom: 1px solid #e8efff; font-size: 16px; } .custom-works-teacher__workModal-header__cAm2u .custom-works-teacher__workModal-header-tabs__36I-R { display: flex; justify-content: space-between; align-items: center; } .custom-works-teacher__workModal-header__cAm2u .custom-works-teacher__workModal-header-tabs__36I-R .custom-works-teacher__workModal-header-tab__22OAW { position: relative; display: flex; align-items: center; width: 64px; margin-right: 24px; line-height: 40px; color: #5e6b81; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-teacher__workModal-header__cAm2u .custom-works-teacher__workModal-header-tabs__36I-R .custom-works-teacher__workModal-header-tab__22OAW:hover { color: var(--theme-primary); } .custom-works-teacher__workModal-header__cAm2u .custom-works-teacher__workModal-header-tabs__36I-R .custom-works-teacher__workModal-header-tab__22OAW.custom-works-teacher__workModal-header-tab-active__1dzVg { font-weight: bold; color: var(--theme-primary); } .custom-works-teacher__workModal-header__cAm2u .custom-works-teacher__workModal-header-tabs__36I-R .custom-works-teacher__workModal-header-tab__22OAW.custom-works-teacher__workModal-header-tab-active__1dzVg::before { position: absolute; left: 50%; bottom: 0px; transform: translateX(-50%); width: 16px; height: 3px; background-color: var(--theme-primary); border-radius: 2px; content: ''; } .custom-works-teacher__workModal-header__cAm2u .custom-works-teacher__workModal-header-openfile__2nfed { display: flex; justify-content: center; align-items: center; height: 24px; line-height: 24px; padding: 0 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .custom-works-teacher__workModal-header__cAm2u .custom-works-teacher__workModal-header-openfile__2nfed svg { font-size: 14px; margin-right: 4px; } .custom-works-teacher__workModal-header__cAm2u .custom-works-teacher__workModal-header-openfile__2nfed:hover { background-color: #e0e9ff; } .custom-works-teacher__workModal-header__cAm2u .custom-works-teacher__workModal-header-openfile__2nfed:active { background-color: #ccdaff; } .custom-works-teacher__workModal-header__cAm2u .custom-works-teacher__workModal-select-wrap__hCFK9 .custom-works-teacher__workModal-select__jpcsT { width: 228px; height: 24px; font-size: 14px; } .custom-works-teacher__workModal-header__cAm2u .custom-works-teacher__workModal-select-wrap__hCFK9 .custom-works-teacher__workModal-select__jpcsT .ant-select-selector { height: 24px; padding: 0 8px; } .custom-works-teacher__workModal-header__cAm2u .custom-works-teacher__workModal-select-wrap__hCFK9 .custom-works-teacher__workModal-select__jpcsT .ant-select-selector .ant-select-selection-item { padding-right: 0; line-height: 24px; } .custom-works-teacher__workModal-header__cAm2u .custom-works-teacher__workModal-header-close__1XP7z { position: absolute; right: 15px; top: 14px; font-size: 16px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-teacher__workModal-header__cAm2u .custom-works-teacher__workModal-header-close__1XP7z:hover { color: #98a2b4; } .custom-works-teacher__works-modal__uujhm .custom-works-teacher__workModal-select__jpcsT { color: #5e6b81; } .custom-works-teacher__works-modal__uujhm .custom-works-teacher__workModal-select__jpcsT .ant-select-selector { z-index: 47; background-color: transparent; border-color: #e8efff; border-radius: 4px; } .custom-works-teacher__works-modal__uujhm .custom-works-teacher__workModal-select__jpcsT .ant-select-arrow { top: 48%; } .custom-works-teacher__works-modal__uujhm .custom-works-teacher__workModal-select__jpcsT .ant-select-arrow svg { font-size: 14px; color: #5e6b81; } .workModal-select-drop .ant-select-item-option-content { font-weight: normal; } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e { flex: 1; display: flex; overflow: hidden; } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-left__2Mt7i { display: flex; flex-flow: column; width: 237px; height: 100%; padding: 12px 0; border-right: 1px solid #e8efff; } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-left__2Mt7i .custom-works-teacher__workModal-content-left-course__2kTB- { width: calc(213px); margin: 0 auto; padding-bottom: 12px; border-bottom: 1px solid #e8efff; } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-left__2Mt7i .custom-works-teacher__workModal-content-left-course__2kTB- .custom-works-teacher__workModal-select__jpcsT { width: 100%; font-size: 14px; } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-left__2Mt7i .custom-works-teacher__workModal-content-left-main__rDqob { flex: 1; width: 237px; padding: 12px 12px 0; overflow-y: auto; } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-left__2Mt7i .custom-works-teacher__workModal-content-left-main__rDqob .custom-works-teacher__workModal-content-lesson__BCtqF { display: flex; justify-content: space-between; align-items: center; width: 100%; margin-bottom: 8px; padding: 0 8px; color: #5e6b81; border-radius: 4px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-left__2Mt7i .custom-works-teacher__workModal-content-left-main__rDqob .custom-works-teacher__workModal-content-lesson__BCtqF .custom-works-teacher__workModal-content-lesson-name__1LscJ { flex: 1; height: 30px; line-height: 30px; font-size: 14px; overflow-x: hidden; text-overflow: ellipsis; white-space: nowrap; } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-left__2Mt7i .custom-works-teacher__workModal-content-left-main__rDqob .custom-works-teacher__workModal-content-lesson__BCtqF .custom-works-teacher__workModal-content-lesson-finished__2mJ2G, .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-left__2Mt7i .custom-works-teacher__workModal-content-left-main__rDqob .custom-works-teacher__workModal-content-lesson__BCtqF .custom-works-teacher__workModal-content-lesson-received__RpWrW { width: 42px; height: 16px; line-height: 16px; background-color: #e0e9ff; font-size: 12px; color: var(--theme-primary); text-align: center; border-radius: 2px; } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-left__2Mt7i .custom-works-teacher__workModal-content-left-main__rDqob .custom-works-teacher__workModal-content-lesson__BCtqF .custom-works-teacher__workModal-content-lesson-received__RpWrW { width: 54px; } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-left__2Mt7i .custom-works-teacher__workModal-content-left-main__rDqob .custom-works-teacher__workModal-content-lesson__BCtqF.custom-works-teacher__workModal-content-lesson-active__2rKjz { background-color: #f0f4ff; color: var(--theme-primary); } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-left__2Mt7i .custom-works-teacher__workModal-content-left-main__rDqob .custom-works-teacher__workModal-content-lesson__BCtqF:hover { background-color: #edeff5; } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-right__1mtwr { flex: 1; display: flex; padding: 10px 0 10px 10px; overflow: hidden; } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-right__1mtwr .custom-works-teacher__workModal-content-right-main__3T7dT { display: flex; flex-direction: column; width: calc(596px); padding-right: 10px; overflow-y: auto; } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-right__1mtwr .custom-works-teacher__workModal-content-right-main__3T7dT .custom-works-teacher__workModal-content-label__vGJTG { position: relative; width: 100%; height: 14px; line-height: 14px; padding-left: 10px; margin-bottom: 12px; font-weight: bold; color: #3d4554; } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-right__1mtwr .custom-works-teacher__workModal-content-right-main__3T7dT .custom-works-teacher__workModal-content-label__vGJTG::before { position: absolute; left: 0; top: 0; width: 4px; height: 14px; background-color: var(--theme-primary); border-radius: 2px; content: ''; } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-right__1mtwr .custom-works-teacher__workModal-content-right-main__3T7dT .custom-works-teacher__workModal-content-label__vGJTG.custom-works-teacher__workModal-content-label_complete__GGd5q { margin-top: 20px; } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-right__1mtwr .custom-works-teacher__workModal-content-right-main__3T7dT .custom-works-teacher__workModal-content-label__vGJTG.custom-works-teacher__workModal-content-label_complete__GGd5q::before { background-color: #fc8230; } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-right__1mtwr .custom-works-teacher__workModal-content-right-main__3T7dT .custom-works-teacher__workModal-content__3rgmF { width: calc(585px); } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-right__1mtwr .custom-works-teacher__workModal-content-right-main__3T7dT .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item__2YJdv { margin-right: 12px; } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-right__1mtwr .custom-works-teacher__workModal-content-right-main__3T7dT .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item__2YJdv .custom-works-teacher__item-main__1Bl__ { width: 186px; height: 104px; box-shadow: 0 -30px 10px -6px rgba(0, 0, 0, 0.4) inset; } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-right__1mtwr .custom-works-teacher__workModal-content-right-main__3T7dT .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item__2YJdv:nth-child(3n) { margin-right: 0; } .custom-works-teacher__workModal-content-wrap_scroll_exercise__nRQ2e .custom-works-teacher__workModal-content-right__1mtwr .custom-works-teacher__workModal-content-right-main__3T7dT .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item__2YJdv .custom-works-teacher__item-label__1cmYR { width: 186px; } .custom-works-teacher__workModal-content__3rgmF { width: 100%; display: flex; flex-wrap: wrap; } .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item__2YJdv { display: flex; flex-direction: column; justify-content: space-between; margin-right: 10px; } .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item__2YJdv.custom-works-teacher__workModal-content-item_dragging__3Gkso { opacity: 0.6; } .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item__2YJdv.custom-works-teacher__workModal-content-item_mouseover__3MSWb .custom-works-teacher__item-main__1Bl__ .custom-works-teacher__item-main-mask__QbFzM:hover { opacity: 1; } .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item__2YJdv .custom-works-teacher__item-main__1Bl__ { position: relative; width: 196px; height: 110px; background-size: cover; background-position: center; background-repeat: no-repeat; overflow: hidden; border-radius: 4px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item__2YJdv .custom-works-teacher__item-main__1Bl__ .custom-works-teacher__item-main-mask__QbFzM { position: absolute; width: 100%; left: 0; right: 0; top: 0; bottom: 0; margin: auto; display: flex; justify-content: center; align-items: center; background-color: rgba(0, 0, 0, 0.64); font-size: 14px; color: #fff; opacity: 0; border-radius: 4px; } .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item__2YJdv .custom-works-teacher__item-main__1Bl__ .custom-works-teacher__item-main-mask__QbFzM .custom-works-teacher__item-main-open__1YLTI { margin-right: 5px; font-size: 16px; } .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item__2YJdv .custom-works-teacher__item-main__1Bl__ .custom-works-teacher__item-main-mask__QbFzM .custom-works-teacher__item-main-delete__1LweI { position: absolute; top: 8px; right: 8px; display: flex; justify-content: center; align-items: center; width: 24px; height: 24px; background: rgba(255, 255, 255, 0.2); color: #ffffff; border-radius: 6px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item__2YJdv .custom-works-teacher__item-main__1Bl__ .custom-works-teacher__item-main-mask__QbFzM .custom-works-teacher__item-main-delete__1LweI:hover { background-color: rgba(255, 255, 255, 0.4); } .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item__2YJdv .custom-works-teacher__item-main__1Bl__ .custom-works-teacher__item-main-mask__QbFzM .custom-works-teacher__item-main-delete__1LweI:active { background-color: rgba(255, 255, 255, 0.6); } .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item__2YJdv .custom-works-teacher__item-main__1Bl__ .custom-works-teacher__item-main-mask__QbFzM:active { color: #98a2b4; } .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item__2YJdv .custom-works-teacher__item-label__1cmYR { display: flex; justify-content: space-between; align-items: center; width: 196px; height: 26px; margin: 6px 0 14px; font-size: 14px; color: #5e6b81; } .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item__2YJdv .custom-works-teacher__item-label__1cmYR .custom-works-teacher__item-label-text__2XUH- { flex: 1; overflow-x: hidden; text-overflow: ellipsis; white-space: nowrap; } .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item__2YJdv .custom-works-teacher__item-label__1cmYR .custom-works-teacher__item-label-icon__33tN0 { color: #757d8a; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item_add__31RVO { display: flex; align-items: center; justify-content: center; flex-direction: column; position: relative; width: 196px; height: 110px; margin-right: 10px; background-color: #f0f4ff; border: 1px dashed #b6c7ff; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item_add__31RVO .custom-works-teacher__add-icon__2O03x { width: 16px; } .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item_add__31RVO .custom-works-teacher__add-label__3s6_e { margin-top: 20px; font-size: 14px; color: var(--theme-primary); } .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item_add__31RVO:hover { background-color: #e0e9ff; } .custom-works-teacher__workModal-content__3rgmF .custom-works-teacher__workModal-content-item_add__31RVO:active { background-color: #ccdaff; } .custom-works-teacher__modalDropdown-menu__2cUHk { background: #ffffff; box-shadow: 0px 8px 24px rgba(27, 46, 94, 0.08); border-radius: 8px; } .custom-works-teacher__modalDropdown-menu__2cUHk .custom-works-teacher__modalDropdown-menu-item__3t4ZJ { padding: 5px 26px; background: #ffffff; color: #5e6b81; font-size: 14px; } .custom-works-teacher__modalDropdown-menu__2cUHk .custom-works-teacher__modalDropdown-menu-item__3t4ZJ svg { margin-right: 5px; color: #5e6b81; } .custom-works-teacher__modalDropdown-menu__2cUHk .custom-works-teacher__modalDropdown-menu-item__3t4ZJ:hover { background: #ffffff; color: #485874; } .custom-works-teacher__modalDropdown-menu__2cUHk .custom-works-teacher__modalDropdown-menu-item__3t4ZJ:hover svg { color: #485874; } .custom-works-teacher__modalDropdown-menu__2cUHk .custom-works-teacher__modalDropdown-menu-item__3t4ZJ:active { color: #3c485c; } .custom-works-teacher__modalDropdown-menu__2cUHk .custom-works-teacher__modalDropdown-menu-item__3t4ZJ:active svg { color: #3c485c; } .custom-works-teacher__workModal-content-empty__2luMG { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; height: 400px; background-color: transparent; border-radius: 10px; } .custom-works-teacher__workModal-content-empty__2luMG img { width: 200px; height: 200px; } .custom-works-teacher__workModal-content-empty__2luMG span { font-size: 14px; color: #666; text-align: center; } .custom-works-teacher__workModal-content-empty__2luMG.custom-works-teacher__workModal-content-loading__u44Tu img { width: 132px; height: auto; } .custom-works-teacher__workModal-content-wrap_scroll__1s3DC { flex: 1; width: 842px; padding: 12px; overflow-x: hidden; overflow-y: auto; } .custom-works-teacher__workModal-content-wrap_scroll__1s3DC .custom-works-teacher__workModal-content__3rgmF { width: calc(818px); } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .custom-works-student__flex-center__oRuYS { display: flex; align-items: center; justify-content: center; } .custom-works-student__full-filled__3gQSV { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .custom-works-student__modal-mask__2-vRc { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .custom-works-student__modal-mask__2-vRc .custom-works-student__modal-wrap__1y_5G { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .custom-works-student__modal-mask__2-vRc .custom-works-student__modal-wrap__1y_5G .custom-works-student__modal-header-wrap__3NvIc { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .custom-works-student__modal-mask__2-vRc .custom-works-student__modal-wrap__1y_5G .custom-works-student__modal-header-wrap__3NvIc .custom-works-student__modal-header-bg__1Rs6d { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .custom-works-student__modal-mask__2-vRc .custom-works-student__modal-wrap__1y_5G .custom-works-student__modal-header-wrap__3NvIc .custom-works-student__modal-header-label__2jzI8 { flex-shrink: 0; font-size: 16px; font-weight: bold; } .custom-works-student__modal-mask__2-vRc .custom-works-student__modal-wrap__1y_5G .custom-works-student__modal-header-wrap__3NvIc .custom-works-student__modal-header-close__1p7ix { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-student__modal-mask__2-vRc .custom-works-student__modal-wrap__1y_5G .custom-works-student__modal-header-wrap__3NvIc .custom-works-student__modal-header-close__1p7ix:hover { color: #98a2b4; } .custom-works-student__modal-mask__2-vRc .custom-works-student__modal-wrap__1y_5G .custom-works-student__modal-body-wrap__sTZN2 { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .custom-works-student__modal-mask__2-vRc .custom-works-student__modal-wrap__1y_5G .custom-works-student__modal-footer-wrap__2RJev { flex-shrink: 0; display: flex; } .custom-works-student__modal-header__3OA_l { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .custom-works-student__modal-header__3OA_l .custom-works-student__modal-header-upload__suHGT { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .custom-works-student__modal-header__3OA_l .custom-works-student__modal-header-upload__suHGT:hover { background-color: #e0e9ff; } .custom-works-student__modal-header__3OA_l .custom-works-student__modal-header-upload__suHGT:active { background-color: #ccdaff; } .custom-works-student__modal-header__3OA_l .custom-works-student__modal-header-upload__suHGT .custom-works-student__upload-img__2VKeT { font-size: 16px; margin-right: calc(2px); } .custom-works-student__modal-header__3OA_l .custom-works-student__modal-header-upload__suHGT .custom-works-student__upload-label__3eVf8 { font-size: 14px; } .custom-works-student__modal-header__3OA_l .custom-works-student__modal-header-upload__suHGT .custom-works-student__upload-input__1V82w { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-student__modal-header__3OA_l .custom-works-student__modal-header-search__L6ajB { position: relative; } .custom-works-student__modal-header__3OA_l .custom-works-student__modal-header-search__L6ajB .custom-works-student__search-input__q_ogh { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .custom-works-student__modal-header__3OA_l .custom-works-student__modal-header-search__L6ajB .custom-works-student__search-input__q_ogh::-webkit-input-placeholder { color: #98a2b4; } .custom-works-student__modal-header__3OA_l .custom-works-student__modal-header-search__L6ajB .custom-works-student__search-input__q_ogh::-moz-placeholder { color: #98a2b4; } .custom-works-student__modal-header__3OA_l .custom-works-student__modal-header-search__L6ajB .custom-works-student__search-input__q_ogh:-ms-input-placeholder { color: #98a2b4; } .custom-works-student__modal-header__3OA_l .custom-works-student__modal-header-search__L6ajB .custom-works-student__search-input__q_ogh:hover { border-color: #d1d7e1; } .custom-works-student__modal-header__3OA_l .custom-works-student__modal-header-search__L6ajB .custom-works-student__search-input__q_ogh:active { border-color: #d1d7e1; } .custom-works-student__modal-header__3OA_l .custom-works-student__modal-header-search__L6ajB .custom-works-student__search-img__UtucK { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-student__modal-body__3pCfX { flex-grow: 1; display: flex; } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-left__3AL-X, .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-main__1Z2pt { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-left__3AL-X { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-left__3AL-X .custom-works-student__modal-body-left-scroll__2a4W2 { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-left__3AL-X .custom-works-student__modal-body-left-scroll__2a4W2 .custom-works-student__modal-body-left-inner__Dxe2g { width: 121px; padding: calc(12px); color: #5e6b81; } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-left__3AL-X .custom-works-student__modal-body-left-scroll__2a4W2 .custom-works-student__modal-body-left-inner__Dxe2g .custom-works-student__menu-item-current__2wkkW { color: var(--theme-primary); background-color: #e0e9ff; } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-left__3AL-X .custom-works-student__modal-body-left-scroll__2a4W2 .custom-works-student__modal-body-left-inner__Dxe2g .custom-works-student__menu-item__1l9hG { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-left__3AL-X .custom-works-student__modal-body-left-scroll__2a4W2 .custom-works-student__modal-body-left-inner__Dxe2g .custom-works-student__menu-item__1l9hG:hover { background-color: #edeff5; } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-left__3AL-X .custom-works-student__modal-body-left-scroll__2a4W2 .custom-works-student__modal-body-left-inner__Dxe2g .custom-works-student__menu-item__1l9hG .custom-works-student__menu-item-img__3qSAF { flex-shrink: 0; width: 20px; margin-right: 8px; } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-left__3AL-X .custom-works-student__modal-body-left-scroll__2a4W2 .custom-works-student__modal-body-left-inner__Dxe2g .custom-works-student__menu-item__1l9hG .custom-works-student__menu-item-label__1W-jj { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-main__1Z2pt { padding: calc(12px) 0; } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-main__1Z2pt .custom-works-student__modal-body-main-scroll__XkaCh { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-main__1Z2pt .custom-works-student__modal-body-main-scroll__XkaCh .custom-works-student__modal-body-main-inner__3DviN { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-main__1Z2pt .custom-works-student__modal-body-main-scroll__XkaCh .custom-works-student__modal-body-main-inner__3DviN .custom-works-student__selector-btn-add__2UQpg, .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-main__1Z2pt .custom-works-student__modal-body-main-scroll__XkaCh .custom-works-student__modal-body-main-inner__3DviN .custom-works-student__selector-btn-item__1hBkt { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-main__1Z2pt .custom-works-student__modal-body-main-scroll__XkaCh .custom-works-student__modal-body-main-inner__3DviN .custom-works-student__selector-btn-add__2UQpg:hover, .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-main__1Z2pt .custom-works-student__modal-body-main-scroll__XkaCh .custom-works-student__modal-body-main-inner__3DviN .custom-works-student__selector-btn-item__1hBkt:hover { background-color: #e0e9ff; } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-main__1Z2pt .custom-works-student__modal-body-main-scroll__XkaCh .custom-works-student__modal-body-main-inner__3DviN .custom-works-student__selector-btn-add__2UQpg:active, .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-main__1Z2pt .custom-works-student__modal-body-main-scroll__XkaCh .custom-works-student__modal-body-main-inner__3DviN .custom-works-student__selector-btn-item__1hBkt:active { background-color: #ccdaff; } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-main__1Z2pt .custom-works-student__modal-body-main-scroll__XkaCh .custom-works-student__modal-body-main-inner__3DviN .custom-works-student__selector-btn-add__2UQpg:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-main__1Z2pt .custom-works-student__modal-body-main-scroll__XkaCh .custom-works-student__modal-body-main-inner__3DviN .custom-works-student__selector-btn-add__2UQpg:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-main__1Z2pt .custom-works-student__modal-body-main-scroll__XkaCh .custom-works-student__modal-body-main-inner__3DviN .custom-works-student__selector-btn-add__2UQpg .custom-works-student__add-img__gvAdv { font-size: 28px; height: auto; margin-bottom: 8px; } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-main__1Z2pt .custom-works-student__modal-body-main-scroll__XkaCh .custom-works-student__modal-body-main-inner__3DviN .custom-works-student__selector-btn-add__2UQpg .custom-works-student__add-label__i7xQ7 { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-main__1Z2pt .custom-works-student__modal-body-main-scroll__XkaCh .custom-works-student__modal-body-main-inner__3DviN .custom-works-student__selector-btn-item__1hBkt { justify-content: space-between; } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-main__1Z2pt .custom-works-student__modal-body-main-scroll__XkaCh .custom-works-student__modal-body-main-inner__3DviN .custom-works-student__selector-btn-item__1hBkt .custom-works-student__item-img__33FVa { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-main__1Z2pt .custom-works-student__modal-body-main-scroll__XkaCh .custom-works-student__modal-body-main-inner__3DviN .custom-works-student__selector-btn-item__1hBkt .custom-works-student__item-img__33FVa img { width: auto; height: 105px; } .custom-works-student__modal-body__3pCfX .custom-works-student__modal-body-main__1Z2pt .custom-works-student__modal-body-main-scroll__XkaCh .custom-works-student__modal-body-main-inner__3DviN .custom-works-student__selector-btn-item__1hBkt .custom-works-student__item-label__3dS5k { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .custom-works-student__modal-footer__2CWbe { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .custom-works-student__selector-btn-add__2UQpg, .custom-works-student__selector-btn-item__1hBkt { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .custom-works-student__selector-btn-add__2UQpg { background-color: var(--selector-sprite-bg_primary); } .custom-works-student__selector-btn-add__2UQpg:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .custom-works-student__selector-btn-add__2UQpg:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .custom-works-student__selector-btn-add__2UQpg .custom-works-student__add-img__gvAdv { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .custom-works-student__selector-btn-add__2UQpg .custom-works-student__add-label__i7xQ7 { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .custom-works-student__selector-btn-item__1hBkt { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .custom-works-student__selector-btn-item__1hBkt .custom-works-student__item-img__33FVa { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .custom-works-student__selector-btn-item__1hBkt .custom-works-student__item-img__33FVa img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .custom-works-student__selector-btn-item__1hBkt .custom-works-student__item-label__3dS5k { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .custom-works-student__selector-btn-item__1hBkt:hover { background-color: var(--selector-sprite-bg_primary); } .custom-works-student__selector-btn-item__1hBkt:hover .custom-works-student__item-img__33FVa { border-color: var(--selector-sprite-bg_primary); } .custom-works-student__selector-btn-item_selected__joopp { background-color: var(--selector-sprite-bg_primary); } .custom-works-student__selector-btn-item_selected__joopp .custom-works-student__item-img__33FVa { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .custom-works-student__menu-bar-btn__1D_1c { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .custom-works-student__menu-bar-btn_green__It1is, .custom-works-student__menu-bar-btn_create__1YQ1E { background-color: #3cdc8f; } .custom-works-student__menu-bar-btn_green__It1is:hover, .custom-works-student__menu-bar-btn_create__1YQ1E:hover { background-color: #00d374; } .custom-works-student__menu-bar-btn_green__It1is:active, .custom-works-student__menu-bar-btn_create__1YQ1E:active { background-color: #00d374; } .custom-works-student__menu-bar-btn_save__3eg-U, .custom-works-student__menu-bar-btn_reset__2Ts-G { background-color: #6ac8ff; } .custom-works-student__menu-bar-btn_save__3eg-U:hover, .custom-works-student__menu-bar-btn_reset__2Ts-G:hover { background-color: #57bcfe; } .custom-works-student__menu-bar-btn_save__3eg-U:active, .custom-works-student__menu-bar-btn_reset__2Ts-G:active { background-color: #4fb0fc; } .custom-works-student__menu-bar-btn_submit__1MkBb, .custom-works-student__menu-bar-btn_open__3Do3f { background-color: #ff9e23; } .custom-works-student__menu-bar-btn_submit__1MkBb:hover, .custom-works-student__menu-bar-btn_open__3Do3f:hover { background-color: #f47b04; } .custom-works-student__menu-bar-btn_submit__1MkBb:active, .custom-works-student__menu-bar-btn_open__3Do3f:active { background-color: #fe8f22; } .custom-works-student__menu-bar-btn_link__2RkmK { background-color: #e8efff; color: var(--theme-primary); } .custom-works-student__menu-bar-btn_link__2RkmK:hover { background-color: #b6c7ff; } .custom-works-student__menu-bar-btn_link__2RkmK:active { background-color: #cfdcff; } .custom-works-student__menu-bar-btn_disabled__2IB-- { color: #565266; background-color: #e6e9ed; } .custom-works-student__menu-bar-btn_disabled__2IB--:hover { cursor: not-allowed; } .custom-works-student__menu-bar-btn_help__10Lpb { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .custom-works-student__menu-bar-btn_help__10Lpb:hover { background-color: #8398ff; } .custom-works-student__menu-bar-btn_help__10Lpb:active { background-color: #8ca3ff; } .custom-works-student__menu-bar-separator__1IwhH { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .custom-works-student__works-modal__3F-dW { position: relative; display: flex; flex-direction: column; width: 1000px; height: 616px; background-color: #f3f5ff; overflow: hidden; border-radius: 16px; } .custom-works-student__workModal-header__QkTns { width: 100%; height: 58px; padding: 10px 0 0 40px; background-color: var(--theme-primary); background-size: 100%; } .custom-works-student__workModal-header__QkTns .custom-works-student__workModal-header-tabs___Sqb1 { display: flex; justify-content: space-between; align-items: center; width: 630px; font-size: 20px; font-weight: bold; } .custom-works-student__workModal-header__QkTns .custom-works-student__workModal-header-tabs___Sqb1 .custom-works-student__workModal-header-tab__29mik { position: relative; display: flex; justify-content: space-between; align-items: center; width: 190px; height: 48px; padding: 4px 30px 0 30px; color: #ffffff; border-radius: 12px 12px 0 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-student__workModal-header__QkTns .custom-works-student__workModal-header-tabs___Sqb1 .custom-works-student__workModal-header-tab__29mik img { width: 36px; z-index: 2; } .custom-works-student__workModal-header__QkTns .custom-works-student__workModal-header-tabs___Sqb1 .custom-works-student__workModal-header-tab__29mik .custom-works-student__workModal-header-tab-bottom__35pb1 { position: absolute; bottom: 0; left: -12px; width: calc(214px); height: 12px; background-color: var(--theme-primary); } .custom-works-student__workModal-header__QkTns .custom-works-student__workModal-header-tabs___Sqb1 .custom-works-student__workModal-header-tab__29mik::before { position: absolute; left: -24px; bottom: 0px; width: 24px; height: 24px; background-color: var(--theme-primary); border-radius: 50%; content: ''; z-index: 1; } .custom-works-student__workModal-header__QkTns .custom-works-student__workModal-header-tabs___Sqb1 .custom-works-student__workModal-header-tab__29mik::after { position: absolute; right: -24px; bottom: 0px; width: 24px; height: 24px; background-color: var(--theme-primary); border-radius: 50%; content: ''; z-index: 1; } .custom-works-student__workModal-header__QkTns .custom-works-student__workModal-header-tabs___Sqb1 .custom-works-student__workModal-header-tab__29mik:hover { background-color: #8597ff; color: #ffffff; } .custom-works-student__workModal-header__QkTns .custom-works-student__workModal-header-tabs___Sqb1 .custom-works-student__workModal-header-tab__29mik:hover .custom-works-student__workModal-header-tab-bottom__35pb1 { background-color: #8597ff; } .custom-works-student__workModal-header__QkTns .custom-works-student__workModal-header-tabs___Sqb1 .custom-works-student__workModal-header-tab__29mik.custom-works-student__workModal-header-tab-active__3gZ0t { background-color: #f3f5ff; color: var(--theme-primary); } .custom-works-student__workModal-header__QkTns .custom-works-student__workModal-header-tabs___Sqb1 .custom-works-student__workModal-header-tab__29mik.custom-works-student__workModal-header-tab-active__3gZ0t .custom-works-student__workModal-header-tab-bottom__35pb1 { background-color: #f3f5ff; } .custom-works-student__workModal-header__QkTns .custom-works-student__workModal-header-close__XTezT { position: absolute; right: 15px; top: 14px; font-size: 22px; color: #fff; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-student__workModal-header__QkTns .custom-works-student__workModal-header-close__XTezT:hover { color: #98a2b4; } .custom-works-student__workModal-content-tagAndSelect__3CsPO { display: flex; align-items: center; width: 100%; height: 54px; padding: 0 40px; } .custom-works-student__workModal-content-tagAndSelect__3CsPO .custom-works-student__tagAndSelect-tag__JNSc9 { font-size: 18px; font-weight: bold; color: #3d4554; } .custom-works-student__workModal-content-tagAndSelect__3CsPO .custom-works-student__tagAndSelect-selects__2GE3b { margin-left: auto; color: #5e6b81; } .custom-works-student__workModal-content-tagAndSelect__3CsPO .custom-works-student__tagAndSelect-selects__2GE3b .custom-works-student__workModal-select__3CsJw { border-color: #ffffff; border-radius: 15px; } .custom-works-student__workModal-content-tagAndSelect__3CsPO .custom-works-student__tagAndSelect-selects__2GE3b .custom-works-student__workModal-select__3CsJw .ant-select-selector { height: 30px; } .custom-works-student__workModal-content-tagAndSelect__3CsPO .custom-works-student__tagAndSelect-selects__2GE3b .custom-works-student__workModal-header-openfile__mR-6C { display: flex; justify-content: center; align-items: center; height: 30px; line-height: 30px; padding: 0 12px; background-color: #ffffff; font-size: 14px; color: #5e6b81; text-align: center; border-radius: 15px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-student__workModal-content-tagAndSelect__3CsPO .custom-works-student__tagAndSelect-selects__2GE3b .custom-works-student__workModal-header-openfile__mR-6C svg { font-size: 16px; font-weight: bold; margin-right: 6px; } .custom-works-student__workModal-content-tagAndSelect__3CsPO .custom-works-student__tagAndSelect-selects__2GE3b .custom-works-student__workModal-header-openfile__mR-6C:hover { background-color: #e5ebf9; } .custom-works-student__workModal-content-tagAndSelect__3CsPO .custom-works-student__tagAndSelect-selects__2GE3b .custom-works-student__workModal-header-openfile__mR-6C:active { background-color: #d9dfeb; } .workModal-select-drop .ant-select-item-option-content { font-weight: normal; } .custom-works-student__workModal-content-wrap_exercise__CVrCR { flex: 1; display: flex; flex-flow: column; width: 100%; padding: 0; overflow-x: hidden; overflow-y: auto; } .custom-works-student__workModal-content-wrap_exercise__CVrCR .custom-works-student__workModal-main__vKO6V { width: 1000px; padding: 0 40px; } .custom-works-student__workModal-content-wrap_exercise__CVrCR .custom-works-student__workModal-main__vKO6V .custom-works-student__workModal-main-label__2UHzF { height: 30px; line-height: 30px; font-size: 18px; font-weight: bold; color: #3d4554; } .custom-works-student__workModal-content-wrap_exercise__CVrCR .custom-works-student__workModal-main__vKO6V .custom-works-student__workModal-content__25zfK { width: 100%; } .custom-works-student__workModal-content-wrap_exercise__CVrCR .custom-works-student__workModal-main__vKO6V .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8:nth-child(4n) { margin-right: 0; } .custom-works-student__workModal-content-wrap_exercise__CVrCR .custom-works-student__workModal-main__vKO6V .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-main-mask__36_0- { flex-flow: column; } .custom-works-student__workModal-content-wrap_exercise__CVrCR .custom-works-student__workModal-main__vKO6V .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-main-mask__36_0- .custom-works-student__item-main-segment__3zO_t { flex: 1; display: flex; justify-content: center; align-items: center; width: 100%; padding: 0 20px; overflow-x: hidden; text-overflow: ellipsis; white-space: nowrap; } .custom-works-student__workModal-content-wrap_exercise__CVrCR .custom-works-student__workModal-main__vKO6V .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-main-mask__36_0- .custom-works-student__item-main-segment__3zO_t svg { margin-right: 4px; font-size: 16px; } .custom-works-student__workModal-content-wrap_exercise__CVrCR .custom-works-student__workModal-main__vKO6V .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-main-mask__36_0- .custom-works-student__item-main-segment__3zO_t.custom-works-student__item-main-segment_more__2OAgV { justify-content: flex-start; } .custom-works-student__workModal-content-wrap_exercise__CVrCR .custom-works-student__workModal-main__vKO6V .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-main-mask__36_0- .custom-works-student__item-main-segment__3zO_t.custom-works-student__item-main-segment_more__2OAgV:hover { background-color: rgba(0, 0, 0, 0.64); } .custom-works-student__workModal-content-wrap_exercise__CVrCR .custom-works-student__workModal-main__vKO6V .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-main-received__NzMY7 { position: absolute; right: 0; top: 0; width: 64px; height: 22px; line-height: 22px; background-color: var(--theme-primary); font-size: 13px; color: #ffffff; text-align: center; border-top-right-radius: 4px; border-bottom-left-radius: 8px; } .custom-works-student__workModal-content-wrap_exercise__CVrCR .custom-works-student__workModal-main__vKO6V .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-label-status__2f9wi { position: absolute; left: 8px; bottom: 5px; display: flex; align-items: center; height: 22px; padding: 0 4px; background-color: rgba(0, 0, 0, 0.64); font-size: 12px; color: #fff; border-radius: 11px; } .custom-works-student__workModal-content-wrap_exercise__CVrCR .custom-works-student__workModal-main__vKO6V .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-label-status__2f9wi .custom-works-student__workModal-tree-star__2Jra2 { width: 16px; height: 16px; margin-right: 2px; } .custom-works-student__workModal-content-wrap_exercise__CVrCR .custom-works-student__workModal-main__vKO6V .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-label-status__2f9wi .custom-works-student__workModal-tree-star__2Jra2:last-child { margin-right: 0; } .custom-works-student__workModal-content-wrap_exercise__CVrCR .custom-works-student__workModal-main__vKO6V .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-label-status__2f9wi .custom-works-student__workModal-tree-submit__3R_Ol, .custom-works-student__workModal-content-wrap_exercise__CVrCR .custom-works-student__workModal-main__vKO6V .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-label-status__2f9wi .custom-works-student__workModal-tree-save__3bqxg { width: 14px; height: 14px; margin-right: 3px; } .custom-works-student__workModal-content-wrap_work__2fbFx { flex: 1; width: 100%; padding: 0; overflow-x: hidden; overflow-y: auto; } .custom-works-student__workModal-content-wrap_work__2fbFx .custom-works-student__workModal-content__25zfK { width: 1000px; padding: 0 40px; } .custom-works-student__workModal-content-wrap_work__2fbFx .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-main__2ce1B .custom-works-student__item-main-mask__36_0- { justify-content: center; align-items: center; } .custom-works-student__workModal-content-wrap_work__2fbFx .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-main__2ce1B .custom-works-student__item-main-mask__36_0- .custom-works-student__item-main-open__2IUz1 { margin-right: 5px; font-size: 16px; } .custom-works-student__workModal-content-wrap_work__2fbFx .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-main__2ce1B .custom-works-student__item-main-mask__36_0- .custom-works-student__item-main-delete__3PFd6 { position: absolute; top: 8px; right: 8px; display: flex; justify-content: center; align-items: center; width: 24px; height: 24px; background: rgba(255, 255, 255, 0.2); color: #ffffff; border-radius: 6px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-student__workModal-content-wrap_work__2fbFx .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-main__2ce1B .custom-works-student__item-main-mask__36_0- .custom-works-student__item-main-delete__3PFd6:hover { background-color: rgba(255, 255, 255, 0.4); } .custom-works-student__workModal-content-wrap_work__2fbFx .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-main__2ce1B .custom-works-student__item-main-mask__36_0- .custom-works-student__item-main-delete__3PFd6:active { background-color: rgba(255, 255, 255, 0.6); } .custom-works-student__workModal-content-wrap_work__2fbFx .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item_add__1th5D { display: flex; align-items: center; justify-content: center; flex-direction: column; position: relative; width: 218px; height: 157px; margin: 0 14px 14px 0; border: 2px dashed #d1d7e1; border-radius: 12px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-student__workModal-content-wrap_work__2fbFx .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item_add__1th5D .custom-works-student__add-icon__3ViLm { font-size: 30px; font-weight: bold; color: #98a2b4; } .custom-works-student__workModal-content-wrap_work__2fbFx .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item_add__1th5D .custom-works-student__add-label__i7xQ7 { margin-top: 24px; font-size: 14px; color: #5e6b81; } .custom-works-student__workModal-content-wrap_work__2fbFx .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item_add__1th5D:hover { background-color: #eef0fa; } .custom-works-student__workModal-content-wrap_work__2fbFx .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item_add__1th5D:active { background-color: #e7e9f2; } .custom-works-student__examModal-content-wrap_exam__3vWCf { width: 100%; flex: 1; overflow-y: auto; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content-empty__1u5lj { width: 100%; height: 518px; display: flex; flex-direction: column; align-items: center; justify-content: center; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content-empty__1u5lj img { width: 200px; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content-empty__1u5lj span { font-size: 16px; line-height: 16px; color: #5e6b81; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC { min-width: 988px; display: flex; flex-direction: row; flex-wrap: wrap; box-sizing: border-box; padding: 20px 11px 20px 20px; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ { width: 309px; height: 188px; display: flex; flex-direction: column; justify-content: space-between; padding: 19px 16px 13px; margin-right: 15px; margin-bottom: 16px; background: #ffffff; border-radius: 8px; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ:nth-child(3n) { margin-right: 0; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-content__1A6wl { width: 100%; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-content__1A6wl .custom-works-student__item-content_title__2uJfJ { height: 51px; margin-bottom: 6px; font-weight: 600; font-size: 16px; color: #5e6b81; overflow: hidden; text-overflow: ellipsis; white-space: normal; word-break: break-all; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-content__1A6wl .custom-works-student__item-content_title__2uJfJ .custom-works-student__item-content_title_status__1Rvz4 { display: inline-block; padding: 1px 8px; margin-right: 4px; border-radius: 4px; font-weight: 600; font-size: 14px; line-height: 22px; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-content__1A6wl .custom-works-student__item-content_title__2uJfJ .custom-works-student__item-content_title_status__1Rvz4.custom-works-student__pending__2Nxpy { background: #e5ecff; color: #557fff; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-content__1A6wl .custom-works-student__item-content_title__2uJfJ .custom-works-student__item-content_title_status__1Rvz4.custom-works-student__notstart__3qi3o { background: rgba(174, 174, 174, 0.2); color: #aeaeae; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-content__1A6wl .custom-works-student__item-content_title__2uJfJ .custom-works-student__item-content_title_status__1Rvz4.custom-works-student__over__1cl6E { background: rgba(103, 211, 186, 0.2); color: #67d3ba; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-content__1A6wl .custom-works-student__item-content_time__DZ9qC { height: 20px; display: inline-flex; align-items: center; padding: 0 10px 0 6px; margin-bottom: 9px; background: #f3f5fb; border-radius: 20px; font-family: 'PingFang SC'; font-weight: 400; font-size: 14px; line-height: 22px; color: #5e6b81; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-content__1A6wl .custom-works-student__item-content_time__DZ9qC .custom-works-student__icon__ZtfL6 { margin-right: 4px; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-content__1A6wl .custom-works-student__item-content_time__DZ9qC .custom-works-student__time__2ymuu { white-space: nowrap; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-content__1A6wl .custom-works-student__item-content_info__3-ZIK { width: 100%; display: flex; flex-direction: row; align-items: center; justify-content: space-between; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-content__1A6wl .custom-works-student__item-content_info__3-ZIK .custom-works-student__info_item__3DZzx { flex: 1; display: flex; flex-direction: row; align-items: center; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-content__1A6wl .custom-works-student__item-content_info__3-ZIK .custom-works-student__info_title__3DCGN { width: 54px; height: 20px; display: flex; align-items: center; padding: 0 6px; margin-right: 6px; background: #f3f5fb; border-radius: 20px; font-family: 'PingFang SC'; font-weight: 400; font-size: 12px; color: #5e6b81; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-content__1A6wl .custom-works-student__item-content_info__3-ZIK .custom-works-student__info_title__3DCGN .custom-works-student__icon__ZtfL6 { margin-right: 4px; font-size: 14px; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-content__1A6wl .custom-works-student__item-content_info__3-ZIK .custom-works-student__info_title__3DCGN .custom-works-student__title__3dUqf { line-height: 20px; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-content__1A6wl .custom-works-student__item-content_info__3-ZIK .custom-works-student__info_main__3QMto { font-family: 'PingFang SC'; font-weight: 400; font-size: 14px; line-height: 22px; color: #5e6b81; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-button__w6LAD { width: 100%; height: 40px; display: flex; align-items: center; justify-content: center; background: #e5ecff; border-radius: 4px; font-weight: 600; font-size: 14px; color: #557fff; cursor: pointer; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-button__w6LAD:hover { background: #c5d4ff; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-button__w6LAD:active { background: #6a7fff; color: #ffffff; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-button__w6LAD.custom-works-student__notstart__3qi3o { background: #efefef; color: #aeaeae; cursor: url(static/cursor/cursor-not-allowed_white.cur), not-allowed; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-button__w6LAD.custom-works-student__notstart__3qi3o:hover { background: #efefef; color: #aeaeae; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-button__w6LAD.custom-works-student__notstart__3qi3o:active { background: #efefef; color: #aeaeae; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-button__w6LAD.custom-works-student__over__1cl6E { background: #f3f5fb; color: #5e6b81; cursor: url(static/cursor/cursor-not-allowed_white.cur), not-allowed; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-button__w6LAD.custom-works-student__over__1cl6E:hover { background: #f3f5fb; color: #5e6b81; } .custom-works-student__examModal-content-wrap_exam__3vWCf .custom-works-student__examModal-content__2VGfC .custom-works-student__examModal-content-item__1-PDJ .custom-works-student__item-button__w6LAD.custom-works-student__over__1cl6E:active { background: #f3f5fb; color: #5e6b81; } .custom-works-student__workModal-content__25zfK { width: 100%; display: flex; flex-wrap: wrap; } .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 { display: flex; flex-direction: column; justify-content: space-between; margin: 0 14px 14px 0; background-color: #ffffff; overflow: hidden; border-radius: 8px; } .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8.custom-works-student__workModal-content-item_dragging__3ASkC { opacity: 0.6; } .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8.custom-works-student__workModal-content-item_mouseover__3sgV_ .custom-works-student__item-main__2ce1B .custom-works-student__item-main-mask__36_0-:hover { opacity: 1; } .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-main__2ce1B { position: relative; width: 218px; height: 123px; background-size: cover; background-position: center; background-repeat: no-repeat; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-main__2ce1B .custom-works-student__item-main-mask__36_0- { position: absolute; width: 100%; left: 0; right: 0; top: 0; bottom: 0; margin: auto; display: flex; background-color: rgba(0, 0, 0, 0.64); font-size: 14px; color: #fff; opacity: 0; } .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-main__2ce1B .custom-works-student__item-main-mask__36_0-:active { color: #98a2b4; } .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-label__3dS5k { display: flex; justify-content: space-between; align-items: center; width: 218px; padding: 0 10px; height: 34px; font-size: 14px; color: #5e6b81; } .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-label__3dS5k .custom-works-student__item-label-text__i4W95 { flex: 1; overflow-x: hidden; text-overflow: ellipsis; white-space: nowrap; } .custom-works-student__workModal-content__25zfK .custom-works-student__workModal-content-item__3v5c8 .custom-works-student__item-label__3dS5k .custom-works-student__item-label-icon__1NrUk { color: #757d8a; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-student__modalDropdown-menu__Uu8q1 { background: #ffffff; box-shadow: 0px 8px 24px rgba(27, 46, 94, 0.08); border-radius: 8px; } .custom-works-student__modalDropdown-menu__Uu8q1 .custom-works-student__modalDropdown-menu-item__1hgAs { padding: 5px 26px; background: #ffffff; color: #5e6b81; font-size: 14px; } .custom-works-student__modalDropdown-menu__Uu8q1 .custom-works-student__modalDropdown-menu-item__1hgAs svg { margin-right: 5px; color: #5e6b81; } .custom-works-student__modalDropdown-menu__Uu8q1 .custom-works-student__modalDropdown-menu-item__1hgAs:hover { background: #ffffff; color: #485874; } .custom-works-student__modalDropdown-menu__Uu8q1 .custom-works-student__modalDropdown-menu-item__1hgAs:hover svg { color: #485874; } .custom-works-student__modalDropdown-menu__Uu8q1 .custom-works-student__modalDropdown-menu-item__1hgAs:active { color: #3c485c; } .custom-works-student__modalDropdown-menu__Uu8q1 .custom-works-student__modalDropdown-menu-item__1hgAs:active svg { color: #3c485c; } .custom-works-student__workModal-content-empty__3-bp0 { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; height: 400px; background-color: transparent; border-radius: 10px; } .custom-works-student__workModal-content-empty__3-bp0 img { width: 200px; height: 200px; } .custom-works-student__workModal-content-empty__3-bp0 span { font-size: 14px; color: #666; text-align: center; } .custom-works-student__workModal-content-empty__3-bp0.custom-works-student__workModal-content-loading__3GFso img { width: 132px; height: auto; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .custom-works-aiEdu__flex-center__3TYIx { display: flex; align-items: center; justify-content: center; } .custom-works-aiEdu__full-filled__3tVjE { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .custom-works-aiEdu__modal-mask__2h-v1 { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .custom-works-aiEdu__modal-mask__2h-v1 .custom-works-aiEdu__modal-wrap__11Bhv { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .custom-works-aiEdu__modal-mask__2h-v1 .custom-works-aiEdu__modal-wrap__11Bhv .custom-works-aiEdu__modal-header-wrap__4uXd7 { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .custom-works-aiEdu__modal-mask__2h-v1 .custom-works-aiEdu__modal-wrap__11Bhv .custom-works-aiEdu__modal-header-wrap__4uXd7 .custom-works-aiEdu__modal-header-bg__3o1Zn { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .custom-works-aiEdu__modal-mask__2h-v1 .custom-works-aiEdu__modal-wrap__11Bhv .custom-works-aiEdu__modal-header-wrap__4uXd7 .custom-works-aiEdu__modal-header-label__1vnUx { flex-shrink: 0; font-size: 16px; font-weight: bold; } .custom-works-aiEdu__modal-mask__2h-v1 .custom-works-aiEdu__modal-wrap__11Bhv .custom-works-aiEdu__modal-header-wrap__4uXd7 .custom-works-aiEdu__modal-header-close__1yCD1 { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-aiEdu__modal-mask__2h-v1 .custom-works-aiEdu__modal-wrap__11Bhv .custom-works-aiEdu__modal-header-wrap__4uXd7 .custom-works-aiEdu__modal-header-close__1yCD1:hover { color: #98a2b4; } .custom-works-aiEdu__modal-mask__2h-v1 .custom-works-aiEdu__modal-wrap__11Bhv .custom-works-aiEdu__modal-body-wrap__1sITM { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .custom-works-aiEdu__modal-mask__2h-v1 .custom-works-aiEdu__modal-wrap__11Bhv .custom-works-aiEdu__modal-footer-wrap__2oemb { flex-shrink: 0; display: flex; } .custom-works-aiEdu__modal-header__1BxEC { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .custom-works-aiEdu__modal-header__1BxEC .custom-works-aiEdu__modal-header-upload__9IMAA { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .custom-works-aiEdu__modal-header__1BxEC .custom-works-aiEdu__modal-header-upload__9IMAA:hover { background-color: #e0e9ff; } .custom-works-aiEdu__modal-header__1BxEC .custom-works-aiEdu__modal-header-upload__9IMAA:active { background-color: #ccdaff; } .custom-works-aiEdu__modal-header__1BxEC .custom-works-aiEdu__modal-header-upload__9IMAA .custom-works-aiEdu__upload-img__2lyZA { font-size: 16px; margin-right: calc(2px); } .custom-works-aiEdu__modal-header__1BxEC .custom-works-aiEdu__modal-header-upload__9IMAA .custom-works-aiEdu__upload-label__CayGf { font-size: 14px; } .custom-works-aiEdu__modal-header__1BxEC .custom-works-aiEdu__modal-header-upload__9IMAA .custom-works-aiEdu__upload-input__3Jpi3 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-aiEdu__modal-header__1BxEC .custom-works-aiEdu__modal-header-search__1pnqq { position: relative; } .custom-works-aiEdu__modal-header__1BxEC .custom-works-aiEdu__modal-header-search__1pnqq .custom-works-aiEdu__search-input__2LGX8 { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .custom-works-aiEdu__modal-header__1BxEC .custom-works-aiEdu__modal-header-search__1pnqq .custom-works-aiEdu__search-input__2LGX8::-webkit-input-placeholder { color: #98a2b4; } .custom-works-aiEdu__modal-header__1BxEC .custom-works-aiEdu__modal-header-search__1pnqq .custom-works-aiEdu__search-input__2LGX8::-moz-placeholder { color: #98a2b4; } .custom-works-aiEdu__modal-header__1BxEC .custom-works-aiEdu__modal-header-search__1pnqq .custom-works-aiEdu__search-input__2LGX8:-ms-input-placeholder { color: #98a2b4; } .custom-works-aiEdu__modal-header__1BxEC .custom-works-aiEdu__modal-header-search__1pnqq .custom-works-aiEdu__search-input__2LGX8:hover { border-color: #d1d7e1; } .custom-works-aiEdu__modal-header__1BxEC .custom-works-aiEdu__modal-header-search__1pnqq .custom-works-aiEdu__search-input__2LGX8:active { border-color: #d1d7e1; } .custom-works-aiEdu__modal-header__1BxEC .custom-works-aiEdu__modal-header-search__1pnqq .custom-works-aiEdu__search-img__2z4wC { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-aiEdu__modal-body__1evGF { flex-grow: 1; display: flex; } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-left__2HbVX, .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-main__1hEmK { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-left__2HbVX { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-left__2HbVX .custom-works-aiEdu__modal-body-left-scroll__OBlwQ { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-left__2HbVX .custom-works-aiEdu__modal-body-left-scroll__OBlwQ .custom-works-aiEdu__modal-body-left-inner__p46Sj { width: 121px; padding: calc(12px); color: #5e6b81; } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-left__2HbVX .custom-works-aiEdu__modal-body-left-scroll__OBlwQ .custom-works-aiEdu__modal-body-left-inner__p46Sj .custom-works-aiEdu__menu-item-current__1uYVI { color: var(--theme-primary); background-color: #e0e9ff; } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-left__2HbVX .custom-works-aiEdu__modal-body-left-scroll__OBlwQ .custom-works-aiEdu__modal-body-left-inner__p46Sj .custom-works-aiEdu__menu-item__s4-z7 { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-left__2HbVX .custom-works-aiEdu__modal-body-left-scroll__OBlwQ .custom-works-aiEdu__modal-body-left-inner__p46Sj .custom-works-aiEdu__menu-item__s4-z7:hover { background-color: #edeff5; } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-left__2HbVX .custom-works-aiEdu__modal-body-left-scroll__OBlwQ .custom-works-aiEdu__modal-body-left-inner__p46Sj .custom-works-aiEdu__menu-item__s4-z7 .custom-works-aiEdu__menu-item-img__1_Bn3 { flex-shrink: 0; width: 20px; margin-right: 8px; } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-left__2HbVX .custom-works-aiEdu__modal-body-left-scroll__OBlwQ .custom-works-aiEdu__modal-body-left-inner__p46Sj .custom-works-aiEdu__menu-item__s4-z7 .custom-works-aiEdu__menu-item-label__gGbTz { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-main__1hEmK { padding: calc(12px) 0; } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-main__1hEmK .custom-works-aiEdu__modal-body-main-scroll__2hGef { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-main__1hEmK .custom-works-aiEdu__modal-body-main-scroll__2hGef .custom-works-aiEdu__modal-body-main-inner__1fqCA { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-main__1hEmK .custom-works-aiEdu__modal-body-main-scroll__2hGef .custom-works-aiEdu__modal-body-main-inner__1fqCA .custom-works-aiEdu__selector-btn-add__3R6y3, .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-main__1hEmK .custom-works-aiEdu__modal-body-main-scroll__2hGef .custom-works-aiEdu__modal-body-main-inner__1fqCA .custom-works-aiEdu__selector-btn-item__M8Q64 { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-main__1hEmK .custom-works-aiEdu__modal-body-main-scroll__2hGef .custom-works-aiEdu__modal-body-main-inner__1fqCA .custom-works-aiEdu__selector-btn-add__3R6y3:hover, .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-main__1hEmK .custom-works-aiEdu__modal-body-main-scroll__2hGef .custom-works-aiEdu__modal-body-main-inner__1fqCA .custom-works-aiEdu__selector-btn-item__M8Q64:hover { background-color: #e0e9ff; } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-main__1hEmK .custom-works-aiEdu__modal-body-main-scroll__2hGef .custom-works-aiEdu__modal-body-main-inner__1fqCA .custom-works-aiEdu__selector-btn-add__3R6y3:active, .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-main__1hEmK .custom-works-aiEdu__modal-body-main-scroll__2hGef .custom-works-aiEdu__modal-body-main-inner__1fqCA .custom-works-aiEdu__selector-btn-item__M8Q64:active { background-color: #ccdaff; } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-main__1hEmK .custom-works-aiEdu__modal-body-main-scroll__2hGef .custom-works-aiEdu__modal-body-main-inner__1fqCA .custom-works-aiEdu__selector-btn-add__3R6y3:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-main__1hEmK .custom-works-aiEdu__modal-body-main-scroll__2hGef .custom-works-aiEdu__modal-body-main-inner__1fqCA .custom-works-aiEdu__selector-btn-add__3R6y3:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-main__1hEmK .custom-works-aiEdu__modal-body-main-scroll__2hGef .custom-works-aiEdu__modal-body-main-inner__1fqCA .custom-works-aiEdu__selector-btn-add__3R6y3 .custom-works-aiEdu__add-img__3onkz { font-size: 28px; height: auto; margin-bottom: 8px; } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-main__1hEmK .custom-works-aiEdu__modal-body-main-scroll__2hGef .custom-works-aiEdu__modal-body-main-inner__1fqCA .custom-works-aiEdu__selector-btn-add__3R6y3 .custom-works-aiEdu__add-label__l4ZtE { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-main__1hEmK .custom-works-aiEdu__modal-body-main-scroll__2hGef .custom-works-aiEdu__modal-body-main-inner__1fqCA .custom-works-aiEdu__selector-btn-item__M8Q64 { justify-content: space-between; } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-main__1hEmK .custom-works-aiEdu__modal-body-main-scroll__2hGef .custom-works-aiEdu__modal-body-main-inner__1fqCA .custom-works-aiEdu__selector-btn-item__M8Q64 .custom-works-aiEdu__item-img__36QSu { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-main__1hEmK .custom-works-aiEdu__modal-body-main-scroll__2hGef .custom-works-aiEdu__modal-body-main-inner__1fqCA .custom-works-aiEdu__selector-btn-item__M8Q64 .custom-works-aiEdu__item-img__36QSu img { width: auto; height: 105px; } .custom-works-aiEdu__modal-body__1evGF .custom-works-aiEdu__modal-body-main__1hEmK .custom-works-aiEdu__modal-body-main-scroll__2hGef .custom-works-aiEdu__modal-body-main-inner__1fqCA .custom-works-aiEdu__selector-btn-item__M8Q64 .custom-works-aiEdu__item-label__3JhVo { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .custom-works-aiEdu__modal-footer__18bvN { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .custom-works-aiEdu__selector-btn-add__3R6y3, .custom-works-aiEdu__selector-btn-item__M8Q64 { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .custom-works-aiEdu__selector-btn-add__3R6y3 { background-color: var(--selector-sprite-bg_primary); } .custom-works-aiEdu__selector-btn-add__3R6y3:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .custom-works-aiEdu__selector-btn-add__3R6y3:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .custom-works-aiEdu__selector-btn-add__3R6y3 .custom-works-aiEdu__add-img__3onkz { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .custom-works-aiEdu__selector-btn-add__3R6y3 .custom-works-aiEdu__add-label__l4ZtE { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .custom-works-aiEdu__selector-btn-item__M8Q64 { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .custom-works-aiEdu__selector-btn-item__M8Q64 .custom-works-aiEdu__item-img__36QSu { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .custom-works-aiEdu__selector-btn-item__M8Q64 .custom-works-aiEdu__item-img__36QSu img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .custom-works-aiEdu__selector-btn-item__M8Q64 .custom-works-aiEdu__item-label__3JhVo { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .custom-works-aiEdu__selector-btn-item__M8Q64:hover { background-color: var(--selector-sprite-bg_primary); } .custom-works-aiEdu__selector-btn-item__M8Q64:hover .custom-works-aiEdu__item-img__36QSu { border-color: var(--selector-sprite-bg_primary); } .custom-works-aiEdu__selector-btn-item_selected__38ffO { background-color: var(--selector-sprite-bg_primary); } .custom-works-aiEdu__selector-btn-item_selected__38ffO .custom-works-aiEdu__item-img__36QSu { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .custom-works-aiEdu__menu-bar-btn__1eNKA { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .custom-works-aiEdu__menu-bar-btn_green__2WPTs, .custom-works-aiEdu__menu-bar-btn_create__1IePt { background-color: #3cdc8f; } .custom-works-aiEdu__menu-bar-btn_green__2WPTs:hover, .custom-works-aiEdu__menu-bar-btn_create__1IePt:hover { background-color: #00d374; } .custom-works-aiEdu__menu-bar-btn_green__2WPTs:active, .custom-works-aiEdu__menu-bar-btn_create__1IePt:active { background-color: #00d374; } .custom-works-aiEdu__menu-bar-btn_save__wcoRl, .custom-works-aiEdu__menu-bar-btn_reset__1lnN9 { background-color: #6ac8ff; } .custom-works-aiEdu__menu-bar-btn_save__wcoRl:hover, .custom-works-aiEdu__menu-bar-btn_reset__1lnN9:hover { background-color: #57bcfe; } .custom-works-aiEdu__menu-bar-btn_save__wcoRl:active, .custom-works-aiEdu__menu-bar-btn_reset__1lnN9:active { background-color: #4fb0fc; } .custom-works-aiEdu__menu-bar-btn_submit__3f-6m, .custom-works-aiEdu__menu-bar-btn_open__Ee5UA { background-color: #ff9e23; } .custom-works-aiEdu__menu-bar-btn_submit__3f-6m:hover, .custom-works-aiEdu__menu-bar-btn_open__Ee5UA:hover { background-color: #f47b04; } .custom-works-aiEdu__menu-bar-btn_submit__3f-6m:active, .custom-works-aiEdu__menu-bar-btn_open__Ee5UA:active { background-color: #fe8f22; } .custom-works-aiEdu__menu-bar-btn_link__1Q_oP { background-color: #e8efff; color: var(--theme-primary); } .custom-works-aiEdu__menu-bar-btn_link__1Q_oP:hover { background-color: #b6c7ff; } .custom-works-aiEdu__menu-bar-btn_link__1Q_oP:active { background-color: #cfdcff; } .custom-works-aiEdu__menu-bar-btn_disabled__1Qqsb { color: #565266; background-color: #e6e9ed; } .custom-works-aiEdu__menu-bar-btn_disabled__1Qqsb:hover { cursor: not-allowed; } .custom-works-aiEdu__menu-bar-btn_help__1J4xI { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .custom-works-aiEdu__menu-bar-btn_help__1J4xI:hover { background-color: #8398ff; } .custom-works-aiEdu__menu-bar-btn_help__1J4xI:active { background-color: #8ca3ff; } .custom-works-aiEdu__menu-bar-separator__2lDFD { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .custom-works-aiEdu__works-modal__DC50k { position: relative; display: flex; flex-direction: column; width: 842px; height: 497px; background-color: #ffffff; border-radius: 12px; } .custom-works-aiEdu__workModal-header__12tY8 { display: flex; justify-content: space-between; align-items: center; width: 100%; height: 41px; padding: 0 48px 0 20px; border-bottom: 1px solid #e8efff; font-size: 16px; } .custom-works-aiEdu__workModal-header__12tY8 .custom-works-aiEdu__workModal-header-tabs__2FO0t { display: flex; justify-content: space-between; align-items: center; } .custom-works-aiEdu__workModal-header__12tY8 .custom-works-aiEdu__workModal-header-tabs__2FO0t .custom-works-aiEdu__workModal-header-tab__3GvrL { position: relative; display: flex; align-items: center; width: 64px; margin-right: 24px; line-height: 40px; color: #5e6b81; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-aiEdu__workModal-header__12tY8 .custom-works-aiEdu__workModal-header-tabs__2FO0t .custom-works-aiEdu__workModal-header-tab__3GvrL:hover { color: var(--theme-primary); } .custom-works-aiEdu__workModal-header__12tY8 .custom-works-aiEdu__workModal-header-tabs__2FO0t .custom-works-aiEdu__workModal-header-tab__3GvrL.custom-works-aiEdu__workModal-header-tab-active__3ooLm { font-weight: bold; color: var(--theme-primary); } .custom-works-aiEdu__workModal-header__12tY8 .custom-works-aiEdu__workModal-header-tabs__2FO0t .custom-works-aiEdu__workModal-header-tab__3GvrL.custom-works-aiEdu__workModal-header-tab-active__3ooLm::before { position: absolute; left: 50%; bottom: 0px; transform: translateX(-50%); width: 16px; height: 3px; background-color: var(--theme-primary); border-radius: 2px; content: ''; } .custom-works-aiEdu__workModal-header__12tY8 .custom-works-aiEdu__workModal-header-openfile__2B2X7 { display: flex; justify-content: center; align-items: center; height: 24px; line-height: 24px; padding: 0 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .custom-works-aiEdu__workModal-header__12tY8 .custom-works-aiEdu__workModal-header-openfile__2B2X7 svg { font-size: 14px; margin-right: 4px; } .custom-works-aiEdu__workModal-header__12tY8 .custom-works-aiEdu__workModal-header-openfile__2B2X7:hover { background-color: #e0e9ff; } .custom-works-aiEdu__workModal-header__12tY8 .custom-works-aiEdu__workModal-header-openfile__2B2X7:active { background-color: #ccdaff; } .custom-works-aiEdu__workModal-header__12tY8 .custom-works-aiEdu__workModal-select-wrap__BWMLY .custom-works-aiEdu__workModal-select__3l_FE { width: 228px; height: 24px; font-size: 14px; } .custom-works-aiEdu__workModal-header__12tY8 .custom-works-aiEdu__workModal-select-wrap__BWMLY .custom-works-aiEdu__workModal-select__3l_FE .ant-select-selector { height: 24px; padding: 0 8px; } .custom-works-aiEdu__workModal-header__12tY8 .custom-works-aiEdu__workModal-select-wrap__BWMLY .custom-works-aiEdu__workModal-select__3l_FE .ant-select-selector .ant-select-selection-item { padding-right: 0; line-height: 24px; } .custom-works-aiEdu__workModal-header__12tY8 .custom-works-aiEdu__workModal-header-close__Xa9DL { position: absolute; right: 15px; top: 14px; font-size: 16px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-aiEdu__workModal-header__12tY8 .custom-works-aiEdu__workModal-header-close__Xa9DL:hover { color: #98a2b4; } .custom-works-aiEdu__works-modal__DC50k .custom-works-aiEdu__workModal-select__3l_FE { color: #5e6b81; } .custom-works-aiEdu__works-modal__DC50k .custom-works-aiEdu__workModal-select__3l_FE .ant-select-selector { z-index: 47; background-color: transparent; border-color: #e8efff; border-radius: 4px; } .custom-works-aiEdu__works-modal__DC50k .custom-works-aiEdu__workModal-select__3l_FE .ant-select-arrow { top: 48%; } .custom-works-aiEdu__works-modal__DC50k .custom-works-aiEdu__workModal-select__3l_FE .ant-select-arrow svg { font-size: 14px; color: #5e6b81; } .workModal-select-drop .ant-select-item-option-content { font-weight: normal; } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT { flex: 1; display: flex; overflow: hidden; } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-left__2sXS9 { display: flex; flex-flow: column; width: 237px; height: 100%; padding: 12px 0; border-right: 1px solid #e8efff; } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-left__2sXS9 .custom-works-aiEdu__workModal-content-left-course__73eQe { width: calc(213px); margin: 0 auto; padding-bottom: 12px; border-bottom: 1px solid #e8efff; } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-left__2sXS9 .custom-works-aiEdu__workModal-content-left-course__73eQe .custom-works-aiEdu__workModal-select__3l_FE { width: 100%; font-size: 14px; } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-left__2sXS9 .custom-works-aiEdu__workModal-content-left-main__3brjx { flex: 1; width: 237px; padding: 12px 12px 0; overflow-y: auto; } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-left__2sXS9 .custom-works-aiEdu__workModal-content-left-main__3brjx .custom-works-aiEdu__workModal-content-lesson__1CiE0 { display: flex; justify-content: space-between; align-items: center; width: 100%; margin-bottom: 8px; padding: 0 8px; color: #5e6b81; border-radius: 4px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-left__2sXS9 .custom-works-aiEdu__workModal-content-left-main__3brjx .custom-works-aiEdu__workModal-content-lesson__1CiE0 .custom-works-aiEdu__workModal-content-lesson-name__3tqjD { flex: 1; height: 30px; line-height: 30px; font-size: 14px; overflow-x: hidden; text-overflow: ellipsis; white-space: nowrap; } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-left__2sXS9 .custom-works-aiEdu__workModal-content-left-main__3brjx .custom-works-aiEdu__workModal-content-lesson__1CiE0 .custom-works-aiEdu__workModal-content-lesson-finished__9RkMp, .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-left__2sXS9 .custom-works-aiEdu__workModal-content-left-main__3brjx .custom-works-aiEdu__workModal-content-lesson__1CiE0 .custom-works-aiEdu__workModal-content-lesson-received__3x3rx { width: 42px; height: 16px; line-height: 16px; background-color: #e0e9ff; font-size: 12px; color: var(--theme-primary); text-align: center; border-radius: 2px; } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-left__2sXS9 .custom-works-aiEdu__workModal-content-left-main__3brjx .custom-works-aiEdu__workModal-content-lesson__1CiE0 .custom-works-aiEdu__workModal-content-lesson-received__3x3rx { width: 54px; } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-left__2sXS9 .custom-works-aiEdu__workModal-content-left-main__3brjx .custom-works-aiEdu__workModal-content-lesson__1CiE0.custom-works-aiEdu__workModal-content-lesson-active__N-kRW { background-color: #f0f4ff; color: var(--theme-primary); } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-left__2sXS9 .custom-works-aiEdu__workModal-content-left-main__3brjx .custom-works-aiEdu__workModal-content-lesson__1CiE0:hover { background-color: #edeff5; } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-right__wqI8E { flex: 1; display: flex; padding: 10px 0 10px 10px; overflow: hidden; } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-right__wqI8E .custom-works-aiEdu__workModal-content-right-main__32Cc- { display: flex; flex-direction: column; width: calc(596px); padding-right: 10px; overflow-y: auto; } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-right__wqI8E .custom-works-aiEdu__workModal-content-right-main__32Cc- .custom-works-aiEdu__workModal-content-label__1otF0 { position: relative; width: 100%; height: 14px; line-height: 14px; padding-left: 10px; margin-bottom: 12px; font-weight: bold; color: #3d4554; } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-right__wqI8E .custom-works-aiEdu__workModal-content-right-main__32Cc- .custom-works-aiEdu__workModal-content-label__1otF0::before { position: absolute; left: 0; top: 0; width: 4px; height: 14px; background-color: var(--theme-primary); border-radius: 2px; content: ''; } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-right__wqI8E .custom-works-aiEdu__workModal-content-right-main__32Cc- .custom-works-aiEdu__workModal-content-label__1otF0.custom-works-aiEdu__workModal-content-label_complete__3ULcP { margin-top: 20px; } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-right__wqI8E .custom-works-aiEdu__workModal-content-right-main__32Cc- .custom-works-aiEdu__workModal-content-label__1otF0.custom-works-aiEdu__workModal-content-label_complete__3ULcP::before { background-color: #fc8230; } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-right__wqI8E .custom-works-aiEdu__workModal-content-right-main__32Cc- .custom-works-aiEdu__workModal-content__2nNp7 { width: calc(585px); } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-right__wqI8E .custom-works-aiEdu__workModal-content-right-main__32Cc- .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item__38DfT { margin-right: 12px; } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-right__wqI8E .custom-works-aiEdu__workModal-content-right-main__32Cc- .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item__38DfT .custom-works-aiEdu__item-main__NoINA { width: 186px; height: 104px; box-shadow: 0 -30px 10px -6px rgba(0, 0, 0, 0.4) inset; } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-right__wqI8E .custom-works-aiEdu__workModal-content-right-main__32Cc- .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item__38DfT:nth-child(3n) { margin-right: 0; } .custom-works-aiEdu__workModal-content-wrap_scroll_exercise__t23JT .custom-works-aiEdu__workModal-content-right__wqI8E .custom-works-aiEdu__workModal-content-right-main__32Cc- .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item__38DfT .custom-works-aiEdu__item-label__3JhVo { width: 186px; } .custom-works-aiEdu__workModal-content__2nNp7 { width: 100%; display: flex; flex-wrap: wrap; } .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item__38DfT { display: flex; flex-direction: column; justify-content: space-between; margin-right: 10px; } .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item__38DfT.custom-works-aiEdu__workModal-content-item_dragging__29ikt { opacity: 0.6; } .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item__38DfT.custom-works-aiEdu__workModal-content-item_mouseover__2F3Sd .custom-works-aiEdu__item-main__NoINA .custom-works-aiEdu__item-main-mask__3w5z-:hover { opacity: 1; } .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item__38DfT .custom-works-aiEdu__item-main__NoINA { position: relative; width: 196px; height: 110px; background-size: cover; background-position: center; background-repeat: no-repeat; overflow: hidden; border-radius: 4px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item__38DfT .custom-works-aiEdu__item-main__NoINA .custom-works-aiEdu__item-main-mask__3w5z- { position: absolute; width: 100%; left: 0; right: 0; top: 0; bottom: 0; margin: auto; display: flex; justify-content: center; align-items: center; background-color: rgba(0, 0, 0, 0.64); font-size: 14px; color: #fff; opacity: 0; border-radius: 4px; } .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item__38DfT .custom-works-aiEdu__item-main__NoINA .custom-works-aiEdu__item-main-mask__3w5z- .custom-works-aiEdu__item-main-open__1u3St { margin-right: 5px; font-size: 16px; } .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item__38DfT .custom-works-aiEdu__item-main__NoINA .custom-works-aiEdu__item-main-mask__3w5z- .custom-works-aiEdu__item-main-delete__2xzzW { position: absolute; top: 8px; right: 8px; display: flex; justify-content: center; align-items: center; width: 24px; height: 24px; background: rgba(255, 255, 255, 0.2); color: #ffffff; border-radius: 6px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item__38DfT .custom-works-aiEdu__item-main__NoINA .custom-works-aiEdu__item-main-mask__3w5z- .custom-works-aiEdu__item-main-delete__2xzzW:hover { background-color: rgba(255, 255, 255, 0.4); } .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item__38DfT .custom-works-aiEdu__item-main__NoINA .custom-works-aiEdu__item-main-mask__3w5z- .custom-works-aiEdu__item-main-delete__2xzzW:active { background-color: rgba(255, 255, 255, 0.6); } .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item__38DfT .custom-works-aiEdu__item-main__NoINA .custom-works-aiEdu__item-main-mask__3w5z-:active { color: #98a2b4; } .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item__38DfT .custom-works-aiEdu__item-label__3JhVo { display: flex; justify-content: space-between; align-items: center; width: 196px; height: 26px; margin: 6px 0 14px; font-size: 14px; color: #5e6b81; } .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item__38DfT .custom-works-aiEdu__item-label__3JhVo .custom-works-aiEdu__item-label-text__1kmwq { flex: 1; overflow-x: hidden; text-overflow: ellipsis; white-space: nowrap; } .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item__38DfT .custom-works-aiEdu__item-label__3JhVo .custom-works-aiEdu__item-label-icon__1NFMD { color: #757d8a; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item_add__32uZh { display: flex; align-items: center; justify-content: center; flex-direction: column; position: relative; width: 196px; height: 110px; margin-right: 10px; background-color: #f0f4ff; border: 1px dashed #b6c7ff; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item_add__32uZh .custom-works-aiEdu__add-icon__1q0Y4 { width: 16px; } .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item_add__32uZh .custom-works-aiEdu__add-label__l4ZtE { margin-top: 20px; font-size: 14px; color: var(--theme-primary); } .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item_add__32uZh:hover { background-color: #e0e9ff; } .custom-works-aiEdu__workModal-content__2nNp7 .custom-works-aiEdu__workModal-content-item_add__32uZh:active { background-color: #ccdaff; } .custom-works-aiEdu__modalDropdown-menu__2adJD { background: #ffffff; box-shadow: 0px 8px 24px rgba(27, 46, 94, 0.08); border-radius: 8px; } .custom-works-aiEdu__modalDropdown-menu__2adJD .custom-works-aiEdu__modalDropdown-menu-item__2kdBL { padding: 5px 26px; background: #ffffff; color: #5e6b81; font-size: 14px; } .custom-works-aiEdu__modalDropdown-menu__2adJD .custom-works-aiEdu__modalDropdown-menu-item__2kdBL svg { margin-right: 5px; color: #5e6b81; } .custom-works-aiEdu__modalDropdown-menu__2adJD .custom-works-aiEdu__modalDropdown-menu-item__2kdBL:hover { background: #ffffff; color: #485874; } .custom-works-aiEdu__modalDropdown-menu__2adJD .custom-works-aiEdu__modalDropdown-menu-item__2kdBL:hover svg { color: #485874; } .custom-works-aiEdu__modalDropdown-menu__2adJD .custom-works-aiEdu__modalDropdown-menu-item__2kdBL:active { color: #3c485c; } .custom-works-aiEdu__modalDropdown-menu__2adJD .custom-works-aiEdu__modalDropdown-menu-item__2kdBL:active svg { color: #3c485c; } .custom-works-aiEdu__workModal-content-empty__3yBoW { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; height: 400px; background-color: transparent; border-radius: 10px; } .custom-works-aiEdu__workModal-content-empty__3yBoW img { width: 200px; height: 200px; } .custom-works-aiEdu__workModal-content-empty__3yBoW span { font-size: 14px; color: #666; text-align: center; } .custom-works-aiEdu__workModal-content-empty__3yBoW.custom-works-aiEdu__workModal-content-loading__17HaY img { width: 132px; height: auto; } .custom-works-aiEdu__workModal-content-wrap_scroll__xSAE_ { flex: 1; width: 842px; padding: 12px; overflow-x: hidden; overflow-y: auto; } .custom-works-aiEdu__workModal-content-wrap_scroll__xSAE_ .custom-works-aiEdu__workModal-content__2nNp7 { width: calc(818px); } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .mark-modal__flex-center__uziP9 { display: flex; align-items: center; justify-content: center; } .mark-modal__full-filled__3xp4w { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .mark-modal__modal-mask__2ViGG { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .mark-modal__modal-mask__2ViGG .mark-modal__modal-wrap__2BKdM { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .mark-modal__modal-mask__2ViGG .mark-modal__modal-wrap__2BKdM .mark-modal__modal-header-wrap__uqBlY { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .mark-modal__modal-mask__2ViGG .mark-modal__modal-wrap__2BKdM .mark-modal__modal-header-wrap__uqBlY .mark-modal__modal-header-bg__8MAtJ { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .mark-modal__modal-mask__2ViGG .mark-modal__modal-wrap__2BKdM .mark-modal__modal-header-wrap__uqBlY .mark-modal__modal-header-label__3GyAC { flex-shrink: 0; font-size: 16px; font-weight: bold; } .mark-modal__modal-mask__2ViGG .mark-modal__modal-wrap__2BKdM .mark-modal__modal-header-wrap__uqBlY .mark-modal__modal-header-close__3LQ45 { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mark-modal__modal-mask__2ViGG .mark-modal__modal-wrap__2BKdM .mark-modal__modal-header-wrap__uqBlY .mark-modal__modal-header-close__3LQ45:hover { color: #98a2b4; } .mark-modal__modal-mask__2ViGG .mark-modal__modal-wrap__2BKdM .mark-modal__modal-body-wrap__2uu4O { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .mark-modal__modal-mask__2ViGG .mark-modal__modal-wrap__2BKdM .mark-modal__modal-footer-wrap__2Sl6G { flex-shrink: 0; display: flex; } .mark-modal__modal-header__1gY3m { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .mark-modal__modal-header__1gY3m .mark-modal__modal-header-upload__KLzFf { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .mark-modal__modal-header__1gY3m .mark-modal__modal-header-upload__KLzFf:hover { background-color: #e0e9ff; } .mark-modal__modal-header__1gY3m .mark-modal__modal-header-upload__KLzFf:active { background-color: #ccdaff; } .mark-modal__modal-header__1gY3m .mark-modal__modal-header-upload__KLzFf .mark-modal__upload-img__ierRS { font-size: 16px; margin-right: calc(2px); } .mark-modal__modal-header__1gY3m .mark-modal__modal-header-upload__KLzFf .mark-modal__upload-label__31UwU { font-size: 14px; } .mark-modal__modal-header__1gY3m .mark-modal__modal-header-upload__KLzFf .mark-modal__upload-input__1drpI { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mark-modal__modal-header__1gY3m .mark-modal__modal-header-search__-qHGd { position: relative; } .mark-modal__modal-header__1gY3m .mark-modal__modal-header-search__-qHGd .mark-modal__search-input__1Cyfo { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .mark-modal__modal-header__1gY3m .mark-modal__modal-header-search__-qHGd .mark-modal__search-input__1Cyfo::-webkit-input-placeholder { color: #98a2b4; } .mark-modal__modal-header__1gY3m .mark-modal__modal-header-search__-qHGd .mark-modal__search-input__1Cyfo::-moz-placeholder { color: #98a2b4; } .mark-modal__modal-header__1gY3m .mark-modal__modal-header-search__-qHGd .mark-modal__search-input__1Cyfo:-ms-input-placeholder { color: #98a2b4; } .mark-modal__modal-header__1gY3m .mark-modal__modal-header-search__-qHGd .mark-modal__search-input__1Cyfo:hover { border-color: #d1d7e1; } .mark-modal__modal-header__1gY3m .mark-modal__modal-header-search__-qHGd .mark-modal__search-input__1Cyfo:active { border-color: #d1d7e1; } .mark-modal__modal-header__1gY3m .mark-modal__modal-header-search__-qHGd .mark-modal__search-img__1nXU3 { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mark-modal__modal-body__CZWCV { flex-grow: 1; display: flex; } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-left__2OCoW, .mark-modal__modal-body__CZWCV .mark-modal__modal-body-main__3ce6d { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-left__2OCoW { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-left__2OCoW .mark-modal__modal-body-left-scroll__HBuRl { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-left__2OCoW .mark-modal__modal-body-left-scroll__HBuRl .mark-modal__modal-body-left-inner__2URbR { width: 121px; padding: calc(12px); color: #5e6b81; } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-left__2OCoW .mark-modal__modal-body-left-scroll__HBuRl .mark-modal__modal-body-left-inner__2URbR .mark-modal__menu-item-current__3nrU1 { color: var(--theme-primary); background-color: #e0e9ff; } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-left__2OCoW .mark-modal__modal-body-left-scroll__HBuRl .mark-modal__modal-body-left-inner__2URbR .mark-modal__menu-item__uUr1p { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-left__2OCoW .mark-modal__modal-body-left-scroll__HBuRl .mark-modal__modal-body-left-inner__2URbR .mark-modal__menu-item__uUr1p:hover { background-color: #edeff5; } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-left__2OCoW .mark-modal__modal-body-left-scroll__HBuRl .mark-modal__modal-body-left-inner__2URbR .mark-modal__menu-item__uUr1p .mark-modal__menu-item-img__3hZl9 { flex-shrink: 0; width: 20px; margin-right: 8px; } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-left__2OCoW .mark-modal__modal-body-left-scroll__HBuRl .mark-modal__modal-body-left-inner__2URbR .mark-modal__menu-item__uUr1p .mark-modal__menu-item-label__28jA1 { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-main__3ce6d { padding: calc(12px) 0; } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-main__3ce6d .mark-modal__modal-body-main-scroll__2EIJO { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-main__3ce6d .mark-modal__modal-body-main-scroll__2EIJO .mark-modal__modal-body-main-inner__1VnVS { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-main__3ce6d .mark-modal__modal-body-main-scroll__2EIJO .mark-modal__modal-body-main-inner__1VnVS .mark-modal__selector-btn-add__2Y5Xj, .mark-modal__modal-body__CZWCV .mark-modal__modal-body-main__3ce6d .mark-modal__modal-body-main-scroll__2EIJO .mark-modal__modal-body-main-inner__1VnVS .mark-modal__selector-btn-item__CCp9d { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-main__3ce6d .mark-modal__modal-body-main-scroll__2EIJO .mark-modal__modal-body-main-inner__1VnVS .mark-modal__selector-btn-add__2Y5Xj:hover, .mark-modal__modal-body__CZWCV .mark-modal__modal-body-main__3ce6d .mark-modal__modal-body-main-scroll__2EIJO .mark-modal__modal-body-main-inner__1VnVS .mark-modal__selector-btn-item__CCp9d:hover { background-color: #e0e9ff; } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-main__3ce6d .mark-modal__modal-body-main-scroll__2EIJO .mark-modal__modal-body-main-inner__1VnVS .mark-modal__selector-btn-add__2Y5Xj:active, .mark-modal__modal-body__CZWCV .mark-modal__modal-body-main__3ce6d .mark-modal__modal-body-main-scroll__2EIJO .mark-modal__modal-body-main-inner__1VnVS .mark-modal__selector-btn-item__CCp9d:active { background-color: #ccdaff; } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-main__3ce6d .mark-modal__modal-body-main-scroll__2EIJO .mark-modal__modal-body-main-inner__1VnVS .mark-modal__selector-btn-add__2Y5Xj:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-main__3ce6d .mark-modal__modal-body-main-scroll__2EIJO .mark-modal__modal-body-main-inner__1VnVS .mark-modal__selector-btn-add__2Y5Xj:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-main__3ce6d .mark-modal__modal-body-main-scroll__2EIJO .mark-modal__modal-body-main-inner__1VnVS .mark-modal__selector-btn-add__2Y5Xj .mark-modal__add-img__lX-RE { font-size: 28px; height: auto; margin-bottom: 8px; } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-main__3ce6d .mark-modal__modal-body-main-scroll__2EIJO .mark-modal__modal-body-main-inner__1VnVS .mark-modal__selector-btn-add__2Y5Xj .mark-modal__add-label__25Sgy { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-main__3ce6d .mark-modal__modal-body-main-scroll__2EIJO .mark-modal__modal-body-main-inner__1VnVS .mark-modal__selector-btn-item__CCp9d { justify-content: space-between; } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-main__3ce6d .mark-modal__modal-body-main-scroll__2EIJO .mark-modal__modal-body-main-inner__1VnVS .mark-modal__selector-btn-item__CCp9d .mark-modal__item-img__34SAv { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-main__3ce6d .mark-modal__modal-body-main-scroll__2EIJO .mark-modal__modal-body-main-inner__1VnVS .mark-modal__selector-btn-item__CCp9d .mark-modal__item-img__34SAv img { width: auto; height: 105px; } .mark-modal__modal-body__CZWCV .mark-modal__modal-body-main__3ce6d .mark-modal__modal-body-main-scroll__2EIJO .mark-modal__modal-body-main-inner__1VnVS .mark-modal__selector-btn-item__CCp9d .mark-modal__item-label__23adY { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .mark-modal__modal-footer__1zdc3 { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .mark-modal__selector-btn-add__2Y5Xj, .mark-modal__selector-btn-item__CCp9d { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .mark-modal__selector-btn-add__2Y5Xj { background-color: var(--selector-sprite-bg_primary); } .mark-modal__selector-btn-add__2Y5Xj:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .mark-modal__selector-btn-add__2Y5Xj:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .mark-modal__selector-btn-add__2Y5Xj .mark-modal__add-img__lX-RE { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .mark-modal__selector-btn-add__2Y5Xj .mark-modal__add-label__25Sgy { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .mark-modal__selector-btn-item__CCp9d { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .mark-modal__selector-btn-item__CCp9d .mark-modal__item-img__34SAv { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .mark-modal__selector-btn-item__CCp9d .mark-modal__item-img__34SAv img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .mark-modal__selector-btn-item__CCp9d .mark-modal__item-label__23adY { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .mark-modal__selector-btn-item__CCp9d:hover { background-color: var(--selector-sprite-bg_primary); } .mark-modal__selector-btn-item__CCp9d:hover .mark-modal__item-img__34SAv { border-color: var(--selector-sprite-bg_primary); } .mark-modal__selector-btn-item_selected__L203g { background-color: var(--selector-sprite-bg_primary); } .mark-modal__selector-btn-item_selected__L203g .mark-modal__item-img__34SAv { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .mark-modal__menu-bar-btn__3P2g3 { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .mark-modal__menu-bar-btn_green__3rSxP, .mark-modal__menu-bar-btn_create__2ARox { background-color: #3cdc8f; } .mark-modal__menu-bar-btn_green__3rSxP:hover, .mark-modal__menu-bar-btn_create__2ARox:hover { background-color: #00d374; } .mark-modal__menu-bar-btn_green__3rSxP:active, .mark-modal__menu-bar-btn_create__2ARox:active { background-color: #00d374; } .mark-modal__menu-bar-btn_save__3pA2n, .mark-modal__menu-bar-btn_reset__6ABC0 { background-color: #6ac8ff; } .mark-modal__menu-bar-btn_save__3pA2n:hover, .mark-modal__menu-bar-btn_reset__6ABC0:hover { background-color: #57bcfe; } .mark-modal__menu-bar-btn_save__3pA2n:active, .mark-modal__menu-bar-btn_reset__6ABC0:active { background-color: #4fb0fc; } .mark-modal__menu-bar-btn_submit__2vESM, .mark-modal__menu-bar-btn_open__fACMY { background-color: #ff9e23; } .mark-modal__menu-bar-btn_submit__2vESM:hover, .mark-modal__menu-bar-btn_open__fACMY:hover { background-color: #f47b04; } .mark-modal__menu-bar-btn_submit__2vESM:active, .mark-modal__menu-bar-btn_open__fACMY:active { background-color: #fe8f22; } .mark-modal__menu-bar-btn_link__TX_TC { background-color: #e8efff; color: var(--theme-primary); } .mark-modal__menu-bar-btn_link__TX_TC:hover { background-color: #b6c7ff; } .mark-modal__menu-bar-btn_link__TX_TC:active { background-color: #cfdcff; } .mark-modal__menu-bar-btn_disabled__2NVeL { color: #565266; background-color: #e6e9ed; } .mark-modal__menu-bar-btn_disabled__2NVeL:hover { cursor: not-allowed; } .mark-modal__menu-bar-btn_help__3loXW { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .mark-modal__menu-bar-btn_help__3loXW:hover { background-color: #8398ff; } .mark-modal__menu-bar-btn_help__3loXW:active { background-color: #8ca3ff; } .mark-modal__menu-bar-separator__2IX6e { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .mark-modal__mark-modal__M0ljZ { width: 330px; border-radius: 12px; background-color: #76d08f; position: fixed; top: 49px; right: 0.5rem; z-index: 1040; transition: none !important; } div.mark-modal__mark-modal__M0ljZ.mark-modal__mark-modal_hidden__2CxHq { height: calc(2.2rem); border-radius: 12px 12px 0 0; } .mark-modal__mark-modal__M0ljZ .mark-modal__modal-header__1gY3m { height: calc(2.2rem); min-height: calc(2.2rem); } .mark-modal__mark-modal__M0ljZ .mark-modal__modal-header__1gY3m .mark-modal__modal-header-left__1YtLR > img { width: 18px; height: 18px; } .mark-modal__mark-modal__M0ljZ .mark-modal__modal-header__1gY3m .mark-modal__modal-header-left__1YtLR > div { font-size: 14.4px; font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; } .mark-modal__mark-modal-container__2gpzc { padding: 24px 24px 18px; background-color: #ffffff; } .mark-modal__mark-modal-item__1U4CW { display: flex; align-items: center; font-size: 14px; line-height: 14px; margin-bottom: 24px; line-height: 1.5; align-items: flex-start; } .mark-modal__mark-modal-item__1U4CW.mark-modal__mark-modal-item_score__3o8cP { position: relative; } .mark-modal__mark-modal-item__1U4CW:last-child { margin-bottom: 0; transform: translate(0, -6px); } .mark-modal__mark-modal-item__1U4CW .mark-modal__item-label__23adY { flex-shrink: 0; width: 56px; font-weight: bold; margin-right: 24px; display: flex; justify-content: space-between; white-space: nowrap; text-overflow: ellipsis; font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; } .mark-modal__mark-modal-item__1U4CW .mark-modal__item-label__23adY.mark-modal__item-label_score__MfkU0::before { content: '*'; display: block; position: absolute; left: -8px; top: 3px; color: #e64d00; } .mark-modal__mark-modal-item__1U4CW .mark-modal__item-value__nVB91 { flex: 1; } .mark-modal__mark-modal-item__1U4CW .mark-modal__item-value_score__spsGj { display: flex; align-items: center; } .mark-modal__mark-modal-item__1U4CW .mark-modal__item-score__3qiEC { height: 20px; width: 20px; margin-right: 8px; } .mark-modal__mark-modal-item__1U4CW .mark-modal__item-value_workcomment__1u9Es { width: 100%; border-radius: 4px; border-color: #edeff5; padding: 8px; } .mark-modal__mark-modal-item__1U4CW .mark-modal__item-value_workcomment__1u9Es:disabled { color: #999999; } .mark-modal__mark-modal-item__1U4CW .mark-modal__item-value_workcomment__1u9Es:active, .mark-modal__mark-modal-item__1U4CW .mark-modal__item-value_workcomment__1u9Es:focus-visible { outline: none; } .mark-modal__mark-modal-item__1U4CW .mark-modal__item-value_workcomment__1u9Es:hover { border-color: #d1d7e1; } .mark-modal__mark-modal-item__1U4CW .mark-modal__item-value_workcomment__1u9Es:focus { border-color: var(--theme-primary); box-shadow: none; } .mark-modal__mark-modal-button__2cqVO { display: flex; align-items: center; justify-content: center; height: 26px; width: 60px; border-radius: 4px; background: #4eb76b; font-size: 14px; border: none; color: #ffffff; margin-left: 80px; } .mark-modal__mark-modal-button__2cqVO:disabled { background: #d6d6d6; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .extend-modal__extend-modal__1L75_ { overflow: hidden; transition: 0.3s; display: flex; flex-direction: column; } .extend-modal__extend-modal__1L75_.extend-modal__extend-modal_hidden__2q3IP { height: 44px; } .extend-modal__extend-modal-header__5Dbrl { height: 44px; min-height: 44px; padding: 0 12px 0 17px; display: flex; align-items: center; justify-content: space-between; font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-size: 16px; font-weight: 600; color: white; } .extend-modal__header-left__3OBmH { display: flex; align-items: center; justify-content: space-between; } .extend-modal__left-icon__1qLPk { height: 24px; width: 24px; margin-right: 4px; } .extend-modal__left-title__cGHAn { font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-size: 16px; font-weight: 600; white-space: nowrap; } .extend-modal__right-icon-wrap__3r-PN { height: 20px; width: 30px; border-radius: 10px; display: flex; align-items: center; justify-content: center; background-color: black; } .extend-modal__right-icon__3x0sJ { height: 20px; width: 20px; transition: 0.3s; } .extend-modal__extend-modal-container__2ADTF { display: flex; padding: 0 12px 12px; flex: 1; width: 100%; } .extend-modal__extend-modal-container__2ADTF > div { flex: 1; background-color: #ffffff; border-radius: 8px; width: 100%; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .interactive-questions-modal__flex-center__2EAtx { display: flex; align-items: center; justify-content: center; } .interactive-questions-modal__full-filled__2P70w { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .interactive-questions-modal__modal-mask__B41QS { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .interactive-questions-modal__modal-mask__B41QS .interactive-questions-modal__modal-wrap__3g2L9 { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .interactive-questions-modal__modal-mask__B41QS .interactive-questions-modal__modal-wrap__3g2L9 .interactive-questions-modal__modal-header-wrap__2V4HA { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .interactive-questions-modal__modal-mask__B41QS .interactive-questions-modal__modal-wrap__3g2L9 .interactive-questions-modal__modal-header-wrap__2V4HA .interactive-questions-modal__modal-header-bg__6Ut9Y { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .interactive-questions-modal__modal-mask__B41QS .interactive-questions-modal__modal-wrap__3g2L9 .interactive-questions-modal__modal-header-wrap__2V4HA .interactive-questions-modal__modal-header-label__YzZVO { flex-shrink: 0; font-size: 16px; font-weight: bold; } .interactive-questions-modal__modal-mask__B41QS .interactive-questions-modal__modal-wrap__3g2L9 .interactive-questions-modal__modal-header-wrap__2V4HA .interactive-questions-modal__modal-header-close__294NB { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .interactive-questions-modal__modal-mask__B41QS .interactive-questions-modal__modal-wrap__3g2L9 .interactive-questions-modal__modal-header-wrap__2V4HA .interactive-questions-modal__modal-header-close__294NB:hover { color: #98a2b4; } .interactive-questions-modal__modal-mask__B41QS .interactive-questions-modal__modal-wrap__3g2L9 .interactive-questions-modal__modal-body-wrap__2OTXm { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .interactive-questions-modal__modal-mask__B41QS .interactive-questions-modal__modal-wrap__3g2L9 .interactive-questions-modal__modal-footer-wrap__1iy-Z { flex-shrink: 0; display: flex; } .interactive-questions-modal__modal-header__2PypM { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .interactive-questions-modal__modal-header__2PypM .interactive-questions-modal__modal-header-upload__2p5ex { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .interactive-questions-modal__modal-header__2PypM .interactive-questions-modal__modal-header-upload__2p5ex:hover { background-color: #e0e9ff; } .interactive-questions-modal__modal-header__2PypM .interactive-questions-modal__modal-header-upload__2p5ex:active { background-color: #ccdaff; } .interactive-questions-modal__modal-header__2PypM .interactive-questions-modal__modal-header-upload__2p5ex .interactive-questions-modal__upload-img__2aWm2 { font-size: 16px; margin-right: calc(2px); } .interactive-questions-modal__modal-header__2PypM .interactive-questions-modal__modal-header-upload__2p5ex .interactive-questions-modal__upload-label__365Qf { font-size: 14px; } .interactive-questions-modal__modal-header__2PypM .interactive-questions-modal__modal-header-upload__2p5ex .interactive-questions-modal__upload-input__3DJMP { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .interactive-questions-modal__modal-header__2PypM .interactive-questions-modal__modal-header-search__1mzOu { position: relative; } .interactive-questions-modal__modal-header__2PypM .interactive-questions-modal__modal-header-search__1mzOu .interactive-questions-modal__search-input__3Q-C4 { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .interactive-questions-modal__modal-header__2PypM .interactive-questions-modal__modal-header-search__1mzOu .interactive-questions-modal__search-input__3Q-C4::-webkit-input-placeholder { color: #98a2b4; } .interactive-questions-modal__modal-header__2PypM .interactive-questions-modal__modal-header-search__1mzOu .interactive-questions-modal__search-input__3Q-C4::-moz-placeholder { color: #98a2b4; } .interactive-questions-modal__modal-header__2PypM .interactive-questions-modal__modal-header-search__1mzOu .interactive-questions-modal__search-input__3Q-C4:-ms-input-placeholder { color: #98a2b4; } .interactive-questions-modal__modal-header__2PypM .interactive-questions-modal__modal-header-search__1mzOu .interactive-questions-modal__search-input__3Q-C4:hover { border-color: #d1d7e1; } .interactive-questions-modal__modal-header__2PypM .interactive-questions-modal__modal-header-search__1mzOu .interactive-questions-modal__search-input__3Q-C4:active { border-color: #d1d7e1; } .interactive-questions-modal__modal-header__2PypM .interactive-questions-modal__modal-header-search__1mzOu .interactive-questions-modal__search-img__x1-L5 { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .interactive-questions-modal__modal-body__1-CkL { flex-grow: 1; display: flex; } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-left__2Qvrg, .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-main__jXLnC { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-left__2Qvrg { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-left__2Qvrg .interactive-questions-modal__modal-body-left-scroll__3i_w_ { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-left__2Qvrg .interactive-questions-modal__modal-body-left-scroll__3i_w_ .interactive-questions-modal__modal-body-left-inner__2Oosh { width: 121px; padding: calc(12px); color: #5e6b81; } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-left__2Qvrg .interactive-questions-modal__modal-body-left-scroll__3i_w_ .interactive-questions-modal__modal-body-left-inner__2Oosh .interactive-questions-modal__menu-item-current__2RbXf { color: var(--theme-primary); background-color: #e0e9ff; } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-left__2Qvrg .interactive-questions-modal__modal-body-left-scroll__3i_w_ .interactive-questions-modal__modal-body-left-inner__2Oosh .interactive-questions-modal__menu-item__26NBR { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-left__2Qvrg .interactive-questions-modal__modal-body-left-scroll__3i_w_ .interactive-questions-modal__modal-body-left-inner__2Oosh .interactive-questions-modal__menu-item__26NBR:hover { background-color: #edeff5; } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-left__2Qvrg .interactive-questions-modal__modal-body-left-scroll__3i_w_ .interactive-questions-modal__modal-body-left-inner__2Oosh .interactive-questions-modal__menu-item__26NBR .interactive-questions-modal__menu-item-img__1eeNj { flex-shrink: 0; width: 20px; margin-right: 8px; } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-left__2Qvrg .interactive-questions-modal__modal-body-left-scroll__3i_w_ .interactive-questions-modal__modal-body-left-inner__2Oosh .interactive-questions-modal__menu-item__26NBR .interactive-questions-modal__menu-item-label__1WELj { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-main__jXLnC { padding: calc(12px) 0; } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-main__jXLnC .interactive-questions-modal__modal-body-main-scroll__3RDAk { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-main__jXLnC .interactive-questions-modal__modal-body-main-scroll__3RDAk .interactive-questions-modal__modal-body-main-inner__2WZGf { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-main__jXLnC .interactive-questions-modal__modal-body-main-scroll__3RDAk .interactive-questions-modal__modal-body-main-inner__2WZGf .interactive-questions-modal__selector-btn-add__3Cc-2, .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-main__jXLnC .interactive-questions-modal__modal-body-main-scroll__3RDAk .interactive-questions-modal__modal-body-main-inner__2WZGf .interactive-questions-modal__selector-btn-item__XImpK { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-main__jXLnC .interactive-questions-modal__modal-body-main-scroll__3RDAk .interactive-questions-modal__modal-body-main-inner__2WZGf .interactive-questions-modal__selector-btn-add__3Cc-2:hover, .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-main__jXLnC .interactive-questions-modal__modal-body-main-scroll__3RDAk .interactive-questions-modal__modal-body-main-inner__2WZGf .interactive-questions-modal__selector-btn-item__XImpK:hover { background-color: #e0e9ff; } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-main__jXLnC .interactive-questions-modal__modal-body-main-scroll__3RDAk .interactive-questions-modal__modal-body-main-inner__2WZGf .interactive-questions-modal__selector-btn-add__3Cc-2:active, .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-main__jXLnC .interactive-questions-modal__modal-body-main-scroll__3RDAk .interactive-questions-modal__modal-body-main-inner__2WZGf .interactive-questions-modal__selector-btn-item__XImpK:active { background-color: #ccdaff; } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-main__jXLnC .interactive-questions-modal__modal-body-main-scroll__3RDAk .interactive-questions-modal__modal-body-main-inner__2WZGf .interactive-questions-modal__selector-btn-add__3Cc-2:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-main__jXLnC .interactive-questions-modal__modal-body-main-scroll__3RDAk .interactive-questions-modal__modal-body-main-inner__2WZGf .interactive-questions-modal__selector-btn-add__3Cc-2:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-main__jXLnC .interactive-questions-modal__modal-body-main-scroll__3RDAk .interactive-questions-modal__modal-body-main-inner__2WZGf .interactive-questions-modal__selector-btn-add__3Cc-2 .interactive-questions-modal__add-img__mF3FK { font-size: 28px; height: auto; margin-bottom: 8px; } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-main__jXLnC .interactive-questions-modal__modal-body-main-scroll__3RDAk .interactive-questions-modal__modal-body-main-inner__2WZGf .interactive-questions-modal__selector-btn-add__3Cc-2 .interactive-questions-modal__add-label__3PNql { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-main__jXLnC .interactive-questions-modal__modal-body-main-scroll__3RDAk .interactive-questions-modal__modal-body-main-inner__2WZGf .interactive-questions-modal__selector-btn-item__XImpK { justify-content: space-between; } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-main__jXLnC .interactive-questions-modal__modal-body-main-scroll__3RDAk .interactive-questions-modal__modal-body-main-inner__2WZGf .interactive-questions-modal__selector-btn-item__XImpK .interactive-questions-modal__item-img__3YF6E { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-main__jXLnC .interactive-questions-modal__modal-body-main-scroll__3RDAk .interactive-questions-modal__modal-body-main-inner__2WZGf .interactive-questions-modal__selector-btn-item__XImpK .interactive-questions-modal__item-img__3YF6E img { width: auto; height: 105px; } .interactive-questions-modal__modal-body__1-CkL .interactive-questions-modal__modal-body-main__jXLnC .interactive-questions-modal__modal-body-main-scroll__3RDAk .interactive-questions-modal__modal-body-main-inner__2WZGf .interactive-questions-modal__selector-btn-item__XImpK .interactive-questions-modal__item-label__1XQhg { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .interactive-questions-modal__modal-footer__18TW1 { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .interactive-questions-modal__selector-btn-add__3Cc-2, .interactive-questions-modal__selector-btn-item__XImpK { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .interactive-questions-modal__selector-btn-add__3Cc-2 { background-color: var(--selector-sprite-bg_primary); } .interactive-questions-modal__selector-btn-add__3Cc-2:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .interactive-questions-modal__selector-btn-add__3Cc-2:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .interactive-questions-modal__selector-btn-add__3Cc-2 .interactive-questions-modal__add-img__mF3FK { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .interactive-questions-modal__selector-btn-add__3Cc-2 .interactive-questions-modal__add-label__3PNql { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .interactive-questions-modal__selector-btn-item__XImpK { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .interactive-questions-modal__selector-btn-item__XImpK .interactive-questions-modal__item-img__3YF6E { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .interactive-questions-modal__selector-btn-item__XImpK .interactive-questions-modal__item-img__3YF6E img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .interactive-questions-modal__selector-btn-item__XImpK .interactive-questions-modal__item-label__1XQhg { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .interactive-questions-modal__selector-btn-item__XImpK:hover { background-color: var(--selector-sprite-bg_primary); } .interactive-questions-modal__selector-btn-item__XImpK:hover .interactive-questions-modal__item-img__3YF6E { border-color: var(--selector-sprite-bg_primary); } .interactive-questions-modal__selector-btn-item_selected__3yW1T { background-color: var(--selector-sprite-bg_primary); } .interactive-questions-modal__selector-btn-item_selected__3yW1T .interactive-questions-modal__item-img__3YF6E { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .interactive-questions-modal__menu-bar-btn__1WgUA { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .interactive-questions-modal__menu-bar-btn_green__QiG3t, .interactive-questions-modal__menu-bar-btn_create__1CJn7 { background-color: #3cdc8f; } .interactive-questions-modal__menu-bar-btn_green__QiG3t:hover, .interactive-questions-modal__menu-bar-btn_create__1CJn7:hover { background-color: #00d374; } .interactive-questions-modal__menu-bar-btn_green__QiG3t:active, .interactive-questions-modal__menu-bar-btn_create__1CJn7:active { background-color: #00d374; } .interactive-questions-modal__menu-bar-btn_save__24ix1, .interactive-questions-modal__menu-bar-btn_reset__3DOwK { background-color: #6ac8ff; } .interactive-questions-modal__menu-bar-btn_save__24ix1:hover, .interactive-questions-modal__menu-bar-btn_reset__3DOwK:hover { background-color: #57bcfe; } .interactive-questions-modal__menu-bar-btn_save__24ix1:active, .interactive-questions-modal__menu-bar-btn_reset__3DOwK:active { background-color: #4fb0fc; } .interactive-questions-modal__menu-bar-btn_submit__32vPN, .interactive-questions-modal__menu-bar-btn_open__1dL6B { background-color: #ff9e23; } .interactive-questions-modal__menu-bar-btn_submit__32vPN:hover, .interactive-questions-modal__menu-bar-btn_open__1dL6B:hover { background-color: #f47b04; } .interactive-questions-modal__menu-bar-btn_submit__32vPN:active, .interactive-questions-modal__menu-bar-btn_open__1dL6B:active { background-color: #fe8f22; } .interactive-questions-modal__menu-bar-btn_link__19KAg { background-color: #e8efff; color: var(--theme-primary); } .interactive-questions-modal__menu-bar-btn_link__19KAg:hover { background-color: #b6c7ff; } .interactive-questions-modal__menu-bar-btn_link__19KAg:active { background-color: #cfdcff; } .interactive-questions-modal__menu-bar-btn_disabled__2XdR9 { color: #565266; background-color: #e6e9ed; } .interactive-questions-modal__menu-bar-btn_disabled__2XdR9:hover { cursor: not-allowed; } .interactive-questions-modal__menu-bar-btn_help__1BfRc { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .interactive-questions-modal__menu-bar-btn_help__1BfRc:hover { background-color: #8398ff; } .interactive-questions-modal__menu-bar-btn_help__1BfRc:active { background-color: #8ca3ff; } .interactive-questions-modal__menu-bar-separator__QnIMk { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .interactive-questions-modal__modal-mask__B41QS { display: block; overflow-y: auto; } .interactive-questions-modal__question-modal-wrap__3inDQ { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; min-height: 640px; } .interactive-questions-modal__question-modal__31gga { position: relative; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .interactive-group-score__flex-center__xE6Ty { display: flex; align-items: center; justify-content: center; } .interactive-group-score__full-filled__QjGQX { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .interactive-group-score__modal-mask__1VRJO { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .interactive-group-score__modal-mask__1VRJO .interactive-group-score__modal-wrap__2sGlZ { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .interactive-group-score__modal-mask__1VRJO .interactive-group-score__modal-wrap__2sGlZ .interactive-group-score__modal-header-wrap__3XmZu { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .interactive-group-score__modal-mask__1VRJO .interactive-group-score__modal-wrap__2sGlZ .interactive-group-score__modal-header-wrap__3XmZu .interactive-group-score__modal-header-bg__348Rw { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .interactive-group-score__modal-mask__1VRJO .interactive-group-score__modal-wrap__2sGlZ .interactive-group-score__modal-header-wrap__3XmZu .interactive-group-score__modal-header-label__3TaDM { flex-shrink: 0; font-size: 16px; font-weight: bold; } .interactive-group-score__modal-mask__1VRJO .interactive-group-score__modal-wrap__2sGlZ .interactive-group-score__modal-header-wrap__3XmZu .interactive-group-score__modal-header-close__3Gi1V { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .interactive-group-score__modal-mask__1VRJO .interactive-group-score__modal-wrap__2sGlZ .interactive-group-score__modal-header-wrap__3XmZu .interactive-group-score__modal-header-close__3Gi1V:hover { color: #98a2b4; } .interactive-group-score__modal-mask__1VRJO .interactive-group-score__modal-wrap__2sGlZ .interactive-group-score__modal-body-wrap__1u92h { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .interactive-group-score__modal-mask__1VRJO .interactive-group-score__modal-wrap__2sGlZ .interactive-group-score__modal-footer-wrap__2fa3N { flex-shrink: 0; display: flex; } .interactive-group-score__modal-header__1Dgl- { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .interactive-group-score__modal-header__1Dgl- .interactive-group-score__modal-header-upload__31tsF { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .interactive-group-score__modal-header__1Dgl- .interactive-group-score__modal-header-upload__31tsF:hover { background-color: #e0e9ff; } .interactive-group-score__modal-header__1Dgl- .interactive-group-score__modal-header-upload__31tsF:active { background-color: #ccdaff; } .interactive-group-score__modal-header__1Dgl- .interactive-group-score__modal-header-upload__31tsF .interactive-group-score__upload-img__1MFB8 { font-size: 16px; margin-right: calc(2px); } .interactive-group-score__modal-header__1Dgl- .interactive-group-score__modal-header-upload__31tsF .interactive-group-score__upload-label__15lLH { font-size: 14px; } .interactive-group-score__modal-header__1Dgl- .interactive-group-score__modal-header-upload__31tsF .interactive-group-score__upload-input__3LOdP { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .interactive-group-score__modal-header__1Dgl- .interactive-group-score__modal-header-search__D_twg { position: relative; } .interactive-group-score__modal-header__1Dgl- .interactive-group-score__modal-header-search__D_twg .interactive-group-score__search-input__3xcDO { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .interactive-group-score__modal-header__1Dgl- .interactive-group-score__modal-header-search__D_twg .interactive-group-score__search-input__3xcDO::-webkit-input-placeholder { color: #98a2b4; } .interactive-group-score__modal-header__1Dgl- .interactive-group-score__modal-header-search__D_twg .interactive-group-score__search-input__3xcDO::-moz-placeholder { color: #98a2b4; } .interactive-group-score__modal-header__1Dgl- .interactive-group-score__modal-header-search__D_twg .interactive-group-score__search-input__3xcDO:-ms-input-placeholder { color: #98a2b4; } .interactive-group-score__modal-header__1Dgl- .interactive-group-score__modal-header-search__D_twg .interactive-group-score__search-input__3xcDO:hover { border-color: #d1d7e1; } .interactive-group-score__modal-header__1Dgl- .interactive-group-score__modal-header-search__D_twg .interactive-group-score__search-input__3xcDO:active { border-color: #d1d7e1; } .interactive-group-score__modal-header__1Dgl- .interactive-group-score__modal-header-search__D_twg .interactive-group-score__search-img__trOiY { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .interactive-group-score__modal-body__3DOLO { flex-grow: 1; display: flex; } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-left__3q8pa, .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-main__27KrD { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-left__3q8pa { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-left__3q8pa .interactive-group-score__modal-body-left-scroll__3L3Gd { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-left__3q8pa .interactive-group-score__modal-body-left-scroll__3L3Gd .interactive-group-score__modal-body-left-inner__1d1Nk { width: 121px; padding: calc(12px); color: #5e6b81; } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-left__3q8pa .interactive-group-score__modal-body-left-scroll__3L3Gd .interactive-group-score__modal-body-left-inner__1d1Nk .interactive-group-score__menu-item-current__1KWIY { color: var(--theme-primary); background-color: #e0e9ff; } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-left__3q8pa .interactive-group-score__modal-body-left-scroll__3L3Gd .interactive-group-score__modal-body-left-inner__1d1Nk .interactive-group-score__menu-item__3xLin { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-left__3q8pa .interactive-group-score__modal-body-left-scroll__3L3Gd .interactive-group-score__modal-body-left-inner__1d1Nk .interactive-group-score__menu-item__3xLin:hover { background-color: #edeff5; } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-left__3q8pa .interactive-group-score__modal-body-left-scroll__3L3Gd .interactive-group-score__modal-body-left-inner__1d1Nk .interactive-group-score__menu-item__3xLin .interactive-group-score__menu-item-img__2sMMD { flex-shrink: 0; width: 20px; margin-right: 8px; } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-left__3q8pa .interactive-group-score__modal-body-left-scroll__3L3Gd .interactive-group-score__modal-body-left-inner__1d1Nk .interactive-group-score__menu-item__3xLin .interactive-group-score__menu-item-label__2zuJN { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-main__27KrD { padding: calc(12px) 0; } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-main__27KrD .interactive-group-score__modal-body-main-scroll__3gQY0 { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-main__27KrD .interactive-group-score__modal-body-main-scroll__3gQY0 .interactive-group-score__modal-body-main-inner__2Hyej { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-main__27KrD .interactive-group-score__modal-body-main-scroll__3gQY0 .interactive-group-score__modal-body-main-inner__2Hyej .interactive-group-score__selector-btn-add__37FW5, .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-main__27KrD .interactive-group-score__modal-body-main-scroll__3gQY0 .interactive-group-score__modal-body-main-inner__2Hyej .interactive-group-score__selector-btn-item__3E54y { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-main__27KrD .interactive-group-score__modal-body-main-scroll__3gQY0 .interactive-group-score__modal-body-main-inner__2Hyej .interactive-group-score__selector-btn-add__37FW5:hover, .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-main__27KrD .interactive-group-score__modal-body-main-scroll__3gQY0 .interactive-group-score__modal-body-main-inner__2Hyej .interactive-group-score__selector-btn-item__3E54y:hover { background-color: #e0e9ff; } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-main__27KrD .interactive-group-score__modal-body-main-scroll__3gQY0 .interactive-group-score__modal-body-main-inner__2Hyej .interactive-group-score__selector-btn-add__37FW5:active, .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-main__27KrD .interactive-group-score__modal-body-main-scroll__3gQY0 .interactive-group-score__modal-body-main-inner__2Hyej .interactive-group-score__selector-btn-item__3E54y:active { background-color: #ccdaff; } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-main__27KrD .interactive-group-score__modal-body-main-scroll__3gQY0 .interactive-group-score__modal-body-main-inner__2Hyej .interactive-group-score__selector-btn-add__37FW5:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-main__27KrD .interactive-group-score__modal-body-main-scroll__3gQY0 .interactive-group-score__modal-body-main-inner__2Hyej .interactive-group-score__selector-btn-add__37FW5:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-main__27KrD .interactive-group-score__modal-body-main-scroll__3gQY0 .interactive-group-score__modal-body-main-inner__2Hyej .interactive-group-score__selector-btn-add__37FW5 .interactive-group-score__add-img__sPAhN { font-size: 28px; height: auto; margin-bottom: 8px; } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-main__27KrD .interactive-group-score__modal-body-main-scroll__3gQY0 .interactive-group-score__modal-body-main-inner__2Hyej .interactive-group-score__selector-btn-add__37FW5 .interactive-group-score__add-label__37v6o { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-main__27KrD .interactive-group-score__modal-body-main-scroll__3gQY0 .interactive-group-score__modal-body-main-inner__2Hyej .interactive-group-score__selector-btn-item__3E54y { justify-content: space-between; } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-main__27KrD .interactive-group-score__modal-body-main-scroll__3gQY0 .interactive-group-score__modal-body-main-inner__2Hyej .interactive-group-score__selector-btn-item__3E54y .interactive-group-score__item-img__2-Vvo { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-main__27KrD .interactive-group-score__modal-body-main-scroll__3gQY0 .interactive-group-score__modal-body-main-inner__2Hyej .interactive-group-score__selector-btn-item__3E54y .interactive-group-score__item-img__2-Vvo img { width: auto; height: 105px; } .interactive-group-score__modal-body__3DOLO .interactive-group-score__modal-body-main__27KrD .interactive-group-score__modal-body-main-scroll__3gQY0 .interactive-group-score__modal-body-main-inner__2Hyej .interactive-group-score__selector-btn-item__3E54y .interactive-group-score__item-label__WYuMa { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .interactive-group-score__modal-footer__1r_JZ { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .interactive-group-score__selector-btn-add__37FW5, .interactive-group-score__selector-btn-item__3E54y { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .interactive-group-score__selector-btn-add__37FW5 { background-color: var(--selector-sprite-bg_primary); } .interactive-group-score__selector-btn-add__37FW5:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .interactive-group-score__selector-btn-add__37FW5:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .interactive-group-score__selector-btn-add__37FW5 .interactive-group-score__add-img__sPAhN { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .interactive-group-score__selector-btn-add__37FW5 .interactive-group-score__add-label__37v6o { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .interactive-group-score__selector-btn-item__3E54y { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .interactive-group-score__selector-btn-item__3E54y .interactive-group-score__item-img__2-Vvo { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .interactive-group-score__selector-btn-item__3E54y .interactive-group-score__item-img__2-Vvo img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .interactive-group-score__selector-btn-item__3E54y .interactive-group-score__item-label__WYuMa { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .interactive-group-score__selector-btn-item__3E54y:hover { background-color: var(--selector-sprite-bg_primary); } .interactive-group-score__selector-btn-item__3E54y:hover .interactive-group-score__item-img__2-Vvo { border-color: var(--selector-sprite-bg_primary); } .interactive-group-score__selector-btn-item_selected__1U8iB { background-color: var(--selector-sprite-bg_primary); } .interactive-group-score__selector-btn-item_selected__1U8iB .interactive-group-score__item-img__2-Vvo { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .interactive-group-score__menu-bar-btn__1rFUG { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .interactive-group-score__menu-bar-btn_green__2VJC9, .interactive-group-score__menu-bar-btn_create__3Wsy_ { background-color: #3cdc8f; } .interactive-group-score__menu-bar-btn_green__2VJC9:hover, .interactive-group-score__menu-bar-btn_create__3Wsy_:hover { background-color: #00d374; } .interactive-group-score__menu-bar-btn_green__2VJC9:active, .interactive-group-score__menu-bar-btn_create__3Wsy_:active { background-color: #00d374; } .interactive-group-score__menu-bar-btn_save__1D8uI, .interactive-group-score__menu-bar-btn_reset__8AwCp { background-color: #6ac8ff; } .interactive-group-score__menu-bar-btn_save__1D8uI:hover, .interactive-group-score__menu-bar-btn_reset__8AwCp:hover { background-color: #57bcfe; } .interactive-group-score__menu-bar-btn_save__1D8uI:active, .interactive-group-score__menu-bar-btn_reset__8AwCp:active { background-color: #4fb0fc; } .interactive-group-score__menu-bar-btn_submit__7aS8D, .interactive-group-score__menu-bar-btn_open__RL32s { background-color: #ff9e23; } .interactive-group-score__menu-bar-btn_submit__7aS8D:hover, .interactive-group-score__menu-bar-btn_open__RL32s:hover { background-color: #f47b04; } .interactive-group-score__menu-bar-btn_submit__7aS8D:active, .interactive-group-score__menu-bar-btn_open__RL32s:active { background-color: #fe8f22; } .interactive-group-score__menu-bar-btn_link__2T71K { background-color: #e8efff; color: var(--theme-primary); } .interactive-group-score__menu-bar-btn_link__2T71K:hover { background-color: #b6c7ff; } .interactive-group-score__menu-bar-btn_link__2T71K:active { background-color: #cfdcff; } .interactive-group-score__menu-bar-btn_disabled__37C2b { color: #565266; background-color: #e6e9ed; } .interactive-group-score__menu-bar-btn_disabled__37C2b:hover { cursor: not-allowed; } .interactive-group-score__menu-bar-btn_help__3UcYl { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .interactive-group-score__menu-bar-btn_help__3UcYl:hover { background-color: #8398ff; } .interactive-group-score__menu-bar-btn_help__3UcYl:active { background-color: #8ca3ff; } .interactive-group-score__menu-bar-separator__qTm2w { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .interactive-group-score__group-score-wrap__1EcFC { position: relative; width: 988px; display: flex; justify-content: space-between; align-items: center; margin-bottom: 13px; } .interactive-group-score__group-score-line-wrap__1e1L8 { position: absolute; left: 94px; top: 6px; display: flex; justify-content: space-between; width: 800px; height: 24px; box-shadow: 0px 3px 0px rgba(0, 0, 0, 0.25); } .interactive-group-score__group-score-line-wrap__1e1L8 .interactive-group-score__group-score-monkey__24Wyf { position: absolute; top: -11px; left: 50%; transform: translateX(-50%); width: 56px; height: 46px; transition: all 0.4s; } .interactive-group-score__group-score-line-wrap__1e1L8 .interactive-group-score__group-score-line__KDdqv { position: relative; min-width: 32px; height: 24px; overflow: hidden; transition: all 0.4s; } .interactive-group-score__group-score-line-wrap__1e1L8 .interactive-group-score__group-score-line__KDdqv > div { position: absolute; top: 0; width: 800px !important; height: 24px !important; } .interactive-group-score__group-score-line-wrap__1e1L8 .interactive-group-score__group-score-line__KDdqv.interactive-group-score__group-score-line-left__3qHIl > div { left: 0; } .interactive-group-score__group-score-line-wrap__1e1L8 .interactive-group-score__group-score-line__KDdqv.interactive-group-score__group-score-line-right__2LGVq > div { right: 0; } .interactive-group-score__group-score-group__1O7QR { position: relative; display: flex; justify-content: center; align-items: center; min-width: 100px; height: 36px; background: #ffffff; font-size: 16px; font-weight: bold; color: #333; box-shadow: 0px 3px 0px rgba(0, 0, 0, 0.25); border-radius: 18px; } .interactive-group-score__group-score-group__1O7QR .interactive-group-score__group-score-score__EgqL4 { margin-left: 4px; font-size: 24px; color: #ff782c; } .interactive-group-score__group-score-group__1O7QR .interactive-group-score__group-score-score__EgqL4.interactive-group-score__group-score-score-right__3aNgV { color: #0094ff; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 倒计时题干部分颜色 */ .choice-questions-modal__choice-question-modal__2W6vu { position: relative; display: flex; flex-flow: column; align-items: center; width: 1008px; height: 590px; background-repeat: no-repeat; background-size: 100%; } .choice-questions-modal__modal-timeAndStem__te4Nd { position: absolute; left: 0; top: 24px; display: flex; justify-content: space-between; padding: 0 45px 0 27px; width: 100%; } .choice-questions-modal__modal-timeAndStem__te4Nd .choice-questions-modal__modal-time__4dMeS { position: relative; display: flex; justify-content: center; align-items: center; width: 84px; height: 84px; padding: 8px; border: 8px solid #ffe865; background-color: #ff8514; font-weight: bold; font-size: 32px; color: #fff; border-radius: 50%; } .choice-questions-modal__modal-timeAndStem__te4Nd .choice-questions-modal__modal-time__4dMeS .choice-questions-modal__modal-time-canvas__1ekx4 { position: absolute; left: 0; top: 0; width: 68px; height: 68px; } .choice-questions-modal__modal-timeAndStem__te4Nd .choice-questions-modal__modal-time__4dMeS span { position: relative; } .choice-questions-modal__modal-timeAndStem__te4Nd .choice-questions-modal__modal-stem-wrap__VDhWe { width: 826px; } .choice-questions-modal__modal-timeAndStem__te4Nd .choice-questions-modal__modal-stem-wrap__VDhWe .choice-questions-modal__modal-stem-content__1vdw6 { width: 100%; padding: 15px 15px 0 50px; height: -webkit-fit-content; height: fit-content; max-height: 90px; line-height: 36px; background-repeat: repeat-y; background-size: 100%; overflow: auto; font-size: 26px; color: #a84e2f; word-break: break-all; } .choice-questions-modal__modal-timeAndStem__te4Nd .choice-questions-modal__modal-stem-wrap__VDhWe .choice-questions-modal__modal-stem-bottom__2jTAZ { width: 100%; height: 20px; background-repeat: no-repeat; background-size: 100%; } .choice-questions-modal__options-wrap__1pQ-l { display: flex; flex-wrap: wrap; justify-content: space-between; } .choice-questions-modal__options-wrap__1pQ-l .choice-questions-modal__option-item__3fRwR { width: 233px; background: #fff; border: 6px solid #a5f1ff; box-shadow: 2px 5px 2px #3081ca; border-radius: 12px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .choice-questions-modal__options-wrap__1pQ-l .choice-questions-modal__option-item__3fRwR:not(.choice-questions-modal__option-item-disabled__21-m9):not(.choice-questions-modal__option-item-selected__3xlQU):hover { border-color: #91ddeb; } .choice-questions-modal__options-wrap__1pQ-l .choice-questions-modal__option-item__3fRwR.choice-questions-modal__option-item-disabled__21-m9 { background-color: #ebebeb; border-color: #c6c6c6; color: #a4a4a4; box-shadow: none; } .choice-questions-modal__options-wrap__1pQ-l .choice-questions-modal__option-item__3fRwR.choice-questions-modal__option-item-selected__3xlQU { border-color: #7dc9d7; } .choice-questions-modal__options-wrap-onlyImg__j0R3x { width: calc(478px); margin-top: 130px; } .choice-questions-modal__options-wrap-onlyImg__j0R3x .choice-questions-modal__option-item__3fRwR { position: relative; height: 130px; margin-bottom: 14px; color: #3f71a9; } .choice-questions-modal__options-wrap-onlyImg__j0R3x .choice-questions-modal__option-item__3fRwR .choice-questions-modal__option-letter__olOq6 { position: absolute; left: 6px; top: 6px; width: 28px; height: 28px; line-height: 28px; font-size: 22px; font-weight: bold; text-align: center; -webkit-text-stroke: 1px #fff; } .choice-questions-modal__options-wrap-onlyImg__j0R3x .choice-questions-modal__option-item__3fRwR .choice-questions-modal__option-imgWrap__1yiJm { width: 100%; height: 100%; overflow: hidden; border-radius: 6px; } .choice-questions-modal__options-wrap-onlyImg__j0R3x .choice-questions-modal__option-item__3fRwR .choice-questions-modal__option-imgWrap__1yiJm img { width: 100%; border-radius: 6px; } .choice-questions-modal__options-wrap-onlyText__1hbfb { width: calc(498px); margin-top: 148px; } .choice-questions-modal__options-wrap-onlyText__1hbfb .choice-questions-modal__option-item__3fRwR { display: flex; justify-content: center; align-items: center; height: 98px; margin-bottom: 40px; padding: 10px 8px; overflow: hidden; font-size: 22px; font-weight: bold; color: #3f71a9; } .choice-questions-modal__options-wrap-onlyText__1hbfb .choice-questions-modal__option-item__3fRwR .choice-questions-modal__option-text-wrap__2CFfW { display: flex; justify-content: center; align-items: flex-start; } .choice-questions-modal__options-wrap-onlyText__1hbfb .choice-questions-modal__option-item__3fRwR .choice-questions-modal__option-text-wrap__2CFfW .choice-questions-modal__option-text__2K3jw { word-break: break-all; } .choice-questions-modal__choice-question-modal_hasImg__3pCKh .choice-questions-modal__stem-img-wrap__16_ga { width: 500px; height: 248px; margin: 174px 0 0 40px; overflow: hidden; } .choice-questions-modal__choice-question-modal_hasImg__3pCKh .choice-questions-modal__stem-img-wrap__16_ga img { width: 100%; } .choice-questions-modal__choice-question-modal_hasImg__3pCKh .choice-questions-modal__options-wrap__1pQ-l { justify-content: space-evenly; width: 100%; margin-top: 48px; } .choice-questions-modal__choice-question-modal_hasImg__3pCKh .choice-questions-modal__options-wrap__1pQ-l .choice-questions-modal__option-item__3fRwR { margin: 0; border-color: #eedb51; color: #a84e2f; box-shadow: 2px 5px 2px #ba7419; } .choice-questions-modal__choice-question-modal_hasImg__3pCKh .choice-questions-modal__options-wrap__1pQ-l .choice-questions-modal__option-item__3fRwR:not(.choice-questions-modal__option-item-disabled__21-m9):not(.choice-questions-modal__option-item-selected__3xlQU):hover { border-color: #eeaf51; } .choice-questions-modal__choice-question-modal_hasImg__3pCKh .choice-questions-modal__options-wrap__1pQ-l .choice-questions-modal__option-item__3fRwR.choice-questions-modal__option-item-disabled__21-m9 { background-color: #ebebeb; border-color: #c6c6c6; color: #a4a4a4; box-shadow: none; } .choice-questions-modal__choice-question-modal_hasImg__3pCKh .choice-questions-modal__options-wrap__1pQ-l .choice-questions-modal__option-item__3fRwR.choice-questions-modal__option-item-selected__3xlQU { border-color: #ee9351; } .choice-questions-modal__choice-question-modal_hasImg__3pCKh .choice-questions-modal__options-wrap-onlyImg__j0R3x { margin-top: 25px; } .choice-questions-modal__choice-question-modal_hasImg__3pCKh .choice-questions-modal__options-wrap-onlyText__1hbfb { margin-top: 48px; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .library__flex-center__1mm7s { display: flex; align-items: center; justify-content: center; } .library__full-filled__3jz8- { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .library__modal-mask__WM0-P { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .library__modal-mask__WM0-P .library__modal-wrap__1mFIM { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .library__modal-mask__WM0-P .library__modal-wrap__1mFIM .library__modal-header-wrap__uqYWh { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .library__modal-mask__WM0-P .library__modal-wrap__1mFIM .library__modal-header-wrap__uqYWh .library__modal-header-bg__130Qz { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .library__modal-mask__WM0-P .library__modal-wrap__1mFIM .library__modal-header-wrap__uqYWh .library__modal-header-label__3tehQ { flex-shrink: 0; font-size: 16px; font-weight: bold; } .library__modal-mask__WM0-P .library__modal-wrap__1mFIM .library__modal-header-wrap__uqYWh .library__modal-header-close__euzaJ { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .library__modal-mask__WM0-P .library__modal-wrap__1mFIM .library__modal-header-wrap__uqYWh .library__modal-header-close__euzaJ:hover { color: #98a2b4; } .library__modal-mask__WM0-P .library__modal-wrap__1mFIM .library__modal-body-wrap__3h6tS { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .library__modal-mask__WM0-P .library__modal-wrap__1mFIM .library__modal-footer-wrap__24r_1 { flex-shrink: 0; display: flex; } .library__modal-header__340sD { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .library__modal-header__340sD .library__modal-header-upload__2JsDV { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .library__modal-header__340sD .library__modal-header-upload__2JsDV:hover { background-color: #e0e9ff; } .library__modal-header__340sD .library__modal-header-upload__2JsDV:active { background-color: #ccdaff; } .library__modal-header__340sD .library__modal-header-upload__2JsDV .library__upload-img__2-u0U { font-size: 16px; margin-right: calc(2px); } .library__modal-header__340sD .library__modal-header-upload__2JsDV .library__upload-label__2yNDe { font-size: 14px; } .library__modal-header__340sD .library__modal-header-upload__2JsDV .library__upload-input__RS1aL { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .library__modal-header__340sD .library__modal-header-search__23xIg { position: relative; } .library__modal-header__340sD .library__modal-header-search__23xIg .library__search-input__1M5bu { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .library__modal-header__340sD .library__modal-header-search__23xIg .library__search-input__1M5bu::-webkit-input-placeholder { color: #98a2b4; } .library__modal-header__340sD .library__modal-header-search__23xIg .library__search-input__1M5bu::-moz-placeholder { color: #98a2b4; } .library__modal-header__340sD .library__modal-header-search__23xIg .library__search-input__1M5bu:-ms-input-placeholder { color: #98a2b4; } .library__modal-header__340sD .library__modal-header-search__23xIg .library__search-input__1M5bu:hover { border-color: #d1d7e1; } .library__modal-header__340sD .library__modal-header-search__23xIg .library__search-input__1M5bu:active { border-color: #d1d7e1; } .library__modal-header__340sD .library__modal-header-search__23xIg .library__search-img__15ui2 { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .library__modal-body___QFz- { flex-grow: 1; display: flex; } .library__modal-body___QFz- .library__modal-body-left__317uX, .library__modal-body___QFz- .library__modal-body-main__27Wc5 { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .library__modal-body___QFz- .library__modal-body-left__317uX { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .library__modal-body___QFz- .library__modal-body-left__317uX .library__modal-body-left-scroll__37vR5 { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .library__modal-body___QFz- .library__modal-body-left__317uX .library__modal-body-left-scroll__37vR5 .library__modal-body-left-inner__2cyVs { width: 121px; padding: calc(12px); color: #5e6b81; } .library__modal-body___QFz- .library__modal-body-left__317uX .library__modal-body-left-scroll__37vR5 .library__modal-body-left-inner__2cyVs .library__menu-item-current__ChdPO { color: var(--theme-primary); background-color: #e0e9ff; } .library__modal-body___QFz- .library__modal-body-left__317uX .library__modal-body-left-scroll__37vR5 .library__modal-body-left-inner__2cyVs .library__menu-item__hwBfg { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .library__modal-body___QFz- .library__modal-body-left__317uX .library__modal-body-left-scroll__37vR5 .library__modal-body-left-inner__2cyVs .library__menu-item__hwBfg:hover { background-color: #edeff5; } .library__modal-body___QFz- .library__modal-body-left__317uX .library__modal-body-left-scroll__37vR5 .library__modal-body-left-inner__2cyVs .library__menu-item__hwBfg .library__menu-item-img__10Z7_ { flex-shrink: 0; width: 20px; margin-right: 8px; } .library__modal-body___QFz- .library__modal-body-left__317uX .library__modal-body-left-scroll__37vR5 .library__modal-body-left-inner__2cyVs .library__menu-item__hwBfg .library__menu-item-label__3Pjx2 { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .library__modal-body___QFz- .library__modal-body-main__27Wc5 { padding: calc(12px) 0; } .library__modal-body___QFz- .library__modal-body-main__27Wc5 .library__modal-body-main-scroll__2ECmt { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .library__modal-body___QFz- .library__modal-body-main__27Wc5 .library__modal-body-main-scroll__2ECmt .library__modal-body-main-inner__ReSwZ { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .library__modal-body___QFz- .library__modal-body-main__27Wc5 .library__modal-body-main-scroll__2ECmt .library__modal-body-main-inner__ReSwZ .library__selector-btn-add__2odqY, .library__modal-body___QFz- .library__modal-body-main__27Wc5 .library__modal-body-main-scroll__2ECmt .library__modal-body-main-inner__ReSwZ .library__selector-btn-item__1UMCO { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .library__modal-body___QFz- .library__modal-body-main__27Wc5 .library__modal-body-main-scroll__2ECmt .library__modal-body-main-inner__ReSwZ .library__selector-btn-add__2odqY:hover, .library__modal-body___QFz- .library__modal-body-main__27Wc5 .library__modal-body-main-scroll__2ECmt .library__modal-body-main-inner__ReSwZ .library__selector-btn-item__1UMCO:hover { background-color: #e0e9ff; } .library__modal-body___QFz- .library__modal-body-main__27Wc5 .library__modal-body-main-scroll__2ECmt .library__modal-body-main-inner__ReSwZ .library__selector-btn-add__2odqY:active, .library__modal-body___QFz- .library__modal-body-main__27Wc5 .library__modal-body-main-scroll__2ECmt .library__modal-body-main-inner__ReSwZ .library__selector-btn-item__1UMCO:active { background-color: #ccdaff; } .library__modal-body___QFz- .library__modal-body-main__27Wc5 .library__modal-body-main-scroll__2ECmt .library__modal-body-main-inner__ReSwZ .library__selector-btn-add__2odqY:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .library__modal-body___QFz- .library__modal-body-main__27Wc5 .library__modal-body-main-scroll__2ECmt .library__modal-body-main-inner__ReSwZ .library__selector-btn-add__2odqY:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .library__modal-body___QFz- .library__modal-body-main__27Wc5 .library__modal-body-main-scroll__2ECmt .library__modal-body-main-inner__ReSwZ .library__selector-btn-add__2odqY .library__add-img__34QeG { font-size: 28px; height: auto; margin-bottom: 8px; } .library__modal-body___QFz- .library__modal-body-main__27Wc5 .library__modal-body-main-scroll__2ECmt .library__modal-body-main-inner__ReSwZ .library__selector-btn-add__2odqY .library__add-label__2STDF { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .library__modal-body___QFz- .library__modal-body-main__27Wc5 .library__modal-body-main-scroll__2ECmt .library__modal-body-main-inner__ReSwZ .library__selector-btn-item__1UMCO { justify-content: space-between; } .library__modal-body___QFz- .library__modal-body-main__27Wc5 .library__modal-body-main-scroll__2ECmt .library__modal-body-main-inner__ReSwZ .library__selector-btn-item__1UMCO .library__item-img__2mvjO { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .library__modal-body___QFz- .library__modal-body-main__27Wc5 .library__modal-body-main-scroll__2ECmt .library__modal-body-main-inner__ReSwZ .library__selector-btn-item__1UMCO .library__item-img__2mvjO img { width: auto; height: 105px; } .library__modal-body___QFz- .library__modal-body-main__27Wc5 .library__modal-body-main-scroll__2ECmt .library__modal-body-main-inner__ReSwZ .library__selector-btn-item__1UMCO .library__item-label__343bG { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .library__modal-footer__1fR_Q { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .library__selector-btn-add__2odqY, .library__selector-btn-item__1UMCO { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .library__selector-btn-add__2odqY { background-color: var(--selector-sprite-bg_primary); } .library__selector-btn-add__2odqY:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .library__selector-btn-add__2odqY:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .library__selector-btn-add__2odqY .library__add-img__34QeG { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .library__selector-btn-add__2odqY .library__add-label__2STDF { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .library__selector-btn-item__1UMCO { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .library__selector-btn-item__1UMCO .library__item-img__2mvjO { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .library__selector-btn-item__1UMCO .library__item-img__2mvjO img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .library__selector-btn-item__1UMCO .library__item-label__343bG { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .library__selector-btn-item__1UMCO:hover { background-color: var(--selector-sprite-bg_primary); } .library__selector-btn-item__1UMCO:hover .library__item-img__2mvjO { border-color: var(--selector-sprite-bg_primary); } .library__selector-btn-item_selected__2h02G { background-color: var(--selector-sprite-bg_primary); } .library__selector-btn-item_selected__2h02G .library__item-img__2mvjO { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .library__menu-bar-btn__1xZ8A { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .library__menu-bar-btn_green__1-Y2r, .library__menu-bar-btn_create__2DMvz { background-color: #3cdc8f; } .library__menu-bar-btn_green__1-Y2r:hover, .library__menu-bar-btn_create__2DMvz:hover { background-color: #00d374; } .library__menu-bar-btn_green__1-Y2r:active, .library__menu-bar-btn_create__2DMvz:active { background-color: #00d374; } .library__menu-bar-btn_save__yrUT9, .library__menu-bar-btn_reset__2yDsH { background-color: #6ac8ff; } .library__menu-bar-btn_save__yrUT9:hover, .library__menu-bar-btn_reset__2yDsH:hover { background-color: #57bcfe; } .library__menu-bar-btn_save__yrUT9:active, .library__menu-bar-btn_reset__2yDsH:active { background-color: #4fb0fc; } .library__menu-bar-btn_submit__qPwyg, .library__menu-bar-btn_open__Rs8dv { background-color: #ff9e23; } .library__menu-bar-btn_submit__qPwyg:hover, .library__menu-bar-btn_open__Rs8dv:hover { background-color: #f47b04; } .library__menu-bar-btn_submit__qPwyg:active, .library__menu-bar-btn_open__Rs8dv:active { background-color: #fe8f22; } .library__menu-bar-btn_link__2FGzR { background-color: #e8efff; color: var(--theme-primary); } .library__menu-bar-btn_link__2FGzR:hover { background-color: #b6c7ff; } .library__menu-bar-btn_link__2FGzR:active { background-color: #cfdcff; } .library__menu-bar-btn_disabled__2Vp4W { color: #565266; background-color: #e6e9ed; } .library__menu-bar-btn_disabled__2Vp4W:hover { cursor: not-allowed; } .library__menu-bar-btn_help__3zTGl { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .library__menu-bar-btn_help__3zTGl:hover { background-color: #8398ff; } .library__menu-bar-btn_help__3zTGl:active { background-color: #8ca3ff; } .library__menu-bar-separator__1q5fS { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .library__ai-modal-mask__23EBL { z-index: 5010; } .library__calorie-modal-wrap__1Mdn6 { width: 682px !important; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .interactive-group-modal__main-menu-group__ELD2u { position: fixed; top: 100px; left: 50%; transform: translateX(-50%); z-index: 2000; display: flex; flex-flow: column; justify-content: center; width: 333px; height: 123px; padding-top: 10px; background-repeat: no-repeat; background-size: 100%; font-size: 13px; color: #fcffed; text-align: center; } .interactive-group-modal__main-menu-group__ELD2u .interactive-group-modal__main-menu-group-text__1F6SY { font-size: 14px; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .change-nickname-modal__flex-center__1gweU { display: flex; align-items: center; justify-content: center; } .change-nickname-modal__full-filled__2p-49 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .change-nickname-modal__modal-mask__XrudF { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .change-nickname-modal__modal-mask__XrudF .change-nickname-modal__modal-wrap__2rsSw { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .change-nickname-modal__modal-mask__XrudF .change-nickname-modal__modal-wrap__2rsSw .change-nickname-modal__modal-header-wrap__1EP2n { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .change-nickname-modal__modal-mask__XrudF .change-nickname-modal__modal-wrap__2rsSw .change-nickname-modal__modal-header-wrap__1EP2n .change-nickname-modal__modal-header-bg__KjtEz { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .change-nickname-modal__modal-mask__XrudF .change-nickname-modal__modal-wrap__2rsSw .change-nickname-modal__modal-header-wrap__1EP2n .change-nickname-modal__modal-header-label__1CTX_ { flex-shrink: 0; font-size: 16px; font-weight: bold; } .change-nickname-modal__modal-mask__XrudF .change-nickname-modal__modal-wrap__2rsSw .change-nickname-modal__modal-header-wrap__1EP2n .change-nickname-modal__modal-header-close__m8gbX { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .change-nickname-modal__modal-mask__XrudF .change-nickname-modal__modal-wrap__2rsSw .change-nickname-modal__modal-header-wrap__1EP2n .change-nickname-modal__modal-header-close__m8gbX:hover { color: #98a2b4; } .change-nickname-modal__modal-mask__XrudF .change-nickname-modal__modal-wrap__2rsSw .change-nickname-modal__modal-body-wrap__28w55 { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .change-nickname-modal__modal-mask__XrudF .change-nickname-modal__modal-wrap__2rsSw .change-nickname-modal__modal-footer-wrap__F7_ZO { flex-shrink: 0; display: flex; } .change-nickname-modal__modal-header__TWP-K { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .change-nickname-modal__modal-header__TWP-K .change-nickname-modal__modal-header-upload__2iEJT { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .change-nickname-modal__modal-header__TWP-K .change-nickname-modal__modal-header-upload__2iEJT:hover { background-color: #e0e9ff; } .change-nickname-modal__modal-header__TWP-K .change-nickname-modal__modal-header-upload__2iEJT:active { background-color: #ccdaff; } .change-nickname-modal__modal-header__TWP-K .change-nickname-modal__modal-header-upload__2iEJT .change-nickname-modal__upload-img__NVsvG { font-size: 16px; margin-right: calc(2px); } .change-nickname-modal__modal-header__TWP-K .change-nickname-modal__modal-header-upload__2iEJT .change-nickname-modal__upload-label__3Qd_W { font-size: 14px; } .change-nickname-modal__modal-header__TWP-K .change-nickname-modal__modal-header-upload__2iEJT .change-nickname-modal__upload-input__1AHxF { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .change-nickname-modal__modal-header__TWP-K .change-nickname-modal__modal-header-search__-7qDS { position: relative; } .change-nickname-modal__modal-header__TWP-K .change-nickname-modal__modal-header-search__-7qDS .change-nickname-modal__search-input__31yug { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .change-nickname-modal__modal-header__TWP-K .change-nickname-modal__modal-header-search__-7qDS .change-nickname-modal__search-input__31yug::-webkit-input-placeholder { color: #98a2b4; } .change-nickname-modal__modal-header__TWP-K .change-nickname-modal__modal-header-search__-7qDS .change-nickname-modal__search-input__31yug::-moz-placeholder { color: #98a2b4; } .change-nickname-modal__modal-header__TWP-K .change-nickname-modal__modal-header-search__-7qDS .change-nickname-modal__search-input__31yug:-ms-input-placeholder { color: #98a2b4; } .change-nickname-modal__modal-header__TWP-K .change-nickname-modal__modal-header-search__-7qDS .change-nickname-modal__search-input__31yug:hover { border-color: #d1d7e1; } .change-nickname-modal__modal-header__TWP-K .change-nickname-modal__modal-header-search__-7qDS .change-nickname-modal__search-input__31yug:active { border-color: #d1d7e1; } .change-nickname-modal__modal-header__TWP-K .change-nickname-modal__modal-header-search__-7qDS .change-nickname-modal__search-img__gr8Zr { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .change-nickname-modal__modal-body__3sIGu { flex-grow: 1; display: flex; } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-left__1z-9h, .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-main__196qp { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-left__1z-9h { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-left__1z-9h .change-nickname-modal__modal-body-left-scroll__2K5au { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-left__1z-9h .change-nickname-modal__modal-body-left-scroll__2K5au .change-nickname-modal__modal-body-left-inner__3iafK { width: 121px; padding: calc(12px); color: #5e6b81; } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-left__1z-9h .change-nickname-modal__modal-body-left-scroll__2K5au .change-nickname-modal__modal-body-left-inner__3iafK .change-nickname-modal__menu-item-current__20A_L { color: var(--theme-primary); background-color: #e0e9ff; } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-left__1z-9h .change-nickname-modal__modal-body-left-scroll__2K5au .change-nickname-modal__modal-body-left-inner__3iafK .change-nickname-modal__menu-item__2Ae0N { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-left__1z-9h .change-nickname-modal__modal-body-left-scroll__2K5au .change-nickname-modal__modal-body-left-inner__3iafK .change-nickname-modal__menu-item__2Ae0N:hover { background-color: #edeff5; } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-left__1z-9h .change-nickname-modal__modal-body-left-scroll__2K5au .change-nickname-modal__modal-body-left-inner__3iafK .change-nickname-modal__menu-item__2Ae0N .change-nickname-modal__menu-item-img__1zOl- { flex-shrink: 0; width: 20px; margin-right: 8px; } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-left__1z-9h .change-nickname-modal__modal-body-left-scroll__2K5au .change-nickname-modal__modal-body-left-inner__3iafK .change-nickname-modal__menu-item__2Ae0N .change-nickname-modal__menu-item-label__34IlD { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-main__196qp { padding: calc(12px) 0; } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-main__196qp .change-nickname-modal__modal-body-main-scroll__1X1z7 { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-main__196qp .change-nickname-modal__modal-body-main-scroll__1X1z7 .change-nickname-modal__modal-body-main-inner__2vabv { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-main__196qp .change-nickname-modal__modal-body-main-scroll__1X1z7 .change-nickname-modal__modal-body-main-inner__2vabv .change-nickname-modal__selector-btn-add__wKgMf, .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-main__196qp .change-nickname-modal__modal-body-main-scroll__1X1z7 .change-nickname-modal__modal-body-main-inner__2vabv .change-nickname-modal__selector-btn-item__1b35C { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-main__196qp .change-nickname-modal__modal-body-main-scroll__1X1z7 .change-nickname-modal__modal-body-main-inner__2vabv .change-nickname-modal__selector-btn-add__wKgMf:hover, .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-main__196qp .change-nickname-modal__modal-body-main-scroll__1X1z7 .change-nickname-modal__modal-body-main-inner__2vabv .change-nickname-modal__selector-btn-item__1b35C:hover { background-color: #e0e9ff; } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-main__196qp .change-nickname-modal__modal-body-main-scroll__1X1z7 .change-nickname-modal__modal-body-main-inner__2vabv .change-nickname-modal__selector-btn-add__wKgMf:active, .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-main__196qp .change-nickname-modal__modal-body-main-scroll__1X1z7 .change-nickname-modal__modal-body-main-inner__2vabv .change-nickname-modal__selector-btn-item__1b35C:active { background-color: #ccdaff; } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-main__196qp .change-nickname-modal__modal-body-main-scroll__1X1z7 .change-nickname-modal__modal-body-main-inner__2vabv .change-nickname-modal__selector-btn-add__wKgMf:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-main__196qp .change-nickname-modal__modal-body-main-scroll__1X1z7 .change-nickname-modal__modal-body-main-inner__2vabv .change-nickname-modal__selector-btn-add__wKgMf:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-main__196qp .change-nickname-modal__modal-body-main-scroll__1X1z7 .change-nickname-modal__modal-body-main-inner__2vabv .change-nickname-modal__selector-btn-add__wKgMf .change-nickname-modal__add-img__ZMou5 { font-size: 28px; height: auto; margin-bottom: 8px; } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-main__196qp .change-nickname-modal__modal-body-main-scroll__1X1z7 .change-nickname-modal__modal-body-main-inner__2vabv .change-nickname-modal__selector-btn-add__wKgMf .change-nickname-modal__add-label__3v8EV { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-main__196qp .change-nickname-modal__modal-body-main-scroll__1X1z7 .change-nickname-modal__modal-body-main-inner__2vabv .change-nickname-modal__selector-btn-item__1b35C { justify-content: space-between; } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-main__196qp .change-nickname-modal__modal-body-main-scroll__1X1z7 .change-nickname-modal__modal-body-main-inner__2vabv .change-nickname-modal__selector-btn-item__1b35C .change-nickname-modal__item-img__a08nu { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-main__196qp .change-nickname-modal__modal-body-main-scroll__1X1z7 .change-nickname-modal__modal-body-main-inner__2vabv .change-nickname-modal__selector-btn-item__1b35C .change-nickname-modal__item-img__a08nu img { width: auto; height: 105px; } .change-nickname-modal__modal-body__3sIGu .change-nickname-modal__modal-body-main__196qp .change-nickname-modal__modal-body-main-scroll__1X1z7 .change-nickname-modal__modal-body-main-inner__2vabv .change-nickname-modal__selector-btn-item__1b35C .change-nickname-modal__item-label__2z5SX { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .change-nickname-modal__modal-footer__2THFB { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .change-nickname-modal__selector-btn-add__wKgMf, .change-nickname-modal__selector-btn-item__1b35C { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .change-nickname-modal__selector-btn-add__wKgMf { background-color: var(--selector-sprite-bg_primary); } .change-nickname-modal__selector-btn-add__wKgMf:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .change-nickname-modal__selector-btn-add__wKgMf:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .change-nickname-modal__selector-btn-add__wKgMf .change-nickname-modal__add-img__ZMou5 { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .change-nickname-modal__selector-btn-add__wKgMf .change-nickname-modal__add-label__3v8EV { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .change-nickname-modal__selector-btn-item__1b35C { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .change-nickname-modal__selector-btn-item__1b35C .change-nickname-modal__item-img__a08nu { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .change-nickname-modal__selector-btn-item__1b35C .change-nickname-modal__item-img__a08nu img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .change-nickname-modal__selector-btn-item__1b35C .change-nickname-modal__item-label__2z5SX { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .change-nickname-modal__selector-btn-item__1b35C:hover { background-color: var(--selector-sprite-bg_primary); } .change-nickname-modal__selector-btn-item__1b35C:hover .change-nickname-modal__item-img__a08nu { border-color: var(--selector-sprite-bg_primary); } .change-nickname-modal__selector-btn-item_selected__3uJjO { background-color: var(--selector-sprite-bg_primary); } .change-nickname-modal__selector-btn-item_selected__3uJjO .change-nickname-modal__item-img__a08nu { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .change-nickname-modal__menu-bar-btn__2ndcW { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .change-nickname-modal__menu-bar-btn_green__3DPTW, .change-nickname-modal__menu-bar-btn_create__3-pWn { background-color: #3cdc8f; } .change-nickname-modal__menu-bar-btn_green__3DPTW:hover, .change-nickname-modal__menu-bar-btn_create__3-pWn:hover { background-color: #00d374; } .change-nickname-modal__menu-bar-btn_green__3DPTW:active, .change-nickname-modal__menu-bar-btn_create__3-pWn:active { background-color: #00d374; } .change-nickname-modal__menu-bar-btn_save__3fHls, .change-nickname-modal__menu-bar-btn_reset__3xFCv { background-color: #6ac8ff; } .change-nickname-modal__menu-bar-btn_save__3fHls:hover, .change-nickname-modal__menu-bar-btn_reset__3xFCv:hover { background-color: #57bcfe; } .change-nickname-modal__menu-bar-btn_save__3fHls:active, .change-nickname-modal__menu-bar-btn_reset__3xFCv:active { background-color: #4fb0fc; } .change-nickname-modal__menu-bar-btn_submit__1_BpR, .change-nickname-modal__menu-bar-btn_open__3Zii4 { background-color: #ff9e23; } .change-nickname-modal__menu-bar-btn_submit__1_BpR:hover, .change-nickname-modal__menu-bar-btn_open__3Zii4:hover { background-color: #f47b04; } .change-nickname-modal__menu-bar-btn_submit__1_BpR:active, .change-nickname-modal__menu-bar-btn_open__3Zii4:active { background-color: #fe8f22; } .change-nickname-modal__menu-bar-btn_link__pgtQY { background-color: #e8efff; color: var(--theme-primary); } .change-nickname-modal__menu-bar-btn_link__pgtQY:hover { background-color: #b6c7ff; } .change-nickname-modal__menu-bar-btn_link__pgtQY:active { background-color: #cfdcff; } .change-nickname-modal__menu-bar-btn_disabled__1xqFW { color: #565266; background-color: #e6e9ed; } .change-nickname-modal__menu-bar-btn_disabled__1xqFW:hover { cursor: not-allowed; } .change-nickname-modal__menu-bar-btn_help__24mYD { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .change-nickname-modal__menu-bar-btn_help__24mYD:hover { background-color: #8398ff; } .change-nickname-modal__menu-bar-btn_help__24mYD:active { background-color: #8ca3ff; } .change-nickname-modal__menu-bar-separator__SiPnb { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .change-nickname-modal__changeName-modal-mask__eV7GV { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__modal-wrap__2rsSw { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__modal-wrap__2rsSw .change-nickname-modal__modal-header-wrap__1EP2n { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__modal-wrap__2rsSw .change-nickname-modal__modal-header-wrap__1EP2n .change-nickname-modal__modal-header-bg__KjtEz { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__modal-wrap__2rsSw .change-nickname-modal__modal-header-wrap__1EP2n .change-nickname-modal__modal-header-label__1CTX_ { flex-shrink: 0; font-size: 16px; font-weight: bold; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__modal-wrap__2rsSw .change-nickname-modal__modal-header-wrap__1EP2n .change-nickname-modal__modal-header-close__m8gbX { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__modal-wrap__2rsSw .change-nickname-modal__modal-header-wrap__1EP2n .change-nickname-modal__modal-header-close__m8gbX:hover { color: #98a2b4; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__modal-wrap__2rsSw .change-nickname-modal__modal-body-wrap__28w55 { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__modal-wrap__2rsSw .change-nickname-modal__modal-footer-wrap__F7_ZO { flex-shrink: 0; display: flex; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__changeName-modal__2AQu3 { position: relative; width: 448px; height: 185px; background-color: #ffffff; box-shadow: 0px 2px 8px rgba(30, 30, 40, 0.15); border-radius: 12px; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__changeName-modal__2AQu3 .change-nickname-modal__changeName-modal-header__39j2W { width: 100%; height: 40px; padding-left: 20px; line-height: 40px; font-size: 16px; font-weight: bold; color: #3d4554; border-bottom: 1px solid #e8efff; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__changeName-modal__2AQu3 .change-nickname-modal__changeName-close__tF2q6 { position: absolute; top: 15px; right: 22px; font-size: 16px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__changeName-modal__2AQu3 .change-nickname-modal__changeName-close__tF2q6:hover { color: #98a2b4; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__changeName-modal__2AQu3 .change-nickname-modal__changeName-modal-form__Fre_z { padding: 20px 20px 24px 20px; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__changeName-modal__2AQu3 .change-nickname-modal__changeName-modal-form__Fre_z .ant-form .ant-form-item .ant-input { border-color: #e8efff; border-radius: 4px; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__changeName-modal__2AQu3 .change-nickname-modal__changeName-modal-form__Fre_z .ant-form .ant-form-item.ant-form-item-has-error .ant-input { border-color: #ff4d4f; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__changeName-modal__2AQu3 .change-nickname-modal__changeName-modal-form__Fre_z .change-nickname-modal__changeName-btns__2WDLo { display: flex; justify-content: flex-end; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__changeName-modal__2AQu3 .change-nickname-modal__changeName-modal-form__Fre_z .change-nickname-modal__changeName-btns__2WDLo .change-nickname-modal__changeName-btn__2KHhm { width: 112px; height: 40px; line-height: 40px; font-size: 16px; font-weight: bold; text-align: center; border-radius: 20px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__changeName-modal__2AQu3 .change-nickname-modal__changeName-modal-form__Fre_z .change-nickname-modal__changeName-btns__2WDLo .change-nickname-modal__changeName-btn__2KHhm.change-nickname-modal__changeName-btn_cancel__32OEu { background: linear-gradient(0deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.1)), #edeff5; color: #4d586a; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__changeName-modal__2AQu3 .change-nickname-modal__changeName-modal-form__Fre_z .change-nickname-modal__changeName-btns__2WDLo .change-nickname-modal__changeName-btn__2KHhm.change-nickname-modal__changeName-btn_cancel__32OEu:hover { background: linear-gradient(0deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.1)), #d1d7e1; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__changeName-modal__2AQu3 .change-nickname-modal__changeName-modal-form__Fre_z .change-nickname-modal__changeName-btns__2WDLo .change-nickname-modal__changeName-btn__2KHhm.change-nickname-modal__changeName-btn_cancel__32OEu:active { background: linear-gradient(0deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.1)), #b5bccb; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__changeName-modal__2AQu3 .change-nickname-modal__changeName-modal-form__Fre_z .change-nickname-modal__changeName-btns__2WDLo .change-nickname-modal__changeName-btn__2KHhm.change-nickname-modal__changeName-btn_confirm__3lPAX { margin-left: 16px; background-color: var(--theme-primary); color: #ffffff; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__changeName-modal__2AQu3 .change-nickname-modal__changeName-modal-form__Fre_z .change-nickname-modal__changeName-btns__2WDLo .change-nickname-modal__changeName-btn__2KHhm.change-nickname-modal__changeName-btn_confirm__3lPAX:hover { background-color: #4250d3; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__changeName-modal__2AQu3 .change-nickname-modal__changeName-modal-form__Fre_z .change-nickname-modal__changeName-btns__2WDLo .change-nickname-modal__changeName-btn__2KHhm.change-nickname-modal__changeName-btn_confirm__3lPAX:active { background-color: #222ba6; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__changeName-modal__2AQu3 .change-nickname-modal__changeName-modal-form__Fre_z .change-nickname-modal__changeName-btns__2WDLo .change-nickname-modal__changeName-btn__2KHhm.change-nickname-modal__changeName-btn_confirm__3lPAX.change-nickname-modal__changeName-btn_confirm_disabled__1-0oc { background-color: #b4bfff; cursor: not-allowed; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__changeName-modal__2AQu3 .change-nickname-modal__changeName-modal-form__Fre_z .change-nickname-modal__changeName-btns__2WDLo .change-nickname-modal__changeName-btn__2KHhm.change-nickname-modal__changeName-btn_confirm__3lPAX.change-nickname-modal__changeName-btn_confirm_disabled__1-0oc:hover { background-color: #b4bfff; } .change-nickname-modal__changeName-modal-mask__eV7GV .change-nickname-modal__changeName-modal__2AQu3 .change-nickname-modal__changeName-modal-form__Fre_z .change-nickname-modal__changeName-btns__2WDLo .change-nickname-modal__changeName-btn__2KHhm.change-nickname-modal__changeName-btn_confirm__3lPAX.change-nickname-modal__changeName-btn_confirm_disabled__1-0oc:active { background-color: #b4bfff; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .bind-phone-modal__flex-center__33KTU { display: flex; align-items: center; justify-content: center; } .bind-phone-modal__full-filled__3weIU { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .bind-phone-modal__modal-mask__3tuor { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .bind-phone-modal__modal-mask__3tuor .bind-phone-modal__modal-wrap__o7uvX { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .bind-phone-modal__modal-mask__3tuor .bind-phone-modal__modal-wrap__o7uvX .bind-phone-modal__modal-header-wrap__t7Tv2 { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .bind-phone-modal__modal-mask__3tuor .bind-phone-modal__modal-wrap__o7uvX .bind-phone-modal__modal-header-wrap__t7Tv2 .bind-phone-modal__modal-header-bg__2DHj_ { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .bind-phone-modal__modal-mask__3tuor .bind-phone-modal__modal-wrap__o7uvX .bind-phone-modal__modal-header-wrap__t7Tv2 .bind-phone-modal__modal-header-label__1ygXE { flex-shrink: 0; font-size: 16px; font-weight: bold; } .bind-phone-modal__modal-mask__3tuor .bind-phone-modal__modal-wrap__o7uvX .bind-phone-modal__modal-header-wrap__t7Tv2 .bind-phone-modal__modal-header-close__2r5lL { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .bind-phone-modal__modal-mask__3tuor .bind-phone-modal__modal-wrap__o7uvX .bind-phone-modal__modal-header-wrap__t7Tv2 .bind-phone-modal__modal-header-close__2r5lL:hover { color: #98a2b4; } .bind-phone-modal__modal-mask__3tuor .bind-phone-modal__modal-wrap__o7uvX .bind-phone-modal__modal-body-wrap__1uLqY { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .bind-phone-modal__modal-mask__3tuor .bind-phone-modal__modal-wrap__o7uvX .bind-phone-modal__modal-footer-wrap__Urh6o { flex-shrink: 0; display: flex; } .bind-phone-modal__modal-header__nofj9 { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .bind-phone-modal__modal-header__nofj9 .bind-phone-modal__modal-header-upload__3TgvQ { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .bind-phone-modal__modal-header__nofj9 .bind-phone-modal__modal-header-upload__3TgvQ:hover { background-color: #e0e9ff; } .bind-phone-modal__modal-header__nofj9 .bind-phone-modal__modal-header-upload__3TgvQ:active { background-color: #ccdaff; } .bind-phone-modal__modal-header__nofj9 .bind-phone-modal__modal-header-upload__3TgvQ .bind-phone-modal__upload-img__1ItDV { font-size: 16px; margin-right: calc(2px); } .bind-phone-modal__modal-header__nofj9 .bind-phone-modal__modal-header-upload__3TgvQ .bind-phone-modal__upload-label__BgK5c { font-size: 14px; } .bind-phone-modal__modal-header__nofj9 .bind-phone-modal__modal-header-upload__3TgvQ .bind-phone-modal__upload-input__23gZo { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .bind-phone-modal__modal-header__nofj9 .bind-phone-modal__modal-header-search__Co4xa { position: relative; } .bind-phone-modal__modal-header__nofj9 .bind-phone-modal__modal-header-search__Co4xa .bind-phone-modal__search-input__3ivaq { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .bind-phone-modal__modal-header__nofj9 .bind-phone-modal__modal-header-search__Co4xa .bind-phone-modal__search-input__3ivaq::-webkit-input-placeholder { color: #98a2b4; } .bind-phone-modal__modal-header__nofj9 .bind-phone-modal__modal-header-search__Co4xa .bind-phone-modal__search-input__3ivaq::-moz-placeholder { color: #98a2b4; } .bind-phone-modal__modal-header__nofj9 .bind-phone-modal__modal-header-search__Co4xa .bind-phone-modal__search-input__3ivaq:-ms-input-placeholder { color: #98a2b4; } .bind-phone-modal__modal-header__nofj9 .bind-phone-modal__modal-header-search__Co4xa .bind-phone-modal__search-input__3ivaq:hover { border-color: #d1d7e1; } .bind-phone-modal__modal-header__nofj9 .bind-phone-modal__modal-header-search__Co4xa .bind-phone-modal__search-input__3ivaq:active { border-color: #d1d7e1; } .bind-phone-modal__modal-header__nofj9 .bind-phone-modal__modal-header-search__Co4xa .bind-phone-modal__search-img__1TLQm { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .bind-phone-modal__modal-body__1U6f4 { flex-grow: 1; display: flex; } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-left__1Jq_6, .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-main__2P2XU { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-left__1Jq_6 { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-left__1Jq_6 .bind-phone-modal__modal-body-left-scroll__2vcI_ { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-left__1Jq_6 .bind-phone-modal__modal-body-left-scroll__2vcI_ .bind-phone-modal__modal-body-left-inner__1t4PE { width: 121px; padding: calc(12px); color: #5e6b81; } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-left__1Jq_6 .bind-phone-modal__modal-body-left-scroll__2vcI_ .bind-phone-modal__modal-body-left-inner__1t4PE .bind-phone-modal__menu-item-current__1-giQ { color: var(--theme-primary); background-color: #e0e9ff; } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-left__1Jq_6 .bind-phone-modal__modal-body-left-scroll__2vcI_ .bind-phone-modal__modal-body-left-inner__1t4PE .bind-phone-modal__menu-item__1tAmd { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-left__1Jq_6 .bind-phone-modal__modal-body-left-scroll__2vcI_ .bind-phone-modal__modal-body-left-inner__1t4PE .bind-phone-modal__menu-item__1tAmd:hover { background-color: #edeff5; } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-left__1Jq_6 .bind-phone-modal__modal-body-left-scroll__2vcI_ .bind-phone-modal__modal-body-left-inner__1t4PE .bind-phone-modal__menu-item__1tAmd .bind-phone-modal__menu-item-img__1JD28 { flex-shrink: 0; width: 20px; margin-right: 8px; } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-left__1Jq_6 .bind-phone-modal__modal-body-left-scroll__2vcI_ .bind-phone-modal__modal-body-left-inner__1t4PE .bind-phone-modal__menu-item__1tAmd .bind-phone-modal__menu-item-label__1v5qV { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-main__2P2XU { padding: calc(12px) 0; } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-main__2P2XU .bind-phone-modal__modal-body-main-scroll__1j1AZ { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-main__2P2XU .bind-phone-modal__modal-body-main-scroll__1j1AZ .bind-phone-modal__modal-body-main-inner__3pZiD { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-main__2P2XU .bind-phone-modal__modal-body-main-scroll__1j1AZ .bind-phone-modal__modal-body-main-inner__3pZiD .bind-phone-modal__selector-btn-add__2A3mz, .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-main__2P2XU .bind-phone-modal__modal-body-main-scroll__1j1AZ .bind-phone-modal__modal-body-main-inner__3pZiD .bind-phone-modal__selector-btn-item__3D134 { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-main__2P2XU .bind-phone-modal__modal-body-main-scroll__1j1AZ .bind-phone-modal__modal-body-main-inner__3pZiD .bind-phone-modal__selector-btn-add__2A3mz:hover, .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-main__2P2XU .bind-phone-modal__modal-body-main-scroll__1j1AZ .bind-phone-modal__modal-body-main-inner__3pZiD .bind-phone-modal__selector-btn-item__3D134:hover { background-color: #e0e9ff; } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-main__2P2XU .bind-phone-modal__modal-body-main-scroll__1j1AZ .bind-phone-modal__modal-body-main-inner__3pZiD .bind-phone-modal__selector-btn-add__2A3mz:active, .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-main__2P2XU .bind-phone-modal__modal-body-main-scroll__1j1AZ .bind-phone-modal__modal-body-main-inner__3pZiD .bind-phone-modal__selector-btn-item__3D134:active { background-color: #ccdaff; } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-main__2P2XU .bind-phone-modal__modal-body-main-scroll__1j1AZ .bind-phone-modal__modal-body-main-inner__3pZiD .bind-phone-modal__selector-btn-add__2A3mz:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-main__2P2XU .bind-phone-modal__modal-body-main-scroll__1j1AZ .bind-phone-modal__modal-body-main-inner__3pZiD .bind-phone-modal__selector-btn-add__2A3mz:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-main__2P2XU .bind-phone-modal__modal-body-main-scroll__1j1AZ .bind-phone-modal__modal-body-main-inner__3pZiD .bind-phone-modal__selector-btn-add__2A3mz .bind-phone-modal__add-img__-xMKp { font-size: 28px; height: auto; margin-bottom: 8px; } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-main__2P2XU .bind-phone-modal__modal-body-main-scroll__1j1AZ .bind-phone-modal__modal-body-main-inner__3pZiD .bind-phone-modal__selector-btn-add__2A3mz .bind-phone-modal__add-label__148d8 { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-main__2P2XU .bind-phone-modal__modal-body-main-scroll__1j1AZ .bind-phone-modal__modal-body-main-inner__3pZiD .bind-phone-modal__selector-btn-item__3D134 { justify-content: space-between; } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-main__2P2XU .bind-phone-modal__modal-body-main-scroll__1j1AZ .bind-phone-modal__modal-body-main-inner__3pZiD .bind-phone-modal__selector-btn-item__3D134 .bind-phone-modal__item-img__xd9iN { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-main__2P2XU .bind-phone-modal__modal-body-main-scroll__1j1AZ .bind-phone-modal__modal-body-main-inner__3pZiD .bind-phone-modal__selector-btn-item__3D134 .bind-phone-modal__item-img__xd9iN img { width: auto; height: 105px; } .bind-phone-modal__modal-body__1U6f4 .bind-phone-modal__modal-body-main__2P2XU .bind-phone-modal__modal-body-main-scroll__1j1AZ .bind-phone-modal__modal-body-main-inner__3pZiD .bind-phone-modal__selector-btn-item__3D134 .bind-phone-modal__item-label__PJ7cX { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .bind-phone-modal__modal-footer__2eHic { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .bind-phone-modal__selector-btn-add__2A3mz, .bind-phone-modal__selector-btn-item__3D134 { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .bind-phone-modal__selector-btn-add__2A3mz { background-color: var(--selector-sprite-bg_primary); } .bind-phone-modal__selector-btn-add__2A3mz:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .bind-phone-modal__selector-btn-add__2A3mz:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .bind-phone-modal__selector-btn-add__2A3mz .bind-phone-modal__add-img__-xMKp { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .bind-phone-modal__selector-btn-add__2A3mz .bind-phone-modal__add-label__148d8 { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .bind-phone-modal__selector-btn-item__3D134 { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .bind-phone-modal__selector-btn-item__3D134 .bind-phone-modal__item-img__xd9iN { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .bind-phone-modal__selector-btn-item__3D134 .bind-phone-modal__item-img__xd9iN img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .bind-phone-modal__selector-btn-item__3D134 .bind-phone-modal__item-label__PJ7cX { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .bind-phone-modal__selector-btn-item__3D134:hover { background-color: var(--selector-sprite-bg_primary); } .bind-phone-modal__selector-btn-item__3D134:hover .bind-phone-modal__item-img__xd9iN { border-color: var(--selector-sprite-bg_primary); } .bind-phone-modal__selector-btn-item_selected__1Lt7z { background-color: var(--selector-sprite-bg_primary); } .bind-phone-modal__selector-btn-item_selected__1Lt7z .bind-phone-modal__item-img__xd9iN { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .bind-phone-modal__menu-bar-btn__2rwtl { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .bind-phone-modal__menu-bar-btn_green__3aifo, .bind-phone-modal__menu-bar-btn_create__1fy8e { background-color: #3cdc8f; } .bind-phone-modal__menu-bar-btn_green__3aifo:hover, .bind-phone-modal__menu-bar-btn_create__1fy8e:hover { background-color: #00d374; } .bind-phone-modal__menu-bar-btn_green__3aifo:active, .bind-phone-modal__menu-bar-btn_create__1fy8e:active { background-color: #00d374; } .bind-phone-modal__menu-bar-btn_save__kLTWx, .bind-phone-modal__menu-bar-btn_reset__3K4oM { background-color: #6ac8ff; } .bind-phone-modal__menu-bar-btn_save__kLTWx:hover, .bind-phone-modal__menu-bar-btn_reset__3K4oM:hover { background-color: #57bcfe; } .bind-phone-modal__menu-bar-btn_save__kLTWx:active, .bind-phone-modal__menu-bar-btn_reset__3K4oM:active { background-color: #4fb0fc; } .bind-phone-modal__menu-bar-btn_submit__32-jz, .bind-phone-modal__menu-bar-btn_open__14hjX { background-color: #ff9e23; } .bind-phone-modal__menu-bar-btn_submit__32-jz:hover, .bind-phone-modal__menu-bar-btn_open__14hjX:hover { background-color: #f47b04; } .bind-phone-modal__menu-bar-btn_submit__32-jz:active, .bind-phone-modal__menu-bar-btn_open__14hjX:active { background-color: #fe8f22; } .bind-phone-modal__menu-bar-btn_link__37Yc6 { background-color: #e8efff; color: var(--theme-primary); } .bind-phone-modal__menu-bar-btn_link__37Yc6:hover { background-color: #b6c7ff; } .bind-phone-modal__menu-bar-btn_link__37Yc6:active { background-color: #cfdcff; } .bind-phone-modal__menu-bar-btn_disabled__3A3OR { color: #565266; background-color: #e6e9ed; } .bind-phone-modal__menu-bar-btn_disabled__3A3OR:hover { cursor: not-allowed; } .bind-phone-modal__menu-bar-btn_help__1MdNJ { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .bind-phone-modal__menu-bar-btn_help__1MdNJ:hover { background-color: #8398ff; } .bind-phone-modal__menu-bar-btn_help__1MdNJ:active { background-color: #8ca3ff; } .bind-phone-modal__menu-bar-separator__2LaKt { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .bind-phone-modal__bindPhone-modal-mask__1QgU2 { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__modal-wrap__o7uvX { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__modal-wrap__o7uvX .bind-phone-modal__modal-header-wrap__t7Tv2 { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__modal-wrap__o7uvX .bind-phone-modal__modal-header-wrap__t7Tv2 .bind-phone-modal__modal-header-bg__2DHj_ { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__modal-wrap__o7uvX .bind-phone-modal__modal-header-wrap__t7Tv2 .bind-phone-modal__modal-header-label__1ygXE { flex-shrink: 0; font-size: 16px; font-weight: bold; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__modal-wrap__o7uvX .bind-phone-modal__modal-header-wrap__t7Tv2 .bind-phone-modal__modal-header-close__2r5lL { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__modal-wrap__o7uvX .bind-phone-modal__modal-header-wrap__t7Tv2 .bind-phone-modal__modal-header-close__2r5lL:hover { color: #98a2b4; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__modal-wrap__o7uvX .bind-phone-modal__modal-body-wrap__1uLqY { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__modal-wrap__o7uvX .bind-phone-modal__modal-footer-wrap__Urh6o { flex-shrink: 0; display: flex; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__bindPhone-modal__KVdq- { position: relative; width: 448px; height: 235px; background-color: #ffffff; box-shadow: 0px 2px 8px rgba(30, 30, 40, 0.15); border-radius: 12px; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__bindPhone-modal__KVdq- .bind-phone-modal__bindPhone-modal-header__2Qlwx { width: 100%; height: 40px; padding-left: 20px; line-height: 40px; font-size: 16px; font-weight: bold; color: #3d4554; border-bottom: 1px solid #e8efff; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__bindPhone-modal__KVdq- .bind-phone-modal__bindPhone-close__3kvYw { position: absolute; top: 15px; right: 22px; font-size: 16px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__bindPhone-modal__KVdq- .bind-phone-modal__bindPhone-close__3kvYw:hover { color: #98a2b4; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__bindPhone-modal__KVdq- .bind-phone-modal__bindPhone-modal-form__rMZXQ { padding: 20px 20px 24px 20px; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__bindPhone-modal__KVdq- .bind-phone-modal__bindPhone-modal-form__rMZXQ .ant-form .ant-form-item .ant-input { border-color: #e8efff; border-radius: 4px; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__bindPhone-modal__KVdq- .bind-phone-modal__bindPhone-modal-form__rMZXQ .ant-form .ant-form-item.ant-form-item-has-error .ant-input { border-color: #ff4d4f; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__bindPhone-modal__KVdq- .bind-phone-modal__bindPhone-modal-form__rMZXQ .bind-phone-modal__bindPhone-modal-getCode__33CuU { position: absolute; top: 0; right: 0; height: 32px; line-height: 32px; padding-right: 12px; color: rgba(106, 127, 255, 0.5); } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__bindPhone-modal__KVdq- .bind-phone-modal__bindPhone-modal-form__rMZXQ .bind-phone-modal__bindPhone-modal-getCode__33CuU.bind-phone-modal__bindPhone-modal-getCode_active__T-nHr { color: var(--theme-primary); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__bindPhone-modal__KVdq- .bind-phone-modal__bindPhone-modal-form__rMZXQ .bind-phone-modal__bindPhone-btns__FhqaE { display: flex; justify-content: flex-end; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__bindPhone-modal__KVdq- .bind-phone-modal__bindPhone-modal-form__rMZXQ .bind-phone-modal__bindPhone-btns__FhqaE .bind-phone-modal__bindPhone-btn__A_R90 { width: 112px; height: 40px; line-height: 40px; font-size: 16px; font-weight: bold; text-align: center; border-radius: 20px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__bindPhone-modal__KVdq- .bind-phone-modal__bindPhone-modal-form__rMZXQ .bind-phone-modal__bindPhone-btns__FhqaE .bind-phone-modal__bindPhone-btn__A_R90.bind-phone-modal__bindPhone-btn_cancel__3tgda { background: linear-gradient(0deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.1)), #edeff5; color: #4d586a; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__bindPhone-modal__KVdq- .bind-phone-modal__bindPhone-modal-form__rMZXQ .bind-phone-modal__bindPhone-btns__FhqaE .bind-phone-modal__bindPhone-btn__A_R90.bind-phone-modal__bindPhone-btn_cancel__3tgda:hover { background: linear-gradient(0deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.1)), #d1d7e1; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__bindPhone-modal__KVdq- .bind-phone-modal__bindPhone-modal-form__rMZXQ .bind-phone-modal__bindPhone-btns__FhqaE .bind-phone-modal__bindPhone-btn__A_R90.bind-phone-modal__bindPhone-btn_cancel__3tgda:active { background: linear-gradient(0deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.1)), #b5bccb; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__bindPhone-modal__KVdq- .bind-phone-modal__bindPhone-modal-form__rMZXQ .bind-phone-modal__bindPhone-btns__FhqaE .bind-phone-modal__bindPhone-btn__A_R90.bind-phone-modal__bindPhone-btn_confirm__2r-zz { margin-left: 16px; background-color: var(--theme-primary); color: #ffffff; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__bindPhone-modal__KVdq- .bind-phone-modal__bindPhone-modal-form__rMZXQ .bind-phone-modal__bindPhone-btns__FhqaE .bind-phone-modal__bindPhone-btn__A_R90.bind-phone-modal__bindPhone-btn_confirm__2r-zz:hover { background-color: #4250d3; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__bindPhone-modal__KVdq- .bind-phone-modal__bindPhone-modal-form__rMZXQ .bind-phone-modal__bindPhone-btns__FhqaE .bind-phone-modal__bindPhone-btn__A_R90.bind-phone-modal__bindPhone-btn_confirm__2r-zz:active { background-color: #222ba6; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__bindPhone-modal__KVdq- .bind-phone-modal__bindPhone-modal-form__rMZXQ .bind-phone-modal__bindPhone-btns__FhqaE .bind-phone-modal__bindPhone-btn__A_R90.bind-phone-modal__bindPhone-btn_confirm__2r-zz.bind-phone-modal__bindPhone-btn_confirm_disabled__2cFen { background-color: #b4bfff; cursor: not-allowed; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__bindPhone-modal__KVdq- .bind-phone-modal__bindPhone-modal-form__rMZXQ .bind-phone-modal__bindPhone-btns__FhqaE .bind-phone-modal__bindPhone-btn__A_R90.bind-phone-modal__bindPhone-btn_confirm__2r-zz.bind-phone-modal__bindPhone-btn_confirm_disabled__2cFen:hover { background-color: #b4bfff; } .bind-phone-modal__bindPhone-modal-mask__1QgU2 .bind-phone-modal__bindPhone-modal__KVdq- .bind-phone-modal__bindPhone-modal-form__rMZXQ .bind-phone-modal__bindPhone-btns__FhqaE .bind-phone-modal__bindPhone-btn__A_R90.bind-phone-modal__bindPhone-btn_confirm__2r-zz.bind-phone-modal__bindPhone-btn_confirm_disabled__2cFen:active { background-color: #b4bfff; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .login-modal__flex-center__oDvq6 { display: flex; align-items: center; justify-content: center; } .login-modal__full-filled__3_iof { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .login-modal__modal-mask__2kLY1 { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .login-modal__modal-mask__2kLY1 .login-modal__modal-wrap__Wi_Dn { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .login-modal__modal-mask__2kLY1 .login-modal__modal-wrap__Wi_Dn .login-modal__modal-header-wrap__2mXOv { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .login-modal__modal-mask__2kLY1 .login-modal__modal-wrap__Wi_Dn .login-modal__modal-header-wrap__2mXOv .login-modal__modal-header-bg__2uBm6 { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .login-modal__modal-mask__2kLY1 .login-modal__modal-wrap__Wi_Dn .login-modal__modal-header-wrap__2mXOv .login-modal__modal-header-label__2-IuN { flex-shrink: 0; font-size: 16px; font-weight: bold; } .login-modal__modal-mask__2kLY1 .login-modal__modal-wrap__Wi_Dn .login-modal__modal-header-wrap__2mXOv .login-modal__modal-header-close__2trMn { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .login-modal__modal-mask__2kLY1 .login-modal__modal-wrap__Wi_Dn .login-modal__modal-header-wrap__2mXOv .login-modal__modal-header-close__2trMn:hover { color: #98a2b4; } .login-modal__modal-mask__2kLY1 .login-modal__modal-wrap__Wi_Dn .login-modal__modal-body-wrap__3UKSN { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .login-modal__modal-mask__2kLY1 .login-modal__modal-wrap__Wi_Dn .login-modal__modal-footer-wrap__k6lyP { flex-shrink: 0; display: flex; } .login-modal__modal-header__2_-0L { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .login-modal__modal-header__2_-0L .login-modal__modal-header-upload__1wJuL { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .login-modal__modal-header__2_-0L .login-modal__modal-header-upload__1wJuL:hover { background-color: #e0e9ff; } .login-modal__modal-header__2_-0L .login-modal__modal-header-upload__1wJuL:active { background-color: #ccdaff; } .login-modal__modal-header__2_-0L .login-modal__modal-header-upload__1wJuL .login-modal__upload-img__d2421 { font-size: 16px; margin-right: calc(2px); } .login-modal__modal-header__2_-0L .login-modal__modal-header-upload__1wJuL .login-modal__upload-label__hGbiy { font-size: 14px; } .login-modal__modal-header__2_-0L .login-modal__modal-header-upload__1wJuL .login-modal__upload-input__22Ucr { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .login-modal__modal-header__2_-0L .login-modal__modal-header-search__ieviv { position: relative; } .login-modal__modal-header__2_-0L .login-modal__modal-header-search__ieviv .login-modal__search-input__2crGK { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .login-modal__modal-header__2_-0L .login-modal__modal-header-search__ieviv .login-modal__search-input__2crGK::-webkit-input-placeholder { color: #98a2b4; } .login-modal__modal-header__2_-0L .login-modal__modal-header-search__ieviv .login-modal__search-input__2crGK::-moz-placeholder { color: #98a2b4; } .login-modal__modal-header__2_-0L .login-modal__modal-header-search__ieviv .login-modal__search-input__2crGK:-ms-input-placeholder { color: #98a2b4; } .login-modal__modal-header__2_-0L .login-modal__modal-header-search__ieviv .login-modal__search-input__2crGK:hover { border-color: #d1d7e1; } .login-modal__modal-header__2_-0L .login-modal__modal-header-search__ieviv .login-modal__search-input__2crGK:active { border-color: #d1d7e1; } .login-modal__modal-header__2_-0L .login-modal__modal-header-search__ieviv .login-modal__search-img__3Hp4F { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .login-modal__modal-body__1mE-w { flex-grow: 1; display: flex; } .login-modal__modal-body__1mE-w .login-modal__modal-body-left__16RcW, .login-modal__modal-body__1mE-w .login-modal__modal-body-main__2sf7p { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .login-modal__modal-body__1mE-w .login-modal__modal-body-left__16RcW { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .login-modal__modal-body__1mE-w .login-modal__modal-body-left__16RcW .login-modal__modal-body-left-scroll__3UfcX { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .login-modal__modal-body__1mE-w .login-modal__modal-body-left__16RcW .login-modal__modal-body-left-scroll__3UfcX .login-modal__modal-body-left-inner__3KRgC { width: 121px; padding: calc(12px); color: #5e6b81; } .login-modal__modal-body__1mE-w .login-modal__modal-body-left__16RcW .login-modal__modal-body-left-scroll__3UfcX .login-modal__modal-body-left-inner__3KRgC .login-modal__menu-item-current__2q2tO { color: var(--theme-primary); background-color: #e0e9ff; } .login-modal__modal-body__1mE-w .login-modal__modal-body-left__16RcW .login-modal__modal-body-left-scroll__3UfcX .login-modal__modal-body-left-inner__3KRgC .login-modal__menu-item__2lqIU { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .login-modal__modal-body__1mE-w .login-modal__modal-body-left__16RcW .login-modal__modal-body-left-scroll__3UfcX .login-modal__modal-body-left-inner__3KRgC .login-modal__menu-item__2lqIU:hover { background-color: #edeff5; } .login-modal__modal-body__1mE-w .login-modal__modal-body-left__16RcW .login-modal__modal-body-left-scroll__3UfcX .login-modal__modal-body-left-inner__3KRgC .login-modal__menu-item__2lqIU .login-modal__menu-item-img__3q_sR { flex-shrink: 0; width: 20px; margin-right: 8px; } .login-modal__modal-body__1mE-w .login-modal__modal-body-left__16RcW .login-modal__modal-body-left-scroll__3UfcX .login-modal__modal-body-left-inner__3KRgC .login-modal__menu-item__2lqIU .login-modal__menu-item-label__1y2Kx { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .login-modal__modal-body__1mE-w .login-modal__modal-body-main__2sf7p { padding: calc(12px) 0; } .login-modal__modal-body__1mE-w .login-modal__modal-body-main__2sf7p .login-modal__modal-body-main-scroll__2U3Fj { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .login-modal__modal-body__1mE-w .login-modal__modal-body-main__2sf7p .login-modal__modal-body-main-scroll__2U3Fj .login-modal__modal-body-main-inner__3Ipcy { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .login-modal__modal-body__1mE-w .login-modal__modal-body-main__2sf7p .login-modal__modal-body-main-scroll__2U3Fj .login-modal__modal-body-main-inner__3Ipcy .login-modal__selector-btn-add__3s-WZ, .login-modal__modal-body__1mE-w .login-modal__modal-body-main__2sf7p .login-modal__modal-body-main-scroll__2U3Fj .login-modal__modal-body-main-inner__3Ipcy .login-modal__selector-btn-item__29W3V { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .login-modal__modal-body__1mE-w .login-modal__modal-body-main__2sf7p .login-modal__modal-body-main-scroll__2U3Fj .login-modal__modal-body-main-inner__3Ipcy .login-modal__selector-btn-add__3s-WZ:hover, .login-modal__modal-body__1mE-w .login-modal__modal-body-main__2sf7p .login-modal__modal-body-main-scroll__2U3Fj .login-modal__modal-body-main-inner__3Ipcy .login-modal__selector-btn-item__29W3V:hover { background-color: #e0e9ff; } .login-modal__modal-body__1mE-w .login-modal__modal-body-main__2sf7p .login-modal__modal-body-main-scroll__2U3Fj .login-modal__modal-body-main-inner__3Ipcy .login-modal__selector-btn-add__3s-WZ:active, .login-modal__modal-body__1mE-w .login-modal__modal-body-main__2sf7p .login-modal__modal-body-main-scroll__2U3Fj .login-modal__modal-body-main-inner__3Ipcy .login-modal__selector-btn-item__29W3V:active { background-color: #ccdaff; } .login-modal__modal-body__1mE-w .login-modal__modal-body-main__2sf7p .login-modal__modal-body-main-scroll__2U3Fj .login-modal__modal-body-main-inner__3Ipcy .login-modal__selector-btn-add__3s-WZ:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .login-modal__modal-body__1mE-w .login-modal__modal-body-main__2sf7p .login-modal__modal-body-main-scroll__2U3Fj .login-modal__modal-body-main-inner__3Ipcy .login-modal__selector-btn-add__3s-WZ:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .login-modal__modal-body__1mE-w .login-modal__modal-body-main__2sf7p .login-modal__modal-body-main-scroll__2U3Fj .login-modal__modal-body-main-inner__3Ipcy .login-modal__selector-btn-add__3s-WZ .login-modal__add-img__3bXFN { font-size: 28px; height: auto; margin-bottom: 8px; } .login-modal__modal-body__1mE-w .login-modal__modal-body-main__2sf7p .login-modal__modal-body-main-scroll__2U3Fj .login-modal__modal-body-main-inner__3Ipcy .login-modal__selector-btn-add__3s-WZ .login-modal__add-label__2h6cZ { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .login-modal__modal-body__1mE-w .login-modal__modal-body-main__2sf7p .login-modal__modal-body-main-scroll__2U3Fj .login-modal__modal-body-main-inner__3Ipcy .login-modal__selector-btn-item__29W3V { justify-content: space-between; } .login-modal__modal-body__1mE-w .login-modal__modal-body-main__2sf7p .login-modal__modal-body-main-scroll__2U3Fj .login-modal__modal-body-main-inner__3Ipcy .login-modal__selector-btn-item__29W3V .login-modal__item-img__2VvjA { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .login-modal__modal-body__1mE-w .login-modal__modal-body-main__2sf7p .login-modal__modal-body-main-scroll__2U3Fj .login-modal__modal-body-main-inner__3Ipcy .login-modal__selector-btn-item__29W3V .login-modal__item-img__2VvjA img { width: auto; height: 105px; } .login-modal__modal-body__1mE-w .login-modal__modal-body-main__2sf7p .login-modal__modal-body-main-scroll__2U3Fj .login-modal__modal-body-main-inner__3Ipcy .login-modal__selector-btn-item__29W3V .login-modal__item-label__3UXBm { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .login-modal__modal-footer__3bMYD { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .login-modal__selector-btn-add__3s-WZ, .login-modal__selector-btn-item__29W3V { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .login-modal__selector-btn-add__3s-WZ { background-color: var(--selector-sprite-bg_primary); } .login-modal__selector-btn-add__3s-WZ:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .login-modal__selector-btn-add__3s-WZ:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .login-modal__selector-btn-add__3s-WZ .login-modal__add-img__3bXFN { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .login-modal__selector-btn-add__3s-WZ .login-modal__add-label__2h6cZ { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .login-modal__selector-btn-item__29W3V { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .login-modal__selector-btn-item__29W3V .login-modal__item-img__2VvjA { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .login-modal__selector-btn-item__29W3V .login-modal__item-img__2VvjA img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .login-modal__selector-btn-item__29W3V .login-modal__item-label__3UXBm { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .login-modal__selector-btn-item__29W3V:hover { background-color: var(--selector-sprite-bg_primary); } .login-modal__selector-btn-item__29W3V:hover .login-modal__item-img__2VvjA { border-color: var(--selector-sprite-bg_primary); } .login-modal__selector-btn-item_selected__XXrUA { background-color: var(--selector-sprite-bg_primary); } .login-modal__selector-btn-item_selected__XXrUA .login-modal__item-img__2VvjA { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .login-modal__menu-bar-btn__3_Lml { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .login-modal__menu-bar-btn_green__1-vGZ, .login-modal__menu-bar-btn_create__2cHu3 { background-color: #3cdc8f; } .login-modal__menu-bar-btn_green__1-vGZ:hover, .login-modal__menu-bar-btn_create__2cHu3:hover { background-color: #00d374; } .login-modal__menu-bar-btn_green__1-vGZ:active, .login-modal__menu-bar-btn_create__2cHu3:active { background-color: #00d374; } .login-modal__menu-bar-btn_save__2rQA1, .login-modal__menu-bar-btn_reset__3cd7F { background-color: #6ac8ff; } .login-modal__menu-bar-btn_save__2rQA1:hover, .login-modal__menu-bar-btn_reset__3cd7F:hover { background-color: #57bcfe; } .login-modal__menu-bar-btn_save__2rQA1:active, .login-modal__menu-bar-btn_reset__3cd7F:active { background-color: #4fb0fc; } .login-modal__menu-bar-btn_submit__hT4MA, .login-modal__menu-bar-btn_open__1pmcB { background-color: #ff9e23; } .login-modal__menu-bar-btn_submit__hT4MA:hover, .login-modal__menu-bar-btn_open__1pmcB:hover { background-color: #f47b04; } .login-modal__menu-bar-btn_submit__hT4MA:active, .login-modal__menu-bar-btn_open__1pmcB:active { background-color: #fe8f22; } .login-modal__menu-bar-btn_link__1AA-0 { background-color: #e8efff; color: var(--theme-primary); } .login-modal__menu-bar-btn_link__1AA-0:hover { background-color: #b6c7ff; } .login-modal__menu-bar-btn_link__1AA-0:active { background-color: #cfdcff; } .login-modal__menu-bar-btn_disabled__2iq2I { color: #565266; background-color: #e6e9ed; } .login-modal__menu-bar-btn_disabled__2iq2I:hover { cursor: not-allowed; } .login-modal__menu-bar-btn_help__2QhNP { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .login-modal__menu-bar-btn_help__2QhNP:hover { background-color: #8398ff; } .login-modal__menu-bar-btn_help__2QhNP:active { background-color: #8ca3ff; } .login-modal__menu-bar-separator__22jmo { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .login-modal__login-modal-mask__nbhtw { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .login-modal__login-modal-mask__nbhtw .login-modal__modal-wrap__Wi_Dn { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .login-modal__login-modal-mask__nbhtw .login-modal__modal-wrap__Wi_Dn .login-modal__modal-header-wrap__2mXOv { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .login-modal__login-modal-mask__nbhtw .login-modal__modal-wrap__Wi_Dn .login-modal__modal-header-wrap__2mXOv .login-modal__modal-header-bg__2uBm6 { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .login-modal__login-modal-mask__nbhtw .login-modal__modal-wrap__Wi_Dn .login-modal__modal-header-wrap__2mXOv .login-modal__modal-header-label__2-IuN { flex-shrink: 0; font-size: 16px; font-weight: bold; } .login-modal__login-modal-mask__nbhtw .login-modal__modal-wrap__Wi_Dn .login-modal__modal-header-wrap__2mXOv .login-modal__modal-header-close__2trMn { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .login-modal__login-modal-mask__nbhtw .login-modal__modal-wrap__Wi_Dn .login-modal__modal-header-wrap__2mXOv .login-modal__modal-header-close__2trMn:hover { color: #98a2b4; } .login-modal__login-modal-mask__nbhtw .login-modal__modal-wrap__Wi_Dn .login-modal__modal-body-wrap__3UKSN { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .login-modal__login-modal-mask__nbhtw .login-modal__modal-wrap__Wi_Dn .login-modal__modal-footer-wrap__k6lyP { flex-shrink: 0; display: flex; } .login-modal__login-modal__2RAyC { position: relative; width: 464px; height: 610px; background-color: #ffffff; border-radius: 24px; } .login-modal__login-modal__2RAyC .login-modal__login-banner__hqnt3 { width: 464px; height: 140px; background-size: 100% auto; background-repeat: no-repeat; border-radius: 24px 24px 0 0; } .login-modal__login-modal__2RAyC .login-modal__login-close-wrap__13KU1 { position: absolute; top: 16px; right: 16px; display: flex; justify-content: center; align-items: center; width: 24px; height: 24px; background-color: rgba(0, 0, 0, 0.4); border-radius: 4.8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .login-modal__login-modal__2RAyC .login-modal__login-close-wrap__13KU1:hover { background-color: rgba(0, 0, 0, 0.6); } .login-modal__login-modal__2RAyC .login-modal__login-close-wrap__13KU1 .login-modal__login-close__2seXx { font-size: 16px; color: #ffffff; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 { padding: 0 40px; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-tabs__1dSqO { display: flex; height: 54px; padding-top: 20px; border-bottom: 1px solid #edeff5; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-tabs__1dSqO .login-modal__login-tab__3PtIc { position: relative; line-height: 26px; font-size: 18px; color: #828da3; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-tabs__1dSqO .login-modal__login-tab__3PtIc:first-child { margin-right: 72px; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-tabs__1dSqO .login-modal__login-tab__3PtIc:hover { color: #5e6b81; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-tabs__1dSqO .login-modal__login-tab__3PtIc.login-modal__login-tab-active__7UdQO { font-weight: bold; color: #3d4554; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-tabs__1dSqO .login-modal__login-tab__3PtIc.login-modal__login-tab-active__7UdQO::after { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 4px; background-color: #3d4554; border-radius: 2px; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-btns__3ZKk2 { position: relative; display: flex; justify-content: space-around; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-btns__3ZKk2::after { position: absolute; left: 50%; top: 50%; transform: translateY(-50%); width: 1px; height: 16px; background-color: #edeff5; content: ''; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-btns__3ZKk2 .login-modal__login-btn__1r_2K { text-align: center; font-size: 16px; color: #3d4554; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-btns__3ZKk2 .login-modal__login-btn__1r_2K svg { margin-right: 5px; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-btns__3ZKk2 .login-modal__login-btn__1r_2K:hover { color: var(--theme-primary); } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-btns__3ZKk2 .login-modal__login-btn__1r_2K:active { color: #586ef5; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT { display: block; padding-top: 24px; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .login-modal__login-label__27cCn { margin-bottom: 8px; line-height: 20px; font-size: 14px; color: #5e6b81; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form { border-bottom: 1px solid transparent; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item .ant-checkbox-checked::after { border-radius: 4px; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item .ant-input:not([id='password'], [id='passwordAgain']) { height: 48px; background-color: #f5f6fa; border-width: 2px !important; border-color: #f5f6fa; color: #3d4554; border-radius: 8px; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item .ant-input:not([id='password'], [id='passwordAgain']):hover { background-color: #edeff5; border-color: #edeff5; box-shadow: none; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item .ant-input:not([id='password'], [id='passwordAgain']):hover:-internal-autofill-selected { box-shadow: inset 0 0 0 1000px #edeff5 !important; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item .ant-input:not([id='password'], [id='passwordAgain']):focus { border-color: var(--theme-primary); box-shadow: none; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item .ant-input:not([id='password'], [id='passwordAgain'])::-webkit-input-placeholder { color: #b5bccb; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item .ant-input:not([id='password'], [id='passwordAgain']):-internal-autofill-selected { box-shadow: inset 0 0 0 1000px #f5f6fa !important; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item .ant-input-password { height: 48px; background-color: #f5f6fa; border-width: 2px !important; border-color: transparent; border-radius: 8px; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item .ant-input-password:hover { background-color: #edeff5; box-shadow: none; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item .ant-input-password:hover:-internal-autofill-selected { box-shadow: inset 0 0 0 1000px #edeff5 !important; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item .ant-input-password:hover .ant-input:-internal-autofill-selected { box-shadow: inset 0 0 0 1000px #edeff5 !important; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item .ant-input-password.ant-input-affix-wrapper-focused { border-color: var(--theme-primary); box-shadow: none; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item .ant-input-password:-internal-autofill-selected { box-shadow: inset 0 0 0 1000px #f5f6fa !important; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item .ant-input-password .ant-input { background-color: transparent; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item .ant-input-password .ant-input::-webkit-input-placeholder { color: #b5bccb; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item .ant-input-password .ant-input:-internal-autofill-selected { box-shadow: inset 0 0 0 1000px #f5f6fa !important; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item .ant-input-password svg { font-size: 18px; color: #98a2b4; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item .ant-input-password svg:hover { color: #828da3; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item .ant-checkbox-inner { border-radius: 4px; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item.ant-form-item-with-help.ant-form-item-has-error .ant-input, .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item.ant-form-item-with-help.ant-form-item-has-error .ant-input-password { background-color: #fff0f0 !important; border-color: #ff4d4f !important; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item.ant-form-item-with-help.ant-form-item-has-error .ant-input:-internal-autofill-selected, .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item.ant-form-item-with-help.ant-form-item-has-error .ant-input-password:-internal-autofill-selected { box-shadow: inset 0 0 0 1000px #fff0f0 !important; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item.ant-form-item-with-help.ant-form-item-has-error .ant-form-item-explain-error { text-align: right; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item.ant-form-item-with-help .ant-form-item-explain.ant-form-item-explain-validating, .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item.ant-form-item-with-help .ant-form-item-explain.ant-form-item-explain-success { text-align: right; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item.ant-form-item-with-help .ant-form-item-explain.ant-form-item-explain-error { text-align: right; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item.ant-form-item-with-help .ant-form-item-explain, .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item.ant-form-item-with-help .ant-form-item-extra { text-align: right; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .ant-form .ant-form-item.ant-form-item-with-help .ant-show-leave { text-align: right; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .login-modal__checkbox-wrap__3sT1Y .ant-checkbox-wrapper { color: #5e6b81; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .login-modal__checkbox-wrap__3sT1Y .ant-form-item-with-help.ant-form-item-has-error .ant-input, .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .login-modal__checkbox-wrap__3sT1Y .ant-form-item-with-help.ant-form-item-has-error .ant-input-password { background-color: #fff0f0 !important; border-color: #ff4d4f !important; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .login-modal__checkbox-wrap__3sT1Y .ant-form-item-with-help.ant-form-item-has-error .ant-input:-internal-autofill-selected, .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .login-modal__checkbox-wrap__3sT1Y .ant-form-item-with-help.ant-form-item-has-error .ant-input-password:-internal-autofill-selected { box-shadow: inset 0 0 0 1000px #fff0f0 !important; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .login-modal__checkbox-wrap__3sT1Y .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-explain-error { text-align: left !important; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .login-modal__checkbox-wrap__3sT1Y .ant-form-item-with-help .ant-form-item-explain.ant-form-item-explain-validating, .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .login-modal__checkbox-wrap__3sT1Y .ant-form-item-with-help .ant-form-item-explain.ant-form-item-explain-success { text-align: left !important; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .login-modal__checkbox-wrap__3sT1Y .ant-form-item-with-help .ant-form-item-explain.ant-form-item-explain-error { text-align: left !important; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .login-modal__checkbox-wrap__3sT1Y .ant-form-item-with-help .ant-form-item-explain, .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .login-modal__checkbox-wrap__3sT1Y .ant-form-item-with-help .ant-form-item-extra { text-align: left !important; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .login-modal__checkbox-wrap__3sT1Y .ant-form-item-with-help .ant-show-leave { text-align: left !important; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .login-modal__bindPhone-modal-getCode__1wjAh { position: absolute; top: 0; right: 0; height: 48px; line-height: 48px; padding-right: 12px; color: rgba(106, 127, 255, 0.5); } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .login-modal__bindPhone-modal-getCode__1wjAh.login-modal__bindPhone-modal-getCode_active__1FhMd { color: var(--theme-primary); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .login-modal__confirm-btn__GM5Ze { width: 100%; height: 48px; margin-bottom: 24px; line-height: 48px; background-color: var(--theme-primary); font-size: 16px; font-weight: bold; color: #ffffff; text-align: center; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .login-modal__confirm-btn__GM5Ze:hover { background-color: #586ef5; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .login-modal__confirm-btn__GM5Ze:active { background-color: #4b62eb; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1 .login-modal__login-main__1FfmT .login-modal__confirm-btn__GM5Ze.login-modal__confirm-btn_disabled__3hYkG { background-color: #9cb0ff; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1.login-modal__register-and-reset__DadP4 { padding-top: 20px; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1.login-modal__register-and-reset__DadP4 .login-modal__login-title__1UnSe { font-weight: bold; font-size: 18px; line-height: 26px; color: #3d4554; text-align: center; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1.login-modal__register-and-reset__DadP4 .login-modal__login-main__1FfmT { padding-top: 0; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1.login-modal__register-and-reset__DadP4 .login-modal__login-main__1FfmT .login-modal__agree-service__2JdNU { margin-bottom: 5px; color: #828da3; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1.login-modal__register-and-reset__DadP4 .login-modal__login-main__1FfmT .login-modal__confirm-btn__GM5Ze { margin-bottom: 12px; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1.login-modal__register-and-reset__DadP4 .login-modal__login-main__1FfmT .login-modal__back-btn__3n5kd { width: 100%; height: 26px; line-height: 26px; font-size: 16px; font-weight: normal; color: #828da3; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1.login-modal__register-and-reset__DadP4 .login-modal__login-main__1FfmT .login-modal__back-btn__3n5kd:hover { color: #5e6b81; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1.login-modal__register-and-reset__DadP4 .login-modal__login-main__1FfmT .login-modal__back-btn__3n5kd:active { color: #3d4554; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1.login-modal__register-body__Yff8p { padding-top: 10px; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1.login-modal__reset-body__kz5xB .login-modal__login-main__1FfmT { margin-top: 24px; } .login-modal__login-modal__2RAyC .login-modal__login-body__10Sg1.login-modal__reset-body__kz5xB .login-modal__login-main__1FfmT .login-modal__confirm-btn__GM5Ze { margin: 48px 0 30px 0; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .service-modal__protocol-page__1mjS0 { width: 100vw; height: 100vh; position: fixed; top: 0; left: 0; background: rgba(0, 0, 0, 0.7); -webkit-user-select: none; -ms-user-select: none; user-select: none; } .service-modal__protocol-page__1mjS0 .service-modal__protocal-box__1vR9U { width: 680px; height: 480px; border-radius: 88px; padding: 40px 40px 32px; background: #ffffff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); margin-top: 30px; } .service-modal__protocol-page__1mjS0 .service-modal__protocal-box__1vR9U .service-modal__protocal-monkey__1zTKq { width: 497px; height: 122px; background-repeat: no-repeat; background-size: 100% auto; position: absolute; top: -112px; left: 50%; transform: translateX(-50%); } .service-modal__protocol-page__1mjS0 .service-modal__protocal-box__1vR9U .service-modal__protocal-close__1KmjT { position: absolute; top: -23px; right: -23px; cursor: pointer; } .service-modal__protocol-page__1mjS0 .service-modal__protocal-box__1vR9U .service-modal__protocal-close__1KmjT:hover { color: var(--global-color-primary); } .service-modal__protocol-page__1mjS0 .service-modal__protocal-box__1vR9U .service-modal__protocal-close__1KmjT svg { font-size: 46px; } .service-modal__protocol-page__1mjS0 .service-modal__protocal-box__1vR9U .service-modal__protocal-top__1CQiU { font-size: 20px; line-height: 16px; color: #000000; text-align: center; padding-bottom: 24px; font-weight: 600; } .service-modal__protocol-page__1mjS0 .service-modal__protocal-box__1vR9U .service-modal__protocal-content__3mMNV { height: 304px; border-radius: 24px; background: #f8f8f8; overflow-y: auto; padding: 20px; font-size: 14px; line-height: 22px; color: #666666; margin-bottom: 24px; } .service-modal__protocol-page__1mjS0 .service-modal__protocal-box__1vR9U .service-modal__protocal-content__3mMNV div { margin-bottom: 12px; word-break: break-all; } .service-modal__protocol-page__1mjS0 .service-modal__protocal-box__1vR9U .service-modal__protocal-content__3mMNV .service-modal__protocal-content-indent__3rPSf { text-indent: 2em; } .service-modal__protocol-page__1mjS0 .service-modal__protocal-box__1vR9U .service-modal__protocal-content__3mMNV .service-modal__font-bold__2OvGI { font-weight: bold; } .service-modal__protocol-page__1mjS0 .service-modal__protocal-box__1vR9U .service-modal__protocal-content__3mMNV .service-modal__content-title__1-aNf { font-weight: bold; color: #333; } .service-modal__protocol-page__1mjS0 .service-modal__protocal-box__1vR9U .service-modal__protocal-btns__29h93 { width: 100%; height: 40px; line-height: 40px; background-color: var(--theme-primary); text-align: center; font-size: 16px; color: #ffffff; border-radius: 20px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .service-modal__protocol-page__1mjS0 .service-modal__protocal-box__1vR9U .service-modal__protocal-btns__29h93:hover { background-color: #586ef5; } .service-modal__protocol-page__1mjS0 .service-modal__protocal-box__1vR9U .service-modal__protocal-btns__29h93:active { background-color: #4b62eb; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .reset-password-modal__flex-center__2T2BY { display: flex; align-items: center; justify-content: center; } .reset-password-modal__full-filled__3K4YX { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .reset-password-modal__modal-mask__gSSyM { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .reset-password-modal__modal-mask__gSSyM .reset-password-modal__modal-wrap__Y7l8u { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .reset-password-modal__modal-mask__gSSyM .reset-password-modal__modal-wrap__Y7l8u .reset-password-modal__modal-header-wrap__yVvR6 { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .reset-password-modal__modal-mask__gSSyM .reset-password-modal__modal-wrap__Y7l8u .reset-password-modal__modal-header-wrap__yVvR6 .reset-password-modal__modal-header-bg__fzR0o { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .reset-password-modal__modal-mask__gSSyM .reset-password-modal__modal-wrap__Y7l8u .reset-password-modal__modal-header-wrap__yVvR6 .reset-password-modal__modal-header-label__29soD { flex-shrink: 0; font-size: 16px; font-weight: bold; } .reset-password-modal__modal-mask__gSSyM .reset-password-modal__modal-wrap__Y7l8u .reset-password-modal__modal-header-wrap__yVvR6 .reset-password-modal__modal-header-close__1Cuf1 { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .reset-password-modal__modal-mask__gSSyM .reset-password-modal__modal-wrap__Y7l8u .reset-password-modal__modal-header-wrap__yVvR6 .reset-password-modal__modal-header-close__1Cuf1:hover { color: #98a2b4; } .reset-password-modal__modal-mask__gSSyM .reset-password-modal__modal-wrap__Y7l8u .reset-password-modal__modal-body-wrap__3WYLe { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .reset-password-modal__modal-mask__gSSyM .reset-password-modal__modal-wrap__Y7l8u .reset-password-modal__modal-footer-wrap__12lWN { flex-shrink: 0; display: flex; } .reset-password-modal__modal-header__3O8Sd { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .reset-password-modal__modal-header__3O8Sd .reset-password-modal__modal-header-upload__2Sxne { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .reset-password-modal__modal-header__3O8Sd .reset-password-modal__modal-header-upload__2Sxne:hover { background-color: #e0e9ff; } .reset-password-modal__modal-header__3O8Sd .reset-password-modal__modal-header-upload__2Sxne:active { background-color: #ccdaff; } .reset-password-modal__modal-header__3O8Sd .reset-password-modal__modal-header-upload__2Sxne .reset-password-modal__upload-img__aRqH1 { font-size: 16px; margin-right: calc(2px); } .reset-password-modal__modal-header__3O8Sd .reset-password-modal__modal-header-upload__2Sxne .reset-password-modal__upload-label__2fAoJ { font-size: 14px; } .reset-password-modal__modal-header__3O8Sd .reset-password-modal__modal-header-upload__2Sxne .reset-password-modal__upload-input__2vBXF { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .reset-password-modal__modal-header__3O8Sd .reset-password-modal__modal-header-search__1JeWh { position: relative; } .reset-password-modal__modal-header__3O8Sd .reset-password-modal__modal-header-search__1JeWh .reset-password-modal__search-input__Wy0Sa { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .reset-password-modal__modal-header__3O8Sd .reset-password-modal__modal-header-search__1JeWh .reset-password-modal__search-input__Wy0Sa::-webkit-input-placeholder { color: #98a2b4; } .reset-password-modal__modal-header__3O8Sd .reset-password-modal__modal-header-search__1JeWh .reset-password-modal__search-input__Wy0Sa::-moz-placeholder { color: #98a2b4; } .reset-password-modal__modal-header__3O8Sd .reset-password-modal__modal-header-search__1JeWh .reset-password-modal__search-input__Wy0Sa:-ms-input-placeholder { color: #98a2b4; } .reset-password-modal__modal-header__3O8Sd .reset-password-modal__modal-header-search__1JeWh .reset-password-modal__search-input__Wy0Sa:hover { border-color: #d1d7e1; } .reset-password-modal__modal-header__3O8Sd .reset-password-modal__modal-header-search__1JeWh .reset-password-modal__search-input__Wy0Sa:active { border-color: #d1d7e1; } .reset-password-modal__modal-header__3O8Sd .reset-password-modal__modal-header-search__1JeWh .reset-password-modal__search-img__NweI9 { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .reset-password-modal__modal-body__1LyXh { flex-grow: 1; display: flex; } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-left__37A1V, .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-main__VgIJd { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-left__37A1V { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-left__37A1V .reset-password-modal__modal-body-left-scroll__zIdpo { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-left__37A1V .reset-password-modal__modal-body-left-scroll__zIdpo .reset-password-modal__modal-body-left-inner__2Rp2x { width: 121px; padding: calc(12px); color: #5e6b81; } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-left__37A1V .reset-password-modal__modal-body-left-scroll__zIdpo .reset-password-modal__modal-body-left-inner__2Rp2x .reset-password-modal__menu-item-current__1DrSP { color: var(--theme-primary); background-color: #e0e9ff; } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-left__37A1V .reset-password-modal__modal-body-left-scroll__zIdpo .reset-password-modal__modal-body-left-inner__2Rp2x .reset-password-modal__menu-item__2SwsT { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-left__37A1V .reset-password-modal__modal-body-left-scroll__zIdpo .reset-password-modal__modal-body-left-inner__2Rp2x .reset-password-modal__menu-item__2SwsT:hover { background-color: #edeff5; } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-left__37A1V .reset-password-modal__modal-body-left-scroll__zIdpo .reset-password-modal__modal-body-left-inner__2Rp2x .reset-password-modal__menu-item__2SwsT .reset-password-modal__menu-item-img__tyg2Q { flex-shrink: 0; width: 20px; margin-right: 8px; } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-left__37A1V .reset-password-modal__modal-body-left-scroll__zIdpo .reset-password-modal__modal-body-left-inner__2Rp2x .reset-password-modal__menu-item__2SwsT .reset-password-modal__menu-item-label__2m97O { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-main__VgIJd { padding: calc(12px) 0; } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-main__VgIJd .reset-password-modal__modal-body-main-scroll__1efMl { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-main__VgIJd .reset-password-modal__modal-body-main-scroll__1efMl .reset-password-modal__modal-body-main-inner__1EmEV { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-main__VgIJd .reset-password-modal__modal-body-main-scroll__1efMl .reset-password-modal__modal-body-main-inner__1EmEV .reset-password-modal__selector-btn-add__3MWp_, .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-main__VgIJd .reset-password-modal__modal-body-main-scroll__1efMl .reset-password-modal__modal-body-main-inner__1EmEV .reset-password-modal__selector-btn-item__PESXT { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-main__VgIJd .reset-password-modal__modal-body-main-scroll__1efMl .reset-password-modal__modal-body-main-inner__1EmEV .reset-password-modal__selector-btn-add__3MWp_:hover, .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-main__VgIJd .reset-password-modal__modal-body-main-scroll__1efMl .reset-password-modal__modal-body-main-inner__1EmEV .reset-password-modal__selector-btn-item__PESXT:hover { background-color: #e0e9ff; } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-main__VgIJd .reset-password-modal__modal-body-main-scroll__1efMl .reset-password-modal__modal-body-main-inner__1EmEV .reset-password-modal__selector-btn-add__3MWp_:active, .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-main__VgIJd .reset-password-modal__modal-body-main-scroll__1efMl .reset-password-modal__modal-body-main-inner__1EmEV .reset-password-modal__selector-btn-item__PESXT:active { background-color: #ccdaff; } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-main__VgIJd .reset-password-modal__modal-body-main-scroll__1efMl .reset-password-modal__modal-body-main-inner__1EmEV .reset-password-modal__selector-btn-add__3MWp_:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-main__VgIJd .reset-password-modal__modal-body-main-scroll__1efMl .reset-password-modal__modal-body-main-inner__1EmEV .reset-password-modal__selector-btn-add__3MWp_:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-main__VgIJd .reset-password-modal__modal-body-main-scroll__1efMl .reset-password-modal__modal-body-main-inner__1EmEV .reset-password-modal__selector-btn-add__3MWp_ .reset-password-modal__add-img__1jpRY { font-size: 28px; height: auto; margin-bottom: 8px; } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-main__VgIJd .reset-password-modal__modal-body-main-scroll__1efMl .reset-password-modal__modal-body-main-inner__1EmEV .reset-password-modal__selector-btn-add__3MWp_ .reset-password-modal__add-label__2sqUI { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-main__VgIJd .reset-password-modal__modal-body-main-scroll__1efMl .reset-password-modal__modal-body-main-inner__1EmEV .reset-password-modal__selector-btn-item__PESXT { justify-content: space-between; } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-main__VgIJd .reset-password-modal__modal-body-main-scroll__1efMl .reset-password-modal__modal-body-main-inner__1EmEV .reset-password-modal__selector-btn-item__PESXT .reset-password-modal__item-img__3Xk0Q { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-main__VgIJd .reset-password-modal__modal-body-main-scroll__1efMl .reset-password-modal__modal-body-main-inner__1EmEV .reset-password-modal__selector-btn-item__PESXT .reset-password-modal__item-img__3Xk0Q img { width: auto; height: 105px; } .reset-password-modal__modal-body__1LyXh .reset-password-modal__modal-body-main__VgIJd .reset-password-modal__modal-body-main-scroll__1efMl .reset-password-modal__modal-body-main-inner__1EmEV .reset-password-modal__selector-btn-item__PESXT .reset-password-modal__item-label__W4yEm { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .reset-password-modal__modal-footer__3ur6u { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .reset-password-modal__selector-btn-add__3MWp_, .reset-password-modal__selector-btn-item__PESXT { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .reset-password-modal__selector-btn-add__3MWp_ { background-color: var(--selector-sprite-bg_primary); } .reset-password-modal__selector-btn-add__3MWp_:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .reset-password-modal__selector-btn-add__3MWp_:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .reset-password-modal__selector-btn-add__3MWp_ .reset-password-modal__add-img__1jpRY { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .reset-password-modal__selector-btn-add__3MWp_ .reset-password-modal__add-label__2sqUI { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .reset-password-modal__selector-btn-item__PESXT { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .reset-password-modal__selector-btn-item__PESXT .reset-password-modal__item-img__3Xk0Q { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .reset-password-modal__selector-btn-item__PESXT .reset-password-modal__item-img__3Xk0Q img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .reset-password-modal__selector-btn-item__PESXT .reset-password-modal__item-label__W4yEm { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .reset-password-modal__selector-btn-item__PESXT:hover { background-color: var(--selector-sprite-bg_primary); } .reset-password-modal__selector-btn-item__PESXT:hover .reset-password-modal__item-img__3Xk0Q { border-color: var(--selector-sprite-bg_primary); } .reset-password-modal__selector-btn-item_selected__g9ye0 { background-color: var(--selector-sprite-bg_primary); } .reset-password-modal__selector-btn-item_selected__g9ye0 .reset-password-modal__item-img__3Xk0Q { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .reset-password-modal__menu-bar-btn__3lgA- { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .reset-password-modal__menu-bar-btn_green__nJP-Q, .reset-password-modal__menu-bar-btn_create__3p83g { background-color: #3cdc8f; } .reset-password-modal__menu-bar-btn_green__nJP-Q:hover, .reset-password-modal__menu-bar-btn_create__3p83g:hover { background-color: #00d374; } .reset-password-modal__menu-bar-btn_green__nJP-Q:active, .reset-password-modal__menu-bar-btn_create__3p83g:active { background-color: #00d374; } .reset-password-modal__menu-bar-btn_save__3F4AS, .reset-password-modal__menu-bar-btn_reset__3Rprb { background-color: #6ac8ff; } .reset-password-modal__menu-bar-btn_save__3F4AS:hover, .reset-password-modal__menu-bar-btn_reset__3Rprb:hover { background-color: #57bcfe; } .reset-password-modal__menu-bar-btn_save__3F4AS:active, .reset-password-modal__menu-bar-btn_reset__3Rprb:active { background-color: #4fb0fc; } .reset-password-modal__menu-bar-btn_submit__2lqgv, .reset-password-modal__menu-bar-btn_open__2AXDP { background-color: #ff9e23; } .reset-password-modal__menu-bar-btn_submit__2lqgv:hover, .reset-password-modal__menu-bar-btn_open__2AXDP:hover { background-color: #f47b04; } .reset-password-modal__menu-bar-btn_submit__2lqgv:active, .reset-password-modal__menu-bar-btn_open__2AXDP:active { background-color: #fe8f22; } .reset-password-modal__menu-bar-btn_link__1v7kE { background-color: #e8efff; color: var(--theme-primary); } .reset-password-modal__menu-bar-btn_link__1v7kE:hover { background-color: #b6c7ff; } .reset-password-modal__menu-bar-btn_link__1v7kE:active { background-color: #cfdcff; } .reset-password-modal__menu-bar-btn_disabled__1kmlR { color: #565266; background-color: #e6e9ed; } .reset-password-modal__menu-bar-btn_disabled__1kmlR:hover { cursor: not-allowed; } .reset-password-modal__menu-bar-btn_help__3JPnw { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .reset-password-modal__menu-bar-btn_help__3JPnw:hover { background-color: #8398ff; } .reset-password-modal__menu-bar-btn_help__3JPnw:active { background-color: #8ca3ff; } .reset-password-modal__menu-bar-separator__3_i6p { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .reset-password-modal__password-modal-mask__7cdtv { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .reset-password-modal__password-modal-mask__7cdtv .reset-password-modal__modal-wrap__Y7l8u { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .reset-password-modal__password-modal-mask__7cdtv .reset-password-modal__modal-wrap__Y7l8u .reset-password-modal__modal-header-wrap__yVvR6 { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .reset-password-modal__password-modal-mask__7cdtv .reset-password-modal__modal-wrap__Y7l8u .reset-password-modal__modal-header-wrap__yVvR6 .reset-password-modal__modal-header-bg__fzR0o { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .reset-password-modal__password-modal-mask__7cdtv .reset-password-modal__modal-wrap__Y7l8u .reset-password-modal__modal-header-wrap__yVvR6 .reset-password-modal__modal-header-label__29soD { flex-shrink: 0; font-size: 16px; font-weight: bold; } .reset-password-modal__password-modal-mask__7cdtv .reset-password-modal__modal-wrap__Y7l8u .reset-password-modal__modal-header-wrap__yVvR6 .reset-password-modal__modal-header-close__1Cuf1 { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .reset-password-modal__password-modal-mask__7cdtv .reset-password-modal__modal-wrap__Y7l8u .reset-password-modal__modal-header-wrap__yVvR6 .reset-password-modal__modal-header-close__1Cuf1:hover { color: #98a2b4; } .reset-password-modal__password-modal-mask__7cdtv .reset-password-modal__modal-wrap__Y7l8u .reset-password-modal__modal-body-wrap__3WYLe { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .reset-password-modal__password-modal-mask__7cdtv .reset-password-modal__modal-wrap__Y7l8u .reset-password-modal__modal-footer-wrap__12lWN { flex-shrink: 0; display: flex; } .reset-password-modal__password-modal-mask__7cdtv .reset-password-modal__password-modal__13xGJ { width: 420px; min-height: 308px; border-radius: 12px; background: #ffffff; box-shadow: 0px 4px 8px 0px #5f80ff21; padding: 24px; position: relative; } .reset-password-modal__password-modal-mask__7cdtv .reset-password-modal__password-modal__13xGJ .reset-password-modal__modal-header-monkey__26eIR { width: 90px; position: absolute; top: -81px; left: 50%; transform: translateX(-50%); } .reset-password-modal__password-modal-mask__7cdtv .reset-password-modal__password-modal__13xGJ .reset-password-modal__modal-title__BypoT { font-weight: 500; font-size: 16px; line-height: 16px; color: #3d4554; padding-bottom: 24px; } .reset-password-modal__password-modal-mask__7cdtv .reset-password-modal__password-modal__13xGJ .reset-password-modal__modal-form__3D_gu .ant-form .ant-form-item .ant-form-item-label label { cursor: url(static/cursor/cursor-auto.cur), auto; } .reset-password-modal__password-modal-mask__7cdtv .reset-password-modal__password-modal__13xGJ .reset-password-modal__modal-form__3D_gu .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper { border-radius: 4px; } .reset-password-modal__password-modal-mask__7cdtv .reset-password-modal__password-modal__13xGJ .reset-password-modal__modal-form__3D_gu .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper span .ant-input-password-icon { cursor: url(static/cursor/cursor-pointer.cur), pointer; } .reset-password-modal__password-modal-mask__7cdtv .reset-password-modal__password-modal__13xGJ .reset-password-modal__modal-form__3D_gu .reset-password-modal__modal-form-btns__12w3r { padding-top: 16px; text-align: right; } .reset-password-modal__password-modal-mask__7cdtv .reset-password-modal__password-modal__13xGJ .reset-password-modal__modal-form__3D_gu .reset-password-modal__modal-form-btns__12w3r button { margin-left: 8px; border-radius: 4px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .account-information__flex-center__1bDnK { display: flex; align-items: center; justify-content: center; } .account-information__full-filled__1Wxkh { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .account-information__modal-mask__39Rnn { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .account-information__modal-mask__39Rnn .account-information__modal-wrap__7k1UK { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .account-information__modal-mask__39Rnn .account-information__modal-wrap__7k1UK .account-information__modal-header-wrap__3g3eg { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .account-information__modal-mask__39Rnn .account-information__modal-wrap__7k1UK .account-information__modal-header-wrap__3g3eg .account-information__modal-header-bg__2T2XL { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .account-information__modal-mask__39Rnn .account-information__modal-wrap__7k1UK .account-information__modal-header-wrap__3g3eg .account-information__modal-header-label__3SlWE { flex-shrink: 0; font-size: 16px; font-weight: bold; } .account-information__modal-mask__39Rnn .account-information__modal-wrap__7k1UK .account-information__modal-header-wrap__3g3eg .account-information__modal-header-close__DCgc4 { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .account-information__modal-mask__39Rnn .account-information__modal-wrap__7k1UK .account-information__modal-header-wrap__3g3eg .account-information__modal-header-close__DCgc4:hover { color: #98a2b4; } .account-information__modal-mask__39Rnn .account-information__modal-wrap__7k1UK .account-information__modal-body-wrap__3GVGV { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .account-information__modal-mask__39Rnn .account-information__modal-wrap__7k1UK .account-information__modal-footer-wrap__3kGhV { flex-shrink: 0; display: flex; } .account-information__modal-header__2iFsh { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .account-information__modal-header__2iFsh .account-information__modal-header-upload__1A_8K { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .account-information__modal-header__2iFsh .account-information__modal-header-upload__1A_8K:hover { background-color: #e0e9ff; } .account-information__modal-header__2iFsh .account-information__modal-header-upload__1A_8K:active { background-color: #ccdaff; } .account-information__modal-header__2iFsh .account-information__modal-header-upload__1A_8K .account-information__upload-img__3hqEp { font-size: 16px; margin-right: calc(2px); } .account-information__modal-header__2iFsh .account-information__modal-header-upload__1A_8K .account-information__upload-label__3AFZP { font-size: 14px; } .account-information__modal-header__2iFsh .account-information__modal-header-upload__1A_8K .account-information__upload-input__2r394 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .account-information__modal-header__2iFsh .account-information__modal-header-search__3k15P { position: relative; } .account-information__modal-header__2iFsh .account-information__modal-header-search__3k15P .account-information__search-input__2tDZZ { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .account-information__modal-header__2iFsh .account-information__modal-header-search__3k15P .account-information__search-input__2tDZZ::-webkit-input-placeholder { color: #98a2b4; } .account-information__modal-header__2iFsh .account-information__modal-header-search__3k15P .account-information__search-input__2tDZZ::-moz-placeholder { color: #98a2b4; } .account-information__modal-header__2iFsh .account-information__modal-header-search__3k15P .account-information__search-input__2tDZZ:-ms-input-placeholder { color: #98a2b4; } .account-information__modal-header__2iFsh .account-information__modal-header-search__3k15P .account-information__search-input__2tDZZ:hover { border-color: #d1d7e1; } .account-information__modal-header__2iFsh .account-information__modal-header-search__3k15P .account-information__search-input__2tDZZ:active { border-color: #d1d7e1; } .account-information__modal-header__2iFsh .account-information__modal-header-search__3k15P .account-information__search-img__E98_e { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .account-information__modal-body__3_Z3L { flex-grow: 1; display: flex; } .account-information__modal-body__3_Z3L .account-information__modal-body-left__2pYQb, .account-information__modal-body__3_Z3L .account-information__modal-body-main__1Jss5 { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .account-information__modal-body__3_Z3L .account-information__modal-body-left__2pYQb { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .account-information__modal-body__3_Z3L .account-information__modal-body-left__2pYQb .account-information__modal-body-left-scroll__1V1i9 { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .account-information__modal-body__3_Z3L .account-information__modal-body-left__2pYQb .account-information__modal-body-left-scroll__1V1i9 .account-information__modal-body-left-inner__2DkKg { width: 121px; padding: calc(12px); color: #5e6b81; } .account-information__modal-body__3_Z3L .account-information__modal-body-left__2pYQb .account-information__modal-body-left-scroll__1V1i9 .account-information__modal-body-left-inner__2DkKg .account-information__menu-item-current__2FVsd { color: var(--theme-primary); background-color: #e0e9ff; } .account-information__modal-body__3_Z3L .account-information__modal-body-left__2pYQb .account-information__modal-body-left-scroll__1V1i9 .account-information__modal-body-left-inner__2DkKg .account-information__menu-item__h1wh2 { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .account-information__modal-body__3_Z3L .account-information__modal-body-left__2pYQb .account-information__modal-body-left-scroll__1V1i9 .account-information__modal-body-left-inner__2DkKg .account-information__menu-item__h1wh2:hover { background-color: #edeff5; } .account-information__modal-body__3_Z3L .account-information__modal-body-left__2pYQb .account-information__modal-body-left-scroll__1V1i9 .account-information__modal-body-left-inner__2DkKg .account-information__menu-item__h1wh2 .account-information__menu-item-img__2fLwL { flex-shrink: 0; width: 20px; margin-right: 8px; } .account-information__modal-body__3_Z3L .account-information__modal-body-left__2pYQb .account-information__modal-body-left-scroll__1V1i9 .account-information__modal-body-left-inner__2DkKg .account-information__menu-item__h1wh2 .account-information__menu-item-label__5Cvqv { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .account-information__modal-body__3_Z3L .account-information__modal-body-main__1Jss5 { padding: calc(12px) 0; } .account-information__modal-body__3_Z3L .account-information__modal-body-main__1Jss5 .account-information__modal-body-main-scroll__2AkLi { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .account-information__modal-body__3_Z3L .account-information__modal-body-main__1Jss5 .account-information__modal-body-main-scroll__2AkLi .account-information__modal-body-main-inner__215sg { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .account-information__modal-body__3_Z3L .account-information__modal-body-main__1Jss5 .account-information__modal-body-main-scroll__2AkLi .account-information__modal-body-main-inner__215sg .account-information__selector-btn-add__N96rE, .account-information__modal-body__3_Z3L .account-information__modal-body-main__1Jss5 .account-information__modal-body-main-scroll__2AkLi .account-information__modal-body-main-inner__215sg .account-information__selector-btn-item__CDXws { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .account-information__modal-body__3_Z3L .account-information__modal-body-main__1Jss5 .account-information__modal-body-main-scroll__2AkLi .account-information__modal-body-main-inner__215sg .account-information__selector-btn-add__N96rE:hover, .account-information__modal-body__3_Z3L .account-information__modal-body-main__1Jss5 .account-information__modal-body-main-scroll__2AkLi .account-information__modal-body-main-inner__215sg .account-information__selector-btn-item__CDXws:hover { background-color: #e0e9ff; } .account-information__modal-body__3_Z3L .account-information__modal-body-main__1Jss5 .account-information__modal-body-main-scroll__2AkLi .account-information__modal-body-main-inner__215sg .account-information__selector-btn-add__N96rE:active, .account-information__modal-body__3_Z3L .account-information__modal-body-main__1Jss5 .account-information__modal-body-main-scroll__2AkLi .account-information__modal-body-main-inner__215sg .account-information__selector-btn-item__CDXws:active { background-color: #ccdaff; } .account-information__modal-body__3_Z3L .account-information__modal-body-main__1Jss5 .account-information__modal-body-main-scroll__2AkLi .account-information__modal-body-main-inner__215sg .account-information__selector-btn-add__N96rE:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .account-information__modal-body__3_Z3L .account-information__modal-body-main__1Jss5 .account-information__modal-body-main-scroll__2AkLi .account-information__modal-body-main-inner__215sg .account-information__selector-btn-add__N96rE:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .account-information__modal-body__3_Z3L .account-information__modal-body-main__1Jss5 .account-information__modal-body-main-scroll__2AkLi .account-information__modal-body-main-inner__215sg .account-information__selector-btn-add__N96rE .account-information__add-img__1UGz6 { font-size: 28px; height: auto; margin-bottom: 8px; } .account-information__modal-body__3_Z3L .account-information__modal-body-main__1Jss5 .account-information__modal-body-main-scroll__2AkLi .account-information__modal-body-main-inner__215sg .account-information__selector-btn-add__N96rE .account-information__add-label__2SVvg { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .account-information__modal-body__3_Z3L .account-information__modal-body-main__1Jss5 .account-information__modal-body-main-scroll__2AkLi .account-information__modal-body-main-inner__215sg .account-information__selector-btn-item__CDXws { justify-content: space-between; } .account-information__modal-body__3_Z3L .account-information__modal-body-main__1Jss5 .account-information__modal-body-main-scroll__2AkLi .account-information__modal-body-main-inner__215sg .account-information__selector-btn-item__CDXws .account-information__item-img__cVw3K { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .account-information__modal-body__3_Z3L .account-information__modal-body-main__1Jss5 .account-information__modal-body-main-scroll__2AkLi .account-information__modal-body-main-inner__215sg .account-information__selector-btn-item__CDXws .account-information__item-img__cVw3K img { width: auto; height: 105px; } .account-information__modal-body__3_Z3L .account-information__modal-body-main__1Jss5 .account-information__modal-body-main-scroll__2AkLi .account-information__modal-body-main-inner__215sg .account-information__selector-btn-item__CDXws .account-information__item-label__2WDzx { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .account-information__modal-footer__3HrN5 { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .account-information__selector-btn-add__N96rE, .account-information__selector-btn-item__CDXws { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .account-information__selector-btn-add__N96rE { background-color: var(--selector-sprite-bg_primary); } .account-information__selector-btn-add__N96rE:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .account-information__selector-btn-add__N96rE:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .account-information__selector-btn-add__N96rE .account-information__add-img__1UGz6 { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .account-information__selector-btn-add__N96rE .account-information__add-label__2SVvg { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .account-information__selector-btn-item__CDXws { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .account-information__selector-btn-item__CDXws .account-information__item-img__cVw3K { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .account-information__selector-btn-item__CDXws .account-information__item-img__cVw3K img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .account-information__selector-btn-item__CDXws .account-information__item-label__2WDzx { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .account-information__selector-btn-item__CDXws:hover { background-color: var(--selector-sprite-bg_primary); } .account-information__selector-btn-item__CDXws:hover .account-information__item-img__cVw3K { border-color: var(--selector-sprite-bg_primary); } .account-information__selector-btn-item_selected__foksX { background-color: var(--selector-sprite-bg_primary); } .account-information__selector-btn-item_selected__foksX .account-information__item-img__cVw3K { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .account-information__menu-bar-btn__1i9ZS { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .account-information__menu-bar-btn_green__29Nws, .account-information__menu-bar-btn_create__10AiT { background-color: #3cdc8f; } .account-information__menu-bar-btn_green__29Nws:hover, .account-information__menu-bar-btn_create__10AiT:hover { background-color: #00d374; } .account-information__menu-bar-btn_green__29Nws:active, .account-information__menu-bar-btn_create__10AiT:active { background-color: #00d374; } .account-information__menu-bar-btn_save__uGgdz, .account-information__menu-bar-btn_reset__jCWgA { background-color: #6ac8ff; } .account-information__menu-bar-btn_save__uGgdz:hover, .account-information__menu-bar-btn_reset__jCWgA:hover { background-color: #57bcfe; } .account-information__menu-bar-btn_save__uGgdz:active, .account-information__menu-bar-btn_reset__jCWgA:active { background-color: #4fb0fc; } .account-information__menu-bar-btn_submit__2TO3d, .account-information__menu-bar-btn_open__1yUz8 { background-color: #ff9e23; } .account-information__menu-bar-btn_submit__2TO3d:hover, .account-information__menu-bar-btn_open__1yUz8:hover { background-color: #f47b04; } .account-information__menu-bar-btn_submit__2TO3d:active, .account-information__menu-bar-btn_open__1yUz8:active { background-color: #fe8f22; } .account-information__menu-bar-btn_link__2NuBz { background-color: #e8efff; color: var(--theme-primary); } .account-information__menu-bar-btn_link__2NuBz:hover { background-color: #b6c7ff; } .account-information__menu-bar-btn_link__2NuBz:active { background-color: #cfdcff; } .account-information__menu-bar-btn_disabled__28tRJ { color: #565266; background-color: #e6e9ed; } .account-information__menu-bar-btn_disabled__28tRJ:hover { cursor: not-allowed; } .account-information__menu-bar-btn_help__9sxKl { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .account-information__menu-bar-btn_help__9sxKl:hover { background-color: #8398ff; } .account-information__menu-bar-btn_help__9sxKl:active { background-color: #8ca3ff; } .account-information__menu-bar-separator__2tcjG { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .account-information__account-information-modal-mask__3A3RO { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .account-information__account-information-modal-mask__3A3RO .account-information__modal-wrap__7k1UK { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .account-information__account-information-modal-mask__3A3RO .account-information__modal-wrap__7k1UK .account-information__modal-header-wrap__3g3eg { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .account-information__account-information-modal-mask__3A3RO .account-information__modal-wrap__7k1UK .account-information__modal-header-wrap__3g3eg .account-information__modal-header-bg__2T2XL { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .account-information__account-information-modal-mask__3A3RO .account-information__modal-wrap__7k1UK .account-information__modal-header-wrap__3g3eg .account-information__modal-header-label__3SlWE { flex-shrink: 0; font-size: 16px; font-weight: bold; } .account-information__account-information-modal-mask__3A3RO .account-information__modal-wrap__7k1UK .account-information__modal-header-wrap__3g3eg .account-information__modal-header-close__DCgc4 { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .account-information__account-information-modal-mask__3A3RO .account-information__modal-wrap__7k1UK .account-information__modal-header-wrap__3g3eg .account-information__modal-header-close__DCgc4:hover { color: #98a2b4; } .account-information__account-information-modal-mask__3A3RO .account-information__modal-wrap__7k1UK .account-information__modal-body-wrap__3GVGV { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .account-information__account-information-modal-mask__3A3RO .account-information__modal-wrap__7k1UK .account-information__modal-footer-wrap__3kGhV { flex-shrink: 0; display: flex; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O { position: relative; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru { width: 464px; border-radius: 24px; background: #ffffff; position: relative; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__account-information-close__1FYyN { height: 29px; width: 100%; box-sizing: border-box; padding-right: 21px; padding-left: 24px; display: flex; justify-content: space-between; flex-direction: row-reverse; align-items: flex-end; margin-bottom: 2.9px; color: #b5bccb; position: relative; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__account-information-close__1FYyN .account-information__back-left__2j8et { cursor: url(static/cursor/cursor-pointer.cur), pointer; position: absolute; top: 16px; left: 24px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__account-information-close__1FYyN .account-information__back-left__2j8et:hover { color: #5e6b81; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__account-information-close__1FYyN .account-information__back-left__2j8et:active { color: #3d4554; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__account-information-close__1FYyN > span:hover { color: #98a2b4; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__account-information-close__1FYyN > span:active { color: #828da3; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-title__2uRgB { width: 100%; padding: 0 40px; box-sizing: border-box; text-align: center; font-family: 'PingFang SC'; font-style: normal; font-weight: 600; font-size: 18px; line-height: 26px; /* identical to box height, or 144% */ margin-bottom: 8px; color: #3d4554; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item { position: relative; box-sizing: border-box; margin-bottom: 12px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item .ant-form-item-label label { font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 14px; line-height: 20px; /* identical to box height */ color: #5e6b81; cursor: url(static/cursor/cursor-auto.cur), auto; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input :focus-within { border: 2px solid #6a7fff; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input :focus-within input:focus { border: none; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content { height: 48px; background: #f5f6fa; border-radius: 8px; box-sizing: border-box; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content input:-ms-input-placeholder { color: #b5bccb; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content input::placeholder { color: #b5bccb; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content input:-ms-input-placeholder:hover { color: #b5bccb; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content input::placeholder:hover { color: #b5bccb; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content input { border-radius: 8px; border: none; height: 100%; background-color: transparent; color: #3d4554; font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 14px; line-height: 20px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-password { padding-right: 20px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper { height: 100%; background: #f5f6fa; border-radius: 8px; border: none; box-sizing: border-box; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper input { border-radius: 8px; border: none; height: 100%; background-color: transparent; color: #3d4554; font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 14px; line-height: 20px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper > span .ant-input-password-icon { font-size: 18px; cursor: url(static/cursor/cursor-pointer.cur), pointer; color: #98a2b4; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper > span .ant-input-password-icon:hover { color: #828da3; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper:hover { background: #edeff5; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content:hover { background: #edeff5; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content { background: #fff0f0; border: 2px solid #ff6666; border-radius: 8px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content input { border-radius: 8px; height: 100%; background-color: transparent; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper { background: #fff0f0; border-radius: 8px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper input { border-radius: 8px; height: 100%; background-color: transparent; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper span .ant-input-password-icon { cursor: url(static/cursor/cursor-pointer.cur), pointer; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper:hover { background: #fff0f0; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper :focus-within { background: #fff0f0; border: none; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper :focus-within input:focus { border: none; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content:hover { background: #fff0f0; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content :focus-within { background: #fff0f0; border: none; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content :focus-within input:focus { border: none; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item-with-help .ant-form-item-explain.ant-form-item-explain-validating, .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item-with-help .ant-form-item-explain.ant-form-item-explain-success { text-align: right; margin-top: 4px; color: #ff6666; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item-with-help .ant-form-item-explain.ant-form-item-explain-validating > div, .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item-with-help .ant-form-item-explain.ant-form-item-explain-success > div { font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 14px; /* identical to box height */ text-align: right; color: #ff6666; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item-with-help .ant-form-item-explain.ant-form-item-explain-error { text-align: right; margin-top: 4px; color: #ff6666; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item-with-help .ant-form-item-explain.ant-form-item-explain-error > div { font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 14px; /* identical to box height */ text-align: right; color: #ff6666; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item-with-help .ant-form-item-explain, .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item-with-help .ant-form-item-extra { text-align: right; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .ant-form .ant-form-item-with-help .ant-show-leave { text-align: right; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .account-information__moda-position-code__5HEIX { position: relative; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .account-information__moda-position-code__5HEIX .ant-form-item .ant-form-item-label { padding: 0 0 5px 0; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .account-information__moda-position-code__5HEIX .ant-form-item .ant-form-item-label label { font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 18px; line-height: 25px; color: #5e6b81; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .account-information__bindPhone-modal-getCode__33tM6 { position: absolute; top: 44px; right: 20px; color: #9cb0ff; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .account-information__bindPhone-modal-getCode__33tM6.account-information__bindPhone-modal-getCode_active__dVF97 { color: var(--theme-primary); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .account-information__bindPhone-modal-getCode__33tM6.account-information__bindPhone-modal-getCode_active__dVF97:hover { color: #586ef5; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form__2rQWa .account-information__bindPhone-modal-getCode__33tM6.account-information__bindPhone-modal-getCode_active__dVF97:active { color: #4b62eb; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form-btns__19Zf6 { text-align: center; padding: 48px 0 40px 0; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form-btns__19Zf6.account-information__margin-light__H-Dw8 { padding: 32px 0 20px 0; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form-btns__19Zf6.account-information__margin-light__H-Dw8 button { margin-bottom: 28px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form-btns__19Zf6 button { width: 100%; background: #6a7fff; border-radius: 8px; height: 48px; cursor: url(static/cursor/cursor-pointer.cur), pointer; font-family: 'PingFang SC'; font-style: normal; font-weight: 600; font-size: 16px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form-btns__19Zf6 button:hover { background: #586ef5; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form-btns__19Zf6 button:active { background: #4b62eb; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form-btns__19Zf6.account-information__modal-form-btn-disable__2s17u button { background: #9cb0ff; pointer-events: none; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-bottom-way__2O1Bb { font-style: normal; font-weight: 400; font-size: 16px; line-height: 26px; text-align: center; color: #5e6b81; margin-bottom: 24px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-bottom-tip__1xk7E { font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 14px; line-height: 22px; text-align: center; color: #98a2b4; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form-btns-change__3V5Oz { text-align: center; margin-top: 32px; margin-bottom: 12px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form-btns-change__3V5Oz button { width: 100%; background: #6a7fff; border-radius: 8px; height: 48px; cursor: url(static/cursor/cursor-pointer.cur), pointer; font-family: 'PingFang SC'; font-style: normal; font-weight: 600; font-size: 16px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form-btns-change__3V5Oz button:hover { background: #586ef5; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form-btns-change__3V5Oz button:active { background: #4b62eb; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form-btns-change__3V5Oz.account-information__modal-form-btn-disable__2s17u { border: none; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-form-btns-change__3V5Oz.account-information__modal-form-btn-disable__2s17u button { border: none; background: #9cb0ff; pointer-events: none; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-bottom-way-change__3KZI9 { font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 16px; line-height: 26px; text-align: center; color: #5e6b81; margin-bottom: 24px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-bottom-way-change__3KZI9 span { cursor: url(static/cursor/cursor-pointer.cur), pointer; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-bottom-way-change__3KZI9 span span:first-child { margin-right: 2px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-bottom-way-change__3KZI9:hover { color: #6a7fff; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-bottom-way-change__3KZI9:active { color: #586ef5; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__modal-bottom-tip-change__GpEch { font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 14px; line-height: 22px; text-align: center; color: #98a2b4; padding-bottom: 20px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__account-info-modal-content__2xy23 { padding: 0 40px; box-sizing: border-box; padding-bottom: 24px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__account-info-modal-content__2xy23 .account-information__account-info-modal-content-list__1wy17 { display: flex; justify-content: space-between; box-sizing: border-box; padding: 15px 0 15px 0; border-bottom: 1px solid #edeff5; font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 16px; color: #3d4554; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__account-info-modal-content__2xy23 .account-information__account-info-modal-content-list__1wy17:last-child { border: none; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__account-info-modal-content__2xy23 .account-information__account-info-modal-content-list__1wy17 .account-information__list-left__1TlC6 { color: #5e6b81; flex-shrink: 0; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__account-info-modal-content__2xy23 .account-information__account-info-modal-content-list__1wy17 .account-information__list-right__rNJxV { flex: 1 0; display: flex; justify-content: flex-end; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__account-info-modal-content__2xy23 .account-information__account-info-modal-content-list__1wy17 .account-information__list-right__rNJxV .account-information__list-right-main__2d_Tn { flex: 1 0; color: #828da3; display: flex; flex-direction: column; max-width: 210px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__account-info-modal-content__2xy23 .account-information__account-info-modal-content-list__1wy17 .account-information__list-right__rNJxV .account-information__list-right-main__2d_Tn .account-information__list-right-item__X1gl7 { display: flex; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__account-info-modal-content__2xy23 .account-information__account-info-modal-content-list__1wy17 .account-information__list-right__rNJxV .account-information__list-right-main__2d_Tn .account-information__list-right-item__X1gl7 .account-information__list-account__2PwH2 { display: flex; align-items: center; width: 92px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__account-info-modal-content__2xy23 .account-information__account-info-modal-content-list__1wy17 .account-information__list-right__rNJxV .account-information__list-right-main__2d_Tn .account-information__list-right-item__X1gl7 .account-information__list-separator__1GJR8 { display: inline-block; margin-right: 4px; width: 4px; left: 640px; top: 412px; font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 16px; text-align: right; color: #3d4554; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__account-info-modal-content__2xy23 .account-information__account-info-modal-content-list__1wy17 .account-information__list-right__rNJxV .account-information__list-right-main__2d_Tn .account-information__list-right-item__X1gl7 .account-information__list-nickname__Q84OX { font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 16px; text-align: right; color: #828da3; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__account-info-modal-content__2xy23 .account-information__account-info-modal-content-list__1wy17 .account-information__list-right__rNJxV .account-information__list-right-edit__vE1wR { display: inline-block; width: 64px; color: #6a7fff; margin-left: 12px; text-align: right; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__account-info-modal-content__2xy23 .account-information__account-info-modal-content-list__1wy17 .account-information__list-right__rNJxV .account-information__list-right-edit__vE1wR:hover { color: #586ef5; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__account-info-modal-content__2xy23 .account-information__account-info-modal-content-list__1wy17 .account-information__list-right__rNJxV .account-information__list-right-edit__vE1wR:active { color: #4b62eb; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-step-wrap__1D0G6 { display: flex; justify-content: center; box-sizing: border-box; margin-top: 16px; margin-bottom: 36px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-step-wrap__1D0G6 .account-information__bind-step-item-wrap__1KlS2 { display: flex; align-items: center; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-step-wrap__1D0G6 .account-information__bind-step-item-wrap__1KlS2 .account-information__bind-step-dashed__3m1T_.account-information__bind-step-dashed-light__3MF8j .account-information__bind-step-item-dashed-wrap__1CWL6 > div { background: #b5bccb; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-step-wrap__1D0G6 .account-information__bind-step-item__300kl { padding: 0 8px; box-sizing: border-box; height: 32px; display: flex; justify-content: center; align-items: center; background: #f5f7fa; border-radius: 36px; font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 14px; /* identical to box height */ /* YKT/YKT_Gray_03 */ color: #828da3; margin: 0 8px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-step-wrap__1D0G6 .account-information__bind-step-item__300kl .account-information__bind-step-item-text__22DeY { margin-left: 3px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-step-wrap__1D0G6 .account-information__bind-step-item__300kl .account-information__bind-step-item-index__37bek { display: inline-block; width: 14px; height: 14px; background: #b5bccb; font-family: 'PingFang SC'; font-style: normal; font-weight: 600; font-size: 12px; border-radius: 50%; line-height: 14px; /* identical to box height */ /* YKT/YKT_Gray_09 */ text-align: center; color: #ffffff; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-step-wrap__1D0G6 .account-information__bind-step-item__300kl.account-information__bind-step-item-finished__1KgIR { color: #6a7fff; background: #f5f8ff; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-step-wrap__1D0G6 .account-information__bind-step-item__300kl.account-information__bind-step-item-finished__1KgIR .account-information__icon-color__11oHy { color: #6a7fff; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-step-wrap__1D0G6 .account-information__bind-step-item__300kl.account-information__bind-step-item-actived__2dcx9 { background: #6a7fff; color: #ffffff; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-step-wrap__1D0G6 .account-information__bind-step-item__300kl.account-information__bind-step-item-actived__2dcx9 .account-information__bind-step-item-index__37bek { background: #ffffff; color: #6a7fff; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-step-wrap__1D0G6 .account-information__bind-step-item-dashed-wrap__1CWL6 { display: flex; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-step-wrap__1D0G6 .account-information__bind-step-item-dashed-wrap__1CWL6 > div { width: 4px; height: 4px; border-radius: 50%; background: #6a7fff; margin-right: 4px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-step-wrap__1D0G6 .account-information__bind-step-item-dashed-wrap__1CWL6 > div:last-child { margin-right: 0; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-account-wrap__3ZumP { padding: 0 40px; box-sizing: border-box; margin-top: 16px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-account-wrap__3ZumP .account-information__changeTelNum-success__3FP5e { width: 100%; justify-content: center; display: flex; align-items: center; font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 16px; line-height: 170%; /* or 27px */ /* YKT/YKT_Gray_01 */ color: #3d4554; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-account-wrap__3ZumP .account-information__changeTelNum-success__3FP5e .account-information__icon-success__4XODA { font-size: 32px; margin-right: 12px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-account-wrap__3ZumP .account-information__bind-account-class-line__3lKuO { display: flex; justify-content: space-between; padding: 15px 0; border-bottom: 1px solid #edeff5; font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 16px; line-height: 22px; color: #5e6b81; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-account-wrap__3ZumP .account-information__bind-account-class-line__3lKuO:last-child { border: none; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-account-wrap__3ZumP .account-information__bind-account-class-result__1nu6Q { display: flex; font-size: 32px; padding-left: 56px; box-sizing: border-box; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-account-wrap__3ZumP .account-information__bind-account-class-result__1nu6Q span:first-child { margin-top: 5px; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-account-wrap__3ZumP .account-information__bind-account-class-result__1nu6Q .account-information__bind-account-class-result-text__5IZq_ { font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 16px; line-height: 170%; /* or 27px */ /* YKT/YKT_Gray_01 */ margin-left: 12px; color: #3d4554; } .account-information__account-information-modal-mask__3A3RO .account-information__account-information-modal-box__ctg4O .account-information__account-information-modal__12Mru .account-information__bind-account-wrap__3ZumP .account-information__moda-position-code__5HEIX { position: relative; } .account-information__account-information-modal-mask__3A3RO .account-information__open-monkey__1V_N8 { width: 132px; height: 86px; position: absolute; top: -75px; left: 50%; transform: translateX(-50%); z-index: 1; } .account-information__account-information-modal-mask__3A3RO .account-information__open-monkey__1V_N8 img { height: 100%; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .reset-password-modal__flex-center__3NGjP { display: flex; align-items: center; justify-content: center; } .reset-password-modal__full-filled__2VFdw { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .reset-password-modal__modal-mask__2TNOx { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .reset-password-modal__modal-mask__2TNOx .reset-password-modal__modal-wrap__2aQhb { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .reset-password-modal__modal-mask__2TNOx .reset-password-modal__modal-wrap__2aQhb .reset-password-modal__modal-header-wrap__3V1rW { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .reset-password-modal__modal-mask__2TNOx .reset-password-modal__modal-wrap__2aQhb .reset-password-modal__modal-header-wrap__3V1rW .reset-password-modal__modal-header-bg__2Dhw1 { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .reset-password-modal__modal-mask__2TNOx .reset-password-modal__modal-wrap__2aQhb .reset-password-modal__modal-header-wrap__3V1rW .reset-password-modal__modal-header-label__2XvuG { flex-shrink: 0; font-size: 16px; font-weight: bold; } .reset-password-modal__modal-mask__2TNOx .reset-password-modal__modal-wrap__2aQhb .reset-password-modal__modal-header-wrap__3V1rW .reset-password-modal__modal-header-close__3kCRE { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .reset-password-modal__modal-mask__2TNOx .reset-password-modal__modal-wrap__2aQhb .reset-password-modal__modal-header-wrap__3V1rW .reset-password-modal__modal-header-close__3kCRE:hover { color: #98a2b4; } .reset-password-modal__modal-mask__2TNOx .reset-password-modal__modal-wrap__2aQhb .reset-password-modal__modal-body-wrap__2AyiG { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .reset-password-modal__modal-mask__2TNOx .reset-password-modal__modal-wrap__2aQhb .reset-password-modal__modal-footer-wrap__2HpnY { flex-shrink: 0; display: flex; } .reset-password-modal__modal-header__Z-X2s { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .reset-password-modal__modal-header__Z-X2s .reset-password-modal__modal-header-upload__RxXfg { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .reset-password-modal__modal-header__Z-X2s .reset-password-modal__modal-header-upload__RxXfg:hover { background-color: #e0e9ff; } .reset-password-modal__modal-header__Z-X2s .reset-password-modal__modal-header-upload__RxXfg:active { background-color: #ccdaff; } .reset-password-modal__modal-header__Z-X2s .reset-password-modal__modal-header-upload__RxXfg .reset-password-modal__upload-img__R-Cy2 { font-size: 16px; margin-right: calc(2px); } .reset-password-modal__modal-header__Z-X2s .reset-password-modal__modal-header-upload__RxXfg .reset-password-modal__upload-label__21LZv { font-size: 14px; } .reset-password-modal__modal-header__Z-X2s .reset-password-modal__modal-header-upload__RxXfg .reset-password-modal__upload-input__LHw98 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .reset-password-modal__modal-header__Z-X2s .reset-password-modal__modal-header-search__CXPO6 { position: relative; } .reset-password-modal__modal-header__Z-X2s .reset-password-modal__modal-header-search__CXPO6 .reset-password-modal__search-input__15-OK { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .reset-password-modal__modal-header__Z-X2s .reset-password-modal__modal-header-search__CXPO6 .reset-password-modal__search-input__15-OK::-webkit-input-placeholder { color: #98a2b4; } .reset-password-modal__modal-header__Z-X2s .reset-password-modal__modal-header-search__CXPO6 .reset-password-modal__search-input__15-OK::-moz-placeholder { color: #98a2b4; } .reset-password-modal__modal-header__Z-X2s .reset-password-modal__modal-header-search__CXPO6 .reset-password-modal__search-input__15-OK:-ms-input-placeholder { color: #98a2b4; } .reset-password-modal__modal-header__Z-X2s .reset-password-modal__modal-header-search__CXPO6 .reset-password-modal__search-input__15-OK:hover { border-color: #d1d7e1; } .reset-password-modal__modal-header__Z-X2s .reset-password-modal__modal-header-search__CXPO6 .reset-password-modal__search-input__15-OK:active { border-color: #d1d7e1; } .reset-password-modal__modal-header__Z-X2s .reset-password-modal__modal-header-search__CXPO6 .reset-password-modal__search-img__12W5s { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .reset-password-modal__modal-body__1ugjh { flex-grow: 1; display: flex; } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-left__FgSkl, .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-main__1CXzE { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-left__FgSkl { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-left__FgSkl .reset-password-modal__modal-body-left-scroll__14h3L { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-left__FgSkl .reset-password-modal__modal-body-left-scroll__14h3L .reset-password-modal__modal-body-left-inner__1k5jk { width: 121px; padding: calc(12px); color: #5e6b81; } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-left__FgSkl .reset-password-modal__modal-body-left-scroll__14h3L .reset-password-modal__modal-body-left-inner__1k5jk .reset-password-modal__menu-item-current__1KXAK { color: var(--theme-primary); background-color: #e0e9ff; } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-left__FgSkl .reset-password-modal__modal-body-left-scroll__14h3L .reset-password-modal__modal-body-left-inner__1k5jk .reset-password-modal__menu-item__1veJD { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-left__FgSkl .reset-password-modal__modal-body-left-scroll__14h3L .reset-password-modal__modal-body-left-inner__1k5jk .reset-password-modal__menu-item__1veJD:hover { background-color: #edeff5; } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-left__FgSkl .reset-password-modal__modal-body-left-scroll__14h3L .reset-password-modal__modal-body-left-inner__1k5jk .reset-password-modal__menu-item__1veJD .reset-password-modal__menu-item-img__1zHyq { flex-shrink: 0; width: 20px; margin-right: 8px; } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-left__FgSkl .reset-password-modal__modal-body-left-scroll__14h3L .reset-password-modal__modal-body-left-inner__1k5jk .reset-password-modal__menu-item__1veJD .reset-password-modal__menu-item-label__3vZud { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-main__1CXzE { padding: calc(12px) 0; } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-main__1CXzE .reset-password-modal__modal-body-main-scroll__TKkGW { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-main__1CXzE .reset-password-modal__modal-body-main-scroll__TKkGW .reset-password-modal__modal-body-main-inner__JIJZj { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-main__1CXzE .reset-password-modal__modal-body-main-scroll__TKkGW .reset-password-modal__modal-body-main-inner__JIJZj .reset-password-modal__selector-btn-add__3or4E, .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-main__1CXzE .reset-password-modal__modal-body-main-scroll__TKkGW .reset-password-modal__modal-body-main-inner__JIJZj .reset-password-modal__selector-btn-item__2LyFo { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-main__1CXzE .reset-password-modal__modal-body-main-scroll__TKkGW .reset-password-modal__modal-body-main-inner__JIJZj .reset-password-modal__selector-btn-add__3or4E:hover, .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-main__1CXzE .reset-password-modal__modal-body-main-scroll__TKkGW .reset-password-modal__modal-body-main-inner__JIJZj .reset-password-modal__selector-btn-item__2LyFo:hover { background-color: #e0e9ff; } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-main__1CXzE .reset-password-modal__modal-body-main-scroll__TKkGW .reset-password-modal__modal-body-main-inner__JIJZj .reset-password-modal__selector-btn-add__3or4E:active, .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-main__1CXzE .reset-password-modal__modal-body-main-scroll__TKkGW .reset-password-modal__modal-body-main-inner__JIJZj .reset-password-modal__selector-btn-item__2LyFo:active { background-color: #ccdaff; } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-main__1CXzE .reset-password-modal__modal-body-main-scroll__TKkGW .reset-password-modal__modal-body-main-inner__JIJZj .reset-password-modal__selector-btn-add__3or4E:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-main__1CXzE .reset-password-modal__modal-body-main-scroll__TKkGW .reset-password-modal__modal-body-main-inner__JIJZj .reset-password-modal__selector-btn-add__3or4E:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-main__1CXzE .reset-password-modal__modal-body-main-scroll__TKkGW .reset-password-modal__modal-body-main-inner__JIJZj .reset-password-modal__selector-btn-add__3or4E .reset-password-modal__add-img__-EsFF { font-size: 28px; height: auto; margin-bottom: 8px; } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-main__1CXzE .reset-password-modal__modal-body-main-scroll__TKkGW .reset-password-modal__modal-body-main-inner__JIJZj .reset-password-modal__selector-btn-add__3or4E .reset-password-modal__add-label__j49Cf { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-main__1CXzE .reset-password-modal__modal-body-main-scroll__TKkGW .reset-password-modal__modal-body-main-inner__JIJZj .reset-password-modal__selector-btn-item__2LyFo { justify-content: space-between; } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-main__1CXzE .reset-password-modal__modal-body-main-scroll__TKkGW .reset-password-modal__modal-body-main-inner__JIJZj .reset-password-modal__selector-btn-item__2LyFo .reset-password-modal__item-img__1bbmH { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-main__1CXzE .reset-password-modal__modal-body-main-scroll__TKkGW .reset-password-modal__modal-body-main-inner__JIJZj .reset-password-modal__selector-btn-item__2LyFo .reset-password-modal__item-img__1bbmH img { width: auto; height: 105px; } .reset-password-modal__modal-body__1ugjh .reset-password-modal__modal-body-main__1CXzE .reset-password-modal__modal-body-main-scroll__TKkGW .reset-password-modal__modal-body-main-inner__JIJZj .reset-password-modal__selector-btn-item__2LyFo .reset-password-modal__item-label__3yDI6 { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .reset-password-modal__modal-footer__1CyF5 { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .reset-password-modal__selector-btn-add__3or4E, .reset-password-modal__selector-btn-item__2LyFo { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .reset-password-modal__selector-btn-add__3or4E { background-color: var(--selector-sprite-bg_primary); } .reset-password-modal__selector-btn-add__3or4E:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .reset-password-modal__selector-btn-add__3or4E:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .reset-password-modal__selector-btn-add__3or4E .reset-password-modal__add-img__-EsFF { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .reset-password-modal__selector-btn-add__3or4E .reset-password-modal__add-label__j49Cf { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .reset-password-modal__selector-btn-item__2LyFo { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .reset-password-modal__selector-btn-item__2LyFo .reset-password-modal__item-img__1bbmH { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .reset-password-modal__selector-btn-item__2LyFo .reset-password-modal__item-img__1bbmH img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .reset-password-modal__selector-btn-item__2LyFo .reset-password-modal__item-label__3yDI6 { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .reset-password-modal__selector-btn-item__2LyFo:hover { background-color: var(--selector-sprite-bg_primary); } .reset-password-modal__selector-btn-item__2LyFo:hover .reset-password-modal__item-img__1bbmH { border-color: var(--selector-sprite-bg_primary); } .reset-password-modal__selector-btn-item_selected__1cb_X { background-color: var(--selector-sprite-bg_primary); } .reset-password-modal__selector-btn-item_selected__1cb_X .reset-password-modal__item-img__1bbmH { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .reset-password-modal__menu-bar-btn__3VlD0 { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .reset-password-modal__menu-bar-btn_green__NwYf5, .reset-password-modal__menu-bar-btn_create__3vYEF { background-color: #3cdc8f; } .reset-password-modal__menu-bar-btn_green__NwYf5:hover, .reset-password-modal__menu-bar-btn_create__3vYEF:hover { background-color: #00d374; } .reset-password-modal__menu-bar-btn_green__NwYf5:active, .reset-password-modal__menu-bar-btn_create__3vYEF:active { background-color: #00d374; } .reset-password-modal__menu-bar-btn_save__3BGpv, .reset-password-modal__menu-bar-btn_reset__3GZ8k { background-color: #6ac8ff; } .reset-password-modal__menu-bar-btn_save__3BGpv:hover, .reset-password-modal__menu-bar-btn_reset__3GZ8k:hover { background-color: #57bcfe; } .reset-password-modal__menu-bar-btn_save__3BGpv:active, .reset-password-modal__menu-bar-btn_reset__3GZ8k:active { background-color: #4fb0fc; } .reset-password-modal__menu-bar-btn_submit__BT6Ao, .reset-password-modal__menu-bar-btn_open__3noXV { background-color: #ff9e23; } .reset-password-modal__menu-bar-btn_submit__BT6Ao:hover, .reset-password-modal__menu-bar-btn_open__3noXV:hover { background-color: #f47b04; } .reset-password-modal__menu-bar-btn_submit__BT6Ao:active, .reset-password-modal__menu-bar-btn_open__3noXV:active { background-color: #fe8f22; } .reset-password-modal__menu-bar-btn_link__uR-3U { background-color: #e8efff; color: var(--theme-primary); } .reset-password-modal__menu-bar-btn_link__uR-3U:hover { background-color: #b6c7ff; } .reset-password-modal__menu-bar-btn_link__uR-3U:active { background-color: #cfdcff; } .reset-password-modal__menu-bar-btn_disabled__2hnn6 { color: #565266; background-color: #e6e9ed; } .reset-password-modal__menu-bar-btn_disabled__2hnn6:hover { cursor: not-allowed; } .reset-password-modal__menu-bar-btn_help__2gzzM { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .reset-password-modal__menu-bar-btn_help__2gzzM:hover { background-color: #8398ff; } .reset-password-modal__menu-bar-btn_help__2gzzM:active { background-color: #8ca3ff; } .reset-password-modal__menu-bar-separator__1rEp9 { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .reset-password-modal__password-modal-mask__2M0Rt { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__modal-wrap__2aQhb { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__modal-wrap__2aQhb .reset-password-modal__modal-header-wrap__3V1rW { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__modal-wrap__2aQhb .reset-password-modal__modal-header-wrap__3V1rW .reset-password-modal__modal-header-bg__2Dhw1 { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__modal-wrap__2aQhb .reset-password-modal__modal-header-wrap__3V1rW .reset-password-modal__modal-header-label__2XvuG { flex-shrink: 0; font-size: 16px; font-weight: bold; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__modal-wrap__2aQhb .reset-password-modal__modal-header-wrap__3V1rW .reset-password-modal__modal-header-close__3kCRE { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__modal-wrap__2aQhb .reset-password-modal__modal-header-wrap__3V1rW .reset-password-modal__modal-header-close__3kCRE:hover { color: #98a2b4; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__modal-wrap__2aQhb .reset-password-modal__modal-body-wrap__2AyiG { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__modal-wrap__2aQhb .reset-password-modal__modal-footer-wrap__2HpnY { flex-shrink: 0; display: flex; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ { width: 464px; min-height: 514px; border-radius: 24px; background: #ffffff; position: relative; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__password-modal-open-close__2vJn- { height: 29px; width: 100%; box-sizing: border-box; padding-right: 21px; display: flex; justify-content: flex-end; align-items: flex-end; margin-bottom: 2.9px; color: #b5bccb; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__password-modal-open-close__2vJn- > span { cursor: url(static/cursor/cursor-pointer.cur), pointer; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__password-modal-open-close__2vJn- > span:hover { color: #98a2b4; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__password-modal-open-close__2vJn- > span:active { color: #828da3; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-title__2dErl { width: 100%; padding: 0 40px; box-sizing: border-box; text-align: center; font-family: 'PingFang SC'; font-style: normal; font-weight: 600; font-size: 18px; line-height: 26px; /* identical to box height, or 144% */ margin-bottom: 16px; color: #3d4554; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item { position: relative; padding: 0 40px; box-sizing: border-box; margin-bottom: 12px; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item .ant-form-item-label label { font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 14px; line-height: 20px; /* identical to box height */ color: #5e6b81; cursor: url(static/cursor/cursor-auto.cur), auto; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input :focus-within { border: 2px solid #6a7fff; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input :focus-within input:focus { border: none; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content { height: 48px; background: #f5f6fa; border-radius: 8px; box-sizing: border-box; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content input:-ms-input-placeholder { color: #b5bccb; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content input::placeholder { color: #b5bccb; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content input:-ms-input-placeholder:hover { color: #b5bccb; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content input::placeholder:hover { color: #b5bccb; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content input { border-radius: 8px; border: none; height: 100%; background-color: transparent; color: #3d4554; font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 14px; line-height: 20px; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-password { padding-right: 20px; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper { height: 100%; background: #f5f6fa; border-radius: 8px; border: none; box-sizing: border-box; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper input { border-radius: 8px; border: none; height: 100%; background-color: transparent; color: #3d4554; font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 14px; line-height: 20px; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper > span .ant-input-password-icon { font-size: 18px; cursor: url(static/cursor/cursor-pointer.cur), pointer; color: #98a2b4; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper > span .ant-input-password-icon:hover { color: #828da3; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper:hover { background: #edeff5; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content:hover { background: #edeff5; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content { background: #fff0f0; border: 2px solid #ff6666; border-radius: 8px; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content input { border-radius: 8px; height: 100%; background-color: transparent; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper { background: #fff0f0; border-radius: 8px; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper input { border-radius: 8px; height: 100%; background-color: transparent; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper span .ant-input-password-icon { cursor: url(static/cursor/cursor-pointer.cur), pointer; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper:hover { background: #fff0f0; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper :focus-within { background: #fff0f0; border: none; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-affix-wrapper :focus-within input:focus { border: none; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content:hover { background: #fff0f0; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content :focus-within { background: #fff0f0; border: none; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item-with-help.ant-form-item-has-error .ant-form-item-control-input .ant-form-item-control-input-content :focus-within input:focus { border: none; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item-with-help .ant-form-item-explain.ant-form-item-explain-validating, .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item-with-help .ant-form-item-explain.ant-form-item-explain-success { text-align: right; margin-top: 4px; color: #ff6666; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item-with-help .ant-form-item-explain.ant-form-item-explain-validating > div, .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item-with-help .ant-form-item-explain.ant-form-item-explain-success > div { font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 14px; /* identical to box height */ text-align: right; color: #ff6666; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item-with-help .ant-form-item-explain.ant-form-item-explain-error { text-align: right; margin-top: 4px; color: #ff6666; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item-with-help .ant-form-item-explain.ant-form-item-explain-error > div { font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 14px; /* identical to box height */ text-align: right; color: #ff6666; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item-with-help .ant-form-item-explain, .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item-with-help .ant-form-item-extra { text-align: right; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .ant-form .ant-form-item-with-help .ant-show-leave { text-align: right; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .reset-password-modal__moda-position-code__1A9Aq { position: relative; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .reset-password-modal__moda-position-code__1A9Aq .ant-form-item .ant-form-item-label { padding: 0 0 5px 0; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .reset-password-modal__moda-position-code__1A9Aq .ant-form-item .ant-form-item-label label { font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 18px; line-height: 25px; color: #5e6b81; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .reset-password-modal__bindPhone-modal-getCode__8IXhZ { position: absolute; top: 44px; right: 60px; color: #9cb0ff; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .reset-password-modal__bindPhone-modal-getCode__8IXhZ.reset-password-modal__bindPhone-modal-getCode_active__1EbTB { color: var(--theme-primary); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .reset-password-modal__bindPhone-modal-getCode__8IXhZ.reset-password-modal__bindPhone-modal-getCode_active__1EbTB:hover { color: #586ef5; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .reset-password-modal__bindPhone-modal-getCode__8IXhZ.reset-password-modal__bindPhone-modal-getCode_active__1EbTB:active { color: #4b62eb; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .reset-password-modal__modal-form-btns-change__1cnZD { padding: 0 40px; text-align: center; margin-top: 32px; margin-bottom: 12px; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .reset-password-modal__modal-form-btns-change__1cnZD button { width: 100%; background: #6a7fff; border-radius: 8px; height: 48px; cursor: url(static/cursor/cursor-pointer.cur), pointer; font-family: 'PingFang SC'; font-style: normal; font-weight: 600; font-size: 16px; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .reset-password-modal__modal-form-btns-change__1cnZD button:hover { background: #586ef5; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .reset-password-modal__modal-form-btns-change__1cnZD button:active { background: #4b62eb; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .reset-password-modal__modal-form-btns-change__1cnZD.reset-password-modal__modal-form-btn-disable__2Pamn { border: none; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-form__YNS-z .reset-password-modal__modal-form-btns-change__1cnZD.reset-password-modal__modal-form-btn-disable__2Pamn button { border: none; background: #9cb0ff; pointer-events: none; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-bottom-way-change__rcWdX { font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 16px; line-height: 26px; text-align: center; color: #5e6b81; margin-bottom: 24px; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-bottom-way-change__rcWdX span { cursor: url(static/cursor/cursor-pointer.cur), pointer; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-bottom-way-change__rcWdX span span:first-child { margin-right: 2px; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-bottom-way-change__rcWdX:hover { color: #6a7fff; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-bottom-way-change__rcWdX:active { color: #586ef5; } .reset-password-modal__password-modal-mask__2M0Rt .reset-password-modal__password-modal-open__IZaO_ .reset-password-modal__modal-bottom-tip-change__2xZf8 { font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 14px; line-height: 22px; text-align: center; color: #98a2b4; margin-bottom: 10px; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .exam-review-modal__exam-review-modal-wrap__3wAFx { position: fixed; top: 95px; right: 20px; width: 272px; z-index: 1040; background: #ffffff; box-shadow: 0px 4px 16px rgba(176, 185, 222, 0.13); border-radius: 12px; box-sizing: border-box; color: #6c7a92; } .exam-review-modal__exam-review-modal-wrap__3wAFx.exam-review-modal__exam-review-modal-wrap_algorithm__3rpP- { width: 350px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-header__3Xl9Q { height: 36px; font-family: 'PingFang SC'; font-style: normal; font-weight: 600; font-size: 14px; line-height: 36px; /* identical to box height, or 100% */ padding-left: 12px; border-bottom: 1px solid #e8efff; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb { box-sizing: border-box; padding-top: 12px; padding-bottom: 12px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-content-header__1MP9I { font-family: 'PingFang SC'; font-style: normal; font-weight: 600; font-size: 14px; line-height: 14px; /* identical to box height, or 100% */ padding-left: 6px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-scoreItem__zWOTg { padding: 0 105px 0 13px; display: flex; justify-content: space-between; align-items: center; margin-top: 12px; font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 14px; line-height: 14px; /* identical to box height, or 100% */ } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-scoreItem__zWOTg.exam-review-modal__examreview-scoreItem_disabled__-OHku .exam-review-modal__scoreItem-left__24Obk, .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-scoreItem__zWOTg.exam-review-modal__examreview-scoreItem_disabled__-OHku .exam-review-modal__scoreItem-right__BHhhD { color: #d1d7e1; text-decoration: line-through; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-scoreItem__zWOTg.exam-review-modal__examreview-scoreItem_codeQues__3gWb6 { padding: 0 129px 0 13px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-scoreItem__zWOTg.exam-review-modal__examreview-scoreItem-view__Zvw4r { justify-content: start; padding-right: 169px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-scoreItem__zWOTg.exam-review-modal__examreview-scoreItem-view__Zvw4r .exam-review-modal__scoreItem-left__24Obk { margin-right: 30px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-scoreItem__zWOTg .ant-input-number { height: 24px; width: 50px; margin-right: 8px; background-color: #fff; border-color: #e1eaff; border-radius: 4px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-scoreItem__zWOTg .ant-input-number .ant-input-number-handler-wrap { display: none; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-scoreItem__zWOTg .ant-input-number .ant-input-number-input { text-align: center; font-size: 14px; color: #6c7a92; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-scoreItem__zWOTg .ant-input-number ::-webkit-input-placeholder { color: #d1d7e1; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-scoreItem__zWOTg .exam-review-modal__scoreItem-right__BHhhD { font-size: 14px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-scoreItem__zWOTg .exam-review-modal__scoreItem-right__BHhhD .exam-review-modal__scoreItem-right-score__wtb7M { min-width: 18px; display: inline-block; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-scoreItem__zWOTg .exam-review-modal__scoreItem-right-err__2DdgZ { font-size: 14px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-scoreItem__zWOTg .exam-review-modal__scoreItem-right-err__2DdgZ .ant-input-number { height: 24px; width: 50px; margin-right: 8px; background-color: #fff0f0; border-color: #ff6666; border-radius: 4px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-scoreItem__zWOTg .exam-review-modal__scoreItem-right-err__2DdgZ .ant-input-number .ant-input-number-handler-wrap { display: none; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-scoreItem__zWOTg .exam-review-modal__scoreItem-right-err__2DdgZ .ant-input-number .ant-input-number-input { text-align: center; font-size: 14px; color: #6c7a92; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-scoreItem__zWOTg .exam-review-modal__scoreItem-right-err__2DdgZ .ant-input-number ::-webkit-input-placeholder { color: #d1d7e1; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-scoreItem__zWOTg .exam-review-modal__scoreItem-right-err__2DdgZ .ant-input-number-focused { box-shadow: none; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-total__2yeYq { padding-left: 13px; margin-top: 17px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-total__2yeYq > span { display: inline-block; margin-right: 60px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-creative-total-view__19Z-h { padding: 0 105px 0 13px; margin-top: 17px; display: flex; justify-content: space-between; align-items: center; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-creative-total-view__19Z-h > span { display: inline-block; margin-right: 0px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-creative-total-view__19Z-h .exam-review-modal__examreview-total-right__1aVY0 { min-width: 18px; display: inline-block; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-title__3STAj, .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-score__3SwIC { padding-left: 13px; margin-top: 12px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-title__3STAj > span, .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-score__3SwIC > span { display: inline-block; margin-right: 30px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-title__3STAj .exam-review-modal__examreview-title__value__BEzZi, .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-score__3SwIC .exam-review-modal__examreview-title__value__BEzZi { font-weight: 600; font-size: 14px; color: #6c7a92; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-title__3STAj { width: 100%; display: flex; flex-direction: row; justify-content: start; margin-top: 0px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-title__3STAj .exam-review-modal__examreview-title__label__1Izqr { width: 28px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-title__3STAj .exam-review-modal__examreview-title__value__BEzZi { flex: 1; max-height: 160px; margin-right: 0px; padding-right: 12px; overflow-y: overlay; white-space: pre-line; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-title__3STAj .exam-review-modal__examreview-title__value__BEzZi .exam-review-modal__examreview-title__value-img__3mIoD { max-width: 100%; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-algorithm-score-item__2-x4S { max-height: 200px; overflow-y: overlay; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-algorithm-score-item__2-x4S.exam-review-modal__examreview-algorithm-score-item-view__3slvQ .exam-review-modal__examreview-item__value__3RGHE { justify-content: start; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-item__2gIJv { display: flex; flex-direction: row; justify-content: space-between; align-items: flex-start; padding: 12px 0 0; margin: 0 12px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-item__2gIJv.exam-review-modal__examreview-item_mark__1RGh- { margin-top: 12px; border-top: 1px solid #e8efff; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-item__2gIJv.exam-review-modal__examreview-item-total-view__3E-i4 .exam-review-modal__examreview-item__value__3RGHE { justify-content: start; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-item__2gIJv.exam-review-modal__examreview-item-total-view__3E-i4 .exam-review-modal__examreview-item__value__3RGHE .exam-review-modal__examreview-item__value_total__3cqre { width: auto; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-item__2gIJv .exam-review-modal__examreview-item__label__132nR { flex: 1; word-break: break-all; margin-right: 4px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-item__2gIJv .exam-review-modal__examreview-item__value__3RGHE { width: 85px; display: flex; flex-direction: row; justify-content: space-between; align-items: center; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-item__2gIJv .exam-review-modal__examreview-item__value__3RGHE.exam-review-modal__examreview-item__value-err__3M6qN { font-size: 14px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-item__2gIJv .exam-review-modal__examreview-item__value__3RGHE.exam-review-modal__examreview-item__value-err__3M6qN .ant-input-number { height: 24px; width: 68px; background-color: #fff0f0; border-color: #ff6666; border-radius: 4px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-item__2gIJv .exam-review-modal__examreview-item__value__3RGHE.exam-review-modal__examreview-item__value-err__3M6qN .ant-input-number .ant-input-number-handler-wrap { display: none; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-item__2gIJv .exam-review-modal__examreview-item__value__3RGHE.exam-review-modal__examreview-item__value-err__3M6qN .ant-input-number .ant-input-number-input { text-align: center; font-size: 14px; color: #6c7a92; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-item__2gIJv .exam-review-modal__examreview-item__value__3RGHE.exam-review-modal__examreview-item__value-err__3M6qN .ant-input-number ::-webkit-input-placeholder { color: #d1d7e1; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-item__2gIJv .exam-review-modal__examreview-item__value__3RGHE.exam-review-modal__examreview-item__value-err__3M6qN .ant-input-number-focused { box-shadow: none; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-item__2gIJv .exam-review-modal__examreview-item__value__3RGHE .exam-review-modal__examreview-item__value_total__3cqre { width: 68px; display: flex; flex-direction: row; justify-content: end; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-item__2gIJv .exam-review-modal__examreview-item__value__3RGHE .exam-review-modal__mark-btn__rsr39 { width: 68px; display: flex; flex-direction: row; justify-content: center; align-items: center; background: #ffffff; border: 1px solid #6a7fff; border-radius: 4px; font-weight: 400; font-size: 14px; color: #6a7fff; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-item__2gIJv .exam-review-modal__examreview-item__value__3RGHE .exam-review-modal__mark-btn__rsr39:hover { background: rgba(106, 127, 255, 0.1); } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-item__2gIJv .exam-review-modal__examreview-item__value__3RGHE .exam-review-modal__mark-btn__rsr39:active { background: rgba(106, 127, 255, 0.3); } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-item__2gIJv .exam-review-modal__examreview-item__value__3RGHE .ant-input-number { height: 24px; width: 68px; background-color: #fff; border-color: #e1eaff; border-radius: 4px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-item__2gIJv .exam-review-modal__examreview-item__value__3RGHE .ant-input-number .ant-input-number-handler-wrap { display: none; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-item__2gIJv .exam-review-modal__examreview-item__value__3RGHE .ant-input-number .ant-input-number-input { text-align: center; font-size: 14px; color: #6c7a92; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-item__2gIJv .exam-review-modal__examreview-item__value__3RGHE .ant-input-number ::-webkit-input-placeholder { color: #d1d7e1; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-comment__1zN0C { display: flex; margin-top: 17px; justify-content: space-between; padding: 0 12px 0 13px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-comment__1zN0C .exam-review-modal__comment-wrap-view__3OwMW { width: 125px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-comment__1zN0C .exam-review-modal__comment-wrap___QA8T { width: 159px; border-radius: 4px; border-color: #edeff5; padding: 8px; color: #6c7a92; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-comment__1zN0C .exam-review-modal__comment-wrap___QA8T:disabled { color: #999999; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-comment__1zN0C .exam-review-modal__comment-wrap___QA8T:active, .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-comment__1zN0C .exam-review-modal__comment-wrap___QA8T:focus-visible { outline: none; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-comment__1zN0C .exam-review-modal__comment-wrap___QA8T:hover { border-color: #d1d7e1; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-comment__1zN0C .exam-review-modal__comment-wrap___QA8T:focus { border-color: var(--theme-primary); box-shadow: none; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__examreview-comment__1zN0C ::-webkit-input-placeholder { color: #d1d7e1; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__modal-btns__3zZ3b { text-align: center; padding: 0 12px; margin-top: 20px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__modal-btns__3zZ3b button { width: 100%; background: #6a7fff; border-radius: 4px; height: 38px; cursor: url(static/cursor/cursor-pointer.cur), pointer; font-family: 'PingFang SC'; font-style: normal; font-weight: 600; font-size: 14px; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__modal-btns__3zZ3b button:hover { background: #586ef5; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__modal-btns__3zZ3b button:active { background: #4b62eb; } .exam-review-modal__exam-review-modal-wrap__3wAFx .exam-review-modal__examreview-body__PyeAb .exam-review-modal__modal-btns__3zZ3b .exam-review-modal__modal-btns_disabled__1rLku { width: 100%; height: 38px; display: flex; align-items: center; justify-content: center; background: #aeaeae; border-radius: 4px; cursor: url(static/cursor/cursor-not-allowed_white.cur), not-allowed; font-family: 'PingFang SC'; font-style: normal; font-weight: 600; font-size: 14px; color: #ffffff; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .exam-room-modal__exam-room-modal-wrap__229qY { position: fixed; top: 95px; right: 20px; max-height: 75%; z-index: 1040; display: flex; flex-direction: column; box-sizing: border-box; flex-wrap: wrap-reverse; } .exam-room-modal__exam-room-modal-wrap__229qY .exam-room-modal__exam-room-list-item__3HoVL { width: 312px; height: 110px; background: #ffffff; box-shadow: 0px 4px 16px rgba(176, 185, 222, 0.13); border-radius: 12px; margin-bottom: 8px; margin-left: 4px; display: block; } .exam-room-modal__exam-room-modal-wrap__229qY .exam-room-modal__exam-room-list-item__3HoVL.exam-room-modal__list-hide__3_9Vx { display: none; } .exam-room-modal__exam-room-modal-wrap__229qY .exam-room-modal__exam-room-list-item__3HoVL .exam-room-modal__exam-name__23UGE { width: 100%; height: 66px; padding: 0 12px; border-bottom: 1px solid #e8efff; font-family: 'PingFang SC'; font-style: normal; font-weight: 600; font-size: 14px; line-height: 150%; color: #6c7a92; display: flex; align-items: center; justify-content: center; box-sizing: border-box; } .exam-room-modal__exam-room-modal-wrap__229qY .exam-room-modal__exam-room-list-item__3HoVL .exam-room-modal__exam-name__23UGE .exam-room-modal__exam-name-detail-wrap__2aSLo { width: 100%; height: 42px; display: flex; align-items: center; } .exam-room-modal__exam-room-modal-wrap__229qY .exam-room-modal__exam-room-list-item__3HoVL .exam-room-modal__exam-name__23UGE .exam-room-modal__exam-name-detail__eFAON { word-break: break-all; overflow: hidden; display: -webkit-box; /*弹性伸缩盒子*/ -webkit-box-orient: vertical; /*子元素垂直排列*/ -webkit-line-clamp: 2; /*可以显示的行数，超出部分用...表示*/ text-overflow: ellipsis; /*（多行文本的情况下，用省略号“…”隐藏溢出范围的文本)*/ } .exam-room-modal__exam-room-modal-wrap__229qY .exam-room-modal__exam-room-list-item__3HoVL .exam-room-modal__exam-time__ZLdOq { box-sizing: border-box; padding: 0 12px; display: flex; align-items: center; justify-content: space-between; height: 43px; } .exam-room-modal__exam-room-modal-wrap__229qY .exam-room-modal__exam-room-list-item__3HoVL .exam-room-modal__exam-time__ZLdOq .exam-room-modal__exam-time-line__2LEsv { height: 100%; display: flex; align-items: center; font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 14px; line-height: 14px; /* identical to box height, or 100% */ color: #6c7a92; } .exam-room-modal__exam-room-modal-wrap__229qY .exam-room-modal__exam-room-list-item__3HoVL .exam-room-modal__exam-time__ZLdOq .exam-room-modal__exam-time-line__2LEsv .exam-room-modal__exam-time-red__2mxjs { color: #ff6666; } .exam-room-modal__exam-room-modal-wrap__229qY .exam-room-modal__exam-room-list-item__3HoVL .exam-room-modal__exam-time__ZLdOq .exam-room-modal__exam-btn__10umN { width: 80px; height: 24px; left: 924px; background: #6a7fff; border-radius: 4px; font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 14px; line-height: 22px; text-align: center; color: #ffffff; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .index__flex-center__2dJH8 { display: flex; align-items: center; justify-content: center; } .index__full-filled__3fhs4 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .index__modal-mask__3qxO5 { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .index__modal-mask__3qxO5 .index__modal-wrap__33OeL { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .index__modal-mask__3qxO5 .index__modal-wrap__33OeL .index__modal-header-wrap__3D4-Z { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .index__modal-mask__3qxO5 .index__modal-wrap__33OeL .index__modal-header-wrap__3D4-Z .index__modal-header-bg__1eysL { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .index__modal-mask__3qxO5 .index__modal-wrap__33OeL .index__modal-header-wrap__3D4-Z .index__modal-header-label__32Jhv { flex-shrink: 0; font-size: 16px; font-weight: bold; } .index__modal-mask__3qxO5 .index__modal-wrap__33OeL .index__modal-header-wrap__3D4-Z .index__modal-header-close__3__oF { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .index__modal-mask__3qxO5 .index__modal-wrap__33OeL .index__modal-header-wrap__3D4-Z .index__modal-header-close__3__oF:hover { color: #98a2b4; } .index__modal-mask__3qxO5 .index__modal-wrap__33OeL .index__modal-body-wrap__3WOQu { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .index__modal-mask__3qxO5 .index__modal-wrap__33OeL .index__modal-footer-wrap__3YoPG { flex-shrink: 0; display: flex; } .index__modal-header__2T5sQ { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .index__modal-header__2T5sQ .index__modal-header-upload__6fxBj { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .index__modal-header__2T5sQ .index__modal-header-upload__6fxBj:hover { background-color: #e0e9ff; } .index__modal-header__2T5sQ .index__modal-header-upload__6fxBj:active { background-color: #ccdaff; } .index__modal-header__2T5sQ .index__modal-header-upload__6fxBj .index__upload-img__2RsAu { font-size: 16px; margin-right: calc(2px); } .index__modal-header__2T5sQ .index__modal-header-upload__6fxBj .index__upload-label__1lIyJ { font-size: 14px; } .index__modal-header__2T5sQ .index__modal-header-upload__6fxBj .index__upload-input__1m5Mi { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .index__modal-header__2T5sQ .index__modal-header-search__1DOud { position: relative; } .index__modal-header__2T5sQ .index__modal-header-search__1DOud .index__search-input__1RAtU { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .index__modal-header__2T5sQ .index__modal-header-search__1DOud .index__search-input__1RAtU::-webkit-input-placeholder { color: #98a2b4; } .index__modal-header__2T5sQ .index__modal-header-search__1DOud .index__search-input__1RAtU::-moz-placeholder { color: #98a2b4; } .index__modal-header__2T5sQ .index__modal-header-search__1DOud .index__search-input__1RAtU:-ms-input-placeholder { color: #98a2b4; } .index__modal-header__2T5sQ .index__modal-header-search__1DOud .index__search-input__1RAtU:hover { border-color: #d1d7e1; } .index__modal-header__2T5sQ .index__modal-header-search__1DOud .index__search-input__1RAtU:active { border-color: #d1d7e1; } .index__modal-header__2T5sQ .index__modal-header-search__1DOud .index__search-img__3H41G { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .index__modal-body__izdlz { flex-grow: 1; display: flex; } .index__modal-body__izdlz .index__modal-body-left__3I0Bo, .index__modal-body__izdlz .index__modal-body-main__3SA9W { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .index__modal-body__izdlz .index__modal-body-left__3I0Bo { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .index__modal-body__izdlz .index__modal-body-left__3I0Bo .index__modal-body-left-scroll__3gni3 { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .index__modal-body__izdlz .index__modal-body-left__3I0Bo .index__modal-body-left-scroll__3gni3 .index__modal-body-left-inner__1-shh { width: 121px; padding: calc(12px); color: #5e6b81; } .index__modal-body__izdlz .index__modal-body-left__3I0Bo .index__modal-body-left-scroll__3gni3 .index__modal-body-left-inner__1-shh .index__menu-item-current__1Ilzi { color: var(--theme-primary); background-color: #e0e9ff; } .index__modal-body__izdlz .index__modal-body-left__3I0Bo .index__modal-body-left-scroll__3gni3 .index__modal-body-left-inner__1-shh .index__menu-item__2m1X_ { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .index__modal-body__izdlz .index__modal-body-left__3I0Bo .index__modal-body-left-scroll__3gni3 .index__modal-body-left-inner__1-shh .index__menu-item__2m1X_:hover { background-color: #edeff5; } .index__modal-body__izdlz .index__modal-body-left__3I0Bo .index__modal-body-left-scroll__3gni3 .index__modal-body-left-inner__1-shh .index__menu-item__2m1X_ .index__menu-item-img__FLeW8 { flex-shrink: 0; width: 20px; margin-right: 8px; } .index__modal-body__izdlz .index__modal-body-left__3I0Bo .index__modal-body-left-scroll__3gni3 .index__modal-body-left-inner__1-shh .index__menu-item__2m1X_ .index__menu-item-label__20fUO { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .index__modal-body__izdlz .index__modal-body-main__3SA9W { padding: calc(12px) 0; } .index__modal-body__izdlz .index__modal-body-main__3SA9W .index__modal-body-main-scroll__3ewSv { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .index__modal-body__izdlz .index__modal-body-main__3SA9W .index__modal-body-main-scroll__3ewSv .index__modal-body-main-inner__1c_Qq { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .index__modal-body__izdlz .index__modal-body-main__3SA9W .index__modal-body-main-scroll__3ewSv .index__modal-body-main-inner__1c_Qq .index__selector-btn-add__3mjJa, .index__modal-body__izdlz .index__modal-body-main__3SA9W .index__modal-body-main-scroll__3ewSv .index__modal-body-main-inner__1c_Qq .index__selector-btn-item__2JwuE { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .index__modal-body__izdlz .index__modal-body-main__3SA9W .index__modal-body-main-scroll__3ewSv .index__modal-body-main-inner__1c_Qq .index__selector-btn-add__3mjJa:hover, .index__modal-body__izdlz .index__modal-body-main__3SA9W .index__modal-body-main-scroll__3ewSv .index__modal-body-main-inner__1c_Qq .index__selector-btn-item__2JwuE:hover { background-color: #e0e9ff; } .index__modal-body__izdlz .index__modal-body-main__3SA9W .index__modal-body-main-scroll__3ewSv .index__modal-body-main-inner__1c_Qq .index__selector-btn-add__3mjJa:active, .index__modal-body__izdlz .index__modal-body-main__3SA9W .index__modal-body-main-scroll__3ewSv .index__modal-body-main-inner__1c_Qq .index__selector-btn-item__2JwuE:active { background-color: #ccdaff; } .index__modal-body__izdlz .index__modal-body-main__3SA9W .index__modal-body-main-scroll__3ewSv .index__modal-body-main-inner__1c_Qq .index__selector-btn-add__3mjJa:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .index__modal-body__izdlz .index__modal-body-main__3SA9W .index__modal-body-main-scroll__3ewSv .index__modal-body-main-inner__1c_Qq .index__selector-btn-add__3mjJa:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .index__modal-body__izdlz .index__modal-body-main__3SA9W .index__modal-body-main-scroll__3ewSv .index__modal-body-main-inner__1c_Qq .index__selector-btn-add__3mjJa .index__add-img__3-grB { font-size: 28px; height: auto; margin-bottom: 8px; } .index__modal-body__izdlz .index__modal-body-main__3SA9W .index__modal-body-main-scroll__3ewSv .index__modal-body-main-inner__1c_Qq .index__selector-btn-add__3mjJa .index__add-label__1BAYx { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .index__modal-body__izdlz .index__modal-body-main__3SA9W .index__modal-body-main-scroll__3ewSv .index__modal-body-main-inner__1c_Qq .index__selector-btn-item__2JwuE { justify-content: space-between; } .index__modal-body__izdlz .index__modal-body-main__3SA9W .index__modal-body-main-scroll__3ewSv .index__modal-body-main-inner__1c_Qq .index__selector-btn-item__2JwuE .index__item-img__1RmOH { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .index__modal-body__izdlz .index__modal-body-main__3SA9W .index__modal-body-main-scroll__3ewSv .index__modal-body-main-inner__1c_Qq .index__selector-btn-item__2JwuE .index__item-img__1RmOH img { width: auto; height: 105px; } .index__modal-body__izdlz .index__modal-body-main__3SA9W .index__modal-body-main-scroll__3ewSv .index__modal-body-main-inner__1c_Qq .index__selector-btn-item__2JwuE .index__item-label__3eKlP { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .index__modal-footer__3Gnpc { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .index__selector-btn-add__3mjJa, .index__selector-btn-item__2JwuE { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .index__selector-btn-add__3mjJa { background-color: var(--selector-sprite-bg_primary); } .index__selector-btn-add__3mjJa:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .index__selector-btn-add__3mjJa:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .index__selector-btn-add__3mjJa .index__add-img__3-grB { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .index__selector-btn-add__3mjJa .index__add-label__1BAYx { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .index__selector-btn-item__2JwuE { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .index__selector-btn-item__2JwuE .index__item-img__1RmOH { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .index__selector-btn-item__2JwuE .index__item-img__1RmOH img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .index__selector-btn-item__2JwuE .index__item-label__3eKlP { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .index__selector-btn-item__2JwuE:hover { background-color: var(--selector-sprite-bg_primary); } .index__selector-btn-item__2JwuE:hover .index__item-img__1RmOH { border-color: var(--selector-sprite-bg_primary); } .index__selector-btn-item_selected__3FwEK { background-color: var(--selector-sprite-bg_primary); } .index__selector-btn-item_selected__3FwEK .index__item-img__1RmOH { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .index__menu-bar-btn__Crg7D { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .index__menu-bar-btn_green__3GAwz, .index__menu-bar-btn_create__3sHZY { background-color: #3cdc8f; } .index__menu-bar-btn_green__3GAwz:hover, .index__menu-bar-btn_create__3sHZY:hover { background-color: #00d374; } .index__menu-bar-btn_green__3GAwz:active, .index__menu-bar-btn_create__3sHZY:active { background-color: #00d374; } .index__menu-bar-btn_save__3Pjl4, .index__menu-bar-btn_reset__3JH86 { background-color: #6ac8ff; } .index__menu-bar-btn_save__3Pjl4:hover, .index__menu-bar-btn_reset__3JH86:hover { background-color: #57bcfe; } .index__menu-bar-btn_save__3Pjl4:active, .index__menu-bar-btn_reset__3JH86:active { background-color: #4fb0fc; } .index__menu-bar-btn_submit__2eb8Y, .index__menu-bar-btn_open__3NONS { background-color: #ff9e23; } .index__menu-bar-btn_submit__2eb8Y:hover, .index__menu-bar-btn_open__3NONS:hover { background-color: #f47b04; } .index__menu-bar-btn_submit__2eb8Y:active, .index__menu-bar-btn_open__3NONS:active { background-color: #fe8f22; } .index__menu-bar-btn_link__3qsfG { background-color: #e8efff; color: var(--theme-primary); } .index__menu-bar-btn_link__3qsfG:hover { background-color: #b6c7ff; } .index__menu-bar-btn_link__3qsfG:active { background-color: #cfdcff; } .index__menu-bar-btn_disabled__KZ40Z { color: #565266; background-color: #e6e9ed; } .index__menu-bar-btn_disabled__KZ40Z:hover { cursor: not-allowed; } .index__menu-bar-btn_help__3Nyt2 { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .index__menu-bar-btn_help__3Nyt2:hover { background-color: #8398ff; } .index__menu-bar-btn_help__3Nyt2:active { background-color: #8ca3ff; } .index__menu-bar-separator__3nFci { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ @keyframes index__loading__1ruI4 { 0% { transform: rotate(0deg); } to { transform: rotate(360deg); } } @keyframes index__ellipsis__2nNJJ { 0% { transform: translate(0, 0); } 20% { transform: translate(0, -4px); } 40% { transform: translate(0, 0); } to { transform: translate(0, 0); } } .index__code-check__2nfib.index__mask__3uTOt { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .index__code-check__2nfib.index__mask__3uTOt .index__modal-wrap__33OeL { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .index__code-check__2nfib.index__mask__3uTOt .index__modal-wrap__33OeL .index__modal-header-wrap__3D4-Z { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .index__code-check__2nfib.index__mask__3uTOt .index__modal-wrap__33OeL .index__modal-header-wrap__3D4-Z .index__modal-header-bg__1eysL { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .index__code-check__2nfib.index__mask__3uTOt .index__modal-wrap__33OeL .index__modal-header-wrap__3D4-Z .index__modal-header-label__32Jhv { flex-shrink: 0; font-size: 16px; font-weight: bold; } .index__code-check__2nfib.index__mask__3uTOt .index__modal-wrap__33OeL .index__modal-header-wrap__3D4-Z .index__modal-header-close__3__oF { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .index__code-check__2nfib.index__mask__3uTOt .index__modal-wrap__33OeL .index__modal-header-wrap__3D4-Z .index__modal-header-close__3__oF:hover { color: #98a2b4; } .index__code-check__2nfib.index__mask__3uTOt .index__modal-wrap__33OeL .index__modal-body-wrap__3WOQu { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .index__code-check__2nfib.index__mask__3uTOt .index__modal-wrap__33OeL .index__modal-footer-wrap__3YoPG { flex-shrink: 0; display: flex; } .index__code-check__2nfib .index__container__1TYSM { width: 569px; background-color: #ffffff; border-radius: 12px; position: relative; display: flex; flex-wrap: nowrap; flex-direction: column; align-items: center; padding: 40px 0 24px 0; } .index__code-check__2nfib .index__container__1TYSM .index__img-hand__29HjZ { position: absolute; top: -19px; left: 50%; width: 100px; object-fit: cover; transform: translate(-50%, 0); z-index: 2; } .index__code-check__2nfib .index__container__1TYSM .index__img-monkey__3fZSu { position: absolute; top: -75px; left: calc(50% - 4px); width: 135px; object-fit: cover; transform: translate(-50%, 0); z-index: 1; } .index__code-check__2nfib .index__container__1TYSM .index__img-monkey-warn__2f1Qr { position: absolute; top: -87px; left: calc(50% - 4px); width: 135px; object-fit: cover; transform: translate(-50%, 0); z-index: 1; } .index__code-check__2nfib .index__container__1TYSM .index__close-btn__42fLX { position: absolute; top: 15px; right: 22.76px; display: inline-block; height: 12px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; font-size: 16px; } .index__code-check__2nfib .index__container__1TYSM .index__title__27Z-d { color: #3d4554; font-family: PingFang SC; font-style: normal; font-weight: 600; font-size: 16px; line-height: 16px; margin-bottom: 20px; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 { margin: 0; overflow-y: auto; max-height: calc(765px - 76px - 73px); padding: 0 20px 20px 20px; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul { margin: 0; padding: 0; list-style: none; transform: translate(18px, 0); background-size: 0; width: 100%; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul::after { content: ''; display: block; height: calc(100% - 38px); position: absolute; left: -27px; top: 19px; width: 2px; background-image: inherit; background-repeat: repeat-y; background-size: contain; z-index: -1; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li { display: block; position: relative; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li.index__openMission__2Hpuk.index__warning__38I4l .index__box__2Lm3L { background: rgba(255, 63, 63, 0.06); } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li.index__openMission__2Hpuk.index__warning__38I4l .index__box__2Lm3L:hover { background: rgba(255, 63, 63, 0.1); } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li.index__openMission__2Hpuk.index__warning__38I4l .index__box__2Lm3L:active { background: rgba(255, 63, 63, 0.15); } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li.index__openMission__2Hpuk.index__warning__38I4l .index__table__309hH { background: rgba(255, 63, 63, 0.02) !important; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li.index__warning__38I4l .index__box__2Lm3L { background: #fff9ea; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li.index__warning__38I4l .index__box__2Lm3L:hover { background: #fff5dc; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li.index__warning__38I4l .index__box__2Lm3L:active { background: #fff0c9; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li.index__warning__38I4l .index__table__309hH { background: rgba(255, 248, 225, 0.3) !important; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li.index__opened__1g8YT .index__box__2Lm3L { border-radius: 4px 4px 0 0 !important; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li.index__opened__1g8YT .index__box__2Lm3L .index__arrow__2kzUi { transform: translate(0, -50%) rotate(-90deg); } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__show__3fmqu { position: relative; opacity: 1 !important; background: #ffffff; border-radius: 50%; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__icon__2B_C0 { transition: opacity 0.24s; opacity: 0; position: absolute; left: -36px; top: 9px; font-size: 20px; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__loading__1ruI4 { transition: opacity 0.24s; opacity: 0; position: relative; box-sizing: border-box; position: absolute; left: -36px; top: 9px; height: 20px; width: 20px; border-radius: 50%; background: #d1d7e1; display: flex; justify-content: flex-start; align-items: center; overflow: hidden; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__loading__1ruI4 span { position: relative; display: block; height: 100%; width: 50%; border-top-left-radius: 50%; border-top-right-radius: 50%; background-color: #3cdc8f; transform-origin: 100% 50%; animation: index__loading__1ruI4 1s infinite linear; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__loading__1ruI4 span::before, .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__loading__1ruI4 span::after { content: ''; display: block; height: 4px; width: 4px; background-color: inherit; border-radius: 50%; position: absolute; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__loading__1ruI4 span::before { top: 0; left: 50%; transform: translate(-50%, 0); } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__loading__1ruI4 span::after { bottom: 0; left: 50%; transform: translate(-50%, 0); } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__loading__1ruI4::after { content: ''; display: block; height: 8px; width: 8px; background-color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 50%; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__box__2Lm3L { position: relative; width: 484px; padding: 8px 0 8px 73px; box-sizing: border-box; display: flex; align-items: center; font-family: PingFang SC; font-style: normal; font-weight: normal; font-size: 14px; line-height: 22px; background: #edf0f7; border-radius: 4px; transition: background-color 0.3s; white-space: break-spaces; color: #5e6b81; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__box__2Lm3L .index__arrow__2kzUi { font-size: 16px; position: absolute; right: 13px; top: 50%; color: #757d8a; transform: translate(0, -50%) rotate(0deg); transition: transform 0.3s; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__box__2Lm3L:hover { background: #e4e8f2; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__box__2Lm3L:active { background: #dde1eb; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__box__2Lm3L::before { width: 60px; height: 100%; position: absolute; top: 50%; left: 0; transform: translate(0, -50%); content: attr(data-title); display: inline-block; padding: 8px 0 8px 12px; color: #3d4554; font-family: PingFang SC; font-style: normal; font-weight: 600; font-size: 14px; line-height: 22px; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__box__2Lm3L::after { content: ''; display: block; position: absolute; top: 12px; left: 60px; height: 13px; width: 1px; border-left: 1px solid #d1d7e1; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li:not(li:last-child) { margin-bottom: 10px; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__table__309hH { transition: height 0.3s, opacity 0.3s; background: rgba(229, 233, 243, 0.2); border-radius: 0 0 4px 4px; overflow: hidden; padding: 0; height: 0; opacity: 0; display: flex; justify-content: center; align-items: center; width: 100%; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__table__309hH .index__subtitle__eUmE4 { display: flex; justify-content: flex-start; align-items: center; width: 100%; grid-column: 1 / 4; height: 18px; margin: 12px 0; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__table__309hH .index__subtitle__eUmE4 .index__subtitle-icon__11ByU { font-size: 17px; color: #8f97a6; flex-shrink: 0; flex-basis: 17px; margin-right: 5px; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__table__309hH .index__subtitle__eUmE4 .index__subtitle-text__o4ZZr { font-family: PingFang SC; font-size: 13px; font-weight: 600; line-height: 18px; display: inline-block; flex-shrink: 0; color: #5e6b81; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__table__309hH .index__subtitle__eUmE4 .index__subtitle-line__1ReYg { display: inline-block; background-color: #eceff6; height: 100%; flex-shrink: 1; flex-grow: 1; flex-basis: 100%; height: 1px; margin-left: 7px; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__table__309hH.index__opened__1g8YT { opacity: 1; height: calc(var(--rows) * 30px + 16px); } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__table__309hH section { display: grid; grid-template-rows: repeat(var(--rows), 30px); grid-template-columns: repeat(3, 1fr); place-items: center left; box-sizing: content-box; height: auto; width: 100%; padding: 8px 16px; } .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 ul li .index__table__309hH section .index__name__2yVO3 { display: inline-block; margin-left: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 115px; vertical-align: middle; font-size: 13px; color: #5e6b81; font-weight: 400; line-height: 30px; } .index__code-check__2nfib .index__container__1TYSM .index__checkBtn__2znNP { position: relative; width: 100px; height: 36px; background: var(--theme-primary); display: flex; justify-content: center; align-items: center; border-radius: 41px; } .index__code-check__2nfib .index__container__1TYSM .index__checkBtn__2znNP span { font-family: PingFang SC; font-style: normal; font-weight: 600; font-size: 14px; line-height: 22px; text-align: center; color: #ffffff; } .index__code-check__2nfib .index__container__1TYSM .index__checkBtn__2znNP .index__ellipsis__2nNJJ { animation-name: index__ellipsis__2nNJJ; animation-duration: 1s; animation-timing-function: ease-out; animation-iteration-count: infinite; } .index__code-check__2nfib .index__container__1TYSM .index__checkBtn__2znNP .index__ellipsis__2nNJJ[data-index='0'] { animation-delay: 0s; } .index__code-check__2nfib .index__container__1TYSM .index__checkBtn__2znNP .index__ellipsis__2nNJJ[data-index='1'] { animation-delay: 0.1s; } .index__code-check__2nfib .index__container__1TYSM .index__checkBtn__2znNP .index__ellipsis__2nNJJ[data-index='2'] { animation-delay: 0.2s; } .index__code-check__2nfib .index__container__1TYSM .index__checkBtn__2znNP:hover { background-color: #4250d3; } .index__code-check__2nfib .index__container__1TYSM .index__checkBtn__2znNP:active { background-color: #222ba6; } .index__code-check__2nfib .index__container__1TYSM .index__checkBtn__2znNP.index__disable__1c9fS { background: var(--theme-primary) !important; cursor: disable; } .index__code-check__2nfib .index__container__1TYSM .index__checkBtn__2znNP.index__disable__1c9fS::after { content: ''; position: absolute; top: 0; left: 0; display: block; height: 100%; width: 100%; border-radius: inherit; background-color: rgba(255, 255, 255, 0.3); } .index__code-check__2nfib .index__container__1TYSM .index__cancelLink__3M9t- { font-family: PingFang SC; font-style: normal; font-weight: normal; font-size: 14px; line-height: 22px; margin-top: 12px; color: #828da3; cursor: url(static/cursor/cursor-pointer.cur), pointer; } @media screen and (max-width: 1024px) { .index__code-check__2nfib .index__container__1TYSM .index__list__1JBH3 { max-height: calc(544px - 76px - 73px); } } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .index__flex-center__6ErXQ { display: flex; align-items: center; justify-content: center; } .index__full-filled__W7tCn { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .index__modal-mask__1oMzi { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .index__modal-mask__1oMzi .index__modal-wrap__wX_Xa { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .index__modal-mask__1oMzi .index__modal-wrap__wX_Xa .index__modal-header-wrap__3LJlO { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .index__modal-mask__1oMzi .index__modal-wrap__wX_Xa .index__modal-header-wrap__3LJlO .index__modal-header-bg__1hjl_ { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .index__modal-mask__1oMzi .index__modal-wrap__wX_Xa .index__modal-header-wrap__3LJlO .index__modal-header-label__3iw3Q { flex-shrink: 0; font-size: 16px; font-weight: bold; } .index__modal-mask__1oMzi .index__modal-wrap__wX_Xa .index__modal-header-wrap__3LJlO .index__modal-header-close__3v3ie { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .index__modal-mask__1oMzi .index__modal-wrap__wX_Xa .index__modal-header-wrap__3LJlO .index__modal-header-close__3v3ie:hover { color: #98a2b4; } .index__modal-mask__1oMzi .index__modal-wrap__wX_Xa .index__modal-body-wrap__2VKdo { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .index__modal-mask__1oMzi .index__modal-wrap__wX_Xa .index__modal-footer-wrap__3zNB_ { flex-shrink: 0; display: flex; } .index__modal-header__2cykz { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .index__modal-header__2cykz .index__modal-header-upload__2Coa2 { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .index__modal-header__2cykz .index__modal-header-upload__2Coa2:hover { background-color: #e0e9ff; } .index__modal-header__2cykz .index__modal-header-upload__2Coa2:active { background-color: #ccdaff; } .index__modal-header__2cykz .index__modal-header-upload__2Coa2 .index__upload-img__I45av { font-size: 16px; margin-right: calc(2px); } .index__modal-header__2cykz .index__modal-header-upload__2Coa2 .index__upload-label__2ChnM { font-size: 14px; } .index__modal-header__2cykz .index__modal-header-upload__2Coa2 .index__upload-input__1nYoM { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .index__modal-header__2cykz .index__modal-header-search__G3XkG { position: relative; } .index__modal-header__2cykz .index__modal-header-search__G3XkG .index__search-input__2WZ0E { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .index__modal-header__2cykz .index__modal-header-search__G3XkG .index__search-input__2WZ0E::-webkit-input-placeholder { color: #98a2b4; } .index__modal-header__2cykz .index__modal-header-search__G3XkG .index__search-input__2WZ0E::-moz-placeholder { color: #98a2b4; } .index__modal-header__2cykz .index__modal-header-search__G3XkG .index__search-input__2WZ0E:-ms-input-placeholder { color: #98a2b4; } .index__modal-header__2cykz .index__modal-header-search__G3XkG .index__search-input__2WZ0E:hover { border-color: #d1d7e1; } .index__modal-header__2cykz .index__modal-header-search__G3XkG .index__search-input__2WZ0E:active { border-color: #d1d7e1; } .index__modal-header__2cykz .index__modal-header-search__G3XkG .index__search-img__emWnj { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .index__modal-body__1FtIn { flex-grow: 1; display: flex; } .index__modal-body__1FtIn .index__modal-body-left__1XmvS, .index__modal-body__1FtIn .index__modal-body-main__1EaqL { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .index__modal-body__1FtIn .index__modal-body-left__1XmvS { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .index__modal-body__1FtIn .index__modal-body-left__1XmvS .index__modal-body-left-scroll__3vKBe { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .index__modal-body__1FtIn .index__modal-body-left__1XmvS .index__modal-body-left-scroll__3vKBe .index__modal-body-left-inner__2hm_m { width: 121px; padding: calc(12px); color: #5e6b81; } .index__modal-body__1FtIn .index__modal-body-left__1XmvS .index__modal-body-left-scroll__3vKBe .index__modal-body-left-inner__2hm_m .index__menu-item-current__NS2Kx { color: var(--theme-primary); background-color: #e0e9ff; } .index__modal-body__1FtIn .index__modal-body-left__1XmvS .index__modal-body-left-scroll__3vKBe .index__modal-body-left-inner__2hm_m .index__menu-item__3rdE8 { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .index__modal-body__1FtIn .index__modal-body-left__1XmvS .index__modal-body-left-scroll__3vKBe .index__modal-body-left-inner__2hm_m .index__menu-item__3rdE8:hover { background-color: #edeff5; } .index__modal-body__1FtIn .index__modal-body-left__1XmvS .index__modal-body-left-scroll__3vKBe .index__modal-body-left-inner__2hm_m .index__menu-item__3rdE8 .index__menu-item-img__3EnEi { flex-shrink: 0; width: 20px; margin-right: 8px; } .index__modal-body__1FtIn .index__modal-body-left__1XmvS .index__modal-body-left-scroll__3vKBe .index__modal-body-left-inner__2hm_m .index__menu-item__3rdE8 .index__menu-item-label__36B52 { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .index__modal-body__1FtIn .index__modal-body-main__1EaqL { padding: calc(12px) 0; } .index__modal-body__1FtIn .index__modal-body-main__1EaqL .index__modal-body-main-scroll__SaiJD { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .index__modal-body__1FtIn .index__modal-body-main__1EaqL .index__modal-body-main-scroll__SaiJD .index__modal-body-main-inner__3dtqc { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .index__modal-body__1FtIn .index__modal-body-main__1EaqL .index__modal-body-main-scroll__SaiJD .index__modal-body-main-inner__3dtqc .index__selector-btn-add__oZJYD, .index__modal-body__1FtIn .index__modal-body-main__1EaqL .index__modal-body-main-scroll__SaiJD .index__modal-body-main-inner__3dtqc .index__selector-btn-item__dBpK_ { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .index__modal-body__1FtIn .index__modal-body-main__1EaqL .index__modal-body-main-scroll__SaiJD .index__modal-body-main-inner__3dtqc .index__selector-btn-add__oZJYD:hover, .index__modal-body__1FtIn .index__modal-body-main__1EaqL .index__modal-body-main-scroll__SaiJD .index__modal-body-main-inner__3dtqc .index__selector-btn-item__dBpK_:hover { background-color: #e0e9ff; } .index__modal-body__1FtIn .index__modal-body-main__1EaqL .index__modal-body-main-scroll__SaiJD .index__modal-body-main-inner__3dtqc .index__selector-btn-add__oZJYD:active, .index__modal-body__1FtIn .index__modal-body-main__1EaqL .index__modal-body-main-scroll__SaiJD .index__modal-body-main-inner__3dtqc .index__selector-btn-item__dBpK_:active { background-color: #ccdaff; } .index__modal-body__1FtIn .index__modal-body-main__1EaqL .index__modal-body-main-scroll__SaiJD .index__modal-body-main-inner__3dtqc .index__selector-btn-add__oZJYD:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .index__modal-body__1FtIn .index__modal-body-main__1EaqL .index__modal-body-main-scroll__SaiJD .index__modal-body-main-inner__3dtqc .index__selector-btn-add__oZJYD:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .index__modal-body__1FtIn .index__modal-body-main__1EaqL .index__modal-body-main-scroll__SaiJD .index__modal-body-main-inner__3dtqc .index__selector-btn-add__oZJYD .index__add-img__2G4FW { font-size: 28px; height: auto; margin-bottom: 8px; } .index__modal-body__1FtIn .index__modal-body-main__1EaqL .index__modal-body-main-scroll__SaiJD .index__modal-body-main-inner__3dtqc .index__selector-btn-add__oZJYD .index__add-label__CKM8c { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .index__modal-body__1FtIn .index__modal-body-main__1EaqL .index__modal-body-main-scroll__SaiJD .index__modal-body-main-inner__3dtqc .index__selector-btn-item__dBpK_ { justify-content: space-between; } .index__modal-body__1FtIn .index__modal-body-main__1EaqL .index__modal-body-main-scroll__SaiJD .index__modal-body-main-inner__3dtqc .index__selector-btn-item__dBpK_ .index__item-img__1uVGj { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .index__modal-body__1FtIn .index__modal-body-main__1EaqL .index__modal-body-main-scroll__SaiJD .index__modal-body-main-inner__3dtqc .index__selector-btn-item__dBpK_ .index__item-img__1uVGj img { width: auto; height: 105px; } .index__modal-body__1FtIn .index__modal-body-main__1EaqL .index__modal-body-main-scroll__SaiJD .index__modal-body-main-inner__3dtqc .index__selector-btn-item__dBpK_ .index__item-label__e76R7 { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .index__modal-footer__3E0gm { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .index__selector-btn-add__oZJYD, .index__selector-btn-item__dBpK_ { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .index__selector-btn-add__oZJYD { background-color: var(--selector-sprite-bg_primary); } .index__selector-btn-add__oZJYD:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .index__selector-btn-add__oZJYD:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .index__selector-btn-add__oZJYD .index__add-img__2G4FW { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .index__selector-btn-add__oZJYD .index__add-label__CKM8c { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .index__selector-btn-item__dBpK_ { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .index__selector-btn-item__dBpK_ .index__item-img__1uVGj { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .index__selector-btn-item__dBpK_ .index__item-img__1uVGj img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .index__selector-btn-item__dBpK_ .index__item-label__e76R7 { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .index__selector-btn-item__dBpK_:hover { background-color: var(--selector-sprite-bg_primary); } .index__selector-btn-item__dBpK_:hover .index__item-img__1uVGj { border-color: var(--selector-sprite-bg_primary); } .index__selector-btn-item_selected__YvKbP { background-color: var(--selector-sprite-bg_primary); } .index__selector-btn-item_selected__YvKbP .index__item-img__1uVGj { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .index__menu-bar-btn__7Ynwl { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .index__menu-bar-btn_green__1ogeH, .index__menu-bar-btn_create__2VKNY { background-color: #3cdc8f; } .index__menu-bar-btn_green__1ogeH:hover, .index__menu-bar-btn_create__2VKNY:hover { background-color: #00d374; } .index__menu-bar-btn_green__1ogeH:active, .index__menu-bar-btn_create__2VKNY:active { background-color: #00d374; } .index__menu-bar-btn_save__15-WE, .index__menu-bar-btn_reset__1s8aN { background-color: #6ac8ff; } .index__menu-bar-btn_save__15-WE:hover, .index__menu-bar-btn_reset__1s8aN:hover { background-color: #57bcfe; } .index__menu-bar-btn_save__15-WE:active, .index__menu-bar-btn_reset__1s8aN:active { background-color: #4fb0fc; } .index__menu-bar-btn_submit__Nf97g, .index__menu-bar-btn_open__3e2K8 { background-color: #ff9e23; } .index__menu-bar-btn_submit__Nf97g:hover, .index__menu-bar-btn_open__3e2K8:hover { background-color: #f47b04; } .index__menu-bar-btn_submit__Nf97g:active, .index__menu-bar-btn_open__3e2K8:active { background-color: #fe8f22; } .index__menu-bar-btn_link__ovSiR { background-color: #e8efff; color: var(--theme-primary); } .index__menu-bar-btn_link__ovSiR:hover { background-color: #b6c7ff; } .index__menu-bar-btn_link__ovSiR:active { background-color: #cfdcff; } .index__menu-bar-btn_disabled__2itTi { color: #565266; background-color: #e6e9ed; } .index__menu-bar-btn_disabled__2itTi:hover { cursor: not-allowed; } .index__menu-bar-btn_help__3Y1Vf { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .index__menu-bar-btn_help__3Y1Vf:hover { background-color: #8398ff; } .index__menu-bar-btn_help__3Y1Vf:active { background-color: #8ca3ff; } .index__menu-bar-separator__1iuVf { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ @keyframes index__loading__19xe0 { 0% { transform: rotate(0deg); } to { transform: rotate(360deg); } } @keyframes index__ellipsis__1A4pK { 0% { transform: translate(0, 0); } 20% { transform: translate(0, -4px); } 40% { transform: translate(0, 0); } to { transform: translate(0, 0); } } .index__code-check__38cRE.index__mask__1Gr4T { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .index__code-check__38cRE.index__mask__1Gr4T .index__modal-wrap__wX_Xa { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .index__code-check__38cRE.index__mask__1Gr4T .index__modal-wrap__wX_Xa .index__modal-header-wrap__3LJlO { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .index__code-check__38cRE.index__mask__1Gr4T .index__modal-wrap__wX_Xa .index__modal-header-wrap__3LJlO .index__modal-header-bg__1hjl_ { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .index__code-check__38cRE.index__mask__1Gr4T .index__modal-wrap__wX_Xa .index__modal-header-wrap__3LJlO .index__modal-header-label__3iw3Q { flex-shrink: 0; font-size: 16px; font-weight: bold; } .index__code-check__38cRE.index__mask__1Gr4T .index__modal-wrap__wX_Xa .index__modal-header-wrap__3LJlO .index__modal-header-close__3v3ie { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .index__code-check__38cRE.index__mask__1Gr4T .index__modal-wrap__wX_Xa .index__modal-header-wrap__3LJlO .index__modal-header-close__3v3ie:hover { color: #98a2b4; } .index__code-check__38cRE.index__mask__1Gr4T .index__modal-wrap__wX_Xa .index__modal-body-wrap__2VKdo { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .index__code-check__38cRE.index__mask__1Gr4T .index__modal-wrap__wX_Xa .index__modal-footer-wrap__3zNB_ { flex-shrink: 0; display: flex; } .index__code-check__38cRE .index__container__2R6wB { width: 569px; background-color: #ffffff; border-radius: 12px; position: relative; display: flex; flex-wrap: nowrap; flex-direction: column; align-items: center; padding: 40px 0 24px 0; } .index__code-check__38cRE .index__container__2R6wB .index__img-hand__1pBkF { position: absolute; top: -19px; left: 50%; width: 100px; object-fit: cover; transform: translate(-50%, 0); z-index: 2; } .index__code-check__38cRE .index__container__2R6wB .index__img-monkey__3CT1S { position: absolute; top: -75px; left: calc(50% - 4px); width: 135px; object-fit: cover; transform: translate(-50%, 0); z-index: 1; } .index__code-check__38cRE .index__container__2R6wB .index__img-monkey-warn__3FN-W { position: absolute; top: -87px; left: calc(50% - 4px); width: 135px; object-fit: cover; transform: translate(-50%, 0); z-index: 1; } .index__code-check__38cRE .index__container__2R6wB .index__close-btn__2239H { position: absolute; top: 15px; right: 22.76px; display: inline-block; height: 12px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; font-size: 16px; } .index__code-check__38cRE .index__container__2R6wB .index__title__10GI5 { color: #3d4554; font-family: PingFang SC; font-style: normal; font-weight: 600; font-size: 16px; line-height: 16px; margin-bottom: 20px; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE { margin: 0; overflow-y: auto; max-height: calc(765px - 76px - 73px); padding: 0 20px 20px 20px; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul { margin: 0; padding: 0; list-style: none; transform: translate(18px, 0); background-size: 0; width: 100%; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul::after { content: ''; display: block; height: calc(100% - 38px); position: absolute; left: -27px; top: 19px; width: 2px; background-image: inherit; background-repeat: repeat-y; background-size: contain; z-index: -1; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li { display: block; position: relative; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li.index__warning__3ojqs .index__box__MtftG { background: rgba(255, 63, 63, 0.06); } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li.index__warning__3ojqs .index__box__MtftG:hover { background: rgba(255, 63, 63, 0.1); } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li.index__warning__3ojqs .index__box__MtftG:active { background: rgba(255, 63, 63, 0.15); } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li.index__warning__3ojqs .index__table__1BSQb { background: rgba(255, 63, 63, 0.02) !important; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li.index__opened__3VvR9 .index__box__MtftG { border-radius: 4px 4px 0 0 !important; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li.index__opened__3VvR9 .index__box__MtftG .index__arrow__2Kxh3 { transform: translate(0, -50%) rotate(-90deg); } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__show__1DKan { position: relative; opacity: 1 !important; background: #ffffff; border-radius: 50%; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__icon__1j4s8 { transition: opacity 0.24s; opacity: 0; position: absolute; left: -36px; top: 9px; font-size: 20px; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__loading__19xe0 { transition: opacity 0.24s; opacity: 0; position: relative; box-sizing: border-box; position: absolute; left: -36px; top: 9px; height: 20px; width: 20px; border-radius: 50%; background: #d1d7e1; display: flex; justify-content: flex-start; align-items: center; overflow: hidden; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__loading__19xe0 span { position: relative; display: block; height: 100%; width: 50%; border-top-left-radius: 50%; border-top-right-radius: 50%; background-color: #3cdc8f; transform-origin: 100% 50%; animation: index__loading__19xe0 1s infinite linear; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__loading__19xe0 span::before, .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__loading__19xe0 span::after { content: ''; display: block; height: 4px; width: 4px; background-color: inherit; border-radius: 50%; position: absolute; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__loading__19xe0 span::before { top: 0; left: 50%; transform: translate(-50%, 0); } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__loading__19xe0 span::after { bottom: 0; left: 50%; transform: translate(-50%, 0); } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__loading__19xe0::after { content: ''; display: block; height: 8px; width: 8px; background-color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 50%; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__box__MtftG { position: relative; width: 484px; padding: 8px 0 8px 73px; box-sizing: border-box; display: flex; align-items: center; font-family: PingFang SC; font-style: normal; font-weight: normal; font-size: 14px; line-height: 22px; background: #edf0f7; border-radius: 4px; transition: background-color 0.3s; white-space: break-spaces; color: #5e6b81; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__box__MtftG .index__arrow__2Kxh3 { font-size: 16px; position: absolute; right: 13px; top: 50%; color: #757d8a; transform: translate(0, -50%) rotate(0deg); transition: transform 0.3s; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__box__MtftG:hover { background: #e4e8f2; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__box__MtftG:active { background: #dde1eb; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__box__MtftG::before { width: 60px; height: 100%; position: absolute; top: 50%; left: 0; transform: translate(0, -50%); content: attr(data-title); display: inline-block; padding: 8px 0 8px 12px; color: #3d4554; font-family: PingFang SC; font-style: normal; font-weight: 600; font-size: 14px; line-height: 22px; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__box__MtftG::after { content: ''; display: block; position: absolute; top: 12px; left: 60px; height: 13px; width: 1px; border-left: 1px solid #d1d7e1; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li:not(li:last-child) { margin-bottom: 10px; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__table__1BSQb { transition: height 0.3s, opacity 0.3s; background: rgba(229, 233, 243, 0.2); border-radius: 0 0 4px 4px; overflow: hidden; padding: 0; height: 0; opacity: 0; display: flex; justify-content: center; align-items: center; width: 100%; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__table__1BSQb .index__subtitle__2Mgk_ { display: flex; justify-content: flex-start; align-items: center; width: 100%; grid-column: 1 / 4; height: 18px; margin: 12px 0; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__table__1BSQb .index__subtitle__2Mgk_ .index__subtitle-icon__1eRm- { font-size: 17px; color: #8f97a6; flex-shrink: 0; flex-basis: 17px; margin-right: 5px; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__table__1BSQb .index__subtitle__2Mgk_ .index__subtitle-text__3iP2w { font-family: PingFang SC; font-size: 13px; font-weight: 600; line-height: 18px; display: inline-block; flex-shrink: 0; color: #5e6b81; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__table__1BSQb .index__subtitle__2Mgk_ .index__subtitle-line__ZKHfZ { display: inline-block; background-color: #eceff6; height: 100%; flex-shrink: 1; flex-grow: 1; flex-basis: 100%; height: 1px; margin-left: 7px; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__table__1BSQb.index__opened__3VvR9 { opacity: 1; height: calc(var(--rows) * 30px + 16px); } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__table__1BSQb section { display: grid; grid-template-rows: repeat(var(--rows), 30px); grid-template-columns: repeat(3, 1fr); place-items: center left; box-sizing: content-box; height: auto; width: 100%; padding: 8px 16px; } .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE ul li .index__table__1BSQb section .index__name__1u8cc { display: inline-block; margin-left: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 115px; vertical-align: middle; font-size: 13px; color: #5e6b81; font-weight: 400; line-height: 30px; } .index__code-check__38cRE .index__container__2R6wB .index__checkBtn__1rkZF { position: relative; width: 100px; height: 36px; background: var(--theme-primary); display: flex; justify-content: center; align-items: center; border-radius: 41px; } .index__code-check__38cRE .index__container__2R6wB .index__checkBtn__1rkZF span { font-family: PingFang SC; font-style: normal; font-weight: 600; font-size: 14px; line-height: 22px; text-align: center; color: #ffffff; } .index__code-check__38cRE .index__container__2R6wB .index__checkBtn__1rkZF .index__ellipsis__1A4pK { animation-name: index__ellipsis__1A4pK; animation-duration: 1s; animation-timing-function: ease-out; animation-iteration-count: infinite; } .index__code-check__38cRE .index__container__2R6wB .index__checkBtn__1rkZF .index__ellipsis__1A4pK[data-index='0'] { animation-delay: 0s; } .index__code-check__38cRE .index__container__2R6wB .index__checkBtn__1rkZF .index__ellipsis__1A4pK[data-index='1'] { animation-delay: 0.1s; } .index__code-check__38cRE .index__container__2R6wB .index__checkBtn__1rkZF .index__ellipsis__1A4pK[data-index='2'] { animation-delay: 0.2s; } .index__code-check__38cRE .index__container__2R6wB .index__checkBtn__1rkZF:hover { background-color: #4250d3; } .index__code-check__38cRE .index__container__2R6wB .index__checkBtn__1rkZF:active { background-color: #222ba6; } .index__code-check__38cRE .index__container__2R6wB .index__checkBtn__1rkZF.index__disable__KeR20 { background: var(--theme-primary) !important; cursor: disable; } .index__code-check__38cRE .index__container__2R6wB .index__checkBtn__1rkZF.index__disable__KeR20::after { content: ''; position: absolute; top: 0; left: 0; display: block; height: 100%; width: 100%; border-radius: inherit; background-color: rgba(255, 255, 255, 0.3); } .index__code-check__38cRE .index__container__2R6wB .index__cancelLink__3OVtf { font-family: PingFang SC; font-style: normal; font-weight: normal; font-size: 14px; line-height: 22px; margin-top: 12px; color: #828da3; cursor: url(static/cursor/cursor-pointer.cur), pointer; } @media screen and (max-width: 1024px) { .index__code-check__38cRE .index__container__2R6wB .index__list__1BShE { max-height: calc(544px - 76px - 73px); } } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .share-modal__flex-center__3UoUK { display: flex; align-items: center; justify-content: center; } .share-modal__full-filled__u06zG { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .share-modal__modal-mask__2kfu4 { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .share-modal__modal-mask__2kfu4 .share-modal__modal-wrap__1KVIU { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .share-modal__modal-mask__2kfu4 .share-modal__modal-wrap__1KVIU .share-modal__modal-header-wrap__3jxIl { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .share-modal__modal-mask__2kfu4 .share-modal__modal-wrap__1KVIU .share-modal__modal-header-wrap__3jxIl .share-modal__modal-header-bg__2jrI7 { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .share-modal__modal-mask__2kfu4 .share-modal__modal-wrap__1KVIU .share-modal__modal-header-wrap__3jxIl .share-modal__modal-header-label__xnVaA { flex-shrink: 0; font-size: 16px; font-weight: bold; } .share-modal__modal-mask__2kfu4 .share-modal__modal-wrap__1KVIU .share-modal__modal-header-wrap__3jxIl .share-modal__modal-header-close__3b2-5 { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .share-modal__modal-mask__2kfu4 .share-modal__modal-wrap__1KVIU .share-modal__modal-header-wrap__3jxIl .share-modal__modal-header-close__3b2-5:hover { color: #98a2b4; } .share-modal__modal-mask__2kfu4 .share-modal__modal-wrap__1KVIU .share-modal__modal-body-wrap__177qD { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .share-modal__modal-mask__2kfu4 .share-modal__modal-wrap__1KVIU .share-modal__modal-footer-wrap__TRhOO { flex-shrink: 0; display: flex; } .share-modal__modal-header__cxVoh { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .share-modal__modal-header__cxVoh .share-modal__modal-header-upload__3k72E { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .share-modal__modal-header__cxVoh .share-modal__modal-header-upload__3k72E:hover { background-color: #e0e9ff; } .share-modal__modal-header__cxVoh .share-modal__modal-header-upload__3k72E:active { background-color: #ccdaff; } .share-modal__modal-header__cxVoh .share-modal__modal-header-upload__3k72E .share-modal__upload-img__K3TOv { font-size: 16px; margin-right: calc(2px); } .share-modal__modal-header__cxVoh .share-modal__modal-header-upload__3k72E .share-modal__upload-label__3DSIR { font-size: 14px; } .share-modal__modal-header__cxVoh .share-modal__modal-header-upload__3k72E .share-modal__upload-input__36cjp { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .share-modal__modal-header__cxVoh .share-modal__modal-header-search__155B_ { position: relative; } .share-modal__modal-header__cxVoh .share-modal__modal-header-search__155B_ .share-modal__search-input__daBxv { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .share-modal__modal-header__cxVoh .share-modal__modal-header-search__155B_ .share-modal__search-input__daBxv::-webkit-input-placeholder { color: #98a2b4; } .share-modal__modal-header__cxVoh .share-modal__modal-header-search__155B_ .share-modal__search-input__daBxv::-moz-placeholder { color: #98a2b4; } .share-modal__modal-header__cxVoh .share-modal__modal-header-search__155B_ .share-modal__search-input__daBxv:-ms-input-placeholder { color: #98a2b4; } .share-modal__modal-header__cxVoh .share-modal__modal-header-search__155B_ .share-modal__search-input__daBxv:hover { border-color: #d1d7e1; } .share-modal__modal-header__cxVoh .share-modal__modal-header-search__155B_ .share-modal__search-input__daBxv:active { border-color: #d1d7e1; } .share-modal__modal-header__cxVoh .share-modal__modal-header-search__155B_ .share-modal__search-img__1RKjn { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .share-modal__modal-body__cR-0K { flex-grow: 1; display: flex; } .share-modal__modal-body__cR-0K .share-modal__modal-body-left__1gOkk, .share-modal__modal-body__cR-0K .share-modal__modal-body-main__9eV67 { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .share-modal__modal-body__cR-0K .share-modal__modal-body-left__1gOkk { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .share-modal__modal-body__cR-0K .share-modal__modal-body-left__1gOkk .share-modal__modal-body-left-scroll__IvLJY { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .share-modal__modal-body__cR-0K .share-modal__modal-body-left__1gOkk .share-modal__modal-body-left-scroll__IvLJY .share-modal__modal-body-left-inner__2y8WU { width: 121px; padding: calc(12px); color: #5e6b81; } .share-modal__modal-body__cR-0K .share-modal__modal-body-left__1gOkk .share-modal__modal-body-left-scroll__IvLJY .share-modal__modal-body-left-inner__2y8WU .share-modal__menu-item-current__27zzb { color: var(--theme-primary); background-color: #e0e9ff; } .share-modal__modal-body__cR-0K .share-modal__modal-body-left__1gOkk .share-modal__modal-body-left-scroll__IvLJY .share-modal__modal-body-left-inner__2y8WU .share-modal__menu-item__O0iV6 { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .share-modal__modal-body__cR-0K .share-modal__modal-body-left__1gOkk .share-modal__modal-body-left-scroll__IvLJY .share-modal__modal-body-left-inner__2y8WU .share-modal__menu-item__O0iV6:hover { background-color: #edeff5; } .share-modal__modal-body__cR-0K .share-modal__modal-body-left__1gOkk .share-modal__modal-body-left-scroll__IvLJY .share-modal__modal-body-left-inner__2y8WU .share-modal__menu-item__O0iV6 .share-modal__menu-item-img__1MSWZ { flex-shrink: 0; width: 20px; margin-right: 8px; } .share-modal__modal-body__cR-0K .share-modal__modal-body-left__1gOkk .share-modal__modal-body-left-scroll__IvLJY .share-modal__modal-body-left-inner__2y8WU .share-modal__menu-item__O0iV6 .share-modal__menu-item-label__Amm2_ { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .share-modal__modal-body__cR-0K .share-modal__modal-body-main__9eV67 { padding: calc(12px) 0; } .share-modal__modal-body__cR-0K .share-modal__modal-body-main__9eV67 .share-modal__modal-body-main-scroll__1_eFv { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .share-modal__modal-body__cR-0K .share-modal__modal-body-main__9eV67 .share-modal__modal-body-main-scroll__1_eFv .share-modal__modal-body-main-inner__3ruAN { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .share-modal__modal-body__cR-0K .share-modal__modal-body-main__9eV67 .share-modal__modal-body-main-scroll__1_eFv .share-modal__modal-body-main-inner__3ruAN .share-modal__selector-btn-add__1wb3b, .share-modal__modal-body__cR-0K .share-modal__modal-body-main__9eV67 .share-modal__modal-body-main-scroll__1_eFv .share-modal__modal-body-main-inner__3ruAN .share-modal__selector-btn-item__27Tvg { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .share-modal__modal-body__cR-0K .share-modal__modal-body-main__9eV67 .share-modal__modal-body-main-scroll__1_eFv .share-modal__modal-body-main-inner__3ruAN .share-modal__selector-btn-add__1wb3b:hover, .share-modal__modal-body__cR-0K .share-modal__modal-body-main__9eV67 .share-modal__modal-body-main-scroll__1_eFv .share-modal__modal-body-main-inner__3ruAN .share-modal__selector-btn-item__27Tvg:hover { background-color: #e0e9ff; } .share-modal__modal-body__cR-0K .share-modal__modal-body-main__9eV67 .share-modal__modal-body-main-scroll__1_eFv .share-modal__modal-body-main-inner__3ruAN .share-modal__selector-btn-add__1wb3b:active, .share-modal__modal-body__cR-0K .share-modal__modal-body-main__9eV67 .share-modal__modal-body-main-scroll__1_eFv .share-modal__modal-body-main-inner__3ruAN .share-modal__selector-btn-item__27Tvg:active { background-color: #ccdaff; } .share-modal__modal-body__cR-0K .share-modal__modal-body-main__9eV67 .share-modal__modal-body-main-scroll__1_eFv .share-modal__modal-body-main-inner__3ruAN .share-modal__selector-btn-add__1wb3b:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .share-modal__modal-body__cR-0K .share-modal__modal-body-main__9eV67 .share-modal__modal-body-main-scroll__1_eFv .share-modal__modal-body-main-inner__3ruAN .share-modal__selector-btn-add__1wb3b:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .share-modal__modal-body__cR-0K .share-modal__modal-body-main__9eV67 .share-modal__modal-body-main-scroll__1_eFv .share-modal__modal-body-main-inner__3ruAN .share-modal__selector-btn-add__1wb3b .share-modal__add-img__33llC { font-size: 28px; height: auto; margin-bottom: 8px; } .share-modal__modal-body__cR-0K .share-modal__modal-body-main__9eV67 .share-modal__modal-body-main-scroll__1_eFv .share-modal__modal-body-main-inner__3ruAN .share-modal__selector-btn-add__1wb3b .share-modal__add-label__32ZzS { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .share-modal__modal-body__cR-0K .share-modal__modal-body-main__9eV67 .share-modal__modal-body-main-scroll__1_eFv .share-modal__modal-body-main-inner__3ruAN .share-modal__selector-btn-item__27Tvg { justify-content: space-between; } .share-modal__modal-body__cR-0K .share-modal__modal-body-main__9eV67 .share-modal__modal-body-main-scroll__1_eFv .share-modal__modal-body-main-inner__3ruAN .share-modal__selector-btn-item__27Tvg .share-modal__item-img__3eRiY { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .share-modal__modal-body__cR-0K .share-modal__modal-body-main__9eV67 .share-modal__modal-body-main-scroll__1_eFv .share-modal__modal-body-main-inner__3ruAN .share-modal__selector-btn-item__27Tvg .share-modal__item-img__3eRiY img { width: auto; height: 105px; } .share-modal__modal-body__cR-0K .share-modal__modal-body-main__9eV67 .share-modal__modal-body-main-scroll__1_eFv .share-modal__modal-body-main-inner__3ruAN .share-modal__selector-btn-item__27Tvg .share-modal__item-label__3TOoi { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .share-modal__modal-footer__3D29Z { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .share-modal__selector-btn-add__1wb3b, .share-modal__selector-btn-item__27Tvg { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .share-modal__selector-btn-add__1wb3b { background-color: var(--selector-sprite-bg_primary); } .share-modal__selector-btn-add__1wb3b:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .share-modal__selector-btn-add__1wb3b:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .share-modal__selector-btn-add__1wb3b .share-modal__add-img__33llC { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .share-modal__selector-btn-add__1wb3b .share-modal__add-label__32ZzS { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .share-modal__selector-btn-item__27Tvg { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .share-modal__selector-btn-item__27Tvg .share-modal__item-img__3eRiY { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .share-modal__selector-btn-item__27Tvg .share-modal__item-img__3eRiY img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .share-modal__selector-btn-item__27Tvg .share-modal__item-label__3TOoi { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .share-modal__selector-btn-item__27Tvg:hover { background-color: var(--selector-sprite-bg_primary); } .share-modal__selector-btn-item__27Tvg:hover .share-modal__item-img__3eRiY { border-color: var(--selector-sprite-bg_primary); } .share-modal__selector-btn-item_selected__2iNEq { background-color: var(--selector-sprite-bg_primary); } .share-modal__selector-btn-item_selected__2iNEq .share-modal__item-img__3eRiY { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .share-modal__menu-bar-btn__1TAhe { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .share-modal__menu-bar-btn_green__1Fv5p, .share-modal__menu-bar-btn_create__3rRRV { background-color: #3cdc8f; } .share-modal__menu-bar-btn_green__1Fv5p:hover, .share-modal__menu-bar-btn_create__3rRRV:hover { background-color: #00d374; } .share-modal__menu-bar-btn_green__1Fv5p:active, .share-modal__menu-bar-btn_create__3rRRV:active { background-color: #00d374; } .share-modal__menu-bar-btn_save__1wGSk, .share-modal__menu-bar-btn_reset__16Ggn { background-color: #6ac8ff; } .share-modal__menu-bar-btn_save__1wGSk:hover, .share-modal__menu-bar-btn_reset__16Ggn:hover { background-color: #57bcfe; } .share-modal__menu-bar-btn_save__1wGSk:active, .share-modal__menu-bar-btn_reset__16Ggn:active { background-color: #4fb0fc; } .share-modal__menu-bar-btn_submit__3vSE3, .share-modal__menu-bar-btn_open__2DBOK { background-color: #ff9e23; } .share-modal__menu-bar-btn_submit__3vSE3:hover, .share-modal__menu-bar-btn_open__2DBOK:hover { background-color: #f47b04; } .share-modal__menu-bar-btn_submit__3vSE3:active, .share-modal__menu-bar-btn_open__2DBOK:active { background-color: #fe8f22; } .share-modal__menu-bar-btn_link__VH4rO { background-color: #e8efff; color: var(--theme-primary); } .share-modal__menu-bar-btn_link__VH4rO:hover { background-color: #b6c7ff; } .share-modal__menu-bar-btn_link__VH4rO:active { background-color: #cfdcff; } .share-modal__menu-bar-btn_disabled__2SbBG { color: #565266; background-color: #e6e9ed; } .share-modal__menu-bar-btn_disabled__2SbBG:hover { cursor: not-allowed; } .share-modal__menu-bar-btn_help__3lNjW { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .share-modal__menu-bar-btn_help__3lNjW:hover { background-color: #8398ff; } .share-modal__menu-bar-btn_help__3lNjW:active { background-color: #8ca3ff; } .share-modal__menu-bar-separator__1lm9X { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .share-modal__share-mask__Ah2pR { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .share-modal__share-mask__Ah2pR .share-modal__modal-wrap__1KVIU { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .share-modal__share-mask__Ah2pR .share-modal__modal-wrap__1KVIU .share-modal__modal-header-wrap__3jxIl { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .share-modal__share-mask__Ah2pR .share-modal__modal-wrap__1KVIU .share-modal__modal-header-wrap__3jxIl .share-modal__modal-header-bg__2jrI7 { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .share-modal__share-mask__Ah2pR .share-modal__modal-wrap__1KVIU .share-modal__modal-header-wrap__3jxIl .share-modal__modal-header-label__xnVaA { flex-shrink: 0; font-size: 16px; font-weight: bold; } .share-modal__share-mask__Ah2pR .share-modal__modal-wrap__1KVIU .share-modal__modal-header-wrap__3jxIl .share-modal__modal-header-close__3b2-5 { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .share-modal__share-mask__Ah2pR .share-modal__modal-wrap__1KVIU .share-modal__modal-header-wrap__3jxIl .share-modal__modal-header-close__3b2-5:hover { color: #98a2b4; } .share-modal__share-mask__Ah2pR .share-modal__modal-wrap__1KVIU .share-modal__modal-body-wrap__177qD { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .share-modal__share-mask__Ah2pR .share-modal__modal-wrap__1KVIU .share-modal__modal-footer-wrap__TRhOO { flex-shrink: 0; display: flex; } .share-modal__share-container__3rgyl { display: flex; flex-direction: column; width: 340px; min-width: 340px; min-height: 414px; padding: 0 16px 16px; background-color: transparent; background-size: cover; background-repeat: no-repeat; background-position: center; position: relative; } .share-modal__share-header__1VQd7 { width: 100%; height: 60px; color: #fff; display: flex; justify-content: space-between; align-items: center; font-size: 18px; line-height: 18px; font-weight: 400; } .share-modal__share-header-right__smE6A button { background: none; border: none; outline: none; cursor: url(static/cursor/cursor-pointer.cur), pointer; padding: 0; } .share-modal__share-header-right__smE6A button img { object-fit: cover; width: 26px; } .share-modal__share-body___jz_1 { width: 100%; height: 100%; background: transparent; display: flex; justify-content: center; align-items: center; flex-direction: column; padding-top: 10px; } .share-modal__share-body___jz_1 h4 { font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-style: normal; font-weight: 600; font-size: 16px; line-height: 14px; text-align: center; color: #ffffff; margin: 0; padding: 0; } .share-modal__share-body___jz_1 h5 { font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-style: normal; font-weight: 600; font-size: 12px; line-height: 21px; text-align: center; color: #efefef; margin: 0; padding: 0; white-space: break-spaces; } .share-modal__share-qrcode-wrapper__1tOBx { --qrcode-width: 200px; background-color: transparent; width: calc(180.84px); height: calc(180.84px); padding: calc(21.6px); background-size: cover; background-position: center; background-repeat: no-repeat; box-sizing: border-box; margin-top: 19px; margin-bottom: 94px; } .share-modal__share-qrcode-wrapper__1tOBx canvas { height: 137px !important; width: 137px !important; } .share-modal__share-qrcode-wrapper__1tOBx h4 { padding-top: 30px; font-size: 16px; line-height: 18.56px; font-weight: 400; } .share-modal__share-airplane__NsOiX { position: absolute; height: 148px; object-fit: contain; bottom: 12px; left: -60px; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .ybcr2-file-modal__flex-center__140Me { display: flex; align-items: center; justify-content: center; } .ybcr2-file-modal__full-filled__1Qys2 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .ybcr2-file-modal__modal-mask__3IOzH { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .ybcr2-file-modal__modal-mask__3IOzH .ybcr2-file-modal__modal-wrap__3PblY { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .ybcr2-file-modal__modal-mask__3IOzH .ybcr2-file-modal__modal-wrap__3PblY .ybcr2-file-modal__modal-header-wrap__3dXiD { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .ybcr2-file-modal__modal-mask__3IOzH .ybcr2-file-modal__modal-wrap__3PblY .ybcr2-file-modal__modal-header-wrap__3dXiD .ybcr2-file-modal__modal-header-bg__2jH7Y { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .ybcr2-file-modal__modal-mask__3IOzH .ybcr2-file-modal__modal-wrap__3PblY .ybcr2-file-modal__modal-header-wrap__3dXiD .ybcr2-file-modal__modal-header-label__l5J61 { flex-shrink: 0; font-size: 16px; font-weight: bold; } .ybcr2-file-modal__modal-mask__3IOzH .ybcr2-file-modal__modal-wrap__3PblY .ybcr2-file-modal__modal-header-wrap__3dXiD .ybcr2-file-modal__modal-header-close__30Vg5 { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .ybcr2-file-modal__modal-mask__3IOzH .ybcr2-file-modal__modal-wrap__3PblY .ybcr2-file-modal__modal-header-wrap__3dXiD .ybcr2-file-modal__modal-header-close__30Vg5:hover { color: #98a2b4; } .ybcr2-file-modal__modal-mask__3IOzH .ybcr2-file-modal__modal-wrap__3PblY .ybcr2-file-modal__modal-body-wrap__2Jsb- { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .ybcr2-file-modal__modal-mask__3IOzH .ybcr2-file-modal__modal-wrap__3PblY .ybcr2-file-modal__modal-footer-wrap__2P0-I { flex-shrink: 0; display: flex; } .ybcr2-file-modal__modal-header__MEFGI { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .ybcr2-file-modal__modal-header__MEFGI .ybcr2-file-modal__modal-header-upload__12-tW { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .ybcr2-file-modal__modal-header__MEFGI .ybcr2-file-modal__modal-header-upload__12-tW:hover { background-color: #e0e9ff; } .ybcr2-file-modal__modal-header__MEFGI .ybcr2-file-modal__modal-header-upload__12-tW:active { background-color: #ccdaff; } .ybcr2-file-modal__modal-header__MEFGI .ybcr2-file-modal__modal-header-upload__12-tW .ybcr2-file-modal__upload-img__2XxV6 { font-size: 16px; margin-right: calc(2px); } .ybcr2-file-modal__modal-header__MEFGI .ybcr2-file-modal__modal-header-upload__12-tW .ybcr2-file-modal__upload-label__3tARL { font-size: 14px; } .ybcr2-file-modal__modal-header__MEFGI .ybcr2-file-modal__modal-header-upload__12-tW .ybcr2-file-modal__upload-input__UET0v { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .ybcr2-file-modal__modal-header__MEFGI .ybcr2-file-modal__modal-header-search__1ez7A { position: relative; } .ybcr2-file-modal__modal-header__MEFGI .ybcr2-file-modal__modal-header-search__1ez7A .ybcr2-file-modal__search-input__3--OX { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .ybcr2-file-modal__modal-header__MEFGI .ybcr2-file-modal__modal-header-search__1ez7A .ybcr2-file-modal__search-input__3--OX::-webkit-input-placeholder { color: #98a2b4; } .ybcr2-file-modal__modal-header__MEFGI .ybcr2-file-modal__modal-header-search__1ez7A .ybcr2-file-modal__search-input__3--OX::-moz-placeholder { color: #98a2b4; } .ybcr2-file-modal__modal-header__MEFGI .ybcr2-file-modal__modal-header-search__1ez7A .ybcr2-file-modal__search-input__3--OX:-ms-input-placeholder { color: #98a2b4; } .ybcr2-file-modal__modal-header__MEFGI .ybcr2-file-modal__modal-header-search__1ez7A .ybcr2-file-modal__search-input__3--OX:hover { border-color: #d1d7e1; } .ybcr2-file-modal__modal-header__MEFGI .ybcr2-file-modal__modal-header-search__1ez7A .ybcr2-file-modal__search-input__3--OX:active { border-color: #d1d7e1; } .ybcr2-file-modal__modal-header__MEFGI .ybcr2-file-modal__modal-header-search__1ez7A .ybcr2-file-modal__search-img__AXrcr { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .ybcr2-file-modal__modal-body__1420W { flex-grow: 1; display: flex; } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-left__2t3H9, .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-main__3RLRM { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-left__2t3H9 { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-left__2t3H9 .ybcr2-file-modal__modal-body-left-scroll__3zso5 { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-left__2t3H9 .ybcr2-file-modal__modal-body-left-scroll__3zso5 .ybcr2-file-modal__modal-body-left-inner__2Xphw { width: 121px; padding: calc(12px); color: #5e6b81; } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-left__2t3H9 .ybcr2-file-modal__modal-body-left-scroll__3zso5 .ybcr2-file-modal__modal-body-left-inner__2Xphw .ybcr2-file-modal__menu-item-current__2OQZa { color: var(--theme-primary); background-color: #e0e9ff; } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-left__2t3H9 .ybcr2-file-modal__modal-body-left-scroll__3zso5 .ybcr2-file-modal__modal-body-left-inner__2Xphw .ybcr2-file-modal__menu-item__9u4AE { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-left__2t3H9 .ybcr2-file-modal__modal-body-left-scroll__3zso5 .ybcr2-file-modal__modal-body-left-inner__2Xphw .ybcr2-file-modal__menu-item__9u4AE:hover { background-color: #edeff5; } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-left__2t3H9 .ybcr2-file-modal__modal-body-left-scroll__3zso5 .ybcr2-file-modal__modal-body-left-inner__2Xphw .ybcr2-file-modal__menu-item__9u4AE .ybcr2-file-modal__menu-item-img__1bx2h { flex-shrink: 0; width: 20px; margin-right: 8px; } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-left__2t3H9 .ybcr2-file-modal__modal-body-left-scroll__3zso5 .ybcr2-file-modal__modal-body-left-inner__2Xphw .ybcr2-file-modal__menu-item__9u4AE .ybcr2-file-modal__menu-item-label__3O7ml { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-main__3RLRM { padding: calc(12px) 0; } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-main__3RLRM .ybcr2-file-modal__modal-body-main-scroll__1C02o { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-main__3RLRM .ybcr2-file-modal__modal-body-main-scroll__1C02o .ybcr2-file-modal__modal-body-main-inner__1CXVK { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-main__3RLRM .ybcr2-file-modal__modal-body-main-scroll__1C02o .ybcr2-file-modal__modal-body-main-inner__1CXVK .ybcr2-file-modal__selector-btn-add__eoZgG, .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-main__3RLRM .ybcr2-file-modal__modal-body-main-scroll__1C02o .ybcr2-file-modal__modal-body-main-inner__1CXVK .ybcr2-file-modal__selector-btn-item__1Mt1O { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-main__3RLRM .ybcr2-file-modal__modal-body-main-scroll__1C02o .ybcr2-file-modal__modal-body-main-inner__1CXVK .ybcr2-file-modal__selector-btn-add__eoZgG:hover, .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-main__3RLRM .ybcr2-file-modal__modal-body-main-scroll__1C02o .ybcr2-file-modal__modal-body-main-inner__1CXVK .ybcr2-file-modal__selector-btn-item__1Mt1O:hover { background-color: #e0e9ff; } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-main__3RLRM .ybcr2-file-modal__modal-body-main-scroll__1C02o .ybcr2-file-modal__modal-body-main-inner__1CXVK .ybcr2-file-modal__selector-btn-add__eoZgG:active, .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-main__3RLRM .ybcr2-file-modal__modal-body-main-scroll__1C02o .ybcr2-file-modal__modal-body-main-inner__1CXVK .ybcr2-file-modal__selector-btn-item__1Mt1O:active { background-color: #ccdaff; } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-main__3RLRM .ybcr2-file-modal__modal-body-main-scroll__1C02o .ybcr2-file-modal__modal-body-main-inner__1CXVK .ybcr2-file-modal__selector-btn-add__eoZgG:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-main__3RLRM .ybcr2-file-modal__modal-body-main-scroll__1C02o .ybcr2-file-modal__modal-body-main-inner__1CXVK .ybcr2-file-modal__selector-btn-add__eoZgG:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-main__3RLRM .ybcr2-file-modal__modal-body-main-scroll__1C02o .ybcr2-file-modal__modal-body-main-inner__1CXVK .ybcr2-file-modal__selector-btn-add__eoZgG .ybcr2-file-modal__add-img__2R7CO { font-size: 28px; height: auto; margin-bottom: 8px; } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-main__3RLRM .ybcr2-file-modal__modal-body-main-scroll__1C02o .ybcr2-file-modal__modal-body-main-inner__1CXVK .ybcr2-file-modal__selector-btn-add__eoZgG .ybcr2-file-modal__add-label__1oCX_ { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-main__3RLRM .ybcr2-file-modal__modal-body-main-scroll__1C02o .ybcr2-file-modal__modal-body-main-inner__1CXVK .ybcr2-file-modal__selector-btn-item__1Mt1O { justify-content: space-between; } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-main__3RLRM .ybcr2-file-modal__modal-body-main-scroll__1C02o .ybcr2-file-modal__modal-body-main-inner__1CXVK .ybcr2-file-modal__selector-btn-item__1Mt1O .ybcr2-file-modal__item-img__19Pnh { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-main__3RLRM .ybcr2-file-modal__modal-body-main-scroll__1C02o .ybcr2-file-modal__modal-body-main-inner__1CXVK .ybcr2-file-modal__selector-btn-item__1Mt1O .ybcr2-file-modal__item-img__19Pnh img { width: auto; height: 105px; } .ybcr2-file-modal__modal-body__1420W .ybcr2-file-modal__modal-body-main__3RLRM .ybcr2-file-modal__modal-body-main-scroll__1C02o .ybcr2-file-modal__modal-body-main-inner__1CXVK .ybcr2-file-modal__selector-btn-item__1Mt1O .ybcr2-file-modal__item-label__3Z6vk { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .ybcr2-file-modal__modal-footer__1Jd8I { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .ybcr2-file-modal__selector-btn-add__eoZgG, .ybcr2-file-modal__selector-btn-item__1Mt1O { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .ybcr2-file-modal__selector-btn-add__eoZgG { background-color: var(--selector-sprite-bg_primary); } .ybcr2-file-modal__selector-btn-add__eoZgG:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .ybcr2-file-modal__selector-btn-add__eoZgG:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .ybcr2-file-modal__selector-btn-add__eoZgG .ybcr2-file-modal__add-img__2R7CO { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .ybcr2-file-modal__selector-btn-add__eoZgG .ybcr2-file-modal__add-label__1oCX_ { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .ybcr2-file-modal__selector-btn-item__1Mt1O { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .ybcr2-file-modal__selector-btn-item__1Mt1O .ybcr2-file-modal__item-img__19Pnh { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .ybcr2-file-modal__selector-btn-item__1Mt1O .ybcr2-file-modal__item-img__19Pnh img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .ybcr2-file-modal__selector-btn-item__1Mt1O .ybcr2-file-modal__item-label__3Z6vk { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .ybcr2-file-modal__selector-btn-item__1Mt1O:hover { background-color: var(--selector-sprite-bg_primary); } .ybcr2-file-modal__selector-btn-item__1Mt1O:hover .ybcr2-file-modal__item-img__19Pnh { border-color: var(--selector-sprite-bg_primary); } .ybcr2-file-modal__selector-btn-item_selected__2YvnL { background-color: var(--selector-sprite-bg_primary); } .ybcr2-file-modal__selector-btn-item_selected__2YvnL .ybcr2-file-modal__item-img__19Pnh { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .ybcr2-file-modal__menu-bar-btn__AVM2E { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .ybcr2-file-modal__menu-bar-btn_green__14ML6, .ybcr2-file-modal__menu-bar-btn_create__vkwLp { background-color: #3cdc8f; } .ybcr2-file-modal__menu-bar-btn_green__14ML6:hover, .ybcr2-file-modal__menu-bar-btn_create__vkwLp:hover { background-color: #00d374; } .ybcr2-file-modal__menu-bar-btn_green__14ML6:active, .ybcr2-file-modal__menu-bar-btn_create__vkwLp:active { background-color: #00d374; } .ybcr2-file-modal__menu-bar-btn_save__1WLYd, .ybcr2-file-modal__menu-bar-btn_reset__3yaG8 { background-color: #6ac8ff; } .ybcr2-file-modal__menu-bar-btn_save__1WLYd:hover, .ybcr2-file-modal__menu-bar-btn_reset__3yaG8:hover { background-color: #57bcfe; } .ybcr2-file-modal__menu-bar-btn_save__1WLYd:active, .ybcr2-file-modal__menu-bar-btn_reset__3yaG8:active { background-color: #4fb0fc; } .ybcr2-file-modal__menu-bar-btn_submit__3YENF, .ybcr2-file-modal__menu-bar-btn_open__2Diq9 { background-color: #ff9e23; } .ybcr2-file-modal__menu-bar-btn_submit__3YENF:hover, .ybcr2-file-modal__menu-bar-btn_open__2Diq9:hover { background-color: #f47b04; } .ybcr2-file-modal__menu-bar-btn_submit__3YENF:active, .ybcr2-file-modal__menu-bar-btn_open__2Diq9:active { background-color: #fe8f22; } .ybcr2-file-modal__menu-bar-btn_link__2p9jZ { background-color: #e8efff; color: var(--theme-primary); } .ybcr2-file-modal__menu-bar-btn_link__2p9jZ:hover { background-color: #b6c7ff; } .ybcr2-file-modal__menu-bar-btn_link__2p9jZ:active { background-color: #cfdcff; } .ybcr2-file-modal__menu-bar-btn_disabled__22Q2- { color: #565266; background-color: #e6e9ed; } .ybcr2-file-modal__menu-bar-btn_disabled__22Q2-:hover { cursor: not-allowed; } .ybcr2-file-modal__menu-bar-btn_help__K31Xf { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .ybcr2-file-modal__menu-bar-btn_help__K31Xf:hover { background-color: #8398ff; } .ybcr2-file-modal__menu-bar-btn_help__K31Xf:active { background-color: #8ca3ff; } .ybcr2-file-modal__menu-bar-separator__2401_ { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .ybcr2-file-modal__file-mask__as55v { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .ybcr2-file-modal__file-mask__as55v .ybcr2-file-modal__modal-wrap__3PblY { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .ybcr2-file-modal__file-mask__as55v .ybcr2-file-modal__modal-wrap__3PblY .ybcr2-file-modal__modal-header-wrap__3dXiD { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .ybcr2-file-modal__file-mask__as55v .ybcr2-file-modal__modal-wrap__3PblY .ybcr2-file-modal__modal-header-wrap__3dXiD .ybcr2-file-modal__modal-header-bg__2jH7Y { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .ybcr2-file-modal__file-mask__as55v .ybcr2-file-modal__modal-wrap__3PblY .ybcr2-file-modal__modal-header-wrap__3dXiD .ybcr2-file-modal__modal-header-label__l5J61 { flex-shrink: 0; font-size: 16px; font-weight: bold; } .ybcr2-file-modal__file-mask__as55v .ybcr2-file-modal__modal-wrap__3PblY .ybcr2-file-modal__modal-header-wrap__3dXiD .ybcr2-file-modal__modal-header-close__30Vg5 { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .ybcr2-file-modal__file-mask__as55v .ybcr2-file-modal__modal-wrap__3PblY .ybcr2-file-modal__modal-header-wrap__3dXiD .ybcr2-file-modal__modal-header-close__30Vg5:hover { color: #98a2b4; } .ybcr2-file-modal__file-mask__as55v .ybcr2-file-modal__modal-wrap__3PblY .ybcr2-file-modal__modal-body-wrap__2Jsb- { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .ybcr2-file-modal__file-mask__as55v .ybcr2-file-modal__modal-wrap__3PblY .ybcr2-file-modal__modal-footer-wrap__2P0-I { flex-shrink: 0; display: flex; } .ybcr2-file-modal__file-container__25wVt { width: 952px; height: 216px; min-width: 340px; padding: 0 16px 16px; background-color: #ffffff; background-size: cover; background-repeat: no-repeat; background-position: center; position: relative; display: flex; flex-direction: column; border-radius: 12px; } .ybcr2-file-modal__file-container__25wVt .ybcr2-file-modal__file-header__8anOO { display: flex; align-items: center; justify-content: center; height: 48px; padding: 0 16px; background-color: #ffffff; border-bottom: 1px solid #e8efff; position: relative; } .ybcr2-file-modal__file-container__25wVt .ybcr2-file-modal__file-header__8anOO .ybcr2-file-modal__file-title__1lynp { font-size: 16px; font-weight: bold; color: #333333; } .ybcr2-file-modal__file-container__25wVt .ybcr2-file-modal__file-header__8anOO .ybcr2-file-modal__close-button__3IYgX { cursor: pointer; color: #999999; position: absolute; top: 50%; right: 16px; transform: translateY(-50%); } .ybcr2-file-modal__file-container__25wVt .ybcr2-file-modal__file-header__8anOO .ybcr2-file-modal__close-button__3IYgX:hover { color: #333333; } .ybcr2-file-modal__file-container__25wVt .ybcr2-file-modal__file-main__1TkWP { width: 100%; flex: 1; display: flex; flex-wrap: wrap; padding-top: 12px; } .ybcr2-file-modal__file-container__25wVt .ybcr2-file-modal__file-main__1TkWP .ybcr2-file-modal__file__2ae6A { width: 176px; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; margin-right: 10px; } .ybcr2-file-modal__file-container__25wVt .ybcr2-file-modal__file-main__1TkWP .ybcr2-file-modal__file__2ae6A:last-child { margin-right: 0; } .ybcr2-file-modal__file-container__25wVt .ybcr2-file-modal__file-main__1TkWP .ybcr2-file-modal__file-item__1bmVT { width: 176px; height: 110px; display: flex; flex-direction: column; align-items: center; justify-content: center; background: #f5f8ff; border: 1px dashed #b6c7ff; border-radius: 8px; color: #6a7fff; cursor: pointer; position: relative; } .ybcr2-file-modal__file-container__25wVt .ybcr2-file-modal__file-main__1TkWP .ybcr2-file-modal__file-item__1bmVT .ybcr2-file-modal__file-item-spin-wrapper__2J4l6 { width: 100%; height: 100%; } .ybcr2-file-modal__file-container__25wVt .ybcr2-file-modal__file-main__1TkWP .ybcr2-file-modal__file-item__1bmVT .ybcr2-file-modal__file-item-spin-wrapper__2J4l6 .ant-spin-container { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; } .ybcr2-file-modal__file-container__25wVt .ybcr2-file-modal__file-main__1TkWP .ybcr2-file-modal__file-item__1bmVT .ybcr2-file-modal__file-item-bg__1oq-G { width: 80%; } .ybcr2-file-modal__file-container__25wVt .ybcr2-file-modal__file-main__1TkWP .ybcr2-file-modal__file-item__1bmVT .ybcr2-file-modal__item-icon__t1k2d { font-size: 24px; } .ybcr2-file-modal__file-container__25wVt .ybcr2-file-modal__file-main__1TkWP .ybcr2-file-modal__file-item__1bmVT .ybcr2-file-modal__item-hint__3OmcN { font-size: 14px; } .ybcr2-file-modal__file-container__25wVt .ybcr2-file-modal__file-main__1TkWP .ybcr2-file-modal__file-item__1bmVT .ybcr2-file-modal__file-item-icon-down__n8v-f { width: 16px; height: 16px; background: rgba(60, 71, 123, 0.3); border-radius: 4px; display: flex; align-items: center; justify-content: center; font-size: 12px; color: #ffffff; cursor: pointer; position: absolute; top: 4px; right: 24px; } .ybcr2-file-modal__file-container__25wVt .ybcr2-file-modal__file-main__1TkWP .ybcr2-file-modal__file-item__1bmVT .ybcr2-file-modal__file-item-icon-del__UNNGm { width: 16px; height: 16px; background: rgba(60, 71, 123, 0.3); border-radius: 4px; display: flex; align-items: center; justify-content: center; font-size: 12px; color: #ffffff; cursor: pointer; position: absolute; top: 4px; right: 4px; } .ybcr2-file-modal__file-container__25wVt .ybcr2-file-modal__file-main__1TkWP .ybcr2-file-modal__file-name__2_0_W { height: 22px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 100%; text-align: center; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .level-up__level-up__3e9l_ { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 1024px; height: 1024px; z-index: 10000; } .camera-modal__flex-center__Z_v-u { display: flex; align-items: center; justify-content: center; } .camera-modal__full-filled__Qplpu { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .camera-modal__modal-mask__2Ost- { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .camera-modal__modal-mask__2Ost- .camera-modal__modal-wrap__O265y { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .camera-modal__modal-mask__2Ost- .camera-modal__modal-wrap__O265y .camera-modal__modal-header-wrap__1hHP3 { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .camera-modal__modal-mask__2Ost- .camera-modal__modal-wrap__O265y .camera-modal__modal-header-wrap__1hHP3 .camera-modal__modal-header-bg__2nTp3 { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .camera-modal__modal-mask__2Ost- .camera-modal__modal-wrap__O265y .camera-modal__modal-header-wrap__1hHP3 .camera-modal__modal-header-label__1yIfA { flex-shrink: 0; font-size: 16px; font-weight: bold; } .camera-modal__modal-mask__2Ost- .camera-modal__modal-wrap__O265y .camera-modal__modal-header-wrap__1hHP3 .camera-modal__modal-header-close__mdXqm { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .camera-modal__modal-mask__2Ost- .camera-modal__modal-wrap__O265y .camera-modal__modal-header-wrap__1hHP3 .camera-modal__modal-header-close__mdXqm:hover { color: #98a2b4; } .camera-modal__modal-mask__2Ost- .camera-modal__modal-wrap__O265y .camera-modal__modal-body-wrap__3i83W { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .camera-modal__modal-mask__2Ost- .camera-modal__modal-wrap__O265y .camera-modal__modal-footer-wrap__3u6nT { flex-shrink: 0; display: flex; } .camera-modal__modal-header__1iSYd { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .camera-modal__modal-header__1iSYd .camera-modal__modal-header-upload__2R6v2 { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .camera-modal__modal-header__1iSYd .camera-modal__modal-header-upload__2R6v2:hover { background-color: #e0e9ff; } .camera-modal__modal-header__1iSYd .camera-modal__modal-header-upload__2R6v2:active { background-color: #ccdaff; } .camera-modal__modal-header__1iSYd .camera-modal__modal-header-upload__2R6v2 .camera-modal__upload-img__3aiDr { font-size: 16px; margin-right: calc(2px); } .camera-modal__modal-header__1iSYd .camera-modal__modal-header-upload__2R6v2 .camera-modal__upload-label__2OSof { font-size: 14px; } .camera-modal__modal-header__1iSYd .camera-modal__modal-header-upload__2R6v2 .camera-modal__upload-input__3tmU7 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .camera-modal__modal-header__1iSYd .camera-modal__modal-header-search__mA50J { position: relative; } .camera-modal__modal-header__1iSYd .camera-modal__modal-header-search__mA50J .camera-modal__search-input__qq1YM { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .camera-modal__modal-header__1iSYd .camera-modal__modal-header-search__mA50J .camera-modal__search-input__qq1YM::-webkit-input-placeholder { color: #98a2b4; } .camera-modal__modal-header__1iSYd .camera-modal__modal-header-search__mA50J .camera-modal__search-input__qq1YM::-moz-placeholder { color: #98a2b4; } .camera-modal__modal-header__1iSYd .camera-modal__modal-header-search__mA50J .camera-modal__search-input__qq1YM:-ms-input-placeholder { color: #98a2b4; } .camera-modal__modal-header__1iSYd .camera-modal__modal-header-search__mA50J .camera-modal__search-input__qq1YM:hover { border-color: #d1d7e1; } .camera-modal__modal-header__1iSYd .camera-modal__modal-header-search__mA50J .camera-modal__search-input__qq1YM:active { border-color: #d1d7e1; } .camera-modal__modal-header__1iSYd .camera-modal__modal-header-search__mA50J .camera-modal__search-img__2Zl0T { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .camera-modal__modal-body__GUEoh { flex-grow: 1; display: flex; } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-left__hG37Q, .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-left__hG37Q { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-left__hG37Q .camera-modal__modal-body-left-scroll__lHmpP { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-left__hG37Q .camera-modal__modal-body-left-scroll__lHmpP .camera-modal__modal-body-left-inner__1rwCQ { width: 121px; padding: calc(12px); color: #5e6b81; } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-left__hG37Q .camera-modal__modal-body-left-scroll__lHmpP .camera-modal__modal-body-left-inner__1rwCQ .camera-modal__menu-item-current__DRDdR { color: var(--theme-primary); background-color: #e0e9ff; } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-left__hG37Q .camera-modal__modal-body-left-scroll__lHmpP .camera-modal__modal-body-left-inner__1rwCQ .camera-modal__menu-item__bYvG1 { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-left__hG37Q .camera-modal__modal-body-left-scroll__lHmpP .camera-modal__modal-body-left-inner__1rwCQ .camera-modal__menu-item__bYvG1:hover { background-color: #edeff5; } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-left__hG37Q .camera-modal__modal-body-left-scroll__lHmpP .camera-modal__modal-body-left-inner__1rwCQ .camera-modal__menu-item__bYvG1 .camera-modal__menu-item-img__3CIk9 { flex-shrink: 0; width: 20px; margin-right: 8px; } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-left__hG37Q .camera-modal__modal-body-left-scroll__lHmpP .camera-modal__modal-body-left-inner__1rwCQ .camera-modal__menu-item__bYvG1 .camera-modal__menu-item-label__2bZge { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa { padding: calc(12px) 0; } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa .camera-modal__modal-body-main-scroll__3KSrJ { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa .camera-modal__modal-body-main-scroll__3KSrJ .camera-modal__modal-body-main-inner__2A6lE { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa .camera-modal__modal-body-main-scroll__3KSrJ .camera-modal__modal-body-main-inner__2A6lE .camera-modal__selector-btn-add__1BXa7, .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa .camera-modal__modal-body-main-scroll__3KSrJ .camera-modal__modal-body-main-inner__2A6lE .camera-modal__selector-btn-item__2LT9P { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa .camera-modal__modal-body-main-scroll__3KSrJ .camera-modal__modal-body-main-inner__2A6lE .camera-modal__selector-btn-add__1BXa7:hover, .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa .camera-modal__modal-body-main-scroll__3KSrJ .camera-modal__modal-body-main-inner__2A6lE .camera-modal__selector-btn-item__2LT9P:hover { background-color: #e0e9ff; } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa .camera-modal__modal-body-main-scroll__3KSrJ .camera-modal__modal-body-main-inner__2A6lE .camera-modal__selector-btn-add__1BXa7:active, .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa .camera-modal__modal-body-main-scroll__3KSrJ .camera-modal__modal-body-main-inner__2A6lE .camera-modal__selector-btn-item__2LT9P:active { background-color: #ccdaff; } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa .camera-modal__modal-body-main-scroll__3KSrJ .camera-modal__modal-body-main-inner__2A6lE .camera-modal__selector-btn-add__1BXa7:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa .camera-modal__modal-body-main-scroll__3KSrJ .camera-modal__modal-body-main-inner__2A6lE .camera-modal__selector-btn-add__1BXa7:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa .camera-modal__modal-body-main-scroll__3KSrJ .camera-modal__modal-body-main-inner__2A6lE .camera-modal__selector-btn-add__1BXa7 .camera-modal__add-img__tvFlL { font-size: 28px; height: auto; margin-bottom: 8px; } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa .camera-modal__modal-body-main-scroll__3KSrJ .camera-modal__modal-body-main-inner__2A6lE .camera-modal__selector-btn-add__1BXa7 .camera-modal__add-label__9Vjm9 { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa .camera-modal__modal-body-main-scroll__3KSrJ .camera-modal__modal-body-main-inner__2A6lE .camera-modal__selector-btn-item__2LT9P { justify-content: space-between; } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa .camera-modal__modal-body-main-scroll__3KSrJ .camera-modal__modal-body-main-inner__2A6lE .camera-modal__selector-btn-item__2LT9P .camera-modal__item-img__3OMbc { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa .camera-modal__modal-body-main-scroll__3KSrJ .camera-modal__modal-body-main-inner__2A6lE .camera-modal__selector-btn-item__2LT9P .camera-modal__item-img__3OMbc img { width: auto; height: 105px; } .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa .camera-modal__modal-body-main-scroll__3KSrJ .camera-modal__modal-body-main-inner__2A6lE .camera-modal__selector-btn-item__2LT9P .camera-modal__item-label__2M3M9 { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .camera-modal__modal-footer__1_FM_ { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .camera-modal__selector-btn-add__1BXa7, .camera-modal__selector-btn-item__2LT9P { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .camera-modal__selector-btn-add__1BXa7 { background-color: var(--selector-sprite-bg_primary); } .camera-modal__selector-btn-add__1BXa7:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .camera-modal__selector-btn-add__1BXa7:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .camera-modal__selector-btn-add__1BXa7 .camera-modal__add-img__tvFlL { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .camera-modal__selector-btn-add__1BXa7 .camera-modal__add-label__9Vjm9 { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .camera-modal__selector-btn-item__2LT9P { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .camera-modal__selector-btn-item__2LT9P .camera-modal__item-img__3OMbc { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .camera-modal__selector-btn-item__2LT9P .camera-modal__item-img__3OMbc img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .camera-modal__selector-btn-item__2LT9P .camera-modal__item-label__2M3M9 { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .camera-modal__selector-btn-item__2LT9P:hover { background-color: var(--selector-sprite-bg_primary); } .camera-modal__selector-btn-item__2LT9P:hover .camera-modal__item-img__3OMbc { border-color: var(--selector-sprite-bg_primary); } .camera-modal__selector-btn-item_selected__3QvUM { background-color: var(--selector-sprite-bg_primary); } .camera-modal__selector-btn-item_selected__3QvUM .camera-modal__item-img__3OMbc { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .camera-modal__menu-bar-btn__b5CPt { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .camera-modal__menu-bar-btn_green__3I4O7, .camera-modal__menu-bar-btn_create__NiYjT { background-color: #3cdc8f; } .camera-modal__menu-bar-btn_green__3I4O7:hover, .camera-modal__menu-bar-btn_create__NiYjT:hover { background-color: #00d374; } .camera-modal__menu-bar-btn_green__3I4O7:active, .camera-modal__menu-bar-btn_create__NiYjT:active { background-color: #00d374; } .camera-modal__menu-bar-btn_save__mSYEs, .camera-modal__menu-bar-btn_reset__27YFp { background-color: #6ac8ff; } .camera-modal__menu-bar-btn_save__mSYEs:hover, .camera-modal__menu-bar-btn_reset__27YFp:hover { background-color: #57bcfe; } .camera-modal__menu-bar-btn_save__mSYEs:active, .camera-modal__menu-bar-btn_reset__27YFp:active { background-color: #4fb0fc; } .camera-modal__menu-bar-btn_submit__2bwhr, .camera-modal__menu-bar-btn_open__ZrOzd { background-color: #ff9e23; } .camera-modal__menu-bar-btn_submit__2bwhr:hover, .camera-modal__menu-bar-btn_open__ZrOzd:hover { background-color: #f47b04; } .camera-modal__menu-bar-btn_submit__2bwhr:active, .camera-modal__menu-bar-btn_open__ZrOzd:active { background-color: #fe8f22; } .camera-modal__menu-bar-btn_link__1NCkc { background-color: #e8efff; color: var(--theme-primary); } .camera-modal__menu-bar-btn_link__1NCkc:hover { background-color: #b6c7ff; } .camera-modal__menu-bar-btn_link__1NCkc:active { background-color: #cfdcff; } .camera-modal__menu-bar-btn_disabled__DLUC_ { color: #565266; background-color: #e6e9ed; } .camera-modal__menu-bar-btn_disabled__DLUC_:hover { cursor: not-allowed; } .camera-modal__menu-bar-btn_help__3R13f { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .camera-modal__menu-bar-btn_help__3R13f:hover { background-color: #8398ff; } .camera-modal__menu-bar-btn_help__3R13f:active { background-color: #8ca3ff; } .camera-modal__menu-bar-separator__wihuz { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .camera-modal__ai-modal-mask__2M-v5 { z-index: 5010; } .camera-modal__ai-modal-wrap__171Cu { width: 682px !important; height: 600px !important; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__ai-modal-header-bg__MZw0H { left: -120px !important; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-header__1iSYd { justify-content: space-between; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-header__1iSYd .camera-modal__modal-header-tabs__2_7Yv { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ justify-content: flex-start; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-header__1iSYd .camera-modal__modal-header-tabs__2_7Yv .camera-modal__modal-header-upload__2R6v2 { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-header__1iSYd .camera-modal__modal-header-tabs__2_7Yv .camera-modal__modal-header-upload__2R6v2:hover { background-color: #e0e9ff; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-header__1iSYd .camera-modal__modal-header-tabs__2_7Yv .camera-modal__modal-header-upload__2R6v2:active { background-color: #ccdaff; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-header__1iSYd .camera-modal__modal-header-tabs__2_7Yv .camera-modal__modal-header-upload__2R6v2 .camera-modal__upload-img__3aiDr { font-size: 16px; margin-right: calc(2px); } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-header__1iSYd .camera-modal__modal-header-tabs__2_7Yv .camera-modal__modal-header-upload__2R6v2 .camera-modal__upload-label__2OSof { font-size: 14px; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-header__1iSYd .camera-modal__modal-header-tabs__2_7Yv .camera-modal__modal-header-upload__2R6v2 .camera-modal__upload-input__3tmU7 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-header__1iSYd .camera-modal__modal-header-tabs__2_7Yv .camera-modal__modal-header-search__mA50J { position: relative; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-header__1iSYd .camera-modal__modal-header-tabs__2_7Yv .camera-modal__modal-header-search__mA50J .camera-modal__search-input__qq1YM { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-header__1iSYd .camera-modal__modal-header-tabs__2_7Yv .camera-modal__modal-header-search__mA50J .camera-modal__search-input__qq1YM::-webkit-input-placeholder { color: #98a2b4; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-header__1iSYd .camera-modal__modal-header-tabs__2_7Yv .camera-modal__modal-header-search__mA50J .camera-modal__search-input__qq1YM::-moz-placeholder { color: #98a2b4; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-header__1iSYd .camera-modal__modal-header-tabs__2_7Yv .camera-modal__modal-header-search__mA50J .camera-modal__search-input__qq1YM:-ms-input-placeholder { color: #98a2b4; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-header__1iSYd .camera-modal__modal-header-tabs__2_7Yv .camera-modal__modal-header-search__mA50J .camera-modal__search-input__qq1YM:hover { border-color: #d1d7e1; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-header__1iSYd .camera-modal__modal-header-tabs__2_7Yv .camera-modal__modal-header-search__mA50J .camera-modal__search-input__qq1YM:active { border-color: #d1d7e1; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-header__1iSYd .camera-modal__modal-header-tabs__2_7Yv .camera-modal__modal-header-search__mA50J .camera-modal__search-img__2Zl0T { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-header__1iSYd .camera-modal__modal-header-tabs__2_7Yv .camera-modal__modal-header-tab__2JeVs { flex-shrink: 0; font-size: 16px; font-weight: bold; margin-right: calc(16px); } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-header__1iSYd .camera-modal__modal-header-tabs__2_7Yv .camera-modal__modal-header-tab__2JeVs:hover { color: var(--theme-primary); } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-header__1iSYd .camera-modal__modal-header-tabs__2_7Yv .camera-modal__modal-header-tab__2JeVs.camera-modal__modal-header-tab_current__22nCG { color: var(--theme-primary); position: relative; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-header__1iSYd .camera-modal__modal-header-tabs__2_7Yv .camera-modal__modal-header-tab__2JeVs.camera-modal__modal-header-tab_current__22nCG::after { position: absolute; content: ''; display: block; width: calc(16px); height: 4px; bottom: -8px; border-radius: 2px; left: 0; right: 0; margin: auto; background-color: var(--theme-primary); } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa { position: relative; display: flex; justify-content: center; width: 500px; padding: 0; border-radius: 0; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa .camera-modal__modal-body-empty__2o199 { position: absolute; top: 120px; width: 170px; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa .camera-modal__modal-body-video__3dtK6, .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa .camera-modal__modal-body-canvas__M62hl { position: relative; flex-grow: 1; height: 500px; object-fit: contain; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-body__GUEoh .camera-modal__modal-body-main__25wqa .camera-modal__modal-body-face__3NM14 { position: absolute; top: 101px; width: 197px; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-footer__1_FM_ .camera-modal__menu-bar-btn__b5CPt { width: 81px !important; height: 32px !important; margin: 0 !important; line-height: 32px !important; font-weight: bold !important; border-radius: 4px !important; } .camera-modal__ai-modal-wrap__171Cu .camera-modal__modal-footer__1_FM_.camera-modal__modal-footer_space__1IvEe { justify-content: space-between !important; } .pictureAI-text__flex-center__3iE5r { display: flex; align-items: center; justify-content: center; } .pictureAI-text__full-filled__3Vazr { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .pictureAI-text__modal-mask__18ktA { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .pictureAI-text__modal-mask__18ktA .pictureAI-text__modal-wrap__1yn3z { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .pictureAI-text__modal-mask__18ktA .pictureAI-text__modal-wrap__1yn3z .pictureAI-text__modal-header-wrap__10kZg { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .pictureAI-text__modal-mask__18ktA .pictureAI-text__modal-wrap__1yn3z .pictureAI-text__modal-header-wrap__10kZg .pictureAI-text__modal-header-bg__1eQ8e { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .pictureAI-text__modal-mask__18ktA .pictureAI-text__modal-wrap__1yn3z .pictureAI-text__modal-header-wrap__10kZg .pictureAI-text__modal-header-label__28jAC { flex-shrink: 0; font-size: 16px; font-weight: bold; } .pictureAI-text__modal-mask__18ktA .pictureAI-text__modal-wrap__1yn3z .pictureAI-text__modal-header-wrap__10kZg .pictureAI-text__modal-header-close__1Bf5G { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .pictureAI-text__modal-mask__18ktA .pictureAI-text__modal-wrap__1yn3z .pictureAI-text__modal-header-wrap__10kZg .pictureAI-text__modal-header-close__1Bf5G:hover { color: #98a2b4; } .pictureAI-text__modal-mask__18ktA .pictureAI-text__modal-wrap__1yn3z .pictureAI-text__modal-body-wrap__3Jdu0 { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .pictureAI-text__modal-mask__18ktA .pictureAI-text__modal-wrap__1yn3z .pictureAI-text__modal-footer-wrap__1FkBR { flex-shrink: 0; display: flex; } .pictureAI-text__modal-header__3ph3G { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .pictureAI-text__modal-header__3ph3G .pictureAI-text__modal-header-upload__HDD9K { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .pictureAI-text__modal-header__3ph3G .pictureAI-text__modal-header-upload__HDD9K:hover { background-color: #e0e9ff; } .pictureAI-text__modal-header__3ph3G .pictureAI-text__modal-header-upload__HDD9K:active { background-color: #ccdaff; } .pictureAI-text__modal-header__3ph3G .pictureAI-text__modal-header-upload__HDD9K .pictureAI-text__upload-img__1WHZM { font-size: 16px; margin-right: calc(2px); } .pictureAI-text__modal-header__3ph3G .pictureAI-text__modal-header-upload__HDD9K .pictureAI-text__upload-label__3fElk { font-size: 14px; } .pictureAI-text__modal-header__3ph3G .pictureAI-text__modal-header-upload__HDD9K .pictureAI-text__upload-input__3GgSg { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .pictureAI-text__modal-header__3ph3G .pictureAI-text__modal-header-search__35-Qw { position: relative; } .pictureAI-text__modal-header__3ph3G .pictureAI-text__modal-header-search__35-Qw .pictureAI-text__search-input__2y49X { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .pictureAI-text__modal-header__3ph3G .pictureAI-text__modal-header-search__35-Qw .pictureAI-text__search-input__2y49X::-webkit-input-placeholder { color: #98a2b4; } .pictureAI-text__modal-header__3ph3G .pictureAI-text__modal-header-search__35-Qw .pictureAI-text__search-input__2y49X::-moz-placeholder { color: #98a2b4; } .pictureAI-text__modal-header__3ph3G .pictureAI-text__modal-header-search__35-Qw .pictureAI-text__search-input__2y49X:-ms-input-placeholder { color: #98a2b4; } .pictureAI-text__modal-header__3ph3G .pictureAI-text__modal-header-search__35-Qw .pictureAI-text__search-input__2y49X:hover { border-color: #d1d7e1; } .pictureAI-text__modal-header__3ph3G .pictureAI-text__modal-header-search__35-Qw .pictureAI-text__search-input__2y49X:active { border-color: #d1d7e1; } .pictureAI-text__modal-header__3ph3G .pictureAI-text__modal-header-search__35-Qw .pictureAI-text__search-img__ekFR9 { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .pictureAI-text__modal-body__29i3q { flex-grow: 1; display: flex; } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-left__2E9uk, .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-main__3gcTb { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-left__2E9uk { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-left__2E9uk .pictureAI-text__modal-body-left-scroll__3gV3Z { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-left__2E9uk .pictureAI-text__modal-body-left-scroll__3gV3Z .pictureAI-text__modal-body-left-inner__oCAQY { width: 121px; padding: calc(12px); color: #5e6b81; } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-left__2E9uk .pictureAI-text__modal-body-left-scroll__3gV3Z .pictureAI-text__modal-body-left-inner__oCAQY .pictureAI-text__menu-item-current__QAz0W { color: var(--theme-primary); background-color: #e0e9ff; } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-left__2E9uk .pictureAI-text__modal-body-left-scroll__3gV3Z .pictureAI-text__modal-body-left-inner__oCAQY .pictureAI-text__menu-item__2n4n1 { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-left__2E9uk .pictureAI-text__modal-body-left-scroll__3gV3Z .pictureAI-text__modal-body-left-inner__oCAQY .pictureAI-text__menu-item__2n4n1:hover { background-color: #edeff5; } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-left__2E9uk .pictureAI-text__modal-body-left-scroll__3gV3Z .pictureAI-text__modal-body-left-inner__oCAQY .pictureAI-text__menu-item__2n4n1 .pictureAI-text__menu-item-img__10ffX { flex-shrink: 0; width: 20px; margin-right: 8px; } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-left__2E9uk .pictureAI-text__modal-body-left-scroll__3gV3Z .pictureAI-text__modal-body-left-inner__oCAQY .pictureAI-text__menu-item__2n4n1 .pictureAI-text__menu-item-label__39IWU { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-main__3gcTb { padding: calc(12px) 0; } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-main__3gcTb .pictureAI-text__modal-body-main-scroll__2azFw { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-main__3gcTb .pictureAI-text__modal-body-main-scroll__2azFw .pictureAI-text__modal-body-main-inner__EojC8 { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-main__3gcTb .pictureAI-text__modal-body-main-scroll__2azFw .pictureAI-text__modal-body-main-inner__EojC8 .pictureAI-text__selector-btn-add__2p9R0, .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-main__3gcTb .pictureAI-text__modal-body-main-scroll__2azFw .pictureAI-text__modal-body-main-inner__EojC8 .pictureAI-text__selector-btn-item__111QF { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-main__3gcTb .pictureAI-text__modal-body-main-scroll__2azFw .pictureAI-text__modal-body-main-inner__EojC8 .pictureAI-text__selector-btn-add__2p9R0:hover, .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-main__3gcTb .pictureAI-text__modal-body-main-scroll__2azFw .pictureAI-text__modal-body-main-inner__EojC8 .pictureAI-text__selector-btn-item__111QF:hover { background-color: #e0e9ff; } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-main__3gcTb .pictureAI-text__modal-body-main-scroll__2azFw .pictureAI-text__modal-body-main-inner__EojC8 .pictureAI-text__selector-btn-add__2p9R0:active, .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-main__3gcTb .pictureAI-text__modal-body-main-scroll__2azFw .pictureAI-text__modal-body-main-inner__EojC8 .pictureAI-text__selector-btn-item__111QF:active { background-color: #ccdaff; } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-main__3gcTb .pictureAI-text__modal-body-main-scroll__2azFw .pictureAI-text__modal-body-main-inner__EojC8 .pictureAI-text__selector-btn-add__2p9R0:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-main__3gcTb .pictureAI-text__modal-body-main-scroll__2azFw .pictureAI-text__modal-body-main-inner__EojC8 .pictureAI-text__selector-btn-add__2p9R0:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-main__3gcTb .pictureAI-text__modal-body-main-scroll__2azFw .pictureAI-text__modal-body-main-inner__EojC8 .pictureAI-text__selector-btn-add__2p9R0 .pictureAI-text__add-img__wQky7 { font-size: 28px; height: auto; margin-bottom: 8px; } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-main__3gcTb .pictureAI-text__modal-body-main-scroll__2azFw .pictureAI-text__modal-body-main-inner__EojC8 .pictureAI-text__selector-btn-add__2p9R0 .pictureAI-text__add-label__20jG2 { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-main__3gcTb .pictureAI-text__modal-body-main-scroll__2azFw .pictureAI-text__modal-body-main-inner__EojC8 .pictureAI-text__selector-btn-item__111QF { justify-content: space-between; } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-main__3gcTb .pictureAI-text__modal-body-main-scroll__2azFw .pictureAI-text__modal-body-main-inner__EojC8 .pictureAI-text__selector-btn-item__111QF .pictureAI-text__item-img__1hMlK { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-main__3gcTb .pictureAI-text__modal-body-main-scroll__2azFw .pictureAI-text__modal-body-main-inner__EojC8 .pictureAI-text__selector-btn-item__111QF .pictureAI-text__item-img__1hMlK img { width: auto; height: 105px; } .pictureAI-text__modal-body__29i3q .pictureAI-text__modal-body-main__3gcTb .pictureAI-text__modal-body-main-scroll__2azFw .pictureAI-text__modal-body-main-inner__EojC8 .pictureAI-text__selector-btn-item__111QF .pictureAI-text__item-label__1nUtD { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .pictureAI-text__modal-footer__MSo2f { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .pictureAI-text__selector-btn-add__2p9R0, .pictureAI-text__selector-btn-item__111QF { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .pictureAI-text__selector-btn-add__2p9R0 { background-color: var(--selector-sprite-bg_primary); } .pictureAI-text__selector-btn-add__2p9R0:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .pictureAI-text__selector-btn-add__2p9R0:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .pictureAI-text__selector-btn-add__2p9R0 .pictureAI-text__add-img__wQky7 { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .pictureAI-text__selector-btn-add__2p9R0 .pictureAI-text__add-label__20jG2 { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .pictureAI-text__selector-btn-item__111QF { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .pictureAI-text__selector-btn-item__111QF .pictureAI-text__item-img__1hMlK { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .pictureAI-text__selector-btn-item__111QF .pictureAI-text__item-img__1hMlK img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .pictureAI-text__selector-btn-item__111QF .pictureAI-text__item-label__1nUtD { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .pictureAI-text__selector-btn-item__111QF:hover { background-color: var(--selector-sprite-bg_primary); } .pictureAI-text__selector-btn-item__111QF:hover .pictureAI-text__item-img__1hMlK { border-color: var(--selector-sprite-bg_primary); } .pictureAI-text__selector-btn-item_selected__2WOOx { background-color: var(--selector-sprite-bg_primary); } .pictureAI-text__selector-btn-item_selected__2WOOx .pictureAI-text__item-img__1hMlK { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .pictureAI-text__menu-bar-btn__1qZfm { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .pictureAI-text__menu-bar-btn_green__2Xghx, .pictureAI-text__menu-bar-btn_create__1rRoI { background-color: #3cdc8f; } .pictureAI-text__menu-bar-btn_green__2Xghx:hover, .pictureAI-text__menu-bar-btn_create__1rRoI:hover { background-color: #00d374; } .pictureAI-text__menu-bar-btn_green__2Xghx:active, .pictureAI-text__menu-bar-btn_create__1rRoI:active { background-color: #00d374; } .pictureAI-text__menu-bar-btn_save__1l1mD, .pictureAI-text__menu-bar-btn_reset__2fkz9 { background-color: #6ac8ff; } .pictureAI-text__menu-bar-btn_save__1l1mD:hover, .pictureAI-text__menu-bar-btn_reset__2fkz9:hover { background-color: #57bcfe; } .pictureAI-text__menu-bar-btn_save__1l1mD:active, .pictureAI-text__menu-bar-btn_reset__2fkz9:active { background-color: #4fb0fc; } .pictureAI-text__menu-bar-btn_submit__1JFA3, .pictureAI-text__menu-bar-btn_open__NbuRL { background-color: #ff9e23; } .pictureAI-text__menu-bar-btn_submit__1JFA3:hover, .pictureAI-text__menu-bar-btn_open__NbuRL:hover { background-color: #f47b04; } .pictureAI-text__menu-bar-btn_submit__1JFA3:active, .pictureAI-text__menu-bar-btn_open__NbuRL:active { background-color: #fe8f22; } .pictureAI-text__menu-bar-btn_link__2Dxfz { background-color: #e8efff; color: var(--theme-primary); } .pictureAI-text__menu-bar-btn_link__2Dxfz:hover { background-color: #b6c7ff; } .pictureAI-text__menu-bar-btn_link__2Dxfz:active { background-color: #cfdcff; } .pictureAI-text__menu-bar-btn_disabled__3okwf { color: #565266; background-color: #e6e9ed; } .pictureAI-text__menu-bar-btn_disabled__3okwf:hover { cursor: not-allowed; } .pictureAI-text__menu-bar-btn_help__3wyL9 { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .pictureAI-text__menu-bar-btn_help__3wyL9:hover { background-color: #8398ff; } .pictureAI-text__menu-bar-btn_help__3wyL9:active { background-color: #8ca3ff; } .pictureAI-text__menu-bar-separator__2zkur { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .pictureAI-text__pictureai-modal-mask__3ZoZe { z-index: 5010; } .pictureAI-text__pictureai-modal-wrap__ChDh6 { width: 425px !important; height: 400px !important; } .pictureAI-text__pictureai-modal-wrap__ChDh6 .pictureAI-text__pictureai-modal-body__3-OPb { width: 100%; padding: 33px; font-size: 16px; word-break: break-all; overflow: scroll; } .pictureAI-text__pictureai-modal-wrap__ChDh6 .pictureAI-text__pictureai-modal-footer__2lBtQ { display: flex; align-items: center; justify-content: center; width: 100%; height: calc(102px); } .pictureAI-text__pictureai-modal-wrap__ChDh6 .pictureAI-text__pictureai-modal-footer__2lBtQ .pictureAI-text__pictureai-modal-footer-button__dQTEU { width: 100px; height: 36px; line-height: 36px; text-align: center; border-radius: 18px; background-color: var(--theme-primary); color: #ffffff; font-size: 14px; font-weight: 600; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .mission-drawer__flex-center__2Jk9x { display: flex; align-items: center; justify-content: center; } .mission-drawer__full-filled__1qMJx { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .mission-drawer__modal-mask__20Y32 { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .mission-drawer__modal-mask__20Y32 .mission-drawer__modal-wrap__YG5GZ { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .mission-drawer__modal-mask__20Y32 .mission-drawer__modal-wrap__YG5GZ .mission-drawer__modal-header-wrap__2B7BW { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .mission-drawer__modal-mask__20Y32 .mission-drawer__modal-wrap__YG5GZ .mission-drawer__modal-header-wrap__2B7BW .mission-drawer__modal-header-bg__2uFv7 { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .mission-drawer__modal-mask__20Y32 .mission-drawer__modal-wrap__YG5GZ .mission-drawer__modal-header-wrap__2B7BW .mission-drawer__modal-header-label__2Pbb9 { flex-shrink: 0; font-size: 16px; font-weight: bold; } .mission-drawer__modal-mask__20Y32 .mission-drawer__modal-wrap__YG5GZ .mission-drawer__modal-header-wrap__2B7BW .mission-drawer__modal-header-close__-8aYz { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mission-drawer__modal-mask__20Y32 .mission-drawer__modal-wrap__YG5GZ .mission-drawer__modal-header-wrap__2B7BW .mission-drawer__modal-header-close__-8aYz:hover { color: #98a2b4; } .mission-drawer__modal-mask__20Y32 .mission-drawer__modal-wrap__YG5GZ .mission-drawer__modal-body-wrap__dLSxN { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .mission-drawer__modal-mask__20Y32 .mission-drawer__modal-wrap__YG5GZ .mission-drawer__modal-footer-wrap__2Glwb { flex-shrink: 0; display: flex; } .mission-drawer__modal-header__1A85u { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .mission-drawer__modal-header__1A85u .mission-drawer__modal-header-upload__tvFZ9 { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .mission-drawer__modal-header__1A85u .mission-drawer__modal-header-upload__tvFZ9:hover { background-color: #e0e9ff; } .mission-drawer__modal-header__1A85u .mission-drawer__modal-header-upload__tvFZ9:active { background-color: #ccdaff; } .mission-drawer__modal-header__1A85u .mission-drawer__modal-header-upload__tvFZ9 .mission-drawer__upload-img__3MuHg { font-size: 16px; margin-right: calc(2px); } .mission-drawer__modal-header__1A85u .mission-drawer__modal-header-upload__tvFZ9 .mission-drawer__upload-label__3JwNR { font-size: 14px; } .mission-drawer__modal-header__1A85u .mission-drawer__modal-header-upload__tvFZ9 .mission-drawer__upload-input__2lwwG { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mission-drawer__modal-header__1A85u .mission-drawer__modal-header-search__1bPjY { position: relative; } .mission-drawer__modal-header__1A85u .mission-drawer__modal-header-search__1bPjY .mission-drawer__search-input__1jtua { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .mission-drawer__modal-header__1A85u .mission-drawer__modal-header-search__1bPjY .mission-drawer__search-input__1jtua::-webkit-input-placeholder { color: #98a2b4; } .mission-drawer__modal-header__1A85u .mission-drawer__modal-header-search__1bPjY .mission-drawer__search-input__1jtua::-moz-placeholder { color: #98a2b4; } .mission-drawer__modal-header__1A85u .mission-drawer__modal-header-search__1bPjY .mission-drawer__search-input__1jtua:-ms-input-placeholder { color: #98a2b4; } .mission-drawer__modal-header__1A85u .mission-drawer__modal-header-search__1bPjY .mission-drawer__search-input__1jtua:hover { border-color: #d1d7e1; } .mission-drawer__modal-header__1A85u .mission-drawer__modal-header-search__1bPjY .mission-drawer__search-input__1jtua:active { border-color: #d1d7e1; } .mission-drawer__modal-header__1A85u .mission-drawer__modal-header-search__1bPjY .mission-drawer__search-img__1tiLT { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mission-drawer__modal-body__246zg { flex-grow: 1; display: flex; } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-left__1f4gw, .mission-drawer__modal-body__246zg .mission-drawer__modal-body-main__uNJf- { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-left__1f4gw { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-left__1f4gw .mission-drawer__modal-body-left-scroll__2i0Kn { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-left__1f4gw .mission-drawer__modal-body-left-scroll__2i0Kn .mission-drawer__modal-body-left-inner__1B8Vs { width: 121px; padding: calc(12px); color: #5e6b81; } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-left__1f4gw .mission-drawer__modal-body-left-scroll__2i0Kn .mission-drawer__modal-body-left-inner__1B8Vs .mission-drawer__menu-item-current__2X_s4 { color: var(--theme-primary); background-color: #e0e9ff; } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-left__1f4gw .mission-drawer__modal-body-left-scroll__2i0Kn .mission-drawer__modal-body-left-inner__1B8Vs .mission-drawer__menu-item__2Zx6m { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-left__1f4gw .mission-drawer__modal-body-left-scroll__2i0Kn .mission-drawer__modal-body-left-inner__1B8Vs .mission-drawer__menu-item__2Zx6m:hover { background-color: #edeff5; } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-left__1f4gw .mission-drawer__modal-body-left-scroll__2i0Kn .mission-drawer__modal-body-left-inner__1B8Vs .mission-drawer__menu-item__2Zx6m .mission-drawer__menu-item-img__2V6J5 { flex-shrink: 0; width: 20px; margin-right: 8px; } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-left__1f4gw .mission-drawer__modal-body-left-scroll__2i0Kn .mission-drawer__modal-body-left-inner__1B8Vs .mission-drawer__menu-item__2Zx6m .mission-drawer__menu-item-label__3OZJ1 { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-main__uNJf- { padding: calc(12px) 0; } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-main__uNJf- .mission-drawer__modal-body-main-scroll__2Gj-T { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-main__uNJf- .mission-drawer__modal-body-main-scroll__2Gj-T .mission-drawer__modal-body-main-inner__3feGE { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-main__uNJf- .mission-drawer__modal-body-main-scroll__2Gj-T .mission-drawer__modal-body-main-inner__3feGE .mission-drawer__selector-btn-add__2HexE, .mission-drawer__modal-body__246zg .mission-drawer__modal-body-main__uNJf- .mission-drawer__modal-body-main-scroll__2Gj-T .mission-drawer__modal-body-main-inner__3feGE .mission-drawer__selector-btn-item__n02VN { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-main__uNJf- .mission-drawer__modal-body-main-scroll__2Gj-T .mission-drawer__modal-body-main-inner__3feGE .mission-drawer__selector-btn-add__2HexE:hover, .mission-drawer__modal-body__246zg .mission-drawer__modal-body-main__uNJf- .mission-drawer__modal-body-main-scroll__2Gj-T .mission-drawer__modal-body-main-inner__3feGE .mission-drawer__selector-btn-item__n02VN:hover { background-color: #e0e9ff; } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-main__uNJf- .mission-drawer__modal-body-main-scroll__2Gj-T .mission-drawer__modal-body-main-inner__3feGE .mission-drawer__selector-btn-add__2HexE:active, .mission-drawer__modal-body__246zg .mission-drawer__modal-body-main__uNJf- .mission-drawer__modal-body-main-scroll__2Gj-T .mission-drawer__modal-body-main-inner__3feGE .mission-drawer__selector-btn-item__n02VN:active { background-color: #ccdaff; } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-main__uNJf- .mission-drawer__modal-body-main-scroll__2Gj-T .mission-drawer__modal-body-main-inner__3feGE .mission-drawer__selector-btn-add__2HexE:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-main__uNJf- .mission-drawer__modal-body-main-scroll__2Gj-T .mission-drawer__modal-body-main-inner__3feGE .mission-drawer__selector-btn-add__2HexE:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-main__uNJf- .mission-drawer__modal-body-main-scroll__2Gj-T .mission-drawer__modal-body-main-inner__3feGE .mission-drawer__selector-btn-add__2HexE .mission-drawer__add-img__3jv-c { font-size: 28px; height: auto; margin-bottom: 8px; } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-main__uNJf- .mission-drawer__modal-body-main-scroll__2Gj-T .mission-drawer__modal-body-main-inner__3feGE .mission-drawer__selector-btn-add__2HexE .mission-drawer__add-label__1rIrV { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-main__uNJf- .mission-drawer__modal-body-main-scroll__2Gj-T .mission-drawer__modal-body-main-inner__3feGE .mission-drawer__selector-btn-item__n02VN { justify-content: space-between; } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-main__uNJf- .mission-drawer__modal-body-main-scroll__2Gj-T .mission-drawer__modal-body-main-inner__3feGE .mission-drawer__selector-btn-item__n02VN .mission-drawer__item-img__33OTt { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-main__uNJf- .mission-drawer__modal-body-main-scroll__2Gj-T .mission-drawer__modal-body-main-inner__3feGE .mission-drawer__selector-btn-item__n02VN .mission-drawer__item-img__33OTt img { width: auto; height: 105px; } .mission-drawer__modal-body__246zg .mission-drawer__modal-body-main__uNJf- .mission-drawer__modal-body-main-scroll__2Gj-T .mission-drawer__modal-body-main-inner__3feGE .mission-drawer__selector-btn-item__n02VN .mission-drawer__item-label__3Elki { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .mission-drawer__modal-footer__1JPZn { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .mission-drawer__selector-btn-add__2HexE, .mission-drawer__selector-btn-item__n02VN { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .mission-drawer__selector-btn-add__2HexE { background-color: var(--selector-sprite-bg_primary); } .mission-drawer__selector-btn-add__2HexE:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .mission-drawer__selector-btn-add__2HexE:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .mission-drawer__selector-btn-add__2HexE .mission-drawer__add-img__3jv-c { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .mission-drawer__selector-btn-add__2HexE .mission-drawer__add-label__1rIrV { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .mission-drawer__selector-btn-item__n02VN { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .mission-drawer__selector-btn-item__n02VN .mission-drawer__item-img__33OTt { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .mission-drawer__selector-btn-item__n02VN .mission-drawer__item-img__33OTt img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .mission-drawer__selector-btn-item__n02VN .mission-drawer__item-label__3Elki { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .mission-drawer__selector-btn-item__n02VN:hover { background-color: var(--selector-sprite-bg_primary); } .mission-drawer__selector-btn-item__n02VN:hover .mission-drawer__item-img__33OTt { border-color: var(--selector-sprite-bg_primary); } .mission-drawer__selector-btn-item_selected__2aKFP { background-color: var(--selector-sprite-bg_primary); } .mission-drawer__selector-btn-item_selected__2aKFP .mission-drawer__item-img__33OTt { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .mission-drawer__menu-bar-btn__iBQHI { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .mission-drawer__menu-bar-btn_green__RrPEs, .mission-drawer__menu-bar-btn_create__3UKJk { background-color: #3cdc8f; } .mission-drawer__menu-bar-btn_green__RrPEs:hover, .mission-drawer__menu-bar-btn_create__3UKJk:hover { background-color: #00d374; } .mission-drawer__menu-bar-btn_green__RrPEs:active, .mission-drawer__menu-bar-btn_create__3UKJk:active { background-color: #00d374; } .mission-drawer__menu-bar-btn_save__2iOXG, .mission-drawer__menu-bar-btn_reset__1Ewet { background-color: #6ac8ff; } .mission-drawer__menu-bar-btn_save__2iOXG:hover, .mission-drawer__menu-bar-btn_reset__1Ewet:hover { background-color: #57bcfe; } .mission-drawer__menu-bar-btn_save__2iOXG:active, .mission-drawer__menu-bar-btn_reset__1Ewet:active { background-color: #4fb0fc; } .mission-drawer__menu-bar-btn_submit__3LIRl, .mission-drawer__menu-bar-btn_open__25dgv { background-color: #ff9e23; } .mission-drawer__menu-bar-btn_submit__3LIRl:hover, .mission-drawer__menu-bar-btn_open__25dgv:hover { background-color: #f47b04; } .mission-drawer__menu-bar-btn_submit__3LIRl:active, .mission-drawer__menu-bar-btn_open__25dgv:active { background-color: #fe8f22; } .mission-drawer__menu-bar-btn_link__UBC_q { background-color: #e8efff; color: var(--theme-primary); } .mission-drawer__menu-bar-btn_link__UBC_q:hover { background-color: #b6c7ff; } .mission-drawer__menu-bar-btn_link__UBC_q:active { background-color: #cfdcff; } .mission-drawer__menu-bar-btn_disabled__2Ix9n { color: #565266; background-color: #e6e9ed; } .mission-drawer__menu-bar-btn_disabled__2Ix9n:hover { cursor: not-allowed; } .mission-drawer__menu-bar-btn_help__x2sPS { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .mission-drawer__menu-bar-btn_help__x2sPS:hover { background-color: #8398ff; } .mission-drawer__menu-bar-btn_help__x2sPS:active { background-color: #8ca3ff; } .mission-drawer__menu-bar-separator__a4-5c { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .mission-drawer__mission-drawer__2C2UU { position: absolute; top: 41px; bottom: 0; right: 0; z-index: 99; margin: auto; background-color: #ffffff; box-shadow: -4px 2px 7px rgba(0, 0, 0, 0.07); } .mission-drawer__mission-drawer__2C2UU .mission-drawer__mission-drawer-container__3ol7M { height: 100%; } .mission-drawer__mission-drawer__2C2UU .mission-drawer__mission-drawer-container__3ol7M .mission-drawer__mission-drawer-main__1aAlD { min-height: 100%; width: calc(256px); background-color: rgba(232, 239, 255, 0.5); padding: 14px; border-radius: 4px; overflow: hidden; } .mission-drawer__mission-drawer__2C2UU .mission-drawer__mission-drawer-container__3ol7M .mission-drawer__mission-drawer-main__1aAlD img { max-width: 228px; } .mission-drawer__mission-drawer__2C2UU .mission-drawer__mission-drawer-container__3ol7M .mission-drawer__mission-drawer-main__1aAlD .mission-drawer__mission-drawer-content__1XAt9 { word-wrap: break-word; } .mission-drawer__mission-drawer__2C2UU.mission-drawer__mission-drawer_expand__2V3sW .mission-drawer__mission-drawer-container__3ol7M { width: 272px; transition: 0.2s; overflow: auto; padding: 8px; } .mission-drawer__mission-drawer__2C2UU.mission-drawer__mission-drawer_collapse__3fdhO .mission-drawer__mission-drawer-container__3ol7M { width: 20px; transition: 0.2s; overflow: hidden; } .mission-drawer__mission-drawer__2C2UU .mission-drawer__mission-drawer-toggle__3tOXb { display: flex; align-items: center; justify-content: center; position: absolute; left: -16px; top: 0; bottom: 0; z-index: 100; margin: auto; height: 32px; width: 32px; border-radius: 50%; box-sizing: border-box; background: #ffffff; border: 1px solid #edeff5; box-shadow: 0px 5px 16px rgba(129, 141, 219, 0.21); } .mission-drawer__mission-drawer__2C2UU.mission-drawer__mission-drawer_expand__2V3sW .mission-drawer__mission-drawer-toggle__3tOXb .mission-drawer__mission-drawer-toggle-icon__29TRg { transition: 0.2s; } .mission-drawer__mission-drawer__2C2UU.mission-drawer__mission-drawer_collapse__3fdhO .mission-drawer__mission-drawer-toggle__3tOXb .mission-drawer__mission-drawer-toggle-icon__29TRg { transform: rotate(180deg); transition: 0.2s; } .mission-drawer__mission-drawer__2C2UU .mission-drawer__view-image__3Xp1J.mission-drawer__mask__1Zbi2 { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .mission-drawer__mission-drawer__2C2UU .mission-drawer__view-image__3Xp1J.mission-drawer__mask__1Zbi2 .mission-drawer__modal-wrap__YG5GZ { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .mission-drawer__mission-drawer__2C2UU .mission-drawer__view-image__3Xp1J.mission-drawer__mask__1Zbi2 .mission-drawer__modal-wrap__YG5GZ .mission-drawer__modal-header-wrap__2B7BW { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .mission-drawer__mission-drawer__2C2UU .mission-drawer__view-image__3Xp1J.mission-drawer__mask__1Zbi2 .mission-drawer__modal-wrap__YG5GZ .mission-drawer__modal-header-wrap__2B7BW .mission-drawer__modal-header-bg__2uFv7 { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .mission-drawer__mission-drawer__2C2UU .mission-drawer__view-image__3Xp1J.mission-drawer__mask__1Zbi2 .mission-drawer__modal-wrap__YG5GZ .mission-drawer__modal-header-wrap__2B7BW .mission-drawer__modal-header-label__2Pbb9 { flex-shrink: 0; font-size: 16px; font-weight: bold; } .mission-drawer__mission-drawer__2C2UU .mission-drawer__view-image__3Xp1J.mission-drawer__mask__1Zbi2 .mission-drawer__modal-wrap__YG5GZ .mission-drawer__modal-header-wrap__2B7BW .mission-drawer__modal-header-close__-8aYz { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mission-drawer__mission-drawer__2C2UU .mission-drawer__view-image__3Xp1J.mission-drawer__mask__1Zbi2 .mission-drawer__modal-wrap__YG5GZ .mission-drawer__modal-header-wrap__2B7BW .mission-drawer__modal-header-close__-8aYz:hover { color: #98a2b4; } .mission-drawer__mission-drawer__2C2UU .mission-drawer__view-image__3Xp1J.mission-drawer__mask__1Zbi2 .mission-drawer__modal-wrap__YG5GZ .mission-drawer__modal-body-wrap__dLSxN { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .mission-drawer__mission-drawer__2C2UU .mission-drawer__view-image__3Xp1J.mission-drawer__mask__1Zbi2 .mission-drawer__modal-wrap__YG5GZ .mission-drawer__modal-footer-wrap__2Glwb { flex-shrink: 0; display: flex; } .mission-drawer__mission-drawer__2C2UU .mission-drawer__view-image__3Xp1J .mission-drawer__imageContent__3B2uf { width: 60%; height: 60%; position: relative; display: flex; justify-content: center; align-items: center; } .mission-drawer__mission-drawer__2C2UU .mission-drawer__view-image__3Xp1J .mission-drawer__imageContent__3B2uf img { max-height: 100%; max-width: 100%; } .mission-drawer__mission-drawer__2C2UU .mission-drawer__view-image__3Xp1J .mission-drawer__imageContent__3B2uf .mission-drawer__close__21L4w { width: 30px; height: 30px; display: flex; justify-content: center; align-items: center; position: absolute; top: -40px; right: -40px; font-size: 20px; } .add-nn-model__flex-center__1S4FD { display: flex; align-items: center; justify-content: center; } .add-nn-model__full-filled__ej8_V { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .add-nn-model__modal-mask__PlXHt { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .add-nn-model__modal-mask__PlXHt .add-nn-model__modal-wrap__3cykz { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .add-nn-model__modal-mask__PlXHt .add-nn-model__modal-wrap__3cykz .add-nn-model__modal-header-wrap__2Epp6 { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .add-nn-model__modal-mask__PlXHt .add-nn-model__modal-wrap__3cykz .add-nn-model__modal-header-wrap__2Epp6 .add-nn-model__modal-header-bg__3uxGs { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .add-nn-model__modal-mask__PlXHt .add-nn-model__modal-wrap__3cykz .add-nn-model__modal-header-wrap__2Epp6 .add-nn-model__modal-header-label__2VeKS { flex-shrink: 0; font-size: 16px; font-weight: bold; } .add-nn-model__modal-mask__PlXHt .add-nn-model__modal-wrap__3cykz .add-nn-model__modal-header-wrap__2Epp6 .add-nn-model__modal-header-close__3maBj { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .add-nn-model__modal-mask__PlXHt .add-nn-model__modal-wrap__3cykz .add-nn-model__modal-header-wrap__2Epp6 .add-nn-model__modal-header-close__3maBj:hover { color: #98a2b4; } .add-nn-model__modal-mask__PlXHt .add-nn-model__modal-wrap__3cykz .add-nn-model__modal-body-wrap__3MQV2 { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .add-nn-model__modal-mask__PlXHt .add-nn-model__modal-wrap__3cykz .add-nn-model__modal-footer-wrap__1EfR4 { flex-shrink: 0; display: flex; } .add-nn-model__modal-header__1Zn5E { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .add-nn-model__modal-header__1Zn5E .add-nn-model__modal-header-upload__2Gncz { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .add-nn-model__modal-header__1Zn5E .add-nn-model__modal-header-upload__2Gncz:hover { background-color: #e0e9ff; } .add-nn-model__modal-header__1Zn5E .add-nn-model__modal-header-upload__2Gncz:active { background-color: #ccdaff; } .add-nn-model__modal-header__1Zn5E .add-nn-model__modal-header-upload__2Gncz .add-nn-model__upload-img__2Uieu { font-size: 16px; margin-right: calc(2px); } .add-nn-model__modal-header__1Zn5E .add-nn-model__modal-header-upload__2Gncz .add-nn-model__upload-label__yXypD { font-size: 14px; } .add-nn-model__modal-header__1Zn5E .add-nn-model__modal-header-upload__2Gncz .add-nn-model__upload-input__19yLx { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .add-nn-model__modal-header__1Zn5E .add-nn-model__modal-header-search__bdJGj { position: relative; } .add-nn-model__modal-header__1Zn5E .add-nn-model__modal-header-search__bdJGj .add-nn-model__search-input__10WnF { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .add-nn-model__modal-header__1Zn5E .add-nn-model__modal-header-search__bdJGj .add-nn-model__search-input__10WnF::-webkit-input-placeholder { color: #98a2b4; } .add-nn-model__modal-header__1Zn5E .add-nn-model__modal-header-search__bdJGj .add-nn-model__search-input__10WnF::-moz-placeholder { color: #98a2b4; } .add-nn-model__modal-header__1Zn5E .add-nn-model__modal-header-search__bdJGj .add-nn-model__search-input__10WnF:-ms-input-placeholder { color: #98a2b4; } .add-nn-model__modal-header__1Zn5E .add-nn-model__modal-header-search__bdJGj .add-nn-model__search-input__10WnF:hover { border-color: #d1d7e1; } .add-nn-model__modal-header__1Zn5E .add-nn-model__modal-header-search__bdJGj .add-nn-model__search-input__10WnF:active { border-color: #d1d7e1; } .add-nn-model__modal-header__1Zn5E .add-nn-model__modal-header-search__bdJGj .add-nn-model__search-img__qUWT4 { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .add-nn-model__modal-body__r0DNz { flex-grow: 1; display: flex; } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-left__kd5ay, .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-main__3ggUG { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-left__kd5ay { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-left__kd5ay .add-nn-model__modal-body-left-scroll__R6CTH { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-left__kd5ay .add-nn-model__modal-body-left-scroll__R6CTH .add-nn-model__modal-body-left-inner__1a-eN { width: 121px; padding: calc(12px); color: #5e6b81; } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-left__kd5ay .add-nn-model__modal-body-left-scroll__R6CTH .add-nn-model__modal-body-left-inner__1a-eN .add-nn-model__menu-item-current__1_3T4 { color: var(--theme-primary); background-color: #e0e9ff; } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-left__kd5ay .add-nn-model__modal-body-left-scroll__R6CTH .add-nn-model__modal-body-left-inner__1a-eN .add-nn-model__menu-item__1heMe { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-left__kd5ay .add-nn-model__modal-body-left-scroll__R6CTH .add-nn-model__modal-body-left-inner__1a-eN .add-nn-model__menu-item__1heMe:hover { background-color: #edeff5; } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-left__kd5ay .add-nn-model__modal-body-left-scroll__R6CTH .add-nn-model__modal-body-left-inner__1a-eN .add-nn-model__menu-item__1heMe .add-nn-model__menu-item-img__3XY7E { flex-shrink: 0; width: 20px; margin-right: 8px; } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-left__kd5ay .add-nn-model__modal-body-left-scroll__R6CTH .add-nn-model__modal-body-left-inner__1a-eN .add-nn-model__menu-item__1heMe .add-nn-model__menu-item-label__1FGm9 { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-main__3ggUG { padding: calc(12px) 0; } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-main__3ggUG .add-nn-model__modal-body-main-scroll__7o4aF { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-main__3ggUG .add-nn-model__modal-body-main-scroll__7o4aF .add-nn-model__modal-body-main-inner__1u1Bh { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-main__3ggUG .add-nn-model__modal-body-main-scroll__7o4aF .add-nn-model__modal-body-main-inner__1u1Bh .add-nn-model__selector-btn-add__26GQo, .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-main__3ggUG .add-nn-model__modal-body-main-scroll__7o4aF .add-nn-model__modal-body-main-inner__1u1Bh .add-nn-model__selector-btn-item__26x7S { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-main__3ggUG .add-nn-model__modal-body-main-scroll__7o4aF .add-nn-model__modal-body-main-inner__1u1Bh .add-nn-model__selector-btn-add__26GQo:hover, .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-main__3ggUG .add-nn-model__modal-body-main-scroll__7o4aF .add-nn-model__modal-body-main-inner__1u1Bh .add-nn-model__selector-btn-item__26x7S:hover { background-color: #e0e9ff; } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-main__3ggUG .add-nn-model__modal-body-main-scroll__7o4aF .add-nn-model__modal-body-main-inner__1u1Bh .add-nn-model__selector-btn-add__26GQo:active, .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-main__3ggUG .add-nn-model__modal-body-main-scroll__7o4aF .add-nn-model__modal-body-main-inner__1u1Bh .add-nn-model__selector-btn-item__26x7S:active { background-color: #ccdaff; } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-main__3ggUG .add-nn-model__modal-body-main-scroll__7o4aF .add-nn-model__modal-body-main-inner__1u1Bh .add-nn-model__selector-btn-add__26GQo:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-main__3ggUG .add-nn-model__modal-body-main-scroll__7o4aF .add-nn-model__modal-body-main-inner__1u1Bh .add-nn-model__selector-btn-add__26GQo:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-main__3ggUG .add-nn-model__modal-body-main-scroll__7o4aF .add-nn-model__modal-body-main-inner__1u1Bh .add-nn-model__selector-btn-add__26GQo .add-nn-model__add-img__eOUyE { font-size: 28px; height: auto; margin-bottom: 8px; } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-main__3ggUG .add-nn-model__modal-body-main-scroll__7o4aF .add-nn-model__modal-body-main-inner__1u1Bh .add-nn-model__selector-btn-add__26GQo .add-nn-model__add-label__GpjOi { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-main__3ggUG .add-nn-model__modal-body-main-scroll__7o4aF .add-nn-model__modal-body-main-inner__1u1Bh .add-nn-model__selector-btn-item__26x7S { justify-content: space-between; } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-main__3ggUG .add-nn-model__modal-body-main-scroll__7o4aF .add-nn-model__modal-body-main-inner__1u1Bh .add-nn-model__selector-btn-item__26x7S .add-nn-model__item-img__xVMho { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-main__3ggUG .add-nn-model__modal-body-main-scroll__7o4aF .add-nn-model__modal-body-main-inner__1u1Bh .add-nn-model__selector-btn-item__26x7S .add-nn-model__item-img__xVMho img { width: auto; height: 105px; } .add-nn-model__modal-body__r0DNz .add-nn-model__modal-body-main__3ggUG .add-nn-model__modal-body-main-scroll__7o4aF .add-nn-model__modal-body-main-inner__1u1Bh .add-nn-model__selector-btn-item__26x7S .add-nn-model__item-label__2hVLl { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .add-nn-model__modal-footer__3ciAm { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .add-nn-model__selector-btn-add__26GQo, .add-nn-model__selector-btn-item__26x7S { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .add-nn-model__selector-btn-add__26GQo { background-color: var(--selector-sprite-bg_primary); } .add-nn-model__selector-btn-add__26GQo:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .add-nn-model__selector-btn-add__26GQo:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .add-nn-model__selector-btn-add__26GQo .add-nn-model__add-img__eOUyE { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .add-nn-model__selector-btn-add__26GQo .add-nn-model__add-label__GpjOi { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .add-nn-model__selector-btn-item__26x7S { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .add-nn-model__selector-btn-item__26x7S .add-nn-model__item-img__xVMho { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .add-nn-model__selector-btn-item__26x7S .add-nn-model__item-img__xVMho img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .add-nn-model__selector-btn-item__26x7S .add-nn-model__item-label__2hVLl { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .add-nn-model__selector-btn-item__26x7S:hover { background-color: var(--selector-sprite-bg_primary); } .add-nn-model__selector-btn-item__26x7S:hover .add-nn-model__item-img__xVMho { border-color: var(--selector-sprite-bg_primary); } .add-nn-model__selector-btn-item_selected__gN_bJ { background-color: var(--selector-sprite-bg_primary); } .add-nn-model__selector-btn-item_selected__gN_bJ .add-nn-model__item-img__xVMho { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .add-nn-model__menu-bar-btn___jYiQ { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .add-nn-model__menu-bar-btn_green__Dde6O, .add-nn-model__menu-bar-btn_create__2-FAc { background-color: #3cdc8f; } .add-nn-model__menu-bar-btn_green__Dde6O:hover, .add-nn-model__menu-bar-btn_create__2-FAc:hover { background-color: #00d374; } .add-nn-model__menu-bar-btn_green__Dde6O:active, .add-nn-model__menu-bar-btn_create__2-FAc:active { background-color: #00d374; } .add-nn-model__menu-bar-btn_save__29xF_, .add-nn-model__menu-bar-btn_reset__Ou1Dn { background-color: #6ac8ff; } .add-nn-model__menu-bar-btn_save__29xF_:hover, .add-nn-model__menu-bar-btn_reset__Ou1Dn:hover { background-color: #57bcfe; } .add-nn-model__menu-bar-btn_save__29xF_:active, .add-nn-model__menu-bar-btn_reset__Ou1Dn:active { background-color: #4fb0fc; } .add-nn-model__menu-bar-btn_submit__iILXW, .add-nn-model__menu-bar-btn_open__1Y2WO { background-color: #ff9e23; } .add-nn-model__menu-bar-btn_submit__iILXW:hover, .add-nn-model__menu-bar-btn_open__1Y2WO:hover { background-color: #f47b04; } .add-nn-model__menu-bar-btn_submit__iILXW:active, .add-nn-model__menu-bar-btn_open__1Y2WO:active { background-color: #fe8f22; } .add-nn-model__menu-bar-btn_link__R5Zmu { background-color: #e8efff; color: var(--theme-primary); } .add-nn-model__menu-bar-btn_link__R5Zmu:hover { background-color: #b6c7ff; } .add-nn-model__menu-bar-btn_link__R5Zmu:active { background-color: #cfdcff; } .add-nn-model__menu-bar-btn_disabled__3nDbB { color: #565266; background-color: #e6e9ed; } .add-nn-model__menu-bar-btn_disabled__3nDbB:hover { cursor: not-allowed; } .add-nn-model__menu-bar-btn_help__13ca4 { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .add-nn-model__menu-bar-btn_help__13ca4:hover { background-color: #8398ff; } .add-nn-model__menu-bar-btn_help__13ca4:active { background-color: #8ca3ff; } .add-nn-model__menu-bar-separator__2Morm { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .add-nn-model__create-nn-model-mask__3zpCG .add-nn-model__create-nn-model__1SknS { width: 240px; height: 160px; } .add-nn-model__create-nn-model-mask__3zpCG .add-nn-model__create-nn-model__1SknS .add-nn-model__create-nn-model-body__3wPDg { flex: 1 0; } .add-nn-model__create-nn-model-mask__3zpCG .add-nn-model__create-nn-model__1SknS .add-nn-model__create-nn-model-body__3wPDg .add-nn-model__create-nn-model-input__1iIZx { width: 100%; border: none; padding: 8px 16px; } .add-nn-model__create-nn-model-mask__3zpCG .add-nn-model__create-nn-model__1SknS .add-nn-model__create-nn-model-body__3wPDg .add-nn-model__create-nn-model-input__1iIZx:focus-visible { outline: none; } .add-nn-model__create-nn-model-mask__3zpCG .add-nn-model__create-nn-model__1SknS .add-nn-model__create-nn-model-footer__2TcCl { flex: 1 0; padding: 16px; display: flex; justify-content: space-between; } .upload-nn-matrix__flex-center__2UWUM { display: flex; align-items: center; justify-content: center; } .upload-nn-matrix__full-filled__27h-i { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .upload-nn-matrix__modal-mask__1DaU_ { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .upload-nn-matrix__modal-mask__1DaU_ .upload-nn-matrix__modal-wrap__1dZAF { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .upload-nn-matrix__modal-mask__1DaU_ .upload-nn-matrix__modal-wrap__1dZAF .upload-nn-matrix__modal-header-wrap__1iV2O { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .upload-nn-matrix__modal-mask__1DaU_ .upload-nn-matrix__modal-wrap__1dZAF .upload-nn-matrix__modal-header-wrap__1iV2O .upload-nn-matrix__modal-header-bg__2zJEf { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .upload-nn-matrix__modal-mask__1DaU_ .upload-nn-matrix__modal-wrap__1dZAF .upload-nn-matrix__modal-header-wrap__1iV2O .upload-nn-matrix__modal-header-label__36giq { flex-shrink: 0; font-size: 16px; font-weight: bold; } .upload-nn-matrix__modal-mask__1DaU_ .upload-nn-matrix__modal-wrap__1dZAF .upload-nn-matrix__modal-header-wrap__1iV2O .upload-nn-matrix__modal-header-close__3asc7 { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .upload-nn-matrix__modal-mask__1DaU_ .upload-nn-matrix__modal-wrap__1dZAF .upload-nn-matrix__modal-header-wrap__1iV2O .upload-nn-matrix__modal-header-close__3asc7:hover { color: #98a2b4; } .upload-nn-matrix__modal-mask__1DaU_ .upload-nn-matrix__modal-wrap__1dZAF .upload-nn-matrix__modal-body-wrap__246Uh { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .upload-nn-matrix__modal-mask__1DaU_ .upload-nn-matrix__modal-wrap__1dZAF .upload-nn-matrix__modal-footer-wrap__2qFM_ { flex-shrink: 0; display: flex; } .upload-nn-matrix__modal-header__2XqeZ { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .upload-nn-matrix__modal-header__2XqeZ .upload-nn-matrix__modal-header-upload__2aefh { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .upload-nn-matrix__modal-header__2XqeZ .upload-nn-matrix__modal-header-upload__2aefh:hover { background-color: #e0e9ff; } .upload-nn-matrix__modal-header__2XqeZ .upload-nn-matrix__modal-header-upload__2aefh:active { background-color: #ccdaff; } .upload-nn-matrix__modal-header__2XqeZ .upload-nn-matrix__modal-header-upload__2aefh .upload-nn-matrix__upload-img__2V3HT { font-size: 16px; margin-right: calc(2px); } .upload-nn-matrix__modal-header__2XqeZ .upload-nn-matrix__modal-header-upload__2aefh .upload-nn-matrix__upload-label__aqQRT { font-size: 14px; } .upload-nn-matrix__modal-header__2XqeZ .upload-nn-matrix__modal-header-upload__2aefh .upload-nn-matrix__upload-input__2BolH { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .upload-nn-matrix__modal-header__2XqeZ .upload-nn-matrix__modal-header-search__CJmHf { position: relative; } .upload-nn-matrix__modal-header__2XqeZ .upload-nn-matrix__modal-header-search__CJmHf .upload-nn-matrix__search-input__3Yi7L { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .upload-nn-matrix__modal-header__2XqeZ .upload-nn-matrix__modal-header-search__CJmHf .upload-nn-matrix__search-input__3Yi7L::-webkit-input-placeholder { color: #98a2b4; } .upload-nn-matrix__modal-header__2XqeZ .upload-nn-matrix__modal-header-search__CJmHf .upload-nn-matrix__search-input__3Yi7L::-moz-placeholder { color: #98a2b4; } .upload-nn-matrix__modal-header__2XqeZ .upload-nn-matrix__modal-header-search__CJmHf .upload-nn-matrix__search-input__3Yi7L:-ms-input-placeholder { color: #98a2b4; } .upload-nn-matrix__modal-header__2XqeZ .upload-nn-matrix__modal-header-search__CJmHf .upload-nn-matrix__search-input__3Yi7L:hover { border-color: #d1d7e1; } .upload-nn-matrix__modal-header__2XqeZ .upload-nn-matrix__modal-header-search__CJmHf .upload-nn-matrix__search-input__3Yi7L:active { border-color: #d1d7e1; } .upload-nn-matrix__modal-header__2XqeZ .upload-nn-matrix__modal-header-search__CJmHf .upload-nn-matrix__search-img__1cX97 { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .upload-nn-matrix__modal-body__2Ywmy { flex-grow: 1; display: flex; } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-left__1JajF, .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-main__2Gl2t { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-left__1JajF { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-left__1JajF .upload-nn-matrix__modal-body-left-scroll__2HS9R { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-left__1JajF .upload-nn-matrix__modal-body-left-scroll__2HS9R .upload-nn-matrix__modal-body-left-inner__1FLMl { width: 121px; padding: calc(12px); color: #5e6b81; } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-left__1JajF .upload-nn-matrix__modal-body-left-scroll__2HS9R .upload-nn-matrix__modal-body-left-inner__1FLMl .upload-nn-matrix__menu-item-current__DuHcg { color: var(--theme-primary); background-color: #e0e9ff; } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-left__1JajF .upload-nn-matrix__modal-body-left-scroll__2HS9R .upload-nn-matrix__modal-body-left-inner__1FLMl .upload-nn-matrix__menu-item__WkFq9 { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-left__1JajF .upload-nn-matrix__modal-body-left-scroll__2HS9R .upload-nn-matrix__modal-body-left-inner__1FLMl .upload-nn-matrix__menu-item__WkFq9:hover { background-color: #edeff5; } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-left__1JajF .upload-nn-matrix__modal-body-left-scroll__2HS9R .upload-nn-matrix__modal-body-left-inner__1FLMl .upload-nn-matrix__menu-item__WkFq9 .upload-nn-matrix__menu-item-img__3iF9- { flex-shrink: 0; width: 20px; margin-right: 8px; } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-left__1JajF .upload-nn-matrix__modal-body-left-scroll__2HS9R .upload-nn-matrix__modal-body-left-inner__1FLMl .upload-nn-matrix__menu-item__WkFq9 .upload-nn-matrix__menu-item-label__1rcsS { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-main__2Gl2t { padding: calc(12px) 0; } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-main__2Gl2t .upload-nn-matrix__modal-body-main-scroll__m4s8f { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-main__2Gl2t .upload-nn-matrix__modal-body-main-scroll__m4s8f .upload-nn-matrix__modal-body-main-inner__2HzZE { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-main__2Gl2t .upload-nn-matrix__modal-body-main-scroll__m4s8f .upload-nn-matrix__modal-body-main-inner__2HzZE .upload-nn-matrix__selector-btn-add__1-syi, .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-main__2Gl2t .upload-nn-matrix__modal-body-main-scroll__m4s8f .upload-nn-matrix__modal-body-main-inner__2HzZE .upload-nn-matrix__selector-btn-item__zzWpL { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-main__2Gl2t .upload-nn-matrix__modal-body-main-scroll__m4s8f .upload-nn-matrix__modal-body-main-inner__2HzZE .upload-nn-matrix__selector-btn-add__1-syi:hover, .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-main__2Gl2t .upload-nn-matrix__modal-body-main-scroll__m4s8f .upload-nn-matrix__modal-body-main-inner__2HzZE .upload-nn-matrix__selector-btn-item__zzWpL:hover { background-color: #e0e9ff; } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-main__2Gl2t .upload-nn-matrix__modal-body-main-scroll__m4s8f .upload-nn-matrix__modal-body-main-inner__2HzZE .upload-nn-matrix__selector-btn-add__1-syi:active, .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-main__2Gl2t .upload-nn-matrix__modal-body-main-scroll__m4s8f .upload-nn-matrix__modal-body-main-inner__2HzZE .upload-nn-matrix__selector-btn-item__zzWpL:active { background-color: #ccdaff; } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-main__2Gl2t .upload-nn-matrix__modal-body-main-scroll__m4s8f .upload-nn-matrix__modal-body-main-inner__2HzZE .upload-nn-matrix__selector-btn-add__1-syi:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-main__2Gl2t .upload-nn-matrix__modal-body-main-scroll__m4s8f .upload-nn-matrix__modal-body-main-inner__2HzZE .upload-nn-matrix__selector-btn-add__1-syi:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-main__2Gl2t .upload-nn-matrix__modal-body-main-scroll__m4s8f .upload-nn-matrix__modal-body-main-inner__2HzZE .upload-nn-matrix__selector-btn-add__1-syi .upload-nn-matrix__add-img__3UJ6j { font-size: 28px; height: auto; margin-bottom: 8px; } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-main__2Gl2t .upload-nn-matrix__modal-body-main-scroll__m4s8f .upload-nn-matrix__modal-body-main-inner__2HzZE .upload-nn-matrix__selector-btn-add__1-syi .upload-nn-matrix__add-label__1c5ks { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-main__2Gl2t .upload-nn-matrix__modal-body-main-scroll__m4s8f .upload-nn-matrix__modal-body-main-inner__2HzZE .upload-nn-matrix__selector-btn-item__zzWpL { justify-content: space-between; } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-main__2Gl2t .upload-nn-matrix__modal-body-main-scroll__m4s8f .upload-nn-matrix__modal-body-main-inner__2HzZE .upload-nn-matrix__selector-btn-item__zzWpL .upload-nn-matrix__item-img__32Nvz { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-main__2Gl2t .upload-nn-matrix__modal-body-main-scroll__m4s8f .upload-nn-matrix__modal-body-main-inner__2HzZE .upload-nn-matrix__selector-btn-item__zzWpL .upload-nn-matrix__item-img__32Nvz img { width: auto; height: 105px; } .upload-nn-matrix__modal-body__2Ywmy .upload-nn-matrix__modal-body-main__2Gl2t .upload-nn-matrix__modal-body-main-scroll__m4s8f .upload-nn-matrix__modal-body-main-inner__2HzZE .upload-nn-matrix__selector-btn-item__zzWpL .upload-nn-matrix__item-label__17TGo { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .upload-nn-matrix__modal-footer__pd0Wq { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .upload-nn-matrix__selector-btn-add__1-syi, .upload-nn-matrix__selector-btn-item__zzWpL { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .upload-nn-matrix__selector-btn-add__1-syi { background-color: var(--selector-sprite-bg_primary); } .upload-nn-matrix__selector-btn-add__1-syi:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .upload-nn-matrix__selector-btn-add__1-syi:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .upload-nn-matrix__selector-btn-add__1-syi .upload-nn-matrix__add-img__3UJ6j { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .upload-nn-matrix__selector-btn-add__1-syi .upload-nn-matrix__add-label__1c5ks { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .upload-nn-matrix__selector-btn-item__zzWpL { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .upload-nn-matrix__selector-btn-item__zzWpL .upload-nn-matrix__item-img__32Nvz { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .upload-nn-matrix__selector-btn-item__zzWpL .upload-nn-matrix__item-img__32Nvz img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .upload-nn-matrix__selector-btn-item__zzWpL .upload-nn-matrix__item-label__17TGo { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .upload-nn-matrix__selector-btn-item__zzWpL:hover { background-color: var(--selector-sprite-bg_primary); } .upload-nn-matrix__selector-btn-item__zzWpL:hover .upload-nn-matrix__item-img__32Nvz { border-color: var(--selector-sprite-bg_primary); } .upload-nn-matrix__selector-btn-item_selected__NgytG { background-color: var(--selector-sprite-bg_primary); } .upload-nn-matrix__selector-btn-item_selected__NgytG .upload-nn-matrix__item-img__32Nvz { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .upload-nn-matrix__menu-bar-btn__DEnqc { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .upload-nn-matrix__menu-bar-btn_green__3nDuX, .upload-nn-matrix__menu-bar-btn_create__2T3H7 { background-color: #3cdc8f; } .upload-nn-matrix__menu-bar-btn_green__3nDuX:hover, .upload-nn-matrix__menu-bar-btn_create__2T3H7:hover { background-color: #00d374; } .upload-nn-matrix__menu-bar-btn_green__3nDuX:active, .upload-nn-matrix__menu-bar-btn_create__2T3H7:active { background-color: #00d374; } .upload-nn-matrix__menu-bar-btn_save__319om, .upload-nn-matrix__menu-bar-btn_reset__1hcHT { background-color: #6ac8ff; } .upload-nn-matrix__menu-bar-btn_save__319om:hover, .upload-nn-matrix__menu-bar-btn_reset__1hcHT:hover { background-color: #57bcfe; } .upload-nn-matrix__menu-bar-btn_save__319om:active, .upload-nn-matrix__menu-bar-btn_reset__1hcHT:active { background-color: #4fb0fc; } .upload-nn-matrix__menu-bar-btn_submit__YLuq2, .upload-nn-matrix__menu-bar-btn_open__2w6Nx { background-color: #ff9e23; } .upload-nn-matrix__menu-bar-btn_submit__YLuq2:hover, .upload-nn-matrix__menu-bar-btn_open__2w6Nx:hover { background-color: #f47b04; } .upload-nn-matrix__menu-bar-btn_submit__YLuq2:active, .upload-nn-matrix__menu-bar-btn_open__2w6Nx:active { background-color: #fe8f22; } .upload-nn-matrix__menu-bar-btn_link__3n7-Y { background-color: #e8efff; color: var(--theme-primary); } .upload-nn-matrix__menu-bar-btn_link__3n7-Y:hover { background-color: #b6c7ff; } .upload-nn-matrix__menu-bar-btn_link__3n7-Y:active { background-color: #cfdcff; } .upload-nn-matrix__menu-bar-btn_disabled__uWRsF { color: #565266; background-color: #e6e9ed; } .upload-nn-matrix__menu-bar-btn_disabled__uWRsF:hover { cursor: not-allowed; } .upload-nn-matrix__menu-bar-btn_help__BWH2L { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .upload-nn-matrix__menu-bar-btn_help__BWH2L:hover { background-color: #8398ff; } .upload-nn-matrix__menu-bar-btn_help__BWH2L:active { background-color: #8ca3ff; } .upload-nn-matrix__menu-bar-separator__2orwX { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .upload-nn-matrix__upload-nn-matrix-drawer__YvAX8 .upload-nn-matrix__nn-matrix-item__3HDZ3 { display: flex; align-items: center; margin-bottom: 8px; } .upload-nn-matrix__upload-nn-matrix-drawer__YvAX8 .upload-nn-matrix__nn-matrix-item__3HDZ3 .upload-nn-matrix__item-btn__12uxy { display: flex; align-items: center; justify-content: center; background-color: #ffc063; color: #ffffff; padding: 4px 8px; font-size: 16px; border-radius: 4px; margin-right: 16px; } .upload-nn-matrix__upload-nn-matrix-drawer__YvAX8 .upload-nn-matrix__nn-matrix-item__3HDZ3 .upload-nn-matrix__item-icon-delete__2AXXV { color: red; font-size: 16px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .upload-nn-matrix__upload-nn-matrix-drawer__YvAX8 .upload-nn-matrix__upload-nn-matrix-input__22sIh { display: flex; align-items: center; justify-content: center; position: relative; background-color: #fffbf0; border: 1px solid #f2e7c9; } .upload-nn-matrix__upload-nn-matrix-drawer__YvAX8 .upload-nn-matrix__upload-nn-matrix-input__22sIh span { color: #7f725f; font-size: 16px; } .upload-nn-matrix__upload-nn-matrix-drawer__YvAX8 .upload-nn-matrix__upload-nn-matrix-input__22sIh input { opacity: 0; width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .mission-pass-modal__flex-center__3umBK { display: flex; align-items: center; justify-content: center; } .mission-pass-modal__full-filled__3plHu { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .mission-pass-modal__modal-mask__29o0n { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .mission-pass-modal__modal-mask__29o0n .mission-pass-modal__modal-wrap__1Y09A { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .mission-pass-modal__modal-mask__29o0n .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-header-wrap__3DTPd { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .mission-pass-modal__modal-mask__29o0n .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-header-wrap__3DTPd .mission-pass-modal__modal-header-bg__1j5Kp { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .mission-pass-modal__modal-mask__29o0n .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-header-wrap__3DTPd .mission-pass-modal__modal-header-label__YU5vm { flex-shrink: 0; font-size: 16px; font-weight: bold; } .mission-pass-modal__modal-mask__29o0n .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-header-wrap__3DTPd .mission-pass-modal__modal-header-close__3i9SM { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mission-pass-modal__modal-mask__29o0n .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-header-wrap__3DTPd .mission-pass-modal__modal-header-close__3i9SM:hover { color: #98a2b4; } .mission-pass-modal__modal-mask__29o0n .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-body-wrap__wm_WK { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .mission-pass-modal__modal-mask__29o0n .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-footer-wrap__1-vxc { flex-shrink: 0; display: flex; } .mission-pass-modal__modal-header__1pRxt { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .mission-pass-modal__modal-header__1pRxt .mission-pass-modal__modal-header-upload__3c61O { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .mission-pass-modal__modal-header__1pRxt .mission-pass-modal__modal-header-upload__3c61O:hover { background-color: #e0e9ff; } .mission-pass-modal__modal-header__1pRxt .mission-pass-modal__modal-header-upload__3c61O:active { background-color: #ccdaff; } .mission-pass-modal__modal-header__1pRxt .mission-pass-modal__modal-header-upload__3c61O .mission-pass-modal__upload-img__3FKmS { font-size: 16px; margin-right: calc(2px); } .mission-pass-modal__modal-header__1pRxt .mission-pass-modal__modal-header-upload__3c61O .mission-pass-modal__upload-label__3xVuH { font-size: 14px; } .mission-pass-modal__modal-header__1pRxt .mission-pass-modal__modal-header-upload__3c61O .mission-pass-modal__upload-input__2k-l2 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mission-pass-modal__modal-header__1pRxt .mission-pass-modal__modal-header-search__2lBL7 { position: relative; } .mission-pass-modal__modal-header__1pRxt .mission-pass-modal__modal-header-search__2lBL7 .mission-pass-modal__search-input__IrMBm { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .mission-pass-modal__modal-header__1pRxt .mission-pass-modal__modal-header-search__2lBL7 .mission-pass-modal__search-input__IrMBm::-webkit-input-placeholder { color: #98a2b4; } .mission-pass-modal__modal-header__1pRxt .mission-pass-modal__modal-header-search__2lBL7 .mission-pass-modal__search-input__IrMBm::-moz-placeholder { color: #98a2b4; } .mission-pass-modal__modal-header__1pRxt .mission-pass-modal__modal-header-search__2lBL7 .mission-pass-modal__search-input__IrMBm:-ms-input-placeholder { color: #98a2b4; } .mission-pass-modal__modal-header__1pRxt .mission-pass-modal__modal-header-search__2lBL7 .mission-pass-modal__search-input__IrMBm:hover { border-color: #d1d7e1; } .mission-pass-modal__modal-header__1pRxt .mission-pass-modal__modal-header-search__2lBL7 .mission-pass-modal__search-input__IrMBm:active { border-color: #d1d7e1; } .mission-pass-modal__modal-header__1pRxt .mission-pass-modal__modal-header-search__2lBL7 .mission-pass-modal__search-img__BDgAw { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mission-pass-modal__modal-body__3V-N5 { flex-grow: 1; display: flex; } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-left__3qYZ3, .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-main__2a1-B { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-left__3qYZ3 { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-left__3qYZ3 .mission-pass-modal__modal-body-left-scroll__KAacq { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-left__3qYZ3 .mission-pass-modal__modal-body-left-scroll__KAacq .mission-pass-modal__modal-body-left-inner__16FC_ { width: 121px; padding: calc(12px); color: #5e6b81; } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-left__3qYZ3 .mission-pass-modal__modal-body-left-scroll__KAacq .mission-pass-modal__modal-body-left-inner__16FC_ .mission-pass-modal__menu-item-current__2uGfU { color: var(--theme-primary); background-color: #e0e9ff; } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-left__3qYZ3 .mission-pass-modal__modal-body-left-scroll__KAacq .mission-pass-modal__modal-body-left-inner__16FC_ .mission-pass-modal__menu-item__dRYnO { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-left__3qYZ3 .mission-pass-modal__modal-body-left-scroll__KAacq .mission-pass-modal__modal-body-left-inner__16FC_ .mission-pass-modal__menu-item__dRYnO:hover { background-color: #edeff5; } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-left__3qYZ3 .mission-pass-modal__modal-body-left-scroll__KAacq .mission-pass-modal__modal-body-left-inner__16FC_ .mission-pass-modal__menu-item__dRYnO .mission-pass-modal__menu-item-img__pDI3J { flex-shrink: 0; width: 20px; margin-right: 8px; } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-left__3qYZ3 .mission-pass-modal__modal-body-left-scroll__KAacq .mission-pass-modal__modal-body-left-inner__16FC_ .mission-pass-modal__menu-item__dRYnO .mission-pass-modal__menu-item-label__1RehO { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-main__2a1-B { padding: calc(12px) 0; } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-main__2a1-B .mission-pass-modal__modal-body-main-scroll__1luuB { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-main__2a1-B .mission-pass-modal__modal-body-main-scroll__1luuB .mission-pass-modal__modal-body-main-inner__2B9tp { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-main__2a1-B .mission-pass-modal__modal-body-main-scroll__1luuB .mission-pass-modal__modal-body-main-inner__2B9tp .mission-pass-modal__selector-btn-add__1yjeo, .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-main__2a1-B .mission-pass-modal__modal-body-main-scroll__1luuB .mission-pass-modal__modal-body-main-inner__2B9tp .mission-pass-modal__selector-btn-item__3pwXh { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-main__2a1-B .mission-pass-modal__modal-body-main-scroll__1luuB .mission-pass-modal__modal-body-main-inner__2B9tp .mission-pass-modal__selector-btn-add__1yjeo:hover, .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-main__2a1-B .mission-pass-modal__modal-body-main-scroll__1luuB .mission-pass-modal__modal-body-main-inner__2B9tp .mission-pass-modal__selector-btn-item__3pwXh:hover { background-color: #e0e9ff; } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-main__2a1-B .mission-pass-modal__modal-body-main-scroll__1luuB .mission-pass-modal__modal-body-main-inner__2B9tp .mission-pass-modal__selector-btn-add__1yjeo:active, .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-main__2a1-B .mission-pass-modal__modal-body-main-scroll__1luuB .mission-pass-modal__modal-body-main-inner__2B9tp .mission-pass-modal__selector-btn-item__3pwXh:active { background-color: #ccdaff; } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-main__2a1-B .mission-pass-modal__modal-body-main-scroll__1luuB .mission-pass-modal__modal-body-main-inner__2B9tp .mission-pass-modal__selector-btn-add__1yjeo:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-main__2a1-B .mission-pass-modal__modal-body-main-scroll__1luuB .mission-pass-modal__modal-body-main-inner__2B9tp .mission-pass-modal__selector-btn-add__1yjeo:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-main__2a1-B .mission-pass-modal__modal-body-main-scroll__1luuB .mission-pass-modal__modal-body-main-inner__2B9tp .mission-pass-modal__selector-btn-add__1yjeo .mission-pass-modal__add-img__LgIWZ { font-size: 28px; height: auto; margin-bottom: 8px; } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-main__2a1-B .mission-pass-modal__modal-body-main-scroll__1luuB .mission-pass-modal__modal-body-main-inner__2B9tp .mission-pass-modal__selector-btn-add__1yjeo .mission-pass-modal__add-label__emIIE { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-main__2a1-B .mission-pass-modal__modal-body-main-scroll__1luuB .mission-pass-modal__modal-body-main-inner__2B9tp .mission-pass-modal__selector-btn-item__3pwXh { justify-content: space-between; } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-main__2a1-B .mission-pass-modal__modal-body-main-scroll__1luuB .mission-pass-modal__modal-body-main-inner__2B9tp .mission-pass-modal__selector-btn-item__3pwXh .mission-pass-modal__item-img__2XZRR { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-main__2a1-B .mission-pass-modal__modal-body-main-scroll__1luuB .mission-pass-modal__modal-body-main-inner__2B9tp .mission-pass-modal__selector-btn-item__3pwXh .mission-pass-modal__item-img__2XZRR img { width: auto; height: 105px; } .mission-pass-modal__modal-body__3V-N5 .mission-pass-modal__modal-body-main__2a1-B .mission-pass-modal__modal-body-main-scroll__1luuB .mission-pass-modal__modal-body-main-inner__2B9tp .mission-pass-modal__selector-btn-item__3pwXh .mission-pass-modal__item-label__1UCL6 { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .mission-pass-modal__modal-footer__1UgkC { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .mission-pass-modal__selector-btn-add__1yjeo, .mission-pass-modal__selector-btn-item__3pwXh { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .mission-pass-modal__selector-btn-add__1yjeo { background-color: var(--selector-sprite-bg_primary); } .mission-pass-modal__selector-btn-add__1yjeo:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .mission-pass-modal__selector-btn-add__1yjeo:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .mission-pass-modal__selector-btn-add__1yjeo .mission-pass-modal__add-img__LgIWZ { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .mission-pass-modal__selector-btn-add__1yjeo .mission-pass-modal__add-label__emIIE { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .mission-pass-modal__selector-btn-item__3pwXh { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .mission-pass-modal__selector-btn-item__3pwXh .mission-pass-modal__item-img__2XZRR { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .mission-pass-modal__selector-btn-item__3pwXh .mission-pass-modal__item-img__2XZRR img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .mission-pass-modal__selector-btn-item__3pwXh .mission-pass-modal__item-label__1UCL6 { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .mission-pass-modal__selector-btn-item__3pwXh:hover { background-color: var(--selector-sprite-bg_primary); } .mission-pass-modal__selector-btn-item__3pwXh:hover .mission-pass-modal__item-img__2XZRR { border-color: var(--selector-sprite-bg_primary); } .mission-pass-modal__selector-btn-item_selected__ozTlI { background-color: var(--selector-sprite-bg_primary); } .mission-pass-modal__selector-btn-item_selected__ozTlI .mission-pass-modal__item-img__2XZRR { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .mission-pass-modal__menu-bar-btn__3h8GX { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .mission-pass-modal__menu-bar-btn_green__326DR, .mission-pass-modal__menu-bar-btn_create__2CYby { background-color: #3cdc8f; } .mission-pass-modal__menu-bar-btn_green__326DR:hover, .mission-pass-modal__menu-bar-btn_create__2CYby:hover { background-color: #00d374; } .mission-pass-modal__menu-bar-btn_green__326DR:active, .mission-pass-modal__menu-bar-btn_create__2CYby:active { background-color: #00d374; } .mission-pass-modal__menu-bar-btn_save__2ri-8, .mission-pass-modal__menu-bar-btn_reset__1uRYY { background-color: #6ac8ff; } .mission-pass-modal__menu-bar-btn_save__2ri-8:hover, .mission-pass-modal__menu-bar-btn_reset__1uRYY:hover { background-color: #57bcfe; } .mission-pass-modal__menu-bar-btn_save__2ri-8:active, .mission-pass-modal__menu-bar-btn_reset__1uRYY:active { background-color: #4fb0fc; } .mission-pass-modal__menu-bar-btn_submit__1vVm_, .mission-pass-modal__menu-bar-btn_open__2Xxfy { background-color: #ff9e23; } .mission-pass-modal__menu-bar-btn_submit__1vVm_:hover, .mission-pass-modal__menu-bar-btn_open__2Xxfy:hover { background-color: #f47b04; } .mission-pass-modal__menu-bar-btn_submit__1vVm_:active, .mission-pass-modal__menu-bar-btn_open__2Xxfy:active { background-color: #fe8f22; } .mission-pass-modal__menu-bar-btn_link__3Tu1g { background-color: #e8efff; color: var(--theme-primary); } .mission-pass-modal__menu-bar-btn_link__3Tu1g:hover { background-color: #b6c7ff; } .mission-pass-modal__menu-bar-btn_link__3Tu1g:active { background-color: #cfdcff; } .mission-pass-modal__menu-bar-btn_disabled__HhxwC { color: #565266; background-color: #e6e9ed; } .mission-pass-modal__menu-bar-btn_disabled__HhxwC:hover { cursor: not-allowed; } .mission-pass-modal__menu-bar-btn_help__1gk4y { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .mission-pass-modal__menu-bar-btn_help__1gk4y:hover { background-color: #8398ff; } .mission-pass-modal__menu-bar-btn_help__1gk4y:active { background-color: #8ca3ff; } .mission-pass-modal__menu-bar-separator__1McdP { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .mission-pass-modal__mission-pass-success__Mf9uQ.mission-pass-modal__mask__1Je8K { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .mission-pass-modal__mission-pass-success__Mf9uQ.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .mission-pass-modal__mission-pass-success__Mf9uQ.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-header-wrap__3DTPd { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .mission-pass-modal__mission-pass-success__Mf9uQ.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-header-wrap__3DTPd .mission-pass-modal__modal-header-bg__1j5Kp { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .mission-pass-modal__mission-pass-success__Mf9uQ.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-header-wrap__3DTPd .mission-pass-modal__modal-header-label__YU5vm { flex-shrink: 0; font-size: 16px; font-weight: bold; } .mission-pass-modal__mission-pass-success__Mf9uQ.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-header-wrap__3DTPd .mission-pass-modal__modal-header-close__3i9SM { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mission-pass-modal__mission-pass-success__Mf9uQ.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-header-wrap__3DTPd .mission-pass-modal__modal-header-close__3i9SM:hover { color: #98a2b4; } .mission-pass-modal__mission-pass-success__Mf9uQ.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-body-wrap__wm_WK { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .mission-pass-modal__mission-pass-success__Mf9uQ.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-footer-wrap__1-vxc { flex-shrink: 0; display: flex; } .mission-pass-modal__mission-pass-success__Mf9uQ .mission-pass-modal__container__pGW4x { width: 376px; height: 375px; position: relative; } .mission-pass-modal__mission-pass-success__Mf9uQ .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O { width: 376px; height: 90px; position: absolute; left: 0; bottom: 60px; display: flex; flex-direction: column; align-items: center; justify-content: space-between; } .mission-pass-modal__mission-pass-success__Mf9uQ .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__info__It8RR { font-weight: 600; font-size: 20px; color: #5e6b81; } .mission-pass-modal__mission-pass-success__Mf9uQ .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__btn__2lctv { width: 100px; height: 36px; display: flex; flex-direction: column; align-items: center; justify-content: center; background: #fed326; border-radius: 41px; font-weight: 600; font-size: 14px; color: #9b4405; } .mission-pass-modal__mission-pass-success__Mf9uQ .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__btn__2lctv:hover { background-color: #ffbd23; } .mission-pass-modal__mission-pass-success__Mf9uQ .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__btn__2lctv:active { background-color: #ffa723; } .mission-pass-modal__mission-pass-success__Mf9uQ .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__btn__2lctv.mission-pass-modal__btn-disabled__3CKlv { background: #fee78a; color: #ffffff; cursor: not-allowed; } .mission-pass-modal__mission-pass-success__Mf9uQ .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__btn__2lctv.mission-pass-modal__btn-disabled__3CKlv:hover { background: #fee78a; } .mission-pass-modal__mission-pass-fail__2jc6R.mission-pass-modal__mask__1Je8K { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .mission-pass-modal__mission-pass-fail__2jc6R.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .mission-pass-modal__mission-pass-fail__2jc6R.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-header-wrap__3DTPd { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .mission-pass-modal__mission-pass-fail__2jc6R.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-header-wrap__3DTPd .mission-pass-modal__modal-header-bg__1j5Kp { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .mission-pass-modal__mission-pass-fail__2jc6R.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-header-wrap__3DTPd .mission-pass-modal__modal-header-label__YU5vm { flex-shrink: 0; font-size: 16px; font-weight: bold; } .mission-pass-modal__mission-pass-fail__2jc6R.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-header-wrap__3DTPd .mission-pass-modal__modal-header-close__3i9SM { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mission-pass-modal__mission-pass-fail__2jc6R.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-header-wrap__3DTPd .mission-pass-modal__modal-header-close__3i9SM:hover { color: #98a2b4; } .mission-pass-modal__mission-pass-fail__2jc6R.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-body-wrap__wm_WK { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .mission-pass-modal__mission-pass-fail__2jc6R.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-footer-wrap__1-vxc { flex-shrink: 0; display: flex; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x { width: 587px; min-height: 200px; position: relative; background-color: #ffffff; border: 9px solid #b6b7bc; border-radius: 38px; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__header__QKH4x { width: 300px; position: absolute; top: -115px; left: 50%; transform: translateX(-50%); } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O { width: 569px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 60px 0 24px 0; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__info__It8RR { width: 511px; padding: 16px; display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 4px; background: rgba(255, 221, 217, 0.8); } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__info__It8RR .mission-pass-modal__info-title__21c2B { display: flex; flex-direction: row; align-items: center; font-weight: 400; font-size: 14px; color: #ff4949; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__info__It8RR .mission-pass-modal__info-title__21c2B .mission-pass-modal__icon__3evPt { margin-right: 8px; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__info__It8RR .mission-pass-modal__info-first__39csG { margin-top: 4px; font-weight: 600; font-size: 16px; color: #ff4949; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__info__It8RR .mission-pass-modal__info-error-code__3j9nQ { margin-top: 4px; font-size: 12px; color: rgba(94, 107, 129, 0.5); } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__info__It8RR .mission-pass-modal__info-error-code__3j9nQ span { display: inline-block; margin-left: 8px; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__blank__1PwHp { width: 100%; height: 24px; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__error-prone-info__3gV2K { width: 511px; display: flex; flex-direction: column; align-items: center; justify-content: center; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__error-prone-info__3gV2K .mission-pass-modal__info-title__21c2B { width: 511px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 16px 0; border-radius: 4px; font-weight: 400; font-size: 14px; background: rgba(255, 221, 217, 0.8); } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__error-prone-info__3gV2K .mission-pass-modal__info-title__21c2B .mission-pass-modal__icon__3evPt { margin-right: 8px; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__error-prone-info__3gV2K .mission-pass-modal__info-title__21c2B .mission-pass-modal__info-title-tip__wKh5z { color: #ff4949; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__error-prone-info__3gV2K .mission-pass-modal__info-title__21c2B .mission-pass-modal__info-error-code__3j9nQ { margin-top: 4px; font-size: 12px; color: rgba(94, 107, 129, 0.5); } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__error-prone-info__3gV2K .mission-pass-modal__info-title__21c2B .mission-pass-modal__info-error-code__3j9nQ span { display: inline-block; margin-left: 8px; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__error-prone-info__3gV2K .mission-pass-modal__info-error__ctv_6 { width: 511px; display: flex; flex-direction: row; align-items: center; justify-content: start; margin: 22px 0 16px; font-weight: 600; font-size: 16px; line-height: 16px; letter-spacing: 0px; color: #5e6b81; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__error-prone-info__3gV2K .mission-pass-modal__info-error__ctv_6 .mission-pass-modal__icon__3evPt { font-size: 14px; margin-right: 5px; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__error-prone-info__3gV2K .mission-pass-modal__info-content__3_o9q { width: 100%; display: flex; flex-direction: row; align-items: center; justify-content: space-between; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__error-prone-info__3gV2K .mission-pass-modal__info-content__3_o9q .mission-pass-modal__info-list__3vOG- { flex: 1; height: 134px; padding: 12px 4px 12px 12px; border-radius: 4px; background: rgba(233, 236, 245, 0.8); color: #5e6b81; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__error-prone-info__3gV2K .mission-pass-modal__info-content__3_o9q .mission-pass-modal__info-list__3vOG- .mission-pass-modal__info-list-content__329w- { width: 100%; height: 100%; visibility: visible; white-space: pre-wrap; overflow-x: hidden; overflow-y: auto; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__error-prone-info__3gV2K .mission-pass-modal__info-content__3_o9q .mission-pass-modal__info-list__3vOG- .mission-pass-modal__info-list-content__329w-::-webkit-scrollbar { width: 4px; border-radius: 110px; color: #d2d5dd; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__error-prone-info__3gV2K .mission-pass-modal__info-content__3_o9q .mission-pass-modal__blank__1PwHp { width: 26px; height: 100%; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__info-wx__2aXZm { width: 112px; height: 134px; display: flex; flex-direction: column; align-items: center; justify-content: scpace-between; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__info-wx__2aXZm .mission-pass-modal__wx-qrcode__Fsfor { width: 112px; height: 112px; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__info-wx__2aXZm .mission-pass-modal__wx-qrcode__Fsfor img { width: 100%; height: 100%; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__info-wx__2aXZm .mission-pass-modal__wx-title__2DLfV { width: 100%; font-family: 'PingFang SC'; font-style: normal; font-weight: 400; font-size: 14px; letter-spacing: 0px; color: #3d4554; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__btn__2lctv { width: 100px; height: 36px; display: flex; flex-direction: column; align-items: center; justify-content: center; margin-top: 24px; background: #6a7fff; border-radius: 41px; font-weight: 600; font-size: 14px; color: #ffffff; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__btn__2lctv:hover { background-color: #4250d3; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__btn__2lctv:active { background-color: #222ba6; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__btn__2lctv.mission-pass-modal__btn-disabled__3CKlv { background: #b4bfff; color: #ffffff; cursor: not-allowed; } .mission-pass-modal__mission-pass-fail__2jc6R .mission-pass-modal__container__pGW4x .mission-pass-modal__content__1Bc7O .mission-pass-modal__btn__2lctv.mission-pass-modal__btn-disabled__3CKlv:hover { background: #b4bfff; } .mission-pass-modal__mission-unlock__2aqXX.mission-pass-modal__mask__1Je8K { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .mission-pass-modal__mission-unlock__2aqXX.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .mission-pass-modal__mission-unlock__2aqXX.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-header-wrap__3DTPd { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .mission-pass-modal__mission-unlock__2aqXX.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-header-wrap__3DTPd .mission-pass-modal__modal-header-bg__1j5Kp { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .mission-pass-modal__mission-unlock__2aqXX.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-header-wrap__3DTPd .mission-pass-modal__modal-header-label__YU5vm { flex-shrink: 0; font-size: 16px; font-weight: bold; } .mission-pass-modal__mission-unlock__2aqXX.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-header-wrap__3DTPd .mission-pass-modal__modal-header-close__3i9SM { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .mission-pass-modal__mission-unlock__2aqXX.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-header-wrap__3DTPd .mission-pass-modal__modal-header-close__3i9SM:hover { color: #98a2b4; } .mission-pass-modal__mission-unlock__2aqXX.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-body-wrap__wm_WK { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .mission-pass-modal__mission-unlock__2aqXX.mission-pass-modal__mask__1Je8K .mission-pass-modal__modal-wrap__1Y09A .mission-pass-modal__modal-footer-wrap__1-vxc { flex-shrink: 0; display: flex; } .mission-pass-modal__mission-unlock__2aqXX .mission-pass-modal__mission-unlock-img__1YCaj { width: 500px; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .exercise-analysis-modal__exercise-analysis-modal__15JtP { position: fixed; top: 110px; right: 20px; z-index: 1040; cursor: url(static/cursor/cursor-grab.cur) 10 10, grab; border-radius: 12px; } .exercise-analysis-modal__exercise-analysis-modal__15JtP.exercise-analysis-modal__exercise-analysis-modal_dragging__1FzLM { cursor: url(static/cursor/cursor-grabbing.cur) 10 10, grabbing; } .exercise-analysis-modal__analysis-main__22IWO { position: relative; display: flex; flex-flow: column; width: 383px; background-color: #fff; border: 1px solid #e8efff; box-shadow: 0px 4px 4px rgba(176, 185, 222, 0.84), inset 0px -1px 4px rgba(255, 255, 255, 0.7), inset 0px -1px 5px #b4bae4; border-radius: 12px; } .exercise-analysis-modal__analysis-main__22IWO.exercise-analysis-modal__analysis-main_big__2Pjh4 { width: 577px; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-header__MxZbH { display: flex; justify-content: space-between; align-items: center; width: 100%; height: 42px; padding: 0 12px; border-bottom: 1px solid #e8efff; background: rgba(221, 224, 243, 0.4); position: relative; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-header__MxZbH .exercise-analysis-modal__analysis-header-titles__21IP3 { flex: 1; height: 100%; display: flex; justify-content: center; align-items: center; font-size: 14px; font-weight: bold; color: #6c7a92; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-header__MxZbH .exercise-analysis-modal__analysis-header-titles__21IP3 .exercise-analysis-modal__analysis-header-title__2FpkJ { justify-content: center; height: 100%; display: flex; align-items: center; position: relative; cursor: url(static/cursor/cursor-pointer.cur), pointer; overflow: hidden; font-weight: 400; color: var(--theme-primary); } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-header__MxZbH .exercise-analysis-modal__analysis-header-titles__21IP3 .exercise-analysis-modal__analysis-header-title__2FpkJ .exercise-analysis-modal__analysis-header-icon__2RZW7 { width: 18px; height: 16px; margin-right: 5px; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-header__MxZbH .exercise-analysis-modal__analysis-header-titles__21IP3 .exercise-analysis-modal__analysis-header-title__2FpkJ.exercise-analysis-modal__is-active__14X50 { font-weight: 600; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-header__MxZbH .exercise-analysis-modal__analysis-header-titles__21IP3 .exercise-analysis-modal__analysis-header-title__2FpkJ.exercise-analysis-modal__is-active__14X50 .exercise-analysis-modal__active-strip__2Vp7r { width: 100%; height: 3px; position: absolute; bottom: 0; background: var(--theme-primary); border-radius: 14px 14px 0 0; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-header__MxZbH .exercise-analysis-modal__analysis-header-right__21Qgv { position: absolute; right: 12px; top: 0; width: 16px; height: 100%; display: flex; justify-content: space-between; align-items: center; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-header__MxZbH .exercise-analysis-modal__analysis-header-right__21Qgv .exercise-analysis-modal__analysis-header-mode__23LZ8 { margin-right: 10px; font-size: 16px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-header__MxZbH .exercise-analysis-modal__analysis-header-right__21Qgv .exercise-analysis-modal__analysis-header-mode__23LZ8:hover { color: #98a2b4; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-header__MxZbH .exercise-analysis-modal__analysis-header-right__21Qgv .exercise-analysis-modal__analysis-header-close__3mlhR { font-size: 16px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-header__MxZbH .exercise-analysis-modal__analysis-header-right__21Qgv .exercise-analysis-modal__analysis-header-close__3mlhR:hover { color: #98a2b4; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d { height: 100%; flex: 1; background-color: #fff; border-radius: 12px; overflow: hidden; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-imgWrap-wrap__14aub { width: 100%; height: 100%; padding: 12px 12px 32px 12px; border-radius: 4px; overflow-y: auto; position: relative; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-imgWrap-wrap__14aub img { width: 100%; height: auto; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-imgWrap-wrap__14aub .exercise-analysis-modal__analysis-main-video-click__1q_Fz { position: absolute; right: 21px; top: 22px; width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; border-radius: 100%; background: rgba(1, 1, 1, 0.2); border: 2px solid rgba(255, 255, 255, 0.4); box-shadow: 0px 4.47059px 13.4118px rgba(71, 78, 122, 0.06); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-imgWrap-wrap__14aub .exercise-analysis-modal__analysis-main-video-click__1q_Fz .exercise-analysis-modal__icon__2WNNZ { font-size: 28px; color: #ffffff; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-imgWrap-wrap__14aub .exercise-analysis-modal__analysis-main-video-click__1q_Fz:hover { transform: scale(1.11); } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-video-wrap__18YWr { width: 100%; display: flex; justify-content: center; padding: none; padding: 12px 12px 32px 12px; position: relative; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-video-wrap__18YWr .exercise-analysis-modal__analysis-main-video-icon__1w0M8 { position: absolute; right: 21px; top: 22px; width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; background: rgba(1, 1, 1, 0.2); border: 2px solid rgba(255, 255, 255, 0.4); box-shadow: 0px 4.47059px 13.4118px rgba(71, 78, 122, 0.06); border-radius: 100%; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-video-wrap__18YWr .exercise-analysis-modal__analysis-main-video-icon__1w0M8 .exercise-analysis-modal__analysis-main-video-icon-pic__1Te-W { width: 28px; height: 28px; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-video-wrap__18YWr .exercise-analysis-modal__analysis-main-video-icon__1w0M8:hover { transform: scale(1.11); } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-video-wrap__18YWr .exercise-analysis-modal__analysis-main-video__8J5cs { width: 550px; height: 309px; border-radius: 4px; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-video-wrap__18YWr .exercise-analysis-modal__analysis-main-video__8J5cs video { width: 100%; height: 100%; border-radius: 6px; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c { width: 100%; display: flex; justify-content: center; padding: none; padding: 12px 12px 32px 12px; position: relative; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__analysis-main-info__1roX4 { height: 29px; display: flex; flex-direction: row; position: absolute; left: 20px; top: 20px; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__analysis-main-info__1roX4 .exercise-analysis-modal__btn__3WMjK { width: 18px; height: 29px; border-radius: 100%; display: flex; align-items: center; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__analysis-main-info__1roX4 .exercise-analysis-modal__btn__3WMjK.exercise-analysis-modal__prev__P5781 { cursor: url(static/cursor/cursor-pointer.cur), pointer; justify-content: start; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__analysis-main-info__1roX4 .exercise-analysis-modal__btn__3WMjK.exercise-analysis-modal__next__3ws3q { cursor: url(static/cursor/cursor-pointer.cur), pointer; justify-content: end; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__analysis-main-info__1roX4 .exercise-analysis-modal__btn__3WMjK.exercise-analysis-modal__is-disabled__2T0_Z { cursor: url(static/cursor/cursor-not-allowed_white.cur), not-allowed; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__analysis-main-info__1roX4 .exercise-analysis-modal__btn__3WMjK.exercise-analysis-modal__is-disabled__2T0_Z .exercise-analysis-modal__icon__2WNNZ { color: rgba(0, 0, 0, 0.2); } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__analysis-main-info__1roX4 .exercise-analysis-modal__btn__3WMjK.exercise-analysis-modal__is-disabled__2T0_Z:hover { transform: none; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__analysis-main-info__1roX4 .exercise-analysis-modal__btn__3WMjK .exercise-analysis-modal__icon__2WNNZ { font-size: 24px; color: rgba(0, 0, 0, 0.4); } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__analysis-main-info__1roX4 .exercise-analysis-modal__btn__3WMjK:hover { transform: scale(1.11); } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__analysis-main-info__1roX4 .exercise-analysis-modal__num__rlZuU { width: 71px; height: 29px; margin: 0 10px; display: flex; justify-content: center; align-items: center; background: rgba(0, 0, 0, 0.4); border-radius: 22px; font-weight: 600; font-size: 15px; color: #ffffff; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__replay__1CmBT { position: absolute; right: 20px; top: 20px; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__replay__1CmBT .exercise-analysis-modal__replay-button__1MCjC { width: 96px; height: 29px; border-radius: 22px; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, 0.4); font-weight: 600; font-size: 15px; color: #ffffff; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__replay__1CmBT .exercise-analysis-modal__replay-button__1MCjC .exercise-analysis-modal__icon__2WNNZ { margin-right: 2px; font-size: 18px; color: #ffffff; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__replay__1CmBT .exercise-analysis-modal__replay-button__1MCjC .exercise-analysis-modal__main__1EOXx { font-weight: 600; font-size: 15px; color: #ffffff; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__replay__1CmBT .exercise-analysis-modal__replay-button__1MCjC:hover { transform: scale(1.11); } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__auto-btns__1CKxO { position: absolute; bottom: 60px; display: flex; flex-direction: row; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__auto-btns__1CKxO .exercise-analysis-modal__btn__3WMjK { width: 48px; height: 48px; border-radius: 100%; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, 0.4); font-weight: 600; font-size: 15px; color: #ffffff; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__auto-btns__1CKxO .exercise-analysis-modal__btn__3WMjK.exercise-analysis-modal__play__1Mb8F { background: #6a7fff; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__auto-btns__1CKxO .exercise-analysis-modal__btn__3WMjK.exercise-analysis-modal__play__1Mb8F.exercise-analysis-modal__is-play__2nyB2 { background: rgba(106, 127, 255, 0.4); } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__auto-btns__1CKxO .exercise-analysis-modal__btn__3WMjK .exercise-analysis-modal__icon__2WNNZ { font-size: 24px; color: #ffffff; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__auto-btns__1CKxO .exercise-analysis-modal__btn__3WMjK:hover { transform: scale(1.11); } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__analysis-main-video__8J5cs { width: 550px; height: 309px; border-radius: 4px; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-assemble-wrap__1jO3c .exercise-analysis-modal__analysis-main-video__8J5cs video { width: 100%; height: 100%; border-radius: 6px; } .exercise-analysis-modal__analysis-main__22IWO .exercise-analysis-modal__analysis-main-content__tsl5d .exercise-analysis-modal__analysis-main-img__1hhIZ { width: 575px; object-fit: contain; border-radius: 6px; } .exercise-analysis-modal__analysis-switch__2U7Uk { position: absolute; top: 50%; transform: translateY(-50%); display: flex; justify-content: center; align-items: center; width: 32px; height: 32px; background-color: #fff; border: 1px solid #edeff5; box-shadow: 0px 2px 6px rgba(71, 78, 122, 0.06); border-radius: 50%; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .exercise-analysis-modal__analysis-switch__2U7Uk svg { font-size: 16px; color: #6c7a92; } .exercise-analysis-modal__analysis-switch__2U7Uk:hover { transform: translateY(-50%) scale(1.125); transition: all 0.25s ease; } .exercise-analysis-modal__analysis-switch__2U7Uk.exercise-analysis-modal__analysis-switch-left__n5QM5 { left: -14px; } .exercise-analysis-modal__analysis-switch__2U7Uk.exercise-analysis-modal__analysis-switch-left__n5QM5 svg { transform: translateX(-2px); } .exercise-analysis-modal__analysis-switch__2U7Uk.exercise-analysis-modal__analysis-switch-right__1x7Hn { right: -14px; } .exercise-analysis-modal__analysis-switch__2U7Uk.exercise-analysis-modal__analysis-switch-right__1x7Hn svg { transform: translateX(2px); } .exercise-analysis-modal__analysis-pagination__2Xtsq { position: absolute; left: 50%; bottom: 48px; transform: translateX(-50%); display: flex; justify-content: center; align-items: center; } .exercise-analysis-modal__analysis-pagination__2Xtsq .exercise-analysis-modal__analysis-pagination-item__1oM6D { width: 6px; height: 6px; margin-right: 3px; background-color: #e3e3e3; border-radius: 3px; } .exercise-analysis-modal__analysis-pagination__2Xtsq .exercise-analysis-modal__analysis-pagination-item__1oM6D:last-child { margin-right: 0; } .exercise-analysis-modal__analysis-pagination__2Xtsq .exercise-analysis-modal__analysis-pagination-item__1oM6D.exercise-analysis-modal__analysis-pagination-item-active__jpFK_ { width: 15px; background-color: var(--theme-primary); } .exercise-analysis-modal__analysis-pagination__2Xtsq.exercise-analysis-modal__analysis-pagination-bottom__3uzC7 { bottom: 8px; } .exercise-analysis-modal__codeCheckBtn__2-6jY { width: 90px; height: 24px; margin-left: 12px; } .exercise-analysis-modal__codeCheckBtn__2-6jY button { height: 100%; width: 90px; position: relative; border-radius: 21px; display: flex; justify-content: flex-start; align-items: center; color: #5e6b81; padding: 0 8px 0 3.5px; background-color: #e3e4f4; } .exercise-analysis-modal__codeCheckBtn__2-6jY button.exercise-analysis-modal__bg__3DQlr { background: rgba(106, 127, 255, 0.2); } .exercise-analysis-modal__codeCheckBtn__2-6jY button .exercise-analysis-modal__icon__2WNNZ { font-size: 20px; color: #828da3; margin-right: 3px; } .exercise-analysis-modal__codeCheckBtn__2-6jY button span { font-family: PingFang SC; font-style: normal; font-weight: normal; font-size: 14px; line-height: 14px; color: inherit; white-space: nowrap; } .exercise-analysis-modal__codeCheckBtn__2-6jY .exercise-analysis-modal__tooltip__vvRa0 { height: 76px; width: 124px; background: #ffffff; box-shadow: 0px 4px 8px rgba(176, 185, 222, 0.13); border-radius: 8px; position: absolute; top: 32px; left: calc(50% + 20px); transform: translate(-50%, -10px); padding: 12px 20px; display: flex; flex-direction: column; justify-content: space-between; align-items: center; transition: transform 0.3s, opacity 0.3s; opacity: 0; pointer-events: none; } .exercise-analysis-modal__codeCheckBtn__2-6jY .exercise-analysis-modal__tooltip__vvRa0 span { font-family: PingFang SC; font-style: normal; font-weight: normal; font-size: 14px; line-height: 22px; color: #5e6b81; } .exercise-analysis-modal__codeCheckBtn__2-6jY .exercise-analysis-modal__tooltip__vvRa0 h4 { margin: 0; padding: 0; font-family: PingFang SC; font-style: normal; font-weight: 600; font-size: 16px; line-height: 24px; color: #6a7fff; } .exercise-analysis-modal__codeCheckBtn__2-6jY:hover button { color: var(--theme-primary); } .exercise-analysis-modal__codeCheckBtn__2-6jY:hover button .exercise-analysis-modal__icon__2WNNZ { color: var(--theme-primary); } .exercise-analysis-modal__codeCheckBtn__2-6jY:hover .exercise-analysis-modal__tooltip__vvRa0.exercise-analysis-modal__open__RElTO { transform: translate(-50%, 0); opacity: 1; } .exercise-analysis-modal__codeCheckBtn__2-6jY.exercise-analysis-modal__exercise__3jzkE .exercise-analysis-modal__icon__2WNNZ { color: #6a7fff; } .exercise-analysis-modal__codeCheckBtn__2-6jY.exercise-analysis-modal__exercise__3jzkE:active button { background: rgba(106, 127, 255, 0.3); } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .workspace-controls__flex-center__1ZgSg { display: flex; align-items: center; justify-content: center; } .workspace-controls__full-filled__1N22V { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .workspace-controls__modal-mask__XYTQU { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .workspace-controls__modal-mask__XYTQU .workspace-controls__modal-wrap__CzTgU { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .workspace-controls__modal-mask__XYTQU .workspace-controls__modal-wrap__CzTgU .workspace-controls__modal-header-wrap__1RJAE { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .workspace-controls__modal-mask__XYTQU .workspace-controls__modal-wrap__CzTgU .workspace-controls__modal-header-wrap__1RJAE .workspace-controls__modal-header-bg__qnKYI { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .workspace-controls__modal-mask__XYTQU .workspace-controls__modal-wrap__CzTgU .workspace-controls__modal-header-wrap__1RJAE .workspace-controls__modal-header-label__17mlI { flex-shrink: 0; font-size: 16px; font-weight: bold; } .workspace-controls__modal-mask__XYTQU .workspace-controls__modal-wrap__CzTgU .workspace-controls__modal-header-wrap__1RJAE .workspace-controls__modal-header-close__2bkIu { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .workspace-controls__modal-mask__XYTQU .workspace-controls__modal-wrap__CzTgU .workspace-controls__modal-header-wrap__1RJAE .workspace-controls__modal-header-close__2bkIu:hover { color: #98a2b4; } .workspace-controls__modal-mask__XYTQU .workspace-controls__modal-wrap__CzTgU .workspace-controls__modal-body-wrap__3rqgU { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .workspace-controls__modal-mask__XYTQU .workspace-controls__modal-wrap__CzTgU .workspace-controls__modal-footer-wrap__2swzP { flex-shrink: 0; display: flex; } .workspace-controls__modal-header__3QqaO { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .workspace-controls__modal-header__3QqaO .workspace-controls__modal-header-upload__zY6up { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .workspace-controls__modal-header__3QqaO .workspace-controls__modal-header-upload__zY6up:hover { background-color: #e0e9ff; } .workspace-controls__modal-header__3QqaO .workspace-controls__modal-header-upload__zY6up:active { background-color: #ccdaff; } .workspace-controls__modal-header__3QqaO .workspace-controls__modal-header-upload__zY6up .workspace-controls__upload-img__2gk9o { font-size: 16px; margin-right: calc(2px); } .workspace-controls__modal-header__3QqaO .workspace-controls__modal-header-upload__zY6up .workspace-controls__upload-label__176hP { font-size: 14px; } .workspace-controls__modal-header__3QqaO .workspace-controls__modal-header-upload__zY6up .workspace-controls__upload-input__3wNjZ { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .workspace-controls__modal-header__3QqaO .workspace-controls__modal-header-search__3aWjl { position: relative; } .workspace-controls__modal-header__3QqaO .workspace-controls__modal-header-search__3aWjl .workspace-controls__search-input__2o5w1 { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .workspace-controls__modal-header__3QqaO .workspace-controls__modal-header-search__3aWjl .workspace-controls__search-input__2o5w1::-webkit-input-placeholder { color: #98a2b4; } .workspace-controls__modal-header__3QqaO .workspace-controls__modal-header-search__3aWjl .workspace-controls__search-input__2o5w1::-moz-placeholder { color: #98a2b4; } .workspace-controls__modal-header__3QqaO .workspace-controls__modal-header-search__3aWjl .workspace-controls__search-input__2o5w1:-ms-input-placeholder { color: #98a2b4; } .workspace-controls__modal-header__3QqaO .workspace-controls__modal-header-search__3aWjl .workspace-controls__search-input__2o5w1:hover { border-color: #d1d7e1; } .workspace-controls__modal-header__3QqaO .workspace-controls__modal-header-search__3aWjl .workspace-controls__search-input__2o5w1:active { border-color: #d1d7e1; } .workspace-controls__modal-header__3QqaO .workspace-controls__modal-header-search__3aWjl .workspace-controls__search-img__2yqbW { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .workspace-controls__modal-body__2v5hP { flex-grow: 1; display: flex; } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-left__211tA, .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-main__1SYoJ { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-left__211tA { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-left__211tA .workspace-controls__modal-body-left-scroll__25tHH { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-left__211tA .workspace-controls__modal-body-left-scroll__25tHH .workspace-controls__modal-body-left-inner__1aE-I { width: 121px; padding: calc(12px); color: #5e6b81; } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-left__211tA .workspace-controls__modal-body-left-scroll__25tHH .workspace-controls__modal-body-left-inner__1aE-I .workspace-controls__menu-item-current__2HSXt { color: var(--theme-primary); background-color: #e0e9ff; } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-left__211tA .workspace-controls__modal-body-left-scroll__25tHH .workspace-controls__modal-body-left-inner__1aE-I .workspace-controls__menu-item__3eRmu { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-left__211tA .workspace-controls__modal-body-left-scroll__25tHH .workspace-controls__modal-body-left-inner__1aE-I .workspace-controls__menu-item__3eRmu:hover { background-color: #edeff5; } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-left__211tA .workspace-controls__modal-body-left-scroll__25tHH .workspace-controls__modal-body-left-inner__1aE-I .workspace-controls__menu-item__3eRmu .workspace-controls__menu-item-img__3bGRF { flex-shrink: 0; width: 20px; margin-right: 8px; } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-left__211tA .workspace-controls__modal-body-left-scroll__25tHH .workspace-controls__modal-body-left-inner__1aE-I .workspace-controls__menu-item__3eRmu .workspace-controls__menu-item-label__2h_2B { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-main__1SYoJ { padding: calc(12px) 0; } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-main__1SYoJ .workspace-controls__modal-body-main-scroll__25uJ5 { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-main__1SYoJ .workspace-controls__modal-body-main-scroll__25uJ5 .workspace-controls__modal-body-main-inner__26utx { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-main__1SYoJ .workspace-controls__modal-body-main-scroll__25uJ5 .workspace-controls__modal-body-main-inner__26utx .workspace-controls__selector-btn-add__e02mb, .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-main__1SYoJ .workspace-controls__modal-body-main-scroll__25uJ5 .workspace-controls__modal-body-main-inner__26utx .workspace-controls__selector-btn-item__30IYg { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-main__1SYoJ .workspace-controls__modal-body-main-scroll__25uJ5 .workspace-controls__modal-body-main-inner__26utx .workspace-controls__selector-btn-add__e02mb:hover, .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-main__1SYoJ .workspace-controls__modal-body-main-scroll__25uJ5 .workspace-controls__modal-body-main-inner__26utx .workspace-controls__selector-btn-item__30IYg:hover { background-color: #e0e9ff; } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-main__1SYoJ .workspace-controls__modal-body-main-scroll__25uJ5 .workspace-controls__modal-body-main-inner__26utx .workspace-controls__selector-btn-add__e02mb:active, .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-main__1SYoJ .workspace-controls__modal-body-main-scroll__25uJ5 .workspace-controls__modal-body-main-inner__26utx .workspace-controls__selector-btn-item__30IYg:active { background-color: #ccdaff; } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-main__1SYoJ .workspace-controls__modal-body-main-scroll__25uJ5 .workspace-controls__modal-body-main-inner__26utx .workspace-controls__selector-btn-add__e02mb:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-main__1SYoJ .workspace-controls__modal-body-main-scroll__25uJ5 .workspace-controls__modal-body-main-inner__26utx .workspace-controls__selector-btn-add__e02mb:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-main__1SYoJ .workspace-controls__modal-body-main-scroll__25uJ5 .workspace-controls__modal-body-main-inner__26utx .workspace-controls__selector-btn-add__e02mb .workspace-controls__add-img__3Ug1W { font-size: 28px; height: auto; margin-bottom: 8px; } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-main__1SYoJ .workspace-controls__modal-body-main-scroll__25uJ5 .workspace-controls__modal-body-main-inner__26utx .workspace-controls__selector-btn-add__e02mb .workspace-controls__add-label__34ybS { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-main__1SYoJ .workspace-controls__modal-body-main-scroll__25uJ5 .workspace-controls__modal-body-main-inner__26utx .workspace-controls__selector-btn-item__30IYg { justify-content: space-between; } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-main__1SYoJ .workspace-controls__modal-body-main-scroll__25uJ5 .workspace-controls__modal-body-main-inner__26utx .workspace-controls__selector-btn-item__30IYg .workspace-controls__item-img__4UUcn { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-main__1SYoJ .workspace-controls__modal-body-main-scroll__25uJ5 .workspace-controls__modal-body-main-inner__26utx .workspace-controls__selector-btn-item__30IYg .workspace-controls__item-img__4UUcn img { width: auto; height: 105px; } .workspace-controls__modal-body__2v5hP .workspace-controls__modal-body-main__1SYoJ .workspace-controls__modal-body-main-scroll__25uJ5 .workspace-controls__modal-body-main-inner__26utx .workspace-controls__selector-btn-item__30IYg .workspace-controls__item-label__33aTv { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .workspace-controls__modal-footer__2EzeH { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .workspace-controls__selector-btn-add__e02mb, .workspace-controls__selector-btn-item__30IYg { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .workspace-controls__selector-btn-add__e02mb { background-color: var(--selector-sprite-bg_primary); } .workspace-controls__selector-btn-add__e02mb:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .workspace-controls__selector-btn-add__e02mb:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .workspace-controls__selector-btn-add__e02mb .workspace-controls__add-img__3Ug1W { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .workspace-controls__selector-btn-add__e02mb .workspace-controls__add-label__34ybS { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .workspace-controls__selector-btn-item__30IYg { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .workspace-controls__selector-btn-item__30IYg .workspace-controls__item-img__4UUcn { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .workspace-controls__selector-btn-item__30IYg .workspace-controls__item-img__4UUcn img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .workspace-controls__selector-btn-item__30IYg .workspace-controls__item-label__33aTv { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .workspace-controls__selector-btn-item__30IYg:hover { background-color: var(--selector-sprite-bg_primary); } .workspace-controls__selector-btn-item__30IYg:hover .workspace-controls__item-img__4UUcn { border-color: var(--selector-sprite-bg_primary); } .workspace-controls__selector-btn-item_selected__YSNR4 { background-color: var(--selector-sprite-bg_primary); } .workspace-controls__selector-btn-item_selected__YSNR4 .workspace-controls__item-img__4UUcn { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .workspace-controls__menu-bar-btn__3XzWK { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .workspace-controls__menu-bar-btn_green__2WYxv, .workspace-controls__menu-bar-btn_create__2SEdq { background-color: #3cdc8f; } .workspace-controls__menu-bar-btn_green__2WYxv:hover, .workspace-controls__menu-bar-btn_create__2SEdq:hover { background-color: #00d374; } .workspace-controls__menu-bar-btn_green__2WYxv:active, .workspace-controls__menu-bar-btn_create__2SEdq:active { background-color: #00d374; } .workspace-controls__menu-bar-btn_save__UiHSd, .workspace-controls__menu-bar-btn_reset__3OMql { background-color: #6ac8ff; } .workspace-controls__menu-bar-btn_save__UiHSd:hover, .workspace-controls__menu-bar-btn_reset__3OMql:hover { background-color: #57bcfe; } .workspace-controls__menu-bar-btn_save__UiHSd:active, .workspace-controls__menu-bar-btn_reset__3OMql:active { background-color: #4fb0fc; } .workspace-controls__menu-bar-btn_submit__3Uh7d, .workspace-controls__menu-bar-btn_open__20lev { background-color: #ff9e23; } .workspace-controls__menu-bar-btn_submit__3Uh7d:hover, .workspace-controls__menu-bar-btn_open__20lev:hover { background-color: #f47b04; } .workspace-controls__menu-bar-btn_submit__3Uh7d:active, .workspace-controls__menu-bar-btn_open__20lev:active { background-color: #fe8f22; } .workspace-controls__menu-bar-btn_link__xV02f { background-color: #e8efff; color: var(--theme-primary); } .workspace-controls__menu-bar-btn_link__xV02f:hover { background-color: #b6c7ff; } .workspace-controls__menu-bar-btn_link__xV02f:active { background-color: #cfdcff; } .workspace-controls__menu-bar-btn_disabled__1KYRs { color: #565266; background-color: #e6e9ed; } .workspace-controls__menu-bar-btn_disabled__1KYRs:hover { cursor: not-allowed; } .workspace-controls__menu-bar-btn_help__1rMAR { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .workspace-controls__menu-bar-btn_help__1rMAR:hover { background-color: #8398ff; } .workspace-controls__menu-bar-btn_help__1rMAR:active { background-color: #8ca3ff; } .workspace-controls__menu-bar-separator__129NJ { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .workspace-controls__workspace-controls__1VSa0 { display: flex; align-items: center; justify-content: center; position: absolute; top: calc(8px); right: 8px; z-index: 1040; } .workspace-controls__workspace-controls__1VSa0 .workspace-controls__controls-title__2N7RZ { font-size: 14px; color: var(--theme-primary); } .workspace-controls__workspace-controls__1VSa0 .workspace-controls__controls-btn__3MfEe { display: flex; align-items: center; justify-content: center; height: 24px; width: 24px; border-radius: 50%; background-color: #e3e4f4; color: #828da3; font-size: 20px; margin-left: 12px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .workspace-controls__workspace-controls__1VSa0 .workspace-controls__controls-btn__3MfEe:hover { color: var(--theme-primary); } .workspace-controls__codeCheckBtn__1WzpN { width: 90px; height: 24px; margin-left: 12px; } .workspace-controls__codeCheckBtn__1WzpN button { height: 100%; width: 90px; position: relative; border-radius: 21px; display: flex; justify-content: flex-start; align-items: center; color: #5e6b81; padding: 0 8px 0 3.5px; background-color: #e3e4f4; } .workspace-controls__codeCheckBtn__1WzpN button .workspace-controls__icon__2PKLG { font-size: 20px; color: #828da3; margin-right: 3px; } .workspace-controls__codeCheckBtn__1WzpN button span { font-family: PingFang SC; font-style: normal; font-weight: normal; font-size: 14px; line-height: 14px; color: inherit; white-space: nowrap; } .workspace-controls__codeCheckBtn__1WzpN .workspace-controls__tooltip__2X7J2 { height: 76px; width: 124px; background: #ffffff; box-shadow: 0px 4px 8px rgba(176, 185, 222, 0.13); border-radius: 8px; position: absolute; top: 32px; left: calc(50% + 20px); transform: translate(-50%, -10px); padding: 12px 20px; display: flex; flex-direction: column; justify-content: space-between; align-items: center; transition: transform 0.3s, opacity 0.3s; opacity: 0; pointer-events: none; } .workspace-controls__codeCheckBtn__1WzpN .workspace-controls__tooltip__2X7J2 span { font-family: PingFang SC; font-style: normal; font-weight: normal; font-size: 14px; line-height: 22px; color: #5e6b81; } .workspace-controls__codeCheckBtn__1WzpN .workspace-controls__tooltip__2X7J2 h4 { margin: 0; padding: 0; font-family: PingFang SC; font-style: normal; font-weight: 600; font-size: 16px; line-height: 24px; color: #6a7fff; } .workspace-controls__codeCheckBtn__1WzpN:hover button { color: var(--theme-primary); } .workspace-controls__codeCheckBtn__1WzpN:hover button .workspace-controls__icon__2PKLG { color: var(--theme-primary); } .workspace-controls__codeCheckBtn__1WzpN:hover .workspace-controls__tooltip__2X7J2.workspace-controls__open__1-cml { transform: translate(-50%, 0); opacity: 1; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .index__codeCheckBtn__3WRho { width: 90px; height: 24px; margin-left: 12px; } .index__codeCheckBtn__3WRho button { height: 100%; width: 90px; position: relative; border-radius: 21px; display: flex; justify-content: flex-start; align-items: center; color: #5e6b81; padding: 0 8px 0 3.5px; background-color: #e3e4f4; } .index__codeCheckBtn__3WRho button .index__icon__3MKdS { font-size: 20px; color: #828da3; margin-right: 3px; } .index__codeCheckBtn__3WRho button span { font-family: PingFang SC; font-style: normal; font-weight: normal; font-size: 14px; line-height: 14px; color: inherit; white-space: nowrap; } .index__codeCheckBtn__3WRho .index__tooltip__1zhWU { height: 76px; width: 124px; background: #ffffff; box-shadow: 0px 4px 8px rgba(176, 185, 222, 0.13); border-radius: 8px; position: absolute; top: 32px; left: calc(50% + 20px); transform: translate(-50%, -10px); padding: 12px 20px; display: flex; flex-direction: column; justify-content: space-between; align-items: center; transition: transform 0.3s, opacity 0.3s; opacity: 0; pointer-events: none; } .index__codeCheckBtn__3WRho .index__tooltip__1zhWU span { font-family: PingFang SC; font-style: normal; font-weight: normal; font-size: 14px; line-height: 22px; color: #5e6b81; } .index__codeCheckBtn__3WRho .index__tooltip__1zhWU h4 { margin: 0; padding: 0; font-family: PingFang SC; font-style: normal; font-weight: 600; font-size: 16px; line-height: 24px; color: #6a7fff; } .index__codeCheckBtn__3WRho:hover button { color: var(--theme-primary); } .index__codeCheckBtn__3WRho:hover button .index__icon__3MKdS { color: var(--theme-primary); } .index__codeCheckBtn__3WRho:hover .index__tooltip__1zhWU.index__open__B8Vsv { transform: translate(-50%, 0); opacity: 1; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .tutorialWrapper__flex-center__1o7pj { display: flex; align-items: center; justify-content: center; } .tutorialWrapper__full-filled__2CZYa { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .tutorialWrapper__modal-mask__2M4Rw { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .tutorialWrapper__modal-mask__2M4Rw .tutorialWrapper__modal-wrap__2wR2r { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .tutorialWrapper__modal-mask__2M4Rw .tutorialWrapper__modal-wrap__2wR2r .tutorialWrapper__modal-header-wrap__3nNi- { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .tutorialWrapper__modal-mask__2M4Rw .tutorialWrapper__modal-wrap__2wR2r .tutorialWrapper__modal-header-wrap__3nNi- .tutorialWrapper__modal-header-bg__2deFc { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .tutorialWrapper__modal-mask__2M4Rw .tutorialWrapper__modal-wrap__2wR2r .tutorialWrapper__modal-header-wrap__3nNi- .tutorialWrapper__modal-header-label__lfWGT { flex-shrink: 0; font-size: 16px; font-weight: bold; } .tutorialWrapper__modal-mask__2M4Rw .tutorialWrapper__modal-wrap__2wR2r .tutorialWrapper__modal-header-wrap__3nNi- .tutorialWrapper__modal-header-close__2Mh5U { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .tutorialWrapper__modal-mask__2M4Rw .tutorialWrapper__modal-wrap__2wR2r .tutorialWrapper__modal-header-wrap__3nNi- .tutorialWrapper__modal-header-close__2Mh5U:hover { color: #98a2b4; } .tutorialWrapper__modal-mask__2M4Rw .tutorialWrapper__modal-wrap__2wR2r .tutorialWrapper__modal-body-wrap__2XRMR { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .tutorialWrapper__modal-mask__2M4Rw .tutorialWrapper__modal-wrap__2wR2r .tutorialWrapper__modal-footer-wrap__BNSBg { flex-shrink: 0; display: flex; } .tutorialWrapper__modal-header__3svSt { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .tutorialWrapper__modal-header__3svSt .tutorialWrapper__modal-header-upload__3ajGC { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .tutorialWrapper__modal-header__3svSt .tutorialWrapper__modal-header-upload__3ajGC:hover { background-color: #e0e9ff; } .tutorialWrapper__modal-header__3svSt .tutorialWrapper__modal-header-upload__3ajGC:active { background-color: #ccdaff; } .tutorialWrapper__modal-header__3svSt .tutorialWrapper__modal-header-upload__3ajGC .tutorialWrapper__upload-img__D5eNu { font-size: 16px; margin-right: calc(2px); } .tutorialWrapper__modal-header__3svSt .tutorialWrapper__modal-header-upload__3ajGC .tutorialWrapper__upload-label__Ieahr { font-size: 14px; } .tutorialWrapper__modal-header__3svSt .tutorialWrapper__modal-header-upload__3ajGC .tutorialWrapper__upload-input__2a4lS { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .tutorialWrapper__modal-header__3svSt .tutorialWrapper__modal-header-search__3V7C3 { position: relative; } .tutorialWrapper__modal-header__3svSt .tutorialWrapper__modal-header-search__3V7C3 .tutorialWrapper__search-input__3SF_d { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .tutorialWrapper__modal-header__3svSt .tutorialWrapper__modal-header-search__3V7C3 .tutorialWrapper__search-input__3SF_d::-webkit-input-placeholder { color: #98a2b4; } .tutorialWrapper__modal-header__3svSt .tutorialWrapper__modal-header-search__3V7C3 .tutorialWrapper__search-input__3SF_d::-moz-placeholder { color: #98a2b4; } .tutorialWrapper__modal-header__3svSt .tutorialWrapper__modal-header-search__3V7C3 .tutorialWrapper__search-input__3SF_d:-ms-input-placeholder { color: #98a2b4; } .tutorialWrapper__modal-header__3svSt .tutorialWrapper__modal-header-search__3V7C3 .tutorialWrapper__search-input__3SF_d:hover { border-color: #d1d7e1; } .tutorialWrapper__modal-header__3svSt .tutorialWrapper__modal-header-search__3V7C3 .tutorialWrapper__search-input__3SF_d:active { border-color: #d1d7e1; } .tutorialWrapper__modal-header__3svSt .tutorialWrapper__modal-header-search__3V7C3 .tutorialWrapper__search-img__1qgfw { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .tutorialWrapper__modal-body__3UQmp { flex-grow: 1; display: flex; } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-left__1UDeX, .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-main__3rTsK { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-left__1UDeX { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-left__1UDeX .tutorialWrapper__modal-body-left-scroll__3OV9k { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-left__1UDeX .tutorialWrapper__modal-body-left-scroll__3OV9k .tutorialWrapper__modal-body-left-inner__2xODh { width: 121px; padding: calc(12px); color: #5e6b81; } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-left__1UDeX .tutorialWrapper__modal-body-left-scroll__3OV9k .tutorialWrapper__modal-body-left-inner__2xODh .tutorialWrapper__menu-item-current__2qy5Y { color: var(--theme-primary); background-color: #e0e9ff; } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-left__1UDeX .tutorialWrapper__modal-body-left-scroll__3OV9k .tutorialWrapper__modal-body-left-inner__2xODh .tutorialWrapper__menu-item__IWBPs { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-left__1UDeX .tutorialWrapper__modal-body-left-scroll__3OV9k .tutorialWrapper__modal-body-left-inner__2xODh .tutorialWrapper__menu-item__IWBPs:hover { background-color: #edeff5; } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-left__1UDeX .tutorialWrapper__modal-body-left-scroll__3OV9k .tutorialWrapper__modal-body-left-inner__2xODh .tutorialWrapper__menu-item__IWBPs .tutorialWrapper__menu-item-img__cXki0 { flex-shrink: 0; width: 20px; margin-right: 8px; } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-left__1UDeX .tutorialWrapper__modal-body-left-scroll__3OV9k .tutorialWrapper__modal-body-left-inner__2xODh .tutorialWrapper__menu-item__IWBPs .tutorialWrapper__menu-item-label__1_nN8 { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-main__3rTsK { padding: calc(12px) 0; } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-main__3rTsK .tutorialWrapper__modal-body-main-scroll__atCS5 { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-main__3rTsK .tutorialWrapper__modal-body-main-scroll__atCS5 .tutorialWrapper__modal-body-main-inner__Ltw38 { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-main__3rTsK .tutorialWrapper__modal-body-main-scroll__atCS5 .tutorialWrapper__modal-body-main-inner__Ltw38 .tutorialWrapper__selector-btn-add__3FW5F, .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-main__3rTsK .tutorialWrapper__modal-body-main-scroll__atCS5 .tutorialWrapper__modal-body-main-inner__Ltw38 .tutorialWrapper__selector-btn-item__2ejx- { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-main__3rTsK .tutorialWrapper__modal-body-main-scroll__atCS5 .tutorialWrapper__modal-body-main-inner__Ltw38 .tutorialWrapper__selector-btn-add__3FW5F:hover, .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-main__3rTsK .tutorialWrapper__modal-body-main-scroll__atCS5 .tutorialWrapper__modal-body-main-inner__Ltw38 .tutorialWrapper__selector-btn-item__2ejx-:hover { background-color: #e0e9ff; } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-main__3rTsK .tutorialWrapper__modal-body-main-scroll__atCS5 .tutorialWrapper__modal-body-main-inner__Ltw38 .tutorialWrapper__selector-btn-add__3FW5F:active, .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-main__3rTsK .tutorialWrapper__modal-body-main-scroll__atCS5 .tutorialWrapper__modal-body-main-inner__Ltw38 .tutorialWrapper__selector-btn-item__2ejx-:active { background-color: #ccdaff; } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-main__3rTsK .tutorialWrapper__modal-body-main-scroll__atCS5 .tutorialWrapper__modal-body-main-inner__Ltw38 .tutorialWrapper__selector-btn-add__3FW5F:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-main__3rTsK .tutorialWrapper__modal-body-main-scroll__atCS5 .tutorialWrapper__modal-body-main-inner__Ltw38 .tutorialWrapper__selector-btn-add__3FW5F:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-main__3rTsK .tutorialWrapper__modal-body-main-scroll__atCS5 .tutorialWrapper__modal-body-main-inner__Ltw38 .tutorialWrapper__selector-btn-add__3FW5F .tutorialWrapper__add-img__1qfrc { font-size: 28px; height: auto; margin-bottom: 8px; } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-main__3rTsK .tutorialWrapper__modal-body-main-scroll__atCS5 .tutorialWrapper__modal-body-main-inner__Ltw38 .tutorialWrapper__selector-btn-add__3FW5F .tutorialWrapper__add-label__sRk9p { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-main__3rTsK .tutorialWrapper__modal-body-main-scroll__atCS5 .tutorialWrapper__modal-body-main-inner__Ltw38 .tutorialWrapper__selector-btn-item__2ejx- { justify-content: space-between; } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-main__3rTsK .tutorialWrapper__modal-body-main-scroll__atCS5 .tutorialWrapper__modal-body-main-inner__Ltw38 .tutorialWrapper__selector-btn-item__2ejx- .tutorialWrapper__item-img__1namj { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-main__3rTsK .tutorialWrapper__modal-body-main-scroll__atCS5 .tutorialWrapper__modal-body-main-inner__Ltw38 .tutorialWrapper__selector-btn-item__2ejx- .tutorialWrapper__item-img__1namj img { width: auto; height: 105px; } .tutorialWrapper__modal-body__3UQmp .tutorialWrapper__modal-body-main__3rTsK .tutorialWrapper__modal-body-main-scroll__atCS5 .tutorialWrapper__modal-body-main-inner__Ltw38 .tutorialWrapper__selector-btn-item__2ejx- .tutorialWrapper__item-label__2mjdk { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .tutorialWrapper__modal-footer__lbgZy { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .tutorialWrapper__selector-btn-add__3FW5F, .tutorialWrapper__selector-btn-item__2ejx- { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .tutorialWrapper__selector-btn-add__3FW5F { background-color: var(--selector-sprite-bg_primary); } .tutorialWrapper__selector-btn-add__3FW5F:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .tutorialWrapper__selector-btn-add__3FW5F:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .tutorialWrapper__selector-btn-add__3FW5F .tutorialWrapper__add-img__1qfrc { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .tutorialWrapper__selector-btn-add__3FW5F .tutorialWrapper__add-label__sRk9p { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .tutorialWrapper__selector-btn-item__2ejx- { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .tutorialWrapper__selector-btn-item__2ejx- .tutorialWrapper__item-img__1namj { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .tutorialWrapper__selector-btn-item__2ejx- .tutorialWrapper__item-img__1namj img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .tutorialWrapper__selector-btn-item__2ejx- .tutorialWrapper__item-label__2mjdk { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .tutorialWrapper__selector-btn-item__2ejx-:hover { background-color: var(--selector-sprite-bg_primary); } .tutorialWrapper__selector-btn-item__2ejx-:hover .tutorialWrapper__item-img__1namj { border-color: var(--selector-sprite-bg_primary); } .tutorialWrapper__selector-btn-item_selected__58-RQ { background-color: var(--selector-sprite-bg_primary); } .tutorialWrapper__selector-btn-item_selected__58-RQ .tutorialWrapper__item-img__1namj { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .tutorialWrapper__menu-bar-btn__-rbWU { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .tutorialWrapper__menu-bar-btn_green__2Izy0, .tutorialWrapper__menu-bar-btn_create__ZHmBf { background-color: #3cdc8f; } .tutorialWrapper__menu-bar-btn_green__2Izy0:hover, .tutorialWrapper__menu-bar-btn_create__ZHmBf:hover { background-color: #00d374; } .tutorialWrapper__menu-bar-btn_green__2Izy0:active, .tutorialWrapper__menu-bar-btn_create__ZHmBf:active { background-color: #00d374; } .tutorialWrapper__menu-bar-btn_save__B3hIo, .tutorialWrapper__menu-bar-btn_reset__2MFm9 { background-color: #6ac8ff; } .tutorialWrapper__menu-bar-btn_save__B3hIo:hover, .tutorialWrapper__menu-bar-btn_reset__2MFm9:hover { background-color: #57bcfe; } .tutorialWrapper__menu-bar-btn_save__B3hIo:active, .tutorialWrapper__menu-bar-btn_reset__2MFm9:active { background-color: #4fb0fc; } .tutorialWrapper__menu-bar-btn_submit__3WKGd, .tutorialWrapper__menu-bar-btn_open__10YiR { background-color: #ff9e23; } .tutorialWrapper__menu-bar-btn_submit__3WKGd:hover, .tutorialWrapper__menu-bar-btn_open__10YiR:hover { background-color: #f47b04; } .tutorialWrapper__menu-bar-btn_submit__3WKGd:active, .tutorialWrapper__menu-bar-btn_open__10YiR:active { background-color: #fe8f22; } .tutorialWrapper__menu-bar-btn_link__30rcs { background-color: #e8efff; color: var(--theme-primary); } .tutorialWrapper__menu-bar-btn_link__30rcs:hover { background-color: #b6c7ff; } .tutorialWrapper__menu-bar-btn_link__30rcs:active { background-color: #cfdcff; } .tutorialWrapper__menu-bar-btn_disabled__1XOE7 { color: #565266; background-color: #e6e9ed; } .tutorialWrapper__menu-bar-btn_disabled__1XOE7:hover { cursor: not-allowed; } .tutorialWrapper__menu-bar-btn_help__9aMiW { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .tutorialWrapper__menu-bar-btn_help__9aMiW:hover { background-color: #8398ff; } .tutorialWrapper__menu-bar-btn_help__9aMiW:active { background-color: #8ca3ff; } .tutorialWrapper__menu-bar-separator__3G3rL { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ @keyframes tutorialWrapper__btn-shake__yj37o { 0% { transform: translate(0px, 0px); } 33% { transform: translate(-3px, 0px); } 66% { transform: translate(3px, 0px); } to { transform: translate(0px, 0px); } } @keyframes tutorialWrapper__fadeIn__2tfgz { 0% { height: 0; width: 0; border-image: none; -webkit-clip-path: none; clip-path: none; background: none; } 66% { height: 0; width: 0; border-image: none; -webkit-clip-path: none; clip-path: none; background: none; } } .tutorialWrapper__tutorial__1ec_e { position: absolute; top: 0; left: 0; width: 100vw; height: 100vh; z-index: 9999; transform: translateZ(0); display: flex; justify-content: center; align-items: center; pointer-events: all; transition: -webkit-clip-path 0.33s; transition: clip-path 0.33s; transition: clip-path 0.33s, -webkit-clip-path 0.33s; overflow: hidden; } .tutorialWrapper__tutorial__1ec_e .tutorialWrapper__jump-over__eEfi2 { position: absolute; top: 24px; right: 24px; z-index: 99999; background-color: transparent; border: none; outline: none; height: 36px; width: 78px; background-repeat: no-repeat; background-size: contain, 0%, 0%; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .tutorialWrapper__tutorial__1ec_e .tutorialWrapper__jump-over__eEfi2:hover { background-size: 0%, contain, 0%; } .tutorialWrapper__tutorial__1ec_e .tutorialWrapper__jump-over__eEfi2:active { background-size: 0%, 0%, contain; } .tutorialWrapper__highlight-area__399p5 { position: fixed; padding: 0; left: 0; top: 0; z-index: 1; box-sizing: content-box; transform: translateZ(0); background-size: 0; box-shadow: 0px 0px 0px 200vmax rgba(0, 0, 0, 0.5); border: none; animation: tutorialWrapper__fadeIn__2tfgz 0.99s forwards; z-index: 9999; display: inline-block; } .tutorialWrapper__highlight-area__399p5 > * { width: 100%; height: 100%; object-fit: cover; pointer-events: all; position: relative; z-index: 99999; cursor: url(static/cursor/cursor-pointer.cur), pointer; } @keyframes tutorialWrapper__flashing__2Lgcs { 0% { opacity: 0; } 50% { opacity: 1; } to { opacity: 0; } } .tutorialWrapper__highlight-area__399p5::after, .tutorialWrapper__highlight-area__399p5::before { box-sizing: content-box; content: ''; background-size: contain; position: absolute; top: 0px; left: 0px; z-index: 1; pointer-events: inherit; height: 100%; width: 100%; background-color: transparent; height: calc(100% + 6px); width: calc(100% + 6px); background-image: inherit; transform: translate(-3px, -3px); background-size: 18px, 4px; background-repeat: repeat-x, repeat-y; animation: tutorialWrapper__flashing__2Lgcs 2s infinite; } .tutorialWrapper__highlight-area__399p5::after { background-position: top, left; } .tutorialWrapper__highlight-area__399p5::before { background-position: bottom, right; } .tutorialWrapper__dialog__2kqo- { position: fixed; min-width: 296px; background: #ffffff; box-shadow: inset 0px -6px 0px #dbdfe6; border-radius: 24px; z-index: 10000; padding-bottom: 27px; transform: translate(0px, 10px); opacity: 1; display: flex; flex-direction: column; align-items: center; background-size: calc(100% - 14px) calc(100% - 18px); background-position: top 6px left 7px; background-repeat: no-repeat; } .tutorialWrapper__dialog__2kqo- .tutorialWrapper__protocal-monkey__3gkah { width: 100%; position: absolute; top: 0; transform: translate(0px, calc(-100% + 6px)); } @keyframes tutorialWrapper__next__fTho- { 0% { transform: translate(0, 0); } to { transform: translate(0, 10px); } } .tutorialWrapper__dialog__2kqo- .tutorialWrapper__next-step__3sjlb { width: 14px; transform: translate(0, 0); animation: tutorialWrapper__next__fTho- 0.5s 0.3s infinite alternate; } .tutorialWrapper__dialog__2kqo- .tutorialWrapper__arrow__3EBWP { height: 150px; bottom: -103px; object-fit: contain; position: absolute; left: calc(50% - 50px); transform: var(--main-direction); pointer-events: none; } .tutorialWrapper__dialog__2kqo- h4 { font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-style: normal; font-weight: 600; font-size: 18px; line-height: 16px; color: #4a5881; text-align: center; padding: 25px 25px 25px 25px; margin: 0; white-space: nowrap; } .tutorialWrapper__dialog__2kqo- h4 div:nth-child(2) { padding-top: 14px; } .tutorialWrapper__dialog__2kqo- .tutorialWrapper__btn-wrapper__8FKwL { display: flex; justify-content: center; align-items: center; } .tutorialWrapper__dialog__2kqo- .tutorialWrapper__btn-wrapper__8FKwL button { width: 92px; background: #ffc02c; padding: 10px 0px; box-shadow: inset 0px -3px 0px rgba(249, 143, 67, 0.4); border-radius: 27px; border: none; outline: none; color: #ffffff; font-size: 16px; line-height: 16px; font-weight: 600; font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; letter-spacing: 1px; margin: 0 16px; cursor: url(static/cursor/cursor-pointer.cur), pointer; transition: 0.3s; position: relative; transform: translate(0px, 0px); text-align: center; white-space: nowrap; } .tutorialWrapper__dialog__2kqo- .tutorialWrapper__btn-wrapper__8FKwL button::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: inherit; background-color: transparent; transition: 0.3s; } .tutorialWrapper__dialog__2kqo- .tutorialWrapper__btn-wrapper__8FKwL button:hover::after { background-color: rgba(0, 0, 0, 0.08); } .tutorialWrapper__dialog__2kqo- .tutorialWrapper__btn-wrapper__8FKwL button:active { box-shadow: inset 0px 0px 0px rgba(249, 143, 67, 0.4); transform: translate(0px, 3px); } .tutorialWrapper__dialog__2kqo- .tutorialWrapper__btn-wrapper__8FKwL .error { background: #ff6e40; box-shadow: inset 0px -3px 0px rgba(255, 56, 56, 0.4); } .tutorialWrapper__dialog__2kqo- .tutorialWrapper__btn-wrapper__8FKwL .selected { transform: translate(0px, 0px); animation: tutorialWrapper__btn-shake__yj37o 0.2s linear infinite; } [data-status='hide'] { opacity: 0 !important; pointer-events: none; transition: all 0.3s, opacity 0.33s, top 0s 999s, left 0s 999s; } [data-status='show'] { opacity: 1 !important; pointer-events: all; transition: all 0.3s, opacity 0.33s 0.33s, top 0s 0s, left 0s 0s; } [data-status='before'] { -webkit-clip-path: polygon(0% 0%, 0% 100%, 100% 100%, 100% 0%) !important; clip-path: polygon(0% 0%, 0% 100%, 100% 100%, 100% 0%) !important; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .screen-manager__flex-center__1PYi- { display: flex; align-items: center; justify-content: center; } .screen-manager__full-filled__31Byh { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .screen-manager__modal-mask__1hnHQ { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .screen-manager__modal-mask__1hnHQ .screen-manager__modal-wrap__1vMJu { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .screen-manager__modal-mask__1hnHQ .screen-manager__modal-wrap__1vMJu .screen-manager__modal-header-wrap__3o0Rn { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .screen-manager__modal-mask__1hnHQ .screen-manager__modal-wrap__1vMJu .screen-manager__modal-header-wrap__3o0Rn .screen-manager__modal-header-bg__5nN1c { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .screen-manager__modal-mask__1hnHQ .screen-manager__modal-wrap__1vMJu .screen-manager__modal-header-wrap__3o0Rn .screen-manager__modal-header-label__148ip { flex-shrink: 0; font-size: 16px; font-weight: bold; } .screen-manager__modal-mask__1hnHQ .screen-manager__modal-wrap__1vMJu .screen-manager__modal-header-wrap__3o0Rn .screen-manager__modal-header-close__qP553 { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .screen-manager__modal-mask__1hnHQ .screen-manager__modal-wrap__1vMJu .screen-manager__modal-header-wrap__3o0Rn .screen-manager__modal-header-close__qP553:hover { color: #98a2b4; } .screen-manager__modal-mask__1hnHQ .screen-manager__modal-wrap__1vMJu .screen-manager__modal-body-wrap__3H5oq { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .screen-manager__modal-mask__1hnHQ .screen-manager__modal-wrap__1vMJu .screen-manager__modal-footer-wrap__2Yx5f { flex-shrink: 0; display: flex; } .screen-manager__modal-header__3QCBr { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .screen-manager__modal-header__3QCBr .screen-manager__modal-header-upload__3aWxa { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .screen-manager__modal-header__3QCBr .screen-manager__modal-header-upload__3aWxa:hover { background-color: #e0e9ff; } .screen-manager__modal-header__3QCBr .screen-manager__modal-header-upload__3aWxa:active { background-color: #ccdaff; } .screen-manager__modal-header__3QCBr .screen-manager__modal-header-upload__3aWxa .screen-manager__upload-img__3DGwo { font-size: 16px; margin-right: calc(2px); } .screen-manager__modal-header__3QCBr .screen-manager__modal-header-upload__3aWxa .screen-manager__upload-label__2r0tu { font-size: 14px; } .screen-manager__modal-header__3QCBr .screen-manager__modal-header-upload__3aWxa .screen-manager__upload-input__QsYm6 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .screen-manager__modal-header__3QCBr .screen-manager__modal-header-search__16A9X { position: relative; } .screen-manager__modal-header__3QCBr .screen-manager__modal-header-search__16A9X .screen-manager__search-input__1Uv_7 { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .screen-manager__modal-header__3QCBr .screen-manager__modal-header-search__16A9X .screen-manager__search-input__1Uv_7::-webkit-input-placeholder { color: #98a2b4; } .screen-manager__modal-header__3QCBr .screen-manager__modal-header-search__16A9X .screen-manager__search-input__1Uv_7::-moz-placeholder { color: #98a2b4; } .screen-manager__modal-header__3QCBr .screen-manager__modal-header-search__16A9X .screen-manager__search-input__1Uv_7:-ms-input-placeholder { color: #98a2b4; } .screen-manager__modal-header__3QCBr .screen-manager__modal-header-search__16A9X .screen-manager__search-input__1Uv_7:hover { border-color: #d1d7e1; } .screen-manager__modal-header__3QCBr .screen-manager__modal-header-search__16A9X .screen-manager__search-input__1Uv_7:active { border-color: #d1d7e1; } .screen-manager__modal-header__3QCBr .screen-manager__modal-header-search__16A9X .screen-manager__search-img__3svsi { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .screen-manager__modal-body__3oJaN { flex-grow: 1; display: flex; } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-left__iIGS_, .screen-manager__modal-body__3oJaN .screen-manager__modal-body-main__2SWrz { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-left__iIGS_ { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-left__iIGS_ .screen-manager__modal-body-left-scroll__WeUdr { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-left__iIGS_ .screen-manager__modal-body-left-scroll__WeUdr .screen-manager__modal-body-left-inner__2oHEI { width: 121px; padding: calc(12px); color: #5e6b81; } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-left__iIGS_ .screen-manager__modal-body-left-scroll__WeUdr .screen-manager__modal-body-left-inner__2oHEI .screen-manager__menu-item-current__2S5LT { color: var(--theme-primary); background-color: #e0e9ff; } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-left__iIGS_ .screen-manager__modal-body-left-scroll__WeUdr .screen-manager__modal-body-left-inner__2oHEI .screen-manager__menu-item__JXTM_ { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-left__iIGS_ .screen-manager__modal-body-left-scroll__WeUdr .screen-manager__modal-body-left-inner__2oHEI .screen-manager__menu-item__JXTM_:hover { background-color: #edeff5; } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-left__iIGS_ .screen-manager__modal-body-left-scroll__WeUdr .screen-manager__modal-body-left-inner__2oHEI .screen-manager__menu-item__JXTM_ .screen-manager__menu-item-img__1xjZH { flex-shrink: 0; width: 20px; margin-right: 8px; } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-left__iIGS_ .screen-manager__modal-body-left-scroll__WeUdr .screen-manager__modal-body-left-inner__2oHEI .screen-manager__menu-item__JXTM_ .screen-manager__menu-item-label__130q8 { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-main__2SWrz { padding: calc(12px) 0; } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-main__2SWrz .screen-manager__modal-body-main-scroll__2MLFf { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-main__2SWrz .screen-manager__modal-body-main-scroll__2MLFf .screen-manager__modal-body-main-inner__2RymF { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-main__2SWrz .screen-manager__modal-body-main-scroll__2MLFf .screen-manager__modal-body-main-inner__2RymF .screen-manager__selector-btn-add__3xE1J, .screen-manager__modal-body__3oJaN .screen-manager__modal-body-main__2SWrz .screen-manager__modal-body-main-scroll__2MLFf .screen-manager__modal-body-main-inner__2RymF .screen-manager__selector-btn-item__3u5O1 { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-main__2SWrz .screen-manager__modal-body-main-scroll__2MLFf .screen-manager__modal-body-main-inner__2RymF .screen-manager__selector-btn-add__3xE1J:hover, .screen-manager__modal-body__3oJaN .screen-manager__modal-body-main__2SWrz .screen-manager__modal-body-main-scroll__2MLFf .screen-manager__modal-body-main-inner__2RymF .screen-manager__selector-btn-item__3u5O1:hover { background-color: #e0e9ff; } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-main__2SWrz .screen-manager__modal-body-main-scroll__2MLFf .screen-manager__modal-body-main-inner__2RymF .screen-manager__selector-btn-add__3xE1J:active, .screen-manager__modal-body__3oJaN .screen-manager__modal-body-main__2SWrz .screen-manager__modal-body-main-scroll__2MLFf .screen-manager__modal-body-main-inner__2RymF .screen-manager__selector-btn-item__3u5O1:active { background-color: #ccdaff; } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-main__2SWrz .screen-manager__modal-body-main-scroll__2MLFf .screen-manager__modal-body-main-inner__2RymF .screen-manager__selector-btn-add__3xE1J:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-main__2SWrz .screen-manager__modal-body-main-scroll__2MLFf .screen-manager__modal-body-main-inner__2RymF .screen-manager__selector-btn-add__3xE1J:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-main__2SWrz .screen-manager__modal-body-main-scroll__2MLFf .screen-manager__modal-body-main-inner__2RymF .screen-manager__selector-btn-add__3xE1J .screen-manager__add-img__2Dz6j { font-size: 28px; height: auto; margin-bottom: 8px; } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-main__2SWrz .screen-manager__modal-body-main-scroll__2MLFf .screen-manager__modal-body-main-inner__2RymF .screen-manager__selector-btn-add__3xE1J .screen-manager__add-label__3Sy6h { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-main__2SWrz .screen-manager__modal-body-main-scroll__2MLFf .screen-manager__modal-body-main-inner__2RymF .screen-manager__selector-btn-item__3u5O1 { justify-content: space-between; } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-main__2SWrz .screen-manager__modal-body-main-scroll__2MLFf .screen-manager__modal-body-main-inner__2RymF .screen-manager__selector-btn-item__3u5O1 .screen-manager__item-img__3hAgD { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-main__2SWrz .screen-manager__modal-body-main-scroll__2MLFf .screen-manager__modal-body-main-inner__2RymF .screen-manager__selector-btn-item__3u5O1 .screen-manager__item-img__3hAgD img { width: auto; height: 105px; } .screen-manager__modal-body__3oJaN .screen-manager__modal-body-main__2SWrz .screen-manager__modal-body-main-scroll__2MLFf .screen-manager__modal-body-main-inner__2RymF .screen-manager__selector-btn-item__3u5O1 .screen-manager__item-label__CBGNQ { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .screen-manager__modal-footer__16USa { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .screen-manager__selector-btn-add__3xE1J, .screen-manager__selector-btn-item__3u5O1 { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .screen-manager__selector-btn-add__3xE1J { background-color: var(--selector-sprite-bg_primary); } .screen-manager__selector-btn-add__3xE1J:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .screen-manager__selector-btn-add__3xE1J:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .screen-manager__selector-btn-add__3xE1J .screen-manager__add-img__2Dz6j { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .screen-manager__selector-btn-add__3xE1J .screen-manager__add-label__3Sy6h { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .screen-manager__selector-btn-item__3u5O1 { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .screen-manager__selector-btn-item__3u5O1 .screen-manager__item-img__3hAgD { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .screen-manager__selector-btn-item__3u5O1 .screen-manager__item-img__3hAgD img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .screen-manager__selector-btn-item__3u5O1 .screen-manager__item-label__CBGNQ { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .screen-manager__selector-btn-item__3u5O1:hover { background-color: var(--selector-sprite-bg_primary); } .screen-manager__selector-btn-item__3u5O1:hover .screen-manager__item-img__3hAgD { border-color: var(--selector-sprite-bg_primary); } .screen-manager__selector-btn-item_selected__3Skq6 { background-color: var(--selector-sprite-bg_primary); } .screen-manager__selector-btn-item_selected__3Skq6 .screen-manager__item-img__3hAgD { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .screen-manager__menu-bar-btn__1kYsV { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .screen-manager__menu-bar-btn_green__3QYGf, .screen-manager__menu-bar-btn_create__1JaE7 { background-color: #3cdc8f; } .screen-manager__menu-bar-btn_green__3QYGf:hover, .screen-manager__menu-bar-btn_create__1JaE7:hover { background-color: #00d374; } .screen-manager__menu-bar-btn_green__3QYGf:active, .screen-manager__menu-bar-btn_create__1JaE7:active { background-color: #00d374; } .screen-manager__menu-bar-btn_save__3Xp6p, .screen-manager__menu-bar-btn_reset__21vff { background-color: #6ac8ff; } .screen-manager__menu-bar-btn_save__3Xp6p:hover, .screen-manager__menu-bar-btn_reset__21vff:hover { background-color: #57bcfe; } .screen-manager__menu-bar-btn_save__3Xp6p:active, .screen-manager__menu-bar-btn_reset__21vff:active { background-color: #4fb0fc; } .screen-manager__menu-bar-btn_submit__3r4VN, .screen-manager__menu-bar-btn_open__3sUrT { background-color: #ff9e23; } .screen-manager__menu-bar-btn_submit__3r4VN:hover, .screen-manager__menu-bar-btn_open__3sUrT:hover { background-color: #f47b04; } .screen-manager__menu-bar-btn_submit__3r4VN:active, .screen-manager__menu-bar-btn_open__3sUrT:active { background-color: #fe8f22; } .screen-manager__menu-bar-btn_link__-ALSL { background-color: #e8efff; color: var(--theme-primary); } .screen-manager__menu-bar-btn_link__-ALSL:hover { background-color: #b6c7ff; } .screen-manager__menu-bar-btn_link__-ALSL:active { background-color: #cfdcff; } .screen-manager__menu-bar-btn_disabled__198Be { color: #565266; background-color: #e6e9ed; } .screen-manager__menu-bar-btn_disabled__198Be:hover { cursor: not-allowed; } .screen-manager__menu-bar-btn_help__LRL3v { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .screen-manager__menu-bar-btn_help__LRL3v:hover { background-color: #8398ff; } .screen-manager__menu-bar-btn_help__LRL3v:active { background-color: #8ca3ff; } .screen-manager__menu-bar-separator__1kiEF { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .screen-manager__screen-wrapper__KLacb { width: 160px; height: 100%; background-color: #f7f7ff; box-shadow: 6px 0px 16px rgba(94, 107, 129, 0.2); position: absolute; left: 0; top: 0; z-index: 1000; display: flex; flex-direction: column; align-items: center; } .screen-manager__screen-wrapper__KLacb.screen-manager__screen-wrapper_easein__tDYN4 { transform: translateX(0); transition: transform 0.2s; } .screen-manager__screen-wrapper__KLacb.screen-manager__screen-wrapper_easeout__2chPE { transform: translateX(-160px); transition: all 0.2s; box-shadow: none; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-add__1PxiG { display: flex; align-items: center; justify-content: center; width: 120px; height: 24px; margin-top: 12px; background-color: #ebecff; color: var(--theme-primary); border-radius: 4px; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-add__1PxiG svg { margin-right: 3px; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-add__1PxiG:hover { background-color: #e0e2ff; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-add__1PxiG:active { background-color: #d6d8ff; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML { display: flex; flex-grow: 1; width: 160px; margin-top: 12px; overflow: auto; position: relative; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; display: flex; flex-direction: column; flex-grow: 1; flex-shrink: 0; align-items: center; width: 160px; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs { width: 144px; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs .screen-manager__screen-item-imgWrap__2vafu { width: 100%; height: 109px; padding: 1px; border: 1px solid #ccdcff; border-radius: 6px; position: relative; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs .screen-manager__screen-item-imgWrap__2vafu .screen-manager__screen-item-img__3TAzD { width: 140px; height: 105px; border-radius: 6px; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs .screen-manager__screen-item-imgWrap__2vafu .screen-manager__screen-item-img-icon-left__1IZUV, .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs .screen-manager__screen-item-imgWrap__2vafu .screen-manager__screen-item-img-icon-right__3-zYC { display: none; position: absolute; width: 16px; height: 16px; top: 7px; border-radius: 31px; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs .screen-manager__screen-item-imgWrap__2vafu .screen-manager__screen-item-img-icon-left__1IZUV svg, .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs .screen-manager__screen-item-imgWrap__2vafu .screen-manager__screen-item-img-icon-right__3-zYC svg { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs .screen-manager__screen-item-imgWrap__2vafu:hover .screen-manager__screen-item-img-icon-left__1IZUV { color: #6a7fff; display: block; left: 6px; background: #e3e5ff; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs .screen-manager__screen-item-imgWrap__2vafu:hover .screen-manager__screen-item-img-icon-left__1IZUV:hover { background-color: #d2d4fa; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs .screen-manager__screen-item-imgWrap__2vafu:hover .screen-manager__screen-item-img-icon-left__1IZUV:active { background-color: #c4c6f5; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs .screen-manager__screen-item-imgWrap__2vafu:hover .screen-manager__screen-item-img-icon-right__3-zYC { display: block; right: 6px; background: #ffe7e7; color: #fe7070; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs .screen-manager__screen-item-imgWrap__2vafu:hover .screen-manager__screen-item-img-icon-right__3-zYC:hover { background-color: #fad2d2; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs .screen-manager__screen-item-imgWrap__2vafu:hover .screen-manager__screen-item-img-icon-right__3-zYC:active { background-color: #fad2d2; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs .screen-manager__screen-item-imgWrap__2vafu .screen-manager__screen-item-img-order__38zUl { position: absolute; width: 24px; height: 18px; line-height: 18px; text-align: center; left: 1px; bottom: 1px; background-color: #ccdcff; border-radius: 0 6px 0 6px; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs .screen-manager__screen-item-imgWrap__2vafu .screen-manager__screen-item-img-order__38zUl.screen-manager__active__2owEi { color: #ffffff; background: #6a7ffd; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs .screen-manager__screen-item-imgWrap__2vafu.screen-manager__active__2owEi { border: 1px solid #6a7fff; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs:nth-last-child(1):first-child .screen-manager__screen-item-imgWrap__2vafu:hover .screen-manager__screen-item-img-icon-left__1IZUV, .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs:nth-last-child(1):first-child .screen-manager__screen-item-imgWrap__2vafu:hover .screen-manager__screen-item-img-icon-right__3-zYC { display: none; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs .screen-manager__screen-item-title__3Ta1K { width: 100%; line-height: 1; font-size: 14px; color: #5e6b81; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; box-sizing: border-box; margin: 8px 0; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs .screen-manager__screen-item-title__3Ta1K .screen-manager__screen-item-input__2ISsX { width: 100%; max-width: 144px; height: 18px; background-color: transparent; font-size: 14px; color: #5e6b81; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border: none; box-sizing: border-box; outline: none; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs .screen-manager__screen-item-title__3Ta1K .screen-manager__screen-item-input__2ISsX:hover { width: 144px; background: #ebebfa; border-radius: 2px; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__screen-item__3XrPs .screen-manager__screen-item-title__3Ta1K .screen-manager__screen-item-input__2ISsX:focus { width: 144px; background: #ffffff; border: 1px solid #ccdcff; border-radius: 2px; } .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__noShowIcon__22HMr:hover .screen-manager__screen-item-img-icon-left__1IZUV, .screen-manager__screen-wrapper__KLacb .screen-manager__screen-list__FbbML .screen-manager__screen-list-scroll__2XORt .screen-manager__noShowIcon__22HMr:hover .screen-manager__screen-item-img-icon-right__3-zYC { display: none; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ .code-editor__code-editor__20DQu * { box-sizing: border-box; } .monaco-mouse-cursor-text { font-family: DejaVuSansMono !important; } .decorationsOverviewRuler { display: none !important; } .vertical .slider { border-radius: 8px; background: #d2d9ff !important; width: 6px !important; right: 4px !important; left: unset !important; } .horizontal .slider { border-radius: 8px; background: #d2d9ff !important; height: 6px !important; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .hardware-console__flex-center__2A9Ec { display: flex; align-items: center; justify-content: center; } .hardware-console__full-filled__199Vs { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .hardware-console__modal-mask__27VcR { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .hardware-console__modal-mask__27VcR .hardware-console__modal-wrap__2yQgW { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .hardware-console__modal-mask__27VcR .hardware-console__modal-wrap__2yQgW .hardware-console__modal-header-wrap__26WoS { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .hardware-console__modal-mask__27VcR .hardware-console__modal-wrap__2yQgW .hardware-console__modal-header-wrap__26WoS .hardware-console__modal-header-bg__2yoyR { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .hardware-console__modal-mask__27VcR .hardware-console__modal-wrap__2yQgW .hardware-console__modal-header-wrap__26WoS .hardware-console__modal-header-label__N6jlA { flex-shrink: 0; font-size: 16px; font-weight: bold; } .hardware-console__modal-mask__27VcR .hardware-console__modal-wrap__2yQgW .hardware-console__modal-header-wrap__26WoS .hardware-console__modal-header-close__O9Ef9 { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .hardware-console__modal-mask__27VcR .hardware-console__modal-wrap__2yQgW .hardware-console__modal-header-wrap__26WoS .hardware-console__modal-header-close__O9Ef9:hover { color: #98a2b4; } .hardware-console__modal-mask__27VcR .hardware-console__modal-wrap__2yQgW .hardware-console__modal-body-wrap__3cs87 { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .hardware-console__modal-mask__27VcR .hardware-console__modal-wrap__2yQgW .hardware-console__modal-footer-wrap__3xqWY { flex-shrink: 0; display: flex; } .hardware-console__modal-header__cnsHh { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .hardware-console__modal-header__cnsHh .hardware-console__modal-header-upload__1nmCM { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .hardware-console__modal-header__cnsHh .hardware-console__modal-header-upload__1nmCM:hover { background-color: #e0e9ff; } .hardware-console__modal-header__cnsHh .hardware-console__modal-header-upload__1nmCM:active { background-color: #ccdaff; } .hardware-console__modal-header__cnsHh .hardware-console__modal-header-upload__1nmCM .hardware-console__upload-img__3MyO0 { font-size: 16px; margin-right: calc(2px); } .hardware-console__modal-header__cnsHh .hardware-console__modal-header-upload__1nmCM .hardware-console__upload-label__16gLJ { font-size: 14px; } .hardware-console__modal-header__cnsHh .hardware-console__modal-header-upload__1nmCM .hardware-console__upload-input__1Qk_q { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .hardware-console__modal-header__cnsHh .hardware-console__modal-header-search__1_B9Q { position: relative; } .hardware-console__modal-header__cnsHh .hardware-console__modal-header-search__1_B9Q .hardware-console__search-input__-G0BR { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .hardware-console__modal-header__cnsHh .hardware-console__modal-header-search__1_B9Q .hardware-console__search-input__-G0BR::-webkit-input-placeholder { color: #98a2b4; } .hardware-console__modal-header__cnsHh .hardware-console__modal-header-search__1_B9Q .hardware-console__search-input__-G0BR::-moz-placeholder { color: #98a2b4; } .hardware-console__modal-header__cnsHh .hardware-console__modal-header-search__1_B9Q .hardware-console__search-input__-G0BR:-ms-input-placeholder { color: #98a2b4; } .hardware-console__modal-header__cnsHh .hardware-console__modal-header-search__1_B9Q .hardware-console__search-input__-G0BR:hover { border-color: #d1d7e1; } .hardware-console__modal-header__cnsHh .hardware-console__modal-header-search__1_B9Q .hardware-console__search-input__-G0BR:active { border-color: #d1d7e1; } .hardware-console__modal-header__cnsHh .hardware-console__modal-header-search__1_B9Q .hardware-console__search-img__1zSIj { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .hardware-console__modal-body__1ZMQ4 { flex-grow: 1; display: flex; } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-left__H6W79, .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-main__34E3Q { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-left__H6W79 { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-left__H6W79 .hardware-console__modal-body-left-scroll__1VPtW { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-left__H6W79 .hardware-console__modal-body-left-scroll__1VPtW .hardware-console__modal-body-left-inner__QlcUM { width: 121px; padding: calc(12px); color: #5e6b81; } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-left__H6W79 .hardware-console__modal-body-left-scroll__1VPtW .hardware-console__modal-body-left-inner__QlcUM .hardware-console__menu-item-current__3wgTP { color: var(--theme-primary); background-color: #e0e9ff; } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-left__H6W79 .hardware-console__modal-body-left-scroll__1VPtW .hardware-console__modal-body-left-inner__QlcUM .hardware-console__menu-item__2Ae54 { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-left__H6W79 .hardware-console__modal-body-left-scroll__1VPtW .hardware-console__modal-body-left-inner__QlcUM .hardware-console__menu-item__2Ae54:hover { background-color: #edeff5; } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-left__H6W79 .hardware-console__modal-body-left-scroll__1VPtW .hardware-console__modal-body-left-inner__QlcUM .hardware-console__menu-item__2Ae54 .hardware-console__menu-item-img__3bda3 { flex-shrink: 0; width: 20px; margin-right: 8px; } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-left__H6W79 .hardware-console__modal-body-left-scroll__1VPtW .hardware-console__modal-body-left-inner__QlcUM .hardware-console__menu-item__2Ae54 .hardware-console__menu-item-label__2OHw9 { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-main__34E3Q { padding: calc(12px) 0; } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-main__34E3Q .hardware-console__modal-body-main-scroll__2fjSA { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-main__34E3Q .hardware-console__modal-body-main-scroll__2fjSA .hardware-console__modal-body-main-inner__3K9mJ { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-main__34E3Q .hardware-console__modal-body-main-scroll__2fjSA .hardware-console__modal-body-main-inner__3K9mJ .hardware-console__selector-btn-add__1_eW2, .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-main__34E3Q .hardware-console__modal-body-main-scroll__2fjSA .hardware-console__modal-body-main-inner__3K9mJ .hardware-console__selector-btn-item__2Gooi { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-main__34E3Q .hardware-console__modal-body-main-scroll__2fjSA .hardware-console__modal-body-main-inner__3K9mJ .hardware-console__selector-btn-add__1_eW2:hover, .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-main__34E3Q .hardware-console__modal-body-main-scroll__2fjSA .hardware-console__modal-body-main-inner__3K9mJ .hardware-console__selector-btn-item__2Gooi:hover { background-color: #e0e9ff; } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-main__34E3Q .hardware-console__modal-body-main-scroll__2fjSA .hardware-console__modal-body-main-inner__3K9mJ .hardware-console__selector-btn-add__1_eW2:active, .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-main__34E3Q .hardware-console__modal-body-main-scroll__2fjSA .hardware-console__modal-body-main-inner__3K9mJ .hardware-console__selector-btn-item__2Gooi:active { background-color: #ccdaff; } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-main__34E3Q .hardware-console__modal-body-main-scroll__2fjSA .hardware-console__modal-body-main-inner__3K9mJ .hardware-console__selector-btn-add__1_eW2:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-main__34E3Q .hardware-console__modal-body-main-scroll__2fjSA .hardware-console__modal-body-main-inner__3K9mJ .hardware-console__selector-btn-add__1_eW2:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-main__34E3Q .hardware-console__modal-body-main-scroll__2fjSA .hardware-console__modal-body-main-inner__3K9mJ .hardware-console__selector-btn-add__1_eW2 .hardware-console__add-img__qA6SZ { font-size: 28px; height: auto; margin-bottom: 8px; } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-main__34E3Q .hardware-console__modal-body-main-scroll__2fjSA .hardware-console__modal-body-main-inner__3K9mJ .hardware-console__selector-btn-add__1_eW2 .hardware-console__add-label__1uyqJ { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-main__34E3Q .hardware-console__modal-body-main-scroll__2fjSA .hardware-console__modal-body-main-inner__3K9mJ .hardware-console__selector-btn-item__2Gooi { justify-content: space-between; } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-main__34E3Q .hardware-console__modal-body-main-scroll__2fjSA .hardware-console__modal-body-main-inner__3K9mJ .hardware-console__selector-btn-item__2Gooi .hardware-console__item-img__1wfXm { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-main__34E3Q .hardware-console__modal-body-main-scroll__2fjSA .hardware-console__modal-body-main-inner__3K9mJ .hardware-console__selector-btn-item__2Gooi .hardware-console__item-img__1wfXm img { width: auto; height: 105px; } .hardware-console__modal-body__1ZMQ4 .hardware-console__modal-body-main__34E3Q .hardware-console__modal-body-main-scroll__2fjSA .hardware-console__modal-body-main-inner__3K9mJ .hardware-console__selector-btn-item__2Gooi .hardware-console__item-label__1ANET { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .hardware-console__modal-footer__WURQc { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .hardware-console__selector-btn-add__1_eW2, .hardware-console__selector-btn-item__2Gooi { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .hardware-console__selector-btn-add__1_eW2 { background-color: var(--selector-sprite-bg_primary); } .hardware-console__selector-btn-add__1_eW2:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .hardware-console__selector-btn-add__1_eW2:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .hardware-console__selector-btn-add__1_eW2 .hardware-console__add-img__qA6SZ { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .hardware-console__selector-btn-add__1_eW2 .hardware-console__add-label__1uyqJ { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .hardware-console__selector-btn-item__2Gooi { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .hardware-console__selector-btn-item__2Gooi .hardware-console__item-img__1wfXm { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .hardware-console__selector-btn-item__2Gooi .hardware-console__item-img__1wfXm img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .hardware-console__selector-btn-item__2Gooi .hardware-console__item-label__1ANET { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .hardware-console__selector-btn-item__2Gooi:hover { background-color: var(--selector-sprite-bg_primary); } .hardware-console__selector-btn-item__2Gooi:hover .hardware-console__item-img__1wfXm { border-color: var(--selector-sprite-bg_primary); } .hardware-console__selector-btn-item_selected__3dmsm { background-color: var(--selector-sprite-bg_primary); } .hardware-console__selector-btn-item_selected__3dmsm .hardware-console__item-img__1wfXm { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .hardware-console__menu-bar-btn__1IAwc { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .hardware-console__menu-bar-btn_green__GKWfB, .hardware-console__menu-bar-btn_create__1jizg { background-color: #3cdc8f; } .hardware-console__menu-bar-btn_green__GKWfB:hover, .hardware-console__menu-bar-btn_create__1jizg:hover { background-color: #00d374; } .hardware-console__menu-bar-btn_green__GKWfB:active, .hardware-console__menu-bar-btn_create__1jizg:active { background-color: #00d374; } .hardware-console__menu-bar-btn_save__2qZYF, .hardware-console__menu-bar-btn_reset__Cj4Sh { background-color: #6ac8ff; } .hardware-console__menu-bar-btn_save__2qZYF:hover, .hardware-console__menu-bar-btn_reset__Cj4Sh:hover { background-color: #57bcfe; } .hardware-console__menu-bar-btn_save__2qZYF:active, .hardware-console__menu-bar-btn_reset__Cj4Sh:active { background-color: #4fb0fc; } .hardware-console__menu-bar-btn_submit__12Zx1, .hardware-console__menu-bar-btn_open__3Dx2e { background-color: #ff9e23; } .hardware-console__menu-bar-btn_submit__12Zx1:hover, .hardware-console__menu-bar-btn_open__3Dx2e:hover { background-color: #f47b04; } .hardware-console__menu-bar-btn_submit__12Zx1:active, .hardware-console__menu-bar-btn_open__3Dx2e:active { background-color: #fe8f22; } .hardware-console__menu-bar-btn_link__3n_iV { background-color: #e8efff; color: var(--theme-primary); } .hardware-console__menu-bar-btn_link__3n_iV:hover { background-color: #b6c7ff; } .hardware-console__menu-bar-btn_link__3n_iV:active { background-color: #cfdcff; } .hardware-console__menu-bar-btn_disabled__2fIfd { color: #565266; background-color: #e6e9ed; } .hardware-console__menu-bar-btn_disabled__2fIfd:hover { cursor: not-allowed; } .hardware-console__menu-bar-btn_help__38F_S { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .hardware-console__menu-bar-btn_help__38F_S:hover { background-color: #8398ff; } .hardware-console__menu-bar-btn_help__38F_S:active { background-color: #8ca3ff; } .hardware-console__menu-bar-separator__3VQzi { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .hardware-console__display-row__2hCAu { display: flex; justify-content: space-between; align-items: center; } .hardware-console__input-box__2LeUK { width: 8ch; /* Ensure the input box displays only 4 characters */ margin: 5px; padding: 5px; /* Adjust padding as necessary */ text-align: center; /* Center the text */ border: 1px solid #ccc; border-radius: 4px; } .hardware-console__input-label__31xd9 { flex: 1; margin: 5px; text-align: right; padding-right: 10px; } .hardware-console__hardware-console-wrapper__2syo_ { display: flex; flex-direction: column; position: relative; padding: 12px; padding-right: 0; } .hardware-console__console-array__2Iu_s { height: calc(50vh - 95px); overflow: auto; word-break: break-all; white-space: pre-wrap; -webkit-user-select: text; -ms-user-select: text; user-select: text; color: #5e6b81; font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-size: 14px; line-height: 21px; font-weight: 700; } .hardware-console__button__3j_J3:hover { cursor: pointer; } .hardware-console__pause-button__39Xo3 { position: absolute; top: -1px; right: -1px; border: 1px solid rgba(0, 0, 0, 0.15); background-color: #ffffff; height: 34px; width: 34px; border-radius: 0 0.5rem 0 0; outline: none; } .hardware-console__clean-button__boZDv { position: absolute; top: calc(32px); right: -1px; border: 1px solid rgba(0, 0, 0, 0.15); background-color: #ffffff; height: 34px; width: 34px; border-radius: 0 0 0 0.5rem; outline: none; } .hardware-console__pause-button__39Xo3:active, .hardware-console__clean-button__boZDv:active { background-color: rgba(0, 0, 0, 0.15); } .hardware-console__clean-icon__3jYQ7 { height: 20px; width: 20px; } .hardware-console__pause-icon__3eOra { height: 20px; width: 20px; } .hardware-console__console-menu-warpper__SpxvM { display: flex; flex-wrap: nowrap; flex-direction: row; justify-content: flex-end; height: 42px; background-color: #ffffff; align-items: center; position: relative; } .hardware-console__console-menu-warpper__SpxvM .hardware-console__console-input__164yE { flex-grow: 1; height: 26px; margin-left: calc(4px); border: none; box-sizing: border-box; border-radius: 0.5rem; background-color: #f7f9ff; overflow: hidden; padding: 0 5px; } .hardware-console__console-menu-warpper__SpxvM .hardware-console__console-input__164yE:focus { outline: none; color: #565266; } .hardware-console__console-menu-warpper__SpxvM .hardware-console__send-button__3oK0V { position: absolute; padding: 0.36rem 0.75rem; color: var(--theme-primary); background-color: transparent; font-weight: 600; font-size: 0.75rem; margin-left: 0.5rem; margin-right: 0.5rem; border: none; outline: none; cursor: pointer; white-space: nowrap; } .hardware-console__console-menu-warpper__SpxvM .hardware-console__send-button__3oK0V:active { opacity: 0.5; } .hardware-console__console-menu-warpper__SpxvM .hardware-console__setting-button__3Ucj8 { border: none; outline: none; cursor: pointer; background-color: #ffffff; padding: 0; margin-right: calc(4px); white-space: nowrap; position: relative; } .hardware-console__console-menu-warpper__SpxvM .hardware-console__setting-button__3Ucj8 .hardware-console__setting-icon__1jOpg { height: 26px; width: 26px; } .hardware-console__menu-bar-menu__1ay9y { z-index: 491; } .hardware-console__menu__1IZ9A { background-color: #ffffff; color: #565266; bottom: 36px; min-width: 0px; text-align: left; } .hardware-console__menu__1IZ9A span { margin-right: 5px; vertical-align: middle; } .hardware-console__menu__1IZ9A input { vertical-align: middle; margin: 0; } .hardware-console__menu__1IZ9A select { border: 1px solid #565266; color: #565266; } .hardware-console__menu__1IZ9A select:focus { outline: none; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: 0 0 0 calc(0.125rem) rgba(77, 151, 255, 0.9); color: #565266; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .hardware-dropdown { width: 150px !important; } .hardware__hardware-wrapper__1eif2 { display: flex; flex-direction: column; height: 100%; padding: 0 10px; position: relative; } .hardware__hardware-wrapper__1eif2.hardware__hide__1om2r { padding: 0; opacity: 0; } .hardware__hardware-wrapper__1eif2 .hardware__hardware-collapse__1xJP4 { border-radius: 12px; border: 1px solid #d1dfff; background: #e9ebff; } .hardware__hardware-wrapper__1eif2 .hardware__hardware-collapse__1xJP4 .ant-collapse-item { border: none; } .hardware__hardware-wrapper__1eif2 .hardware__hardware-collapse__1xJP4 .ant-collapse-item .ant-collapse-content-hidden { display: block; height: 0; opacity: 0; } .hardware__hardware-wrapper__1eif2 .hardware__hardware-collapse__1xJP4 .ant-collapse-item .ant-collapse-content-box { padding: 4px 8px; } .hardware__hardware-wrapper__1eif2 .hardware__hardware-collapse__1xJP4 .ant-collapse-item .ant-collapse-content-box:first-child { padding: 0; } .hardware__hardware-wrapper__1eif2 .hardware__hardware-collapse__1xJP4 .ant-collapse-item:last-child .ant-collapse-content-box { border-top: 1px solid #d1dfff; } .hardware__hardware-wrapper__1eif2 .hardware__hardware-collapse__1xJP4 .ant-collapse-item:not(.hardware__hardware-wrapper__1eif2 .hardware__hardware-collapse__1xJP4 .ant-collapse-item:last-child) .ant-collapse-header, .hardware__hardware-wrapper__1eif2 .hardware__hardware-collapse__1xJP4 .ant-collapse-item:not(.hardware__hardware-wrapper__1eif2 .hardware__hardware-collapse__1xJP4 .ant-collapse-item:last-child) .ant-collapse-content-box { border-bottom: 1px solid #d1dfff; } .hardware__hardware-wrapper__1eif2 .hardware__hardware-collapse__1xJP4 .ant-collapse-item .ant-collapse-header { padding: 0 0 0 16.5px; height: 32px; display: flex; align-items: center; cursor: url(static/cursor/cursor-pointer.cur), pointer !important; } .hardware__hardware-wrapper__1eif2 .hardware__hardware-collapse__1xJP4 .ant-collapse-item .ant-collapse-header header { margin-left: 0; display: flex; width: 100%; align-items: center; justify-content: space-between; } .hardware__hardware-wrapper__1eif2 .hardware__hardware-collapse__1xJP4 .ant-collapse-item .ant-collapse-header header h4 { padding: 0; margin: 0; color: #565266; font-size: 14px; font-weight: 400; } .hardware__hardware-wrapper__1eif2 .hardware__hardware-collapse__1xJP4 .ant-collapse-item .ant-collapse-header header section { margin-right: 10px; } .hardware__hardware-wrapper__1eif2 .hardware__hardware-collapse__1xJP4 .ant-collapse-item .ant-collapse-header header section label { font-size: 12px; font-weight: 400; color: #565266; cursor: unset; } .hardware__hardware-wrapper__1eif2 .hardware__hardware-collapse__1xJP4 .ant-collapse-item .ant-collapse-header header section label span { display: inline-block; margin-right: 8px; } .hardware__hardware-wrapper__1eif2 .hardware__hardware-collapse__1xJP4 .ant-collapse-item .ant-collapse-header header section label > button { transform: rotate(180deg); margin-top: -2px; } .hardware__hardware-wrapper__1eif2 .hardware__hardware-collapse__1xJP4 .ant-collapse-item .ant-collapse-header header section label .ant-switch { cursor: url(static/cursor/cursor-pointer.cur), pointer; } .hardware__hardware-wrapper__1eif2 .hardware__hardware-collapse__1xJP4 .ant-collapse-item .ant-collapse-header header section .hardware__hardware-panel-btn__12ZiX { margin-left: 11px; } .hardware__hardware-wrapper__1eif2 .hardware__hardware-collapse__1xJP4 .ant-collapse-item .ant-collapse-header header section .hardware__hardware-panel-btn__12ZiX > span { font-size: 18px; vertical-align: middle; color: #8a97ad; } .hardware__hardware-wrapper__1eif2 .hardware__hardware-collapse__1xJP4 .ant-collapse-item .ant-collapse-header header section .hardware__hardware-panel-btn__12ZiX > span:hover { color: var(--theme-primary); } .hardware__hardware-wrapper__1eif2 .hardware__code-editor-wrapper__2h3SR { height: 100%; display: flex; flex-grow: 1; flex-basis: 0; min-height: 0; border: none; box-sizing: border-box; border-radius: 0px; overflow: hidden; } .hardware__hardware-wrapper__1eif2 .hardware__hardware-console-wrapper__3GLoV { box-sizing: border-box; background-color: transparent; overflow: hidden; background: #f7f7ff; border-bottom-left-radius: 12px; border-bottom-right-radius: 12px; } .hardware__hardware-wrapper__1eif2 .hardware__hardware-console-wrapper__3GLoV.hardware__wide-wrapper__2x9jQ { width: 100%; } .hardware__hardware-wrapper__1eif2 .hardware__hardware-console-wrapper__3GLoV.hardware__narrow-wrapper__1RSKv { width: 100%; } .hardware__hardware-size-btn__1hFMi { height: 24px; width: 24px; box-shadow: 0px 2px 6px 0px #474e7a0f; border: 1px solid #edeff5; border-radius: 50%; box-sizing: content-box; display: block; position: absolute; top: 50%; right: -10px; overflow: hidden; z-index: 42; transform: rotate(90deg); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .hardware__hardware-size-btn__1hFMi img { vertical-align: middle; border-style: none; height: 100%; width: 100%; object-fit: cover; } .hardware__hardware-size-btn__1hFMi.hardware__hide__1om2r { transform: rotate(-90deg); } .hardware__hardware-popover__2C0XC * { transition: none !important; } .hardware__hardware-popover__2C0XC .ant-popover-arrow { display: none; } .hardware__hardware-popover__2C0XC .ant-popover-inner { box-shadow: none; width: 194px; background: #ffffff; border: 1px solid #e7eeff; box-sizing: border-box; box-shadow: 8px 4px 8px rgba(39, 71, 154, 0.04); border-radius: 8px; } .hardware__hardware-popover__2C0XC .ant-popover-inner .ant-popover-inner-content > * { display: flex; flex-direction: column; } .hardware__hardware-popover__2C0XC .ant-popover-inner .ant-popover-inner-content > * label { font-size: 12px; height: 30px; font-weight: 400; display: flex; justify-content: space-between; align-items: center; } .hardware__hardware-popover__2C0XC .ant-popover-inner .ant-popover-inner-content > * label .ant-select { width: 96px; } .hardware__hardware-popover__2C0XC .ant-popover-inner .ant-popover-inner-content > * label .ant-select .ant-select-selector { height: 20px; width: 100px; font-size: 12px; font-weight: 400; border: 1px solid #d1dfff; box-sizing: border-box; border-radius: 4px; padding: 0 8px; } .hardware__hardware-popover__2C0XC .ant-popover-inner .ant-popover-inner-content > * label .ant-select .ant-select-selector .ant-select-selection-item { line-height: 20px; } .hardware__hardware-popover__2C0XC .ant-popover-inner .ant-popover-inner-content > * label .ant-switch { transform: rotate(180deg); cursor: url(static/cursor/cursor-pointer.cur), pointer !important; } .ant-select-arrow .anticon { margin-top: -2px; font-size: 16px !important; } .ant-select-arrow .anticon svg { height: 18px; width: 18px; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .hardware-header__flex-center__3GFWC { display: flex; align-items: center; justify-content: center; } .hardware-header__full-filled__2uG49 { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .hardware-header__modal-mask__1ozFH { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .hardware-header__modal-mask__1ozFH .hardware-header__modal-wrap__hk1VS { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .hardware-header__modal-mask__1ozFH .hardware-header__modal-wrap__hk1VS .hardware-header__modal-header-wrap__28PCE { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .hardware-header__modal-mask__1ozFH .hardware-header__modal-wrap__hk1VS .hardware-header__modal-header-wrap__28PCE .hardware-header__modal-header-bg__2GX17 { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .hardware-header__modal-mask__1ozFH .hardware-header__modal-wrap__hk1VS .hardware-header__modal-header-wrap__28PCE .hardware-header__modal-header-label__QSU3Y { flex-shrink: 0; font-size: 16px; font-weight: bold; } .hardware-header__modal-mask__1ozFH .hardware-header__modal-wrap__hk1VS .hardware-header__modal-header-wrap__28PCE .hardware-header__modal-header-close__3VELJ { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .hardware-header__modal-mask__1ozFH .hardware-header__modal-wrap__hk1VS .hardware-header__modal-header-wrap__28PCE .hardware-header__modal-header-close__3VELJ:hover { color: #98a2b4; } .hardware-header__modal-mask__1ozFH .hardware-header__modal-wrap__hk1VS .hardware-header__modal-body-wrap__1PIr7 { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .hardware-header__modal-mask__1ozFH .hardware-header__modal-wrap__hk1VS .hardware-header__modal-footer-wrap__1yc6R { flex-shrink: 0; display: flex; } .hardware-header__modal-header__2iwyC { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .hardware-header__modal-header__2iwyC .hardware-header__modal-header-upload___zfJ9 { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .hardware-header__modal-header__2iwyC .hardware-header__modal-header-upload___zfJ9:hover { background-color: #e0e9ff; } .hardware-header__modal-header__2iwyC .hardware-header__modal-header-upload___zfJ9:active { background-color: #ccdaff; } .hardware-header__modal-header__2iwyC .hardware-header__modal-header-upload___zfJ9 .hardware-header__upload-img__3mJ2_ { font-size: 16px; margin-right: calc(2px); } .hardware-header__modal-header__2iwyC .hardware-header__modal-header-upload___zfJ9 .hardware-header__upload-label__31BwB { font-size: 14px; } .hardware-header__modal-header__2iwyC .hardware-header__modal-header-upload___zfJ9 .hardware-header__upload-input__1NTIR { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .hardware-header__modal-header__2iwyC .hardware-header__modal-header-search__24e9K { position: relative; } .hardware-header__modal-header__2iwyC .hardware-header__modal-header-search__24e9K .hardware-header__search-input__1CvjE { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .hardware-header__modal-header__2iwyC .hardware-header__modal-header-search__24e9K .hardware-header__search-input__1CvjE::-webkit-input-placeholder { color: #98a2b4; } .hardware-header__modal-header__2iwyC .hardware-header__modal-header-search__24e9K .hardware-header__search-input__1CvjE::-moz-placeholder { color: #98a2b4; } .hardware-header__modal-header__2iwyC .hardware-header__modal-header-search__24e9K .hardware-header__search-input__1CvjE:-ms-input-placeholder { color: #98a2b4; } .hardware-header__modal-header__2iwyC .hardware-header__modal-header-search__24e9K .hardware-header__search-input__1CvjE:hover { border-color: #d1d7e1; } .hardware-header__modal-header__2iwyC .hardware-header__modal-header-search__24e9K .hardware-header__search-input__1CvjE:active { border-color: #d1d7e1; } .hardware-header__modal-header__2iwyC .hardware-header__modal-header-search__24e9K .hardware-header__search-img__7oAPs { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .hardware-header__modal-body__2k-FB { flex-grow: 1; display: flex; } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-left__HvntW, .hardware-header__modal-body__2k-FB .hardware-header__modal-body-main__FTwhV { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-left__HvntW { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-left__HvntW .hardware-header__modal-body-left-scroll__11NbY { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-left__HvntW .hardware-header__modal-body-left-scroll__11NbY .hardware-header__modal-body-left-inner__11GhC { width: 121px; padding: calc(12px); color: #5e6b81; } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-left__HvntW .hardware-header__modal-body-left-scroll__11NbY .hardware-header__modal-body-left-inner__11GhC .hardware-header__menu-item-current__NxgJV { color: var(--theme-primary); background-color: #e0e9ff; } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-left__HvntW .hardware-header__modal-body-left-scroll__11NbY .hardware-header__modal-body-left-inner__11GhC .hardware-header__menu-item__PgvhE { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-left__HvntW .hardware-header__modal-body-left-scroll__11NbY .hardware-header__modal-body-left-inner__11GhC .hardware-header__menu-item__PgvhE:hover { background-color: #edeff5; } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-left__HvntW .hardware-header__modal-body-left-scroll__11NbY .hardware-header__modal-body-left-inner__11GhC .hardware-header__menu-item__PgvhE .hardware-header__menu-item-img__3Z6ug { flex-shrink: 0; width: 20px; margin-right: 8px; } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-left__HvntW .hardware-header__modal-body-left-scroll__11NbY .hardware-header__modal-body-left-inner__11GhC .hardware-header__menu-item__PgvhE .hardware-header__menu-item-label__wGmWM { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-main__FTwhV { padding: calc(12px) 0; } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-main__FTwhV .hardware-header__modal-body-main-scroll__1MM4E { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-main__FTwhV .hardware-header__modal-body-main-scroll__1MM4E .hardware-header__modal-body-main-inner__3O55- { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-main__FTwhV .hardware-header__modal-body-main-scroll__1MM4E .hardware-header__modal-body-main-inner__3O55- .hardware-header__selector-btn-add__sLvfd, .hardware-header__modal-body__2k-FB .hardware-header__modal-body-main__FTwhV .hardware-header__modal-body-main-scroll__1MM4E .hardware-header__modal-body-main-inner__3O55- .hardware-header__selector-btn-item__ESnIp { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-main__FTwhV .hardware-header__modal-body-main-scroll__1MM4E .hardware-header__modal-body-main-inner__3O55- .hardware-header__selector-btn-add__sLvfd:hover, .hardware-header__modal-body__2k-FB .hardware-header__modal-body-main__FTwhV .hardware-header__modal-body-main-scroll__1MM4E .hardware-header__modal-body-main-inner__3O55- .hardware-header__selector-btn-item__ESnIp:hover { background-color: #e0e9ff; } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-main__FTwhV .hardware-header__modal-body-main-scroll__1MM4E .hardware-header__modal-body-main-inner__3O55- .hardware-header__selector-btn-add__sLvfd:active, .hardware-header__modal-body__2k-FB .hardware-header__modal-body-main__FTwhV .hardware-header__modal-body-main-scroll__1MM4E .hardware-header__modal-body-main-inner__3O55- .hardware-header__selector-btn-item__ESnIp:active { background-color: #ccdaff; } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-main__FTwhV .hardware-header__modal-body-main-scroll__1MM4E .hardware-header__modal-body-main-inner__3O55- .hardware-header__selector-btn-add__sLvfd:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-main__FTwhV .hardware-header__modal-body-main-scroll__1MM4E .hardware-header__modal-body-main-inner__3O55- .hardware-header__selector-btn-add__sLvfd:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-main__FTwhV .hardware-header__modal-body-main-scroll__1MM4E .hardware-header__modal-body-main-inner__3O55- .hardware-header__selector-btn-add__sLvfd .hardware-header__add-img__5OZPO { font-size: 28px; height: auto; margin-bottom: 8px; } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-main__FTwhV .hardware-header__modal-body-main-scroll__1MM4E .hardware-header__modal-body-main-inner__3O55- .hardware-header__selector-btn-add__sLvfd .hardware-header__add-label__XKqKM { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-main__FTwhV .hardware-header__modal-body-main-scroll__1MM4E .hardware-header__modal-body-main-inner__3O55- .hardware-header__selector-btn-item__ESnIp { justify-content: space-between; } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-main__FTwhV .hardware-header__modal-body-main-scroll__1MM4E .hardware-header__modal-body-main-inner__3O55- .hardware-header__selector-btn-item__ESnIp .hardware-header__item-img__1qL7z { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-main__FTwhV .hardware-header__modal-body-main-scroll__1MM4E .hardware-header__modal-body-main-inner__3O55- .hardware-header__selector-btn-item__ESnIp .hardware-header__item-img__1qL7z img { width: auto; height: 105px; } .hardware-header__modal-body__2k-FB .hardware-header__modal-body-main__FTwhV .hardware-header__modal-body-main-scroll__1MM4E .hardware-header__modal-body-main-inner__3O55- .hardware-header__selector-btn-item__ESnIp .hardware-header__item-label__1gQ5u { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .hardware-header__modal-footer__3-BzO { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .hardware-header__selector-btn-add__sLvfd, .hardware-header__selector-btn-item__ESnIp { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .hardware-header__selector-btn-add__sLvfd { background-color: var(--selector-sprite-bg_primary); } .hardware-header__selector-btn-add__sLvfd:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .hardware-header__selector-btn-add__sLvfd:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .hardware-header__selector-btn-add__sLvfd .hardware-header__add-img__5OZPO { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .hardware-header__selector-btn-add__sLvfd .hardware-header__add-label__XKqKM { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .hardware-header__selector-btn-item__ESnIp { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .hardware-header__selector-btn-item__ESnIp .hardware-header__item-img__1qL7z { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .hardware-header__selector-btn-item__ESnIp .hardware-header__item-img__1qL7z img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .hardware-header__selector-btn-item__ESnIp .hardware-header__item-label__1gQ5u { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .hardware-header__selector-btn-item__ESnIp:hover { background-color: var(--selector-sprite-bg_primary); } .hardware-header__selector-btn-item__ESnIp:hover .hardware-header__item-img__1qL7z { border-color: var(--selector-sprite-bg_primary); } .hardware-header__selector-btn-item_selected__3FNH8 { background-color: var(--selector-sprite-bg_primary); } .hardware-header__selector-btn-item_selected__3FNH8 .hardware-header__item-img__1qL7z { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .hardware-header__menu-bar-btn__p49OH { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .hardware-header__menu-bar-btn_green__1lEhk, .hardware-header__menu-bar-btn_create__3_HdT { background-color: #3cdc8f; } .hardware-header__menu-bar-btn_green__1lEhk:hover, .hardware-header__menu-bar-btn_create__3_HdT:hover { background-color: #00d374; } .hardware-header__menu-bar-btn_green__1lEhk:active, .hardware-header__menu-bar-btn_create__3_HdT:active { background-color: #00d374; } .hardware-header__menu-bar-btn_save__mzCuX, .hardware-header__menu-bar-btn_reset__325tC { background-color: #6ac8ff; } .hardware-header__menu-bar-btn_save__mzCuX:hover, .hardware-header__menu-bar-btn_reset__325tC:hover { background-color: #57bcfe; } .hardware-header__menu-bar-btn_save__mzCuX:active, .hardware-header__menu-bar-btn_reset__325tC:active { background-color: #4fb0fc; } .hardware-header__menu-bar-btn_submit__1msNX, .hardware-header__menu-bar-btn_open__2pMbT { background-color: #ff9e23; } .hardware-header__menu-bar-btn_submit__1msNX:hover, .hardware-header__menu-bar-btn_open__2pMbT:hover { background-color: #f47b04; } .hardware-header__menu-bar-btn_submit__1msNX:active, .hardware-header__menu-bar-btn_open__2pMbT:active { background-color: #fe8f22; } .hardware-header__menu-bar-btn_link__3lLgF { background-color: #e8efff; color: var(--theme-primary); } .hardware-header__menu-bar-btn_link__3lLgF:hover { background-color: #b6c7ff; } .hardware-header__menu-bar-btn_link__3lLgF:active { background-color: #cfdcff; } .hardware-header__menu-bar-btn_disabled__1rPRy { color: #565266; background-color: #e6e9ed; } .hardware-header__menu-bar-btn_disabled__1rPRy:hover { cursor: not-allowed; } .hardware-header__menu-bar-btn_help__1Qpeu { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .hardware-header__menu-bar-btn_help__1Qpeu:hover { background-color: #8398ff; } .hardware-header__menu-bar-btn_help__1Qpeu:active { background-color: #8ca3ff; } .hardware-header__menu-bar-separator__2zVHL { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .hardware-header__hardware-header-wrapper__1XUHM { display: flex; justify-content: flex-end; margin: auto; flex-shrink: 0; align-items: center; height: 40px; padding: 0 8px; } .hardware-header__hardware-header-wrapper__1XUHM.hardware-header__hardware-header-wrapper-stage-full__1iVte { width: 100%; } .hardware-header__hardware-header-wrapper__1XUHM.hardware-header__hardware-header-wrapper-stage-large__32dhg { width: 376px; } .hardware-header__hardware-header-wrapper__1XUHM.hardware-header__hardware-header-wrapper-stage-small__3NVSV { width: 242px; } .hardware-header__hardware-header-wrapper__1XUHM.hardware-header__hardware-header-wrapper-stage-hide__3Vngn { width: 0px; visibility: hidden; } .hardware-header__hardware-header-wrapper__1XUHM .hardware-header__read-button__3wT-w { display: flex; align-items: center; justify-content: center; height: 24px; width: 112px; border-radius: 39px; padding: 0px; background-color: #3cdc8f; margin-right: 4px; cursor: url(static/cursor/cursor-pointer.cur), pointer; font-size: 14px; color: #fff; } .hardware-header__hardware-header-wrapper__1XUHM .hardware-header__read-button__3wT-w .hardware-header__upload-icon__1oQEz { width: 12px; height: 12px; border-radius: 2px; margin-right: 2px; transform: rotate(180deg); } .hardware-header__hardware-header-wrapper__1XUHM .hardware-header__upload-button__1AH9J { display: flex; align-items: center; justify-content: center; height: 24px; width: 102px; border-radius: 39px; padding: 0px; background-color: #3cdc8f; cursor: url(static/cursor/cursor-pointer.cur), pointer; font-size: 14px; color: #fff; } .hardware-header__hardware-header-wrapper__1XUHM .hardware-header__upload-button__1AH9J .hardware-header__upload-icon__1oQEz { width: 12px; height: 12px; border-radius: 2px; margin-right: 2px; } .hardware-header__hardware-header-wrapper__1XUHM .hardware-header__stage-size-toggle-group__3HnyG { display: flex; } .hardware-header__hardware-header-wrapper__1XUHM .hardware-header__stage-size-toggle-group__3HnyG .hardware-header__stage-button__1UZ-G { display: flex; align-items: center; justify-content: center; border: 1px solid #e8efff; border-radius: 6px; width: 24px; height: 24px; background-color: #ffffff; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .hardware-header__hardware-header-wrapper__1XUHM .hardware-header__stage-size-toggle-group__3HnyG .hardware-header__stage-button__1UZ-G:hover { background-color: #6a7fff1a; } .hardware-header__hardware-header-wrapper__1XUHM .hardware-header__stage-size-toggle-group__3HnyG .hardware-header__stage-button__1UZ-G:active { background-color: #6a7fff33; } .hardware-header__hardware-header-wrapper__1XUHM .hardware-header__stage-size-toggle-group__3HnyG .hardware-header__stage-button__1UZ-G div { font-size: 0; } .hardware-header__hardware-header-wrapper__1XUHM .hardware-header__stage-size-toggle-group__3HnyG .hardware-header__stage-button__1UZ-G.hardware-header__stage-button-toggled-off__3_rM1 { filter: saturate(0); opacity: 0.4; } .hardware-header__hardware-header-wrapper__1XUHM .hardware-header__stage-size-toggle-group__3HnyG .hardware-header__stage-button__1UZ-G .hardware-header__stage-button-icon__h-zBN { width: 15px; object-fit: cover; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .tutorial-modal__flex-center__1p4Ds { display: flex; align-items: center; justify-content: center; } .tutorial-modal__full-filled__1cE3X { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .tutorial-modal__modal-mask__1TjE_ { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .tutorial-modal__modal-mask__1TjE_ .tutorial-modal__modal-wrap__1-TX0 { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .tutorial-modal__modal-mask__1TjE_ .tutorial-modal__modal-wrap__1-TX0 .tutorial-modal__modal-header-wrap__3Q-k6 { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .tutorial-modal__modal-mask__1TjE_ .tutorial-modal__modal-wrap__1-TX0 .tutorial-modal__modal-header-wrap__3Q-k6 .tutorial-modal__modal-header-bg__3heCl { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .tutorial-modal__modal-mask__1TjE_ .tutorial-modal__modal-wrap__1-TX0 .tutorial-modal__modal-header-wrap__3Q-k6 .tutorial-modal__modal-header-label__JtXNP { flex-shrink: 0; font-size: 16px; font-weight: bold; } .tutorial-modal__modal-mask__1TjE_ .tutorial-modal__modal-wrap__1-TX0 .tutorial-modal__modal-header-wrap__3Q-k6 .tutorial-modal__modal-header-close__rxi8N { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .tutorial-modal__modal-mask__1TjE_ .tutorial-modal__modal-wrap__1-TX0 .tutorial-modal__modal-header-wrap__3Q-k6 .tutorial-modal__modal-header-close__rxi8N:hover { color: #98a2b4; } .tutorial-modal__modal-mask__1TjE_ .tutorial-modal__modal-wrap__1-TX0 .tutorial-modal__modal-body-wrap__14e1l { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .tutorial-modal__modal-mask__1TjE_ .tutorial-modal__modal-wrap__1-TX0 .tutorial-modal__modal-footer-wrap__3fsON { flex-shrink: 0; display: flex; } .tutorial-modal__modal-header__NaALT { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .tutorial-modal__modal-header__NaALT .tutorial-modal__modal-header-upload__2S1-1 { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .tutorial-modal__modal-header__NaALT .tutorial-modal__modal-header-upload__2S1-1:hover { background-color: #e0e9ff; } .tutorial-modal__modal-header__NaALT .tutorial-modal__modal-header-upload__2S1-1:active { background-color: #ccdaff; } .tutorial-modal__modal-header__NaALT .tutorial-modal__modal-header-upload__2S1-1 .tutorial-modal__upload-img__3UPKx { font-size: 16px; margin-right: calc(2px); } .tutorial-modal__modal-header__NaALT .tutorial-modal__modal-header-upload__2S1-1 .tutorial-modal__upload-label__30jrV { font-size: 14px; } .tutorial-modal__modal-header__NaALT .tutorial-modal__modal-header-upload__2S1-1 .tutorial-modal__upload-input__1Dx1w { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .tutorial-modal__modal-header__NaALT .tutorial-modal__modal-header-search__3cMBT { position: relative; } .tutorial-modal__modal-header__NaALT .tutorial-modal__modal-header-search__3cMBT .tutorial-modal__search-input__22ptx { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .tutorial-modal__modal-header__NaALT .tutorial-modal__modal-header-search__3cMBT .tutorial-modal__search-input__22ptx::-webkit-input-placeholder { color: #98a2b4; } .tutorial-modal__modal-header__NaALT .tutorial-modal__modal-header-search__3cMBT .tutorial-modal__search-input__22ptx::-moz-placeholder { color: #98a2b4; } .tutorial-modal__modal-header__NaALT .tutorial-modal__modal-header-search__3cMBT .tutorial-modal__search-input__22ptx:-ms-input-placeholder { color: #98a2b4; } .tutorial-modal__modal-header__NaALT .tutorial-modal__modal-header-search__3cMBT .tutorial-modal__search-input__22ptx:hover { border-color: #d1d7e1; } .tutorial-modal__modal-header__NaALT .tutorial-modal__modal-header-search__3cMBT .tutorial-modal__search-input__22ptx:active { border-color: #d1d7e1; } .tutorial-modal__modal-header__NaALT .tutorial-modal__modal-header-search__3cMBT .tutorial-modal__search-img__Z7k78 { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .tutorial-modal__modal-body__vBwvm { flex-grow: 1; display: flex; } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-left__12Vy_, .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-main__1EpNr { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-left__12Vy_ { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-left__12Vy_ .tutorial-modal__modal-body-left-scroll__1g0Ao { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-left__12Vy_ .tutorial-modal__modal-body-left-scroll__1g0Ao .tutorial-modal__modal-body-left-inner__3slnE { width: 121px; padding: calc(12px); color: #5e6b81; } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-left__12Vy_ .tutorial-modal__modal-body-left-scroll__1g0Ao .tutorial-modal__modal-body-left-inner__3slnE .tutorial-modal__menu-item-current__2GPYd { color: var(--theme-primary); background-color: #e0e9ff; } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-left__12Vy_ .tutorial-modal__modal-body-left-scroll__1g0Ao .tutorial-modal__modal-body-left-inner__3slnE .tutorial-modal__menu-item__St4o5 { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-left__12Vy_ .tutorial-modal__modal-body-left-scroll__1g0Ao .tutorial-modal__modal-body-left-inner__3slnE .tutorial-modal__menu-item__St4o5:hover { background-color: #edeff5; } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-left__12Vy_ .tutorial-modal__modal-body-left-scroll__1g0Ao .tutorial-modal__modal-body-left-inner__3slnE .tutorial-modal__menu-item__St4o5 .tutorial-modal__menu-item-img__3KV_1 { flex-shrink: 0; width: 20px; margin-right: 8px; } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-left__12Vy_ .tutorial-modal__modal-body-left-scroll__1g0Ao .tutorial-modal__modal-body-left-inner__3slnE .tutorial-modal__menu-item__St4o5 .tutorial-modal__menu-item-label__3Tz1c { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-main__1EpNr { padding: calc(12px) 0; } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-main__1EpNr .tutorial-modal__modal-body-main-scroll__F9mAK { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-main__1EpNr .tutorial-modal__modal-body-main-scroll__F9mAK .tutorial-modal__modal-body-main-inner__3ut0G { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-main__1EpNr .tutorial-modal__modal-body-main-scroll__F9mAK .tutorial-modal__modal-body-main-inner__3ut0G .tutorial-modal__selector-btn-add__CnEXn, .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-main__1EpNr .tutorial-modal__modal-body-main-scroll__F9mAK .tutorial-modal__modal-body-main-inner__3ut0G .tutorial-modal__selector-btn-item__8rvtG { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-main__1EpNr .tutorial-modal__modal-body-main-scroll__F9mAK .tutorial-modal__modal-body-main-inner__3ut0G .tutorial-modal__selector-btn-add__CnEXn:hover, .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-main__1EpNr .tutorial-modal__modal-body-main-scroll__F9mAK .tutorial-modal__modal-body-main-inner__3ut0G .tutorial-modal__selector-btn-item__8rvtG:hover { background-color: #e0e9ff; } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-main__1EpNr .tutorial-modal__modal-body-main-scroll__F9mAK .tutorial-modal__modal-body-main-inner__3ut0G .tutorial-modal__selector-btn-add__CnEXn:active, .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-main__1EpNr .tutorial-modal__modal-body-main-scroll__F9mAK .tutorial-modal__modal-body-main-inner__3ut0G .tutorial-modal__selector-btn-item__8rvtG:active { background-color: #ccdaff; } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-main__1EpNr .tutorial-modal__modal-body-main-scroll__F9mAK .tutorial-modal__modal-body-main-inner__3ut0G .tutorial-modal__selector-btn-add__CnEXn:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-main__1EpNr .tutorial-modal__modal-body-main-scroll__F9mAK .tutorial-modal__modal-body-main-inner__3ut0G .tutorial-modal__selector-btn-add__CnEXn:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-main__1EpNr .tutorial-modal__modal-body-main-scroll__F9mAK .tutorial-modal__modal-body-main-inner__3ut0G .tutorial-modal__selector-btn-add__CnEXn .tutorial-modal__add-img__3xDWI { font-size: 28px; height: auto; margin-bottom: 8px; } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-main__1EpNr .tutorial-modal__modal-body-main-scroll__F9mAK .tutorial-modal__modal-body-main-inner__3ut0G .tutorial-modal__selector-btn-add__CnEXn .tutorial-modal__add-label__1bJZC { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-main__1EpNr .tutorial-modal__modal-body-main-scroll__F9mAK .tutorial-modal__modal-body-main-inner__3ut0G .tutorial-modal__selector-btn-item__8rvtG { justify-content: space-between; } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-main__1EpNr .tutorial-modal__modal-body-main-scroll__F9mAK .tutorial-modal__modal-body-main-inner__3ut0G .tutorial-modal__selector-btn-item__8rvtG .tutorial-modal__item-img__36cBF { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-main__1EpNr .tutorial-modal__modal-body-main-scroll__F9mAK .tutorial-modal__modal-body-main-inner__3ut0G .tutorial-modal__selector-btn-item__8rvtG .tutorial-modal__item-img__36cBF img { width: auto; height: 105px; } .tutorial-modal__modal-body__vBwvm .tutorial-modal__modal-body-main__1EpNr .tutorial-modal__modal-body-main-scroll__F9mAK .tutorial-modal__modal-body-main-inner__3ut0G .tutorial-modal__selector-btn-item__8rvtG .tutorial-modal__item-label__3xGAg { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .tutorial-modal__modal-footer__3wjaK { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .tutorial-modal__selector-btn-add__CnEXn, .tutorial-modal__selector-btn-item__8rvtG { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .tutorial-modal__selector-btn-add__CnEXn { background-color: var(--selector-sprite-bg_primary); } .tutorial-modal__selector-btn-add__CnEXn:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .tutorial-modal__selector-btn-add__CnEXn:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .tutorial-modal__selector-btn-add__CnEXn .tutorial-modal__add-img__3xDWI { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .tutorial-modal__selector-btn-add__CnEXn .tutorial-modal__add-label__1bJZC { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .tutorial-modal__selector-btn-item__8rvtG { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .tutorial-modal__selector-btn-item__8rvtG .tutorial-modal__item-img__36cBF { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .tutorial-modal__selector-btn-item__8rvtG .tutorial-modal__item-img__36cBF img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .tutorial-modal__selector-btn-item__8rvtG .tutorial-modal__item-label__3xGAg { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .tutorial-modal__selector-btn-item__8rvtG:hover { background-color: var(--selector-sprite-bg_primary); } .tutorial-modal__selector-btn-item__8rvtG:hover .tutorial-modal__item-img__36cBF { border-color: var(--selector-sprite-bg_primary); } .tutorial-modal__selector-btn-item_selected__R_K8i { background-color: var(--selector-sprite-bg_primary); } .tutorial-modal__selector-btn-item_selected__R_K8i .tutorial-modal__item-img__36cBF { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .tutorial-modal__menu-bar-btn__A9F8T { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .tutorial-modal__menu-bar-btn_green__8z2k-, .tutorial-modal__menu-bar-btn_create__2hOKy { background-color: #3cdc8f; } .tutorial-modal__menu-bar-btn_green__8z2k-:hover, .tutorial-modal__menu-bar-btn_create__2hOKy:hover { background-color: #00d374; } .tutorial-modal__menu-bar-btn_green__8z2k-:active, .tutorial-modal__menu-bar-btn_create__2hOKy:active { background-color: #00d374; } .tutorial-modal__menu-bar-btn_save__EKEdW, .tutorial-modal__menu-bar-btn_reset__brofk { background-color: #6ac8ff; } .tutorial-modal__menu-bar-btn_save__EKEdW:hover, .tutorial-modal__menu-bar-btn_reset__brofk:hover { background-color: #57bcfe; } .tutorial-modal__menu-bar-btn_save__EKEdW:active, .tutorial-modal__menu-bar-btn_reset__brofk:active { background-color: #4fb0fc; } .tutorial-modal__menu-bar-btn_submit__1jOWU, .tutorial-modal__menu-bar-btn_open__1pOu4 { background-color: #ff9e23; } .tutorial-modal__menu-bar-btn_submit__1jOWU:hover, .tutorial-modal__menu-bar-btn_open__1pOu4:hover { background-color: #f47b04; } .tutorial-modal__menu-bar-btn_submit__1jOWU:active, .tutorial-modal__menu-bar-btn_open__1pOu4:active { background-color: #fe8f22; } .tutorial-modal__menu-bar-btn_link__2ANeI { background-color: #e8efff; color: var(--theme-primary); } .tutorial-modal__menu-bar-btn_link__2ANeI:hover { background-color: #b6c7ff; } .tutorial-modal__menu-bar-btn_link__2ANeI:active { background-color: #cfdcff; } .tutorial-modal__menu-bar-btn_disabled__UOV5U { color: #565266; background-color: #e6e9ed; } .tutorial-modal__menu-bar-btn_disabled__UOV5U:hover { cursor: not-allowed; } .tutorial-modal__menu-bar-btn_help__2fCQc { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .tutorial-modal__menu-bar-btn_help__2fCQc:hover { background-color: #8398ff; } .tutorial-modal__menu-bar-btn_help__2fCQc:active { background-color: #8ca3ff; } .tutorial-modal__menu-bar-separator__3jf8w { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } .tutorial-modal__tutorial-mask__341t4 { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .tutorial-modal__tutorial-mask__341t4 .tutorial-modal__modal-wrap__1-TX0 { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .tutorial-modal__tutorial-mask__341t4 .tutorial-modal__modal-wrap__1-TX0 .tutorial-modal__modal-header-wrap__3Q-k6 { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .tutorial-modal__tutorial-mask__341t4 .tutorial-modal__modal-wrap__1-TX0 .tutorial-modal__modal-header-wrap__3Q-k6 .tutorial-modal__modal-header-bg__3heCl { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .tutorial-modal__tutorial-mask__341t4 .tutorial-modal__modal-wrap__1-TX0 .tutorial-modal__modal-header-wrap__3Q-k6 .tutorial-modal__modal-header-label__JtXNP { flex-shrink: 0; font-size: 16px; font-weight: bold; } .tutorial-modal__tutorial-mask__341t4 .tutorial-modal__modal-wrap__1-TX0 .tutorial-modal__modal-header-wrap__3Q-k6 .tutorial-modal__modal-header-close__rxi8N { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .tutorial-modal__tutorial-mask__341t4 .tutorial-modal__modal-wrap__1-TX0 .tutorial-modal__modal-header-wrap__3Q-k6 .tutorial-modal__modal-header-close__rxi8N:hover { color: #98a2b4; } .tutorial-modal__tutorial-mask__341t4 .tutorial-modal__modal-wrap__1-TX0 .tutorial-modal__modal-body-wrap__14e1l { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .tutorial-modal__tutorial-mask__341t4 .tutorial-modal__modal-wrap__1-TX0 .tutorial-modal__modal-footer-wrap__3fsON { flex-shrink: 0; display: flex; } .tutorial-modal__tutorial-container__1FGC5 { height: 148px; width: 296px; background: #ffffff; box-shadow: inset 0px -6px 0px #dbdfe6; border-radius: 24px; display: flex; box-sizing: border-box; flex-direction: column; padding: 48px 40px 28px; justify-content: space-between; position: relative; } .tutorial-modal__tutorial-container__1FGC5 img { position: absolute; } .tutorial-modal__tutorial-container__1FGC5 .tutorial-modal__airplane__yO1p- { object-fit: contain; top: -128px; left: -81px; width: 241px; } .tutorial-modal__tutorial-container__1FGC5 .tutorial-modal__cartoon__F8vRe { object-fit: contain; width: 80px; top: -20px; right: -27px; } .tutorial-modal__tutorial-container__1FGC5 .tutorial-modal__tutorial-msg__2CvQ2 { text-align: center; font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-style: normal; font-weight: 600; font-size: 18px; line-height: 16px; color: #4a5881; } .tutorial-modal__tutorial-container__1FGC5 .tutorial-modal__tutorial-btn-wrapper__3VP8T { display: flex; justify-content: space-between; } .tutorial-modal__tutorial-container__1FGC5 .tutorial-modal__tutorial-btn-wrapper__3VP8T button { width: 92px; height: 36px; border-radius: 27px; font-style: normal; font-weight: 600; font-size: 16px; line-height: 16px; text-align: center; color: #ffffff; border: none; outline: none; position: relative; transform: translate(0, 0px); transition: 0.3s; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .tutorial-modal__tutorial-container__1FGC5 .tutorial-modal__tutorial-btn-wrapper__3VP8T button::after { content: ''; display: block; height: 100%; width: 100%; border-radius: inherit; position: absolute; left: 0; top: 0; background-color: transparent; transition: 0.3s; } .tutorial-modal__tutorial-container__1FGC5 .tutorial-modal__tutorial-btn-wrapper__3VP8T button:hover::after { background-color: rgba(0, 0, 0, 0.08); } .tutorial-modal__tutorial-container__1FGC5 .tutorial-modal__tutorial-btn-wrapper__3VP8T button:active { box-shadow: 0 0 0 rgba(0, 0, 0, 0); transform: translate(0, 3px); } .tutorial-modal__tutorial-container__1FGC5 .tutorial-modal__tutorial-btn-wrapper__3VP8T [data-btn='y'] { background: #ffc02c; box-shadow: inset 0px -3px 0px rgba(249, 143, 67, 0.4); } .tutorial-modal__tutorial-container__1FGC5 .tutorial-modal__tutorial-btn-wrapper__3VP8T [data-btn='n'] { background: #d3d3d3; box-shadow: inset 0px -3px 0px rgba(101, 101, 101, 0.4); } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .gui__flex-center__2ADpO { display: flex; align-items: center; justify-content: center; } .gui__full-filled__lhvOk { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .gui__modal-mask__v9vtj { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .gui__modal-mask__v9vtj .gui__modal-wrap__2BJyJ { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .gui__modal-mask__v9vtj .gui__modal-wrap__2BJyJ .gui__modal-header-wrap__lbogj { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .gui__modal-mask__v9vtj .gui__modal-wrap__2BJyJ .gui__modal-header-wrap__lbogj .gui__modal-header-bg__OPC1J { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .gui__modal-mask__v9vtj .gui__modal-wrap__2BJyJ .gui__modal-header-wrap__lbogj .gui__modal-header-label__3kPd9 { flex-shrink: 0; font-size: 16px; font-weight: bold; } .gui__modal-mask__v9vtj .gui__modal-wrap__2BJyJ .gui__modal-header-wrap__lbogj .gui__modal-header-close__1fnDc { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui__modal-mask__v9vtj .gui__modal-wrap__2BJyJ .gui__modal-header-wrap__lbogj .gui__modal-header-close__1fnDc:hover { color: #98a2b4; } .gui__modal-mask__v9vtj .gui__modal-wrap__2BJyJ .gui__modal-body-wrap__31jnj { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .gui__modal-mask__v9vtj .gui__modal-wrap__2BJyJ .gui__modal-footer-wrap__1CP0- { flex-shrink: 0; display: flex; } .gui__modal-header__3FHis { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .gui__modal-header__3FHis .gui__modal-header-upload__1vV5O { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .gui__modal-header__3FHis .gui__modal-header-upload__1vV5O:hover { background-color: #e0e9ff; } .gui__modal-header__3FHis .gui__modal-header-upload__1vV5O:active { background-color: #ccdaff; } .gui__modal-header__3FHis .gui__modal-header-upload__1vV5O .gui__upload-img__2I1it { font-size: 16px; margin-right: calc(2px); } .gui__modal-header__3FHis .gui__modal-header-upload__1vV5O .gui__upload-label__2MbQa { font-size: 14px; } .gui__modal-header__3FHis .gui__modal-header-upload__1vV5O .gui__upload-input__79oIZ { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui__modal-header__3FHis .gui__modal-header-search__3sW2v { position: relative; } .gui__modal-header__3FHis .gui__modal-header-search__3sW2v .gui__search-input__qIpIY { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .gui__modal-header__3FHis .gui__modal-header-search__3sW2v .gui__search-input__qIpIY::-webkit-input-placeholder { color: #98a2b4; } .gui__modal-header__3FHis .gui__modal-header-search__3sW2v .gui__search-input__qIpIY::-moz-placeholder { color: #98a2b4; } .gui__modal-header__3FHis .gui__modal-header-search__3sW2v .gui__search-input__qIpIY:-ms-input-placeholder { color: #98a2b4; } .gui__modal-header__3FHis .gui__modal-header-search__3sW2v .gui__search-input__qIpIY:hover { border-color: #d1d7e1; } .gui__modal-header__3FHis .gui__modal-header-search__3sW2v .gui__search-input__qIpIY:active { border-color: #d1d7e1; } .gui__modal-header__3FHis .gui__modal-header-search__3sW2v .gui__search-img__ec6Vr { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui__modal-body__2ojKO { flex-grow: 1; display: flex; } .gui__modal-body__2ojKO .gui__modal-body-left__2O8_B, .gui__modal-body__2ojKO .gui__modal-body-main__JoYHJ { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .gui__modal-body__2ojKO .gui__modal-body-left__2O8_B { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .gui__modal-body__2ojKO .gui__modal-body-left__2O8_B .gui__modal-body-left-scroll__EpNT- { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .gui__modal-body__2ojKO .gui__modal-body-left__2O8_B .gui__modal-body-left-scroll__EpNT- .gui__modal-body-left-inner__2A88s { width: 121px; padding: calc(12px); color: #5e6b81; } .gui__modal-body__2ojKO .gui__modal-body-left__2O8_B .gui__modal-body-left-scroll__EpNT- .gui__modal-body-left-inner__2A88s .gui__menu-item-current__2NlJ8 { color: var(--theme-primary); background-color: #e0e9ff; } .gui__modal-body__2ojKO .gui__modal-body-left__2O8_B .gui__modal-body-left-scroll__EpNT- .gui__modal-body-left-inner__2A88s .gui__menu-item__1BMYR { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui__modal-body__2ojKO .gui__modal-body-left__2O8_B .gui__modal-body-left-scroll__EpNT- .gui__modal-body-left-inner__2A88s .gui__menu-item__1BMYR:hover { background-color: #edeff5; } .gui__modal-body__2ojKO .gui__modal-body-left__2O8_B .gui__modal-body-left-scroll__EpNT- .gui__modal-body-left-inner__2A88s .gui__menu-item__1BMYR .gui__menu-item-img__jo67h { flex-shrink: 0; width: 20px; margin-right: 8px; } .gui__modal-body__2ojKO .gui__modal-body-left__2O8_B .gui__modal-body-left-scroll__EpNT- .gui__modal-body-left-inner__2A88s .gui__menu-item__1BMYR .gui__menu-item-label__1-jN2 { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .gui__modal-body__2ojKO .gui__modal-body-main__JoYHJ { padding: calc(12px) 0; } .gui__modal-body__2ojKO .gui__modal-body-main__JoYHJ .gui__modal-body-main-scroll__3_nBv { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .gui__modal-body__2ojKO .gui__modal-body-main__JoYHJ .gui__modal-body-main-scroll__3_nBv .gui__modal-body-main-inner__2DIKb { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .gui__modal-body__2ojKO .gui__modal-body-main__JoYHJ .gui__modal-body-main-scroll__3_nBv .gui__modal-body-main-inner__2DIKb .gui__selector-btn-add__V1Wi1, .gui__modal-body__2ojKO .gui__modal-body-main__JoYHJ .gui__modal-body-main-scroll__3_nBv .gui__modal-body-main-inner__2DIKb .gui__selector-btn-item__1ySoU { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .gui__modal-body__2ojKO .gui__modal-body-main__JoYHJ .gui__modal-body-main-scroll__3_nBv .gui__modal-body-main-inner__2DIKb .gui__selector-btn-add__V1Wi1:hover, .gui__modal-body__2ojKO .gui__modal-body-main__JoYHJ .gui__modal-body-main-scroll__3_nBv .gui__modal-body-main-inner__2DIKb .gui__selector-btn-item__1ySoU:hover { background-color: #e0e9ff; } .gui__modal-body__2ojKO .gui__modal-body-main__JoYHJ .gui__modal-body-main-scroll__3_nBv .gui__modal-body-main-inner__2DIKb .gui__selector-btn-add__V1Wi1:active, .gui__modal-body__2ojKO .gui__modal-body-main__JoYHJ .gui__modal-body-main-scroll__3_nBv .gui__modal-body-main-inner__2DIKb .gui__selector-btn-item__1ySoU:active { background-color: #ccdaff; } .gui__modal-body__2ojKO .gui__modal-body-main__JoYHJ .gui__modal-body-main-scroll__3_nBv .gui__modal-body-main-inner__2DIKb .gui__selector-btn-add__V1Wi1:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .gui__modal-body__2ojKO .gui__modal-body-main__JoYHJ .gui__modal-body-main-scroll__3_nBv .gui__modal-body-main-inner__2DIKb .gui__selector-btn-add__V1Wi1:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .gui__modal-body__2ojKO .gui__modal-body-main__JoYHJ .gui__modal-body-main-scroll__3_nBv .gui__modal-body-main-inner__2DIKb .gui__selector-btn-add__V1Wi1 .gui__add-img__pSnBx { font-size: 28px; height: auto; margin-bottom: 8px; } .gui__modal-body__2ojKO .gui__modal-body-main__JoYHJ .gui__modal-body-main-scroll__3_nBv .gui__modal-body-main-inner__2DIKb .gui__selector-btn-add__V1Wi1 .gui__add-label__1o8N5 { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .gui__modal-body__2ojKO .gui__modal-body-main__JoYHJ .gui__modal-body-main-scroll__3_nBv .gui__modal-body-main-inner__2DIKb .gui__selector-btn-item__1ySoU { justify-content: space-between; } .gui__modal-body__2ojKO .gui__modal-body-main__JoYHJ .gui__modal-body-main-scroll__3_nBv .gui__modal-body-main-inner__2DIKb .gui__selector-btn-item__1ySoU .gui__item-img__3ht4Z { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .gui__modal-body__2ojKO .gui__modal-body-main__JoYHJ .gui__modal-body-main-scroll__3_nBv .gui__modal-body-main-inner__2DIKb .gui__selector-btn-item__1ySoU .gui__item-img__3ht4Z img { width: auto; height: 105px; } .gui__modal-body__2ojKO .gui__modal-body-main__JoYHJ .gui__modal-body-main-scroll__3_nBv .gui__modal-body-main-inner__2DIKb .gui__selector-btn-item__1ySoU .gui__item-label__2zPRV { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .gui__modal-footer__HG93Q { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .gui__selector-btn-add__V1Wi1, .gui__selector-btn-item__1ySoU { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .gui__selector-btn-add__V1Wi1 { background-color: var(--selector-sprite-bg_primary); } .gui__selector-btn-add__V1Wi1:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .gui__selector-btn-add__V1Wi1:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .gui__selector-btn-add__V1Wi1 .gui__add-img__pSnBx { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .gui__selector-btn-add__V1Wi1 .gui__add-label__1o8N5 { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .gui__selector-btn-item__1ySoU { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .gui__selector-btn-item__1ySoU .gui__item-img__3ht4Z { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .gui__selector-btn-item__1ySoU .gui__item-img__3ht4Z img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .gui__selector-btn-item__1ySoU .gui__item-label__2zPRV { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .gui__selector-btn-item__1ySoU:hover { background-color: var(--selector-sprite-bg_primary); } .gui__selector-btn-item__1ySoU:hover .gui__item-img__3ht4Z { border-color: var(--selector-sprite-bg_primary); } .gui__selector-btn-item_selected__1dJN8 { background-color: var(--selector-sprite-bg_primary); } .gui__selector-btn-item_selected__1dJN8 .gui__item-img__3ht4Z { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .gui__menu-bar-btn__B_nkP { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .gui__menu-bar-btn_green__GpjFq, .gui__menu-bar-btn_create__2UzhV { background-color: #3cdc8f; } .gui__menu-bar-btn_green__GpjFq:hover, .gui__menu-bar-btn_create__2UzhV:hover { background-color: #00d374; } .gui__menu-bar-btn_green__GpjFq:active, .gui__menu-bar-btn_create__2UzhV:active { background-color: #00d374; } .gui__menu-bar-btn_save__25N2_, .gui__menu-bar-btn_reset__1JC0I { background-color: #6ac8ff; } .gui__menu-bar-btn_save__25N2_:hover, .gui__menu-bar-btn_reset__1JC0I:hover { background-color: #57bcfe; } .gui__menu-bar-btn_save__25N2_:active, .gui__menu-bar-btn_reset__1JC0I:active { background-color: #4fb0fc; } .gui__menu-bar-btn_submit__3ceTs, .gui__menu-bar-btn_open__2mW6q { background-color: #ff9e23; } .gui__menu-bar-btn_submit__3ceTs:hover, .gui__menu-bar-btn_open__2mW6q:hover { background-color: #f47b04; } .gui__menu-bar-btn_submit__3ceTs:active, .gui__menu-bar-btn_open__2mW6q:active { background-color: #fe8f22; } .gui__menu-bar-btn_link__o-lQn { background-color: #e8efff; color: var(--theme-primary); } .gui__menu-bar-btn_link__o-lQn:hover { background-color: #b6c7ff; } .gui__menu-bar-btn_link__o-lQn:active { background-color: #cfdcff; } .gui__menu-bar-btn_disabled__3mLrM { color: #565266; background-color: #e6e9ed; } .gui__menu-bar-btn_disabled__3mLrM:hover { cursor: not-allowed; } .gui__menu-bar-btn_help__2Uy8X { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .gui__menu-bar-btn_help__2Uy8X:hover { background-color: #8398ff; } .gui__menu-bar-btn_help__2Uy8X:active { background-color: #8ca3ff; } .gui__menu-bar-separator__2OtI7 { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .gui__add-device-wrap__2A0uX { display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; position: fixed; bottom: 0; z-index: 42; background-color: #f7f7ff; } .gui__add-device-wrap__2A0uX .gui__add-device-btn__3Rjw2 { display: flex; align-items: center; justify-content: center; height: 34px; width: 34px; border-radius: 8px; background-color: #ebecff; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .gui__add-device-wrap__2A0uX .gui__add-device-btn__3Rjw2:hover { background-color: #e0e2ff; } .gui__add-device-wrap__2A0uX .gui__add-device-btn__3Rjw2 .gui__add-device-icon__3tRdr { font-size: 24px; margin: 2px 0 0 4px; color: var(--theme-primary); } .gui__page-wrapper__7-S6b { width: 100%; height: 100%; background-color: var(--theme-primary); display: flex; flex-direction: column; } .gui__page-wrapper__7-S6b .gui__alerts-container__1OKVf { display: flex; justify-content: center; width: 100%; z-index: 490; position: absolute; margin-top: 53px; pointer-events: none; } .gui__page-wrapper__7-S6b .gui__body-wrapper__2dVBC { flex: 1 0; background-color: #f7f7ff; display: flex; /* Make 2 columns: a) for the blocks + workspace panes, and b) for combined stage menu + stage + sprite/stage selectors */ overflow-y: hidden; border-radius: 8px 8px 0 0; position: relative; } .gui__page-wrapper__7-S6b .gui__body-wrapper__2dVBC.gui__body-wrapper__no-menu__2neGo { height: 100%; } .gui__page-wrapper__7-S6b .gui__body-wrapper__2dVBC .gui__stage-and-target-wrapper__GNQOD { /* Makes rows for children: 1) stage menu 2) stage 3) sprite/stage selectors Only reason we need this, is so .targetWrapper, which holds the selectors, goes to full vertical height of the window */ display: flex; flex-direction: column; /* pad entire wrapper to the left and right; allow children to fill width */ /* padding-left: @space; */ /* this will only ever be as wide as the stage */ flex-basis: 0; position: relative; } .gui__page-wrapper__7-S6b .gui__body-wrapper__2dVBC .gui__stage-and-target-wrapper__GNQOD.gui__show__-SDCo { display: flex; } .gui__page-wrapper__7-S6b .gui__body-wrapper__2dVBC .gui__stage-and-target-wrapper__GNQOD.gui__hidden__2Ud-o { display: none; width: 0; height: 0; } .gui__page-wrapper__7-S6b .gui__body-wrapper__2dVBC .gui__editor-wrapper__2_6de { /* This is carefully balanced-- the minimum width at which the GUI will be displayed is 1024px. At that size, the stage pane is 408px wide, with @space-primary of padding to each side. However, we must also add the border width to the stage pane. All-in-all, the stage pane's final width is 408px + (@space-primary + @border-width-primary * 2) (one border & padding per left/right side). @todo This is in place to prevent "doubling up" of horizontal scrollbars in narrow windows, but there are likely much better ways to solve that (e.g. undo #2124, remove this flex-basis entirely). However, they run their own risks of breaking things, so let's just leave this as-is for the time being. */ flex: 1 0; position: relative; display: flex; flex-direction: column; border-left: 1px solid #ccdcff; } .gui__page-wrapper__7-S6b .gui__body-wrapper__2dVBC .gui__editor-wrapper__2_6de.gui__hidden__2Ud-o { display: none; width: 0; height: 0; } .gui__page-wrapper__7-S6b .gui__body-wrapper__2dVBC .gui__code-wrapper__uzLIe { display: flex; flex-direction: column; } /* Make the (background) page not scrollable when modals are open This CSS class is automatically added to the body when react-modal is open */ .ReactModal__Body--open { overflow: hidden; } .tutorial .blockyVisibleControl { pointer-events: none; transform: translate(50px, 0px) !important; opacity: 1 !important; -webkit-clip-path: none !important; clip-path: none !important; box-shadow: 3px 0px 12px rgba(72, 102, 179, 0.06); } .tutorial .blockyVisibleControl .blocklyWorkspace { pointer-events: all; } .ant-switch-checked .ant-switch-handle { left: calc(100% - 18px - 2px); } .ant-switch-small.ant-switch-checked .ant-switch-handle { left: calc(100% - 14px); } .active-line-number.line-numbers::after { content: ''; z-index: -1; display: block; width: 30px; height: 100%; position: absolute; top: 0; left: 3px; background-repeat: no-repeat; background-size: contain; background-image: url(https://ybc-online.oss-cn-beijing.aliyuncs.com/ybccrm/ada-school-ide/img/common/editor-highlighter.png); } .margin-view-overlays { font-weight: 700 !important; } .margin-view-overlays > div { display: flex !important; justify-content: flex-start; } .margin-view-overlays > div .line-numbers { position: static !important; width: unset !important; margin-left: 8px !important; } [data-field-type='button'] { cursor: url(static/cursor/cursor-pointer.cur), pointer; } .scratchRgbPicker { border-radius: 8px; display: flex; flex-wrap: wrap; overflow: hidden; padding: 7px; box-sizing: border-box; } .scratchRgbPicker span { overflow: hidden; margin: 5px; display: block; height: 18px; width: 18px; box-sizing: content-box; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 2px; border-width: 2px; border-style: solid; border-color: rgba(0, 0, 0, 0); border-radius: 50%; transition: border-color 0.3s; } .scratchRgbPicker span:hover { border-color: rgba(0, 0, 0, 0.2); } .scratchRgbPicker span:active { border-color: rgba(0, 0, 0, 0.3); } .scratchRgbPicker span.white { border-color: rgba(0, 0, 0, 0.2); } .scratchRgbPicker span.white:hover { border-color: rgba(0, 0, 0, 0.2); } .scratchRgbPicker span.white:active { border-color: rgba(0, 0, 0, 0.3); } .scratchRgbPicker span.black { border-color: #000000; } .scratchRgbPicker span.black:hover { border-color: #676767; } .scratchRgbPicker span.black:active { border-color: #6a6a6a; } .scratchHuePicker .goog-slider-horizontal { width: 256px !important; height: 16px !important; margin: 0 16px 18px 16px; } .scratchHuePicker .goog-slider-thumb { cursor: url(static/cursor/cursor-pointer.cur), pointer; height: 16.8px !important; width: 16.8px !important; top: -0.4px !important; box-shadow: 0 0 0 5.6px rgb(0 0 0 / 20%) !important; transition: box-shadow 0.3s; } .scratchHuePicker .goog-slider-thumb:hover { box-shadow: 0 0 0 5.6px rgb(0 0 0 / 30%) !important; } .scratchHuePicker .goog-slider-thumb:active { box-shadow: 0 0 0 5.6px rgb(0 0 0 / 40%) !important; } .scratchHuePicker .scratchColourPickerLabel { font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif'; font-style: normal !important; font-weight: normal !important; font-size: 14px !important; line-height: 14px !important; color: #555555 !important; margin: 16px 0 14px 16px !important; } .scratchHuePicker .scratchColourPickerLabel .scratchColourPickerLabelText { font-weight: unset; } .scratchHuePicker .scratchColourPickerLabel .scratchColourPickerReadout { margin-left: 12px; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .tab__flex-center__2eOQp { display: flex; align-items: center; justify-content: center; } .tab__full-filled__3jHYu { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .tab__modal-mask__3sI8y { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .tab__modal-mask__3sI8y .tab__modal-wrap__5jT30 { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .tab__modal-mask__3sI8y .tab__modal-wrap__5jT30 .tab__modal-header-wrap__1PuOa { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .tab__modal-mask__3sI8y .tab__modal-wrap__5jT30 .tab__modal-header-wrap__1PuOa .tab__modal-header-bg__32cTQ { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .tab__modal-mask__3sI8y .tab__modal-wrap__5jT30 .tab__modal-header-wrap__1PuOa .tab__modal-header-label__2_hC9 { flex-shrink: 0; font-size: 16px; font-weight: bold; } .tab__modal-mask__3sI8y .tab__modal-wrap__5jT30 .tab__modal-header-wrap__1PuOa .tab__modal-header-close__qBEls { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .tab__modal-mask__3sI8y .tab__modal-wrap__5jT30 .tab__modal-header-wrap__1PuOa .tab__modal-header-close__qBEls:hover { color: #98a2b4; } .tab__modal-mask__3sI8y .tab__modal-wrap__5jT30 .tab__modal-body-wrap__1dHFY { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .tab__modal-mask__3sI8y .tab__modal-wrap__5jT30 .tab__modal-footer-wrap__1LbvQ { flex-shrink: 0; display: flex; } .tab__modal-header__3xywu { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .tab__modal-header__3xywu .tab__modal-header-upload__g-Zmy { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .tab__modal-header__3xywu .tab__modal-header-upload__g-Zmy:hover { background-color: #e0e9ff; } .tab__modal-header__3xywu .tab__modal-header-upload__g-Zmy:active { background-color: #ccdaff; } .tab__modal-header__3xywu .tab__modal-header-upload__g-Zmy .tab__upload-img__3iXed { font-size: 16px; margin-right: calc(2px); } .tab__modal-header__3xywu .tab__modal-header-upload__g-Zmy .tab__upload-label__1EaVN { font-size: 14px; } .tab__modal-header__3xywu .tab__modal-header-upload__g-Zmy .tab__upload-input__2FnlZ { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .tab__modal-header__3xywu .tab__modal-header-search__3S7Jo { position: relative; } .tab__modal-header__3xywu .tab__modal-header-search__3S7Jo .tab__search-input__1a5HK { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .tab__modal-header__3xywu .tab__modal-header-search__3S7Jo .tab__search-input__1a5HK::-webkit-input-placeholder { color: #98a2b4; } .tab__modal-header__3xywu .tab__modal-header-search__3S7Jo .tab__search-input__1a5HK::-moz-placeholder { color: #98a2b4; } .tab__modal-header__3xywu .tab__modal-header-search__3S7Jo .tab__search-input__1a5HK:-ms-input-placeholder { color: #98a2b4; } .tab__modal-header__3xywu .tab__modal-header-search__3S7Jo .tab__search-input__1a5HK:hover { border-color: #d1d7e1; } .tab__modal-header__3xywu .tab__modal-header-search__3S7Jo .tab__search-input__1a5HK:active { border-color: #d1d7e1; } .tab__modal-header__3xywu .tab__modal-header-search__3S7Jo .tab__search-img__XX5wZ { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .tab__modal-body__3PcDr { flex-grow: 1; display: flex; } .tab__modal-body__3PcDr .tab__modal-body-left__1YXS8, .tab__modal-body__3PcDr .tab__modal-body-main__3RHM_ { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .tab__modal-body__3PcDr .tab__modal-body-left__1YXS8 { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .tab__modal-body__3PcDr .tab__modal-body-left__1YXS8 .tab__modal-body-left-scroll__PNxPf { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .tab__modal-body__3PcDr .tab__modal-body-left__1YXS8 .tab__modal-body-left-scroll__PNxPf .tab__modal-body-left-inner__1_Yxl { width: 121px; padding: calc(12px); color: #5e6b81; } .tab__modal-body__3PcDr .tab__modal-body-left__1YXS8 .tab__modal-body-left-scroll__PNxPf .tab__modal-body-left-inner__1_Yxl .tab__menu-item-current__1APLe { color: var(--theme-primary); background-color: #e0e9ff; } .tab__modal-body__3PcDr .tab__modal-body-left__1YXS8 .tab__modal-body-left-scroll__PNxPf .tab__modal-body-left-inner__1_Yxl .tab__menu-item__2Gnkr { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .tab__modal-body__3PcDr .tab__modal-body-left__1YXS8 .tab__modal-body-left-scroll__PNxPf .tab__modal-body-left-inner__1_Yxl .tab__menu-item__2Gnkr:hover { background-color: #edeff5; } .tab__modal-body__3PcDr .tab__modal-body-left__1YXS8 .tab__modal-body-left-scroll__PNxPf .tab__modal-body-left-inner__1_Yxl .tab__menu-item__2Gnkr .tab__menu-item-img__1G25A { flex-shrink: 0; width: 20px; margin-right: 8px; } .tab__modal-body__3PcDr .tab__modal-body-left__1YXS8 .tab__modal-body-left-scroll__PNxPf .tab__modal-body-left-inner__1_Yxl .tab__menu-item__2Gnkr .tab__menu-item-label__3XdFP { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .tab__modal-body__3PcDr .tab__modal-body-main__3RHM_ { padding: calc(12px) 0; } .tab__modal-body__3PcDr .tab__modal-body-main__3RHM_ .tab__modal-body-main-scroll__3sb6X { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .tab__modal-body__3PcDr .tab__modal-body-main__3RHM_ .tab__modal-body-main-scroll__3sb6X .tab__modal-body-main-inner__2yQlI { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .tab__modal-body__3PcDr .tab__modal-body-main__3RHM_ .tab__modal-body-main-scroll__3sb6X .tab__modal-body-main-inner__2yQlI .tab__selector-btn-add__vsM84, .tab__modal-body__3PcDr .tab__modal-body-main__3RHM_ .tab__modal-body-main-scroll__3sb6X .tab__modal-body-main-inner__2yQlI .tab__selector-btn-item__2GT8M { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .tab__modal-body__3PcDr .tab__modal-body-main__3RHM_ .tab__modal-body-main-scroll__3sb6X .tab__modal-body-main-inner__2yQlI .tab__selector-btn-add__vsM84:hover, .tab__modal-body__3PcDr .tab__modal-body-main__3RHM_ .tab__modal-body-main-scroll__3sb6X .tab__modal-body-main-inner__2yQlI .tab__selector-btn-item__2GT8M:hover { background-color: #e0e9ff; } .tab__modal-body__3PcDr .tab__modal-body-main__3RHM_ .tab__modal-body-main-scroll__3sb6X .tab__modal-body-main-inner__2yQlI .tab__selector-btn-add__vsM84:active, .tab__modal-body__3PcDr .tab__modal-body-main__3RHM_ .tab__modal-body-main-scroll__3sb6X .tab__modal-body-main-inner__2yQlI .tab__selector-btn-item__2GT8M:active { background-color: #ccdaff; } .tab__modal-body__3PcDr .tab__modal-body-main__3RHM_ .tab__modal-body-main-scroll__3sb6X .tab__modal-body-main-inner__2yQlI .tab__selector-btn-add__vsM84:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .tab__modal-body__3PcDr .tab__modal-body-main__3RHM_ .tab__modal-body-main-scroll__3sb6X .tab__modal-body-main-inner__2yQlI .tab__selector-btn-add__vsM84:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .tab__modal-body__3PcDr .tab__modal-body-main__3RHM_ .tab__modal-body-main-scroll__3sb6X .tab__modal-body-main-inner__2yQlI .tab__selector-btn-add__vsM84 .tab__add-img__2yzwJ { font-size: 28px; height: auto; margin-bottom: 8px; } .tab__modal-body__3PcDr .tab__modal-body-main__3RHM_ .tab__modal-body-main-scroll__3sb6X .tab__modal-body-main-inner__2yQlI .tab__selector-btn-add__vsM84 .tab__add-label__22t1G { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .tab__modal-body__3PcDr .tab__modal-body-main__3RHM_ .tab__modal-body-main-scroll__3sb6X .tab__modal-body-main-inner__2yQlI .tab__selector-btn-item__2GT8M { justify-content: space-between; } .tab__modal-body__3PcDr .tab__modal-body-main__3RHM_ .tab__modal-body-main-scroll__3sb6X .tab__modal-body-main-inner__2yQlI .tab__selector-btn-item__2GT8M .tab__item-img__2VM7x { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .tab__modal-body__3PcDr .tab__modal-body-main__3RHM_ .tab__modal-body-main-scroll__3sb6X .tab__modal-body-main-inner__2yQlI .tab__selector-btn-item__2GT8M .tab__item-img__2VM7x img { width: auto; height: 105px; } .tab__modal-body__3PcDr .tab__modal-body-main__3RHM_ .tab__modal-body-main-scroll__3sb6X .tab__modal-body-main-inner__2yQlI .tab__selector-btn-item__2GT8M .tab__item-label__2mZeU { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .tab__modal-footer__VcCyW { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .tab__selector-btn-add__vsM84, .tab__selector-btn-item__2GT8M { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .tab__selector-btn-add__vsM84 { background-color: var(--selector-sprite-bg_primary); } .tab__selector-btn-add__vsM84:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .tab__selector-btn-add__vsM84:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .tab__selector-btn-add__vsM84 .tab__add-img__2yzwJ { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .tab__selector-btn-add__vsM84 .tab__add-label__22t1G { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .tab__selector-btn-item__2GT8M { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .tab__selector-btn-item__2GT8M .tab__item-img__2VM7x { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .tab__selector-btn-item__2GT8M .tab__item-img__2VM7x img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .tab__selector-btn-item__2GT8M .tab__item-label__2mZeU { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .tab__selector-btn-item__2GT8M:hover { background-color: var(--selector-sprite-bg_primary); } .tab__selector-btn-item__2GT8M:hover .tab__item-img__2VM7x { border-color: var(--selector-sprite-bg_primary); } .tab__selector-btn-item_selected__VwG6V { background-color: var(--selector-sprite-bg_primary); } .tab__selector-btn-item_selected__VwG6V .tab__item-img__2VM7x { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .tab__menu-bar-btn__vjgN6 { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .tab__menu-bar-btn_green__2V7jF, .tab__menu-bar-btn_create__2ccxb { background-color: #3cdc8f; } .tab__menu-bar-btn_green__2V7jF:hover, .tab__menu-bar-btn_create__2ccxb:hover { background-color: #00d374; } .tab__menu-bar-btn_green__2V7jF:active, .tab__menu-bar-btn_create__2ccxb:active { background-color: #00d374; } .tab__menu-bar-btn_save__3HGWT, .tab__menu-bar-btn_reset__3fUPG { background-color: #6ac8ff; } .tab__menu-bar-btn_save__3HGWT:hover, .tab__menu-bar-btn_reset__3fUPG:hover { background-color: #57bcfe; } .tab__menu-bar-btn_save__3HGWT:active, .tab__menu-bar-btn_reset__3fUPG:active { background-color: #4fb0fc; } .tab__menu-bar-btn_submit__1P2m7, .tab__menu-bar-btn_open__DIItI { background-color: #ff9e23; } .tab__menu-bar-btn_submit__1P2m7:hover, .tab__menu-bar-btn_open__DIItI:hover { background-color: #f47b04; } .tab__menu-bar-btn_submit__1P2m7:active, .tab__menu-bar-btn_open__DIItI:active { background-color: #fe8f22; } .tab__menu-bar-btn_link__2inHu { background-color: #e8efff; color: var(--theme-primary); } .tab__menu-bar-btn_link__2inHu:hover { background-color: #b6c7ff; } .tab__menu-bar-btn_link__2inHu:active { background-color: #cfdcff; } .tab__menu-bar-btn_disabled__2u2oc { color: #565266; background-color: #e6e9ed; } .tab__menu-bar-btn_disabled__2u2oc:hover { cursor: not-allowed; } .tab__menu-bar-btn_help__1SMSj { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .tab__menu-bar-btn_help__1SMSj:hover { background-color: #8398ff; } .tab__menu-bar-btn_help__1SMSj:active { background-color: #8ca3ff; } .tab__menu-bar-separator__1IRQ4 { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .tab__tabs__FjHUn { position: relative; flex-grow: 1; display: flex; flex-direction: column; } .tab__tabs__FjHUn .tab__tab-list__GUGMZ { display: flex; /* Overrides for react-tabs styling */ margin: 0 !important; border: none !important; height: 40px; padding-left: 6px; } .tab__tabs__FjHUn .tab__tab-list__GUGMZ.tab__tab-list_large__3YsdP { height: 40px; } .tab__tabs__FjHUn .tab__tab-list__GUGMZ .tab__tab__274EE { width: 52px; flex-shrink: 0; white-space: nowrap; position: relative; cursor: url(static/cursor/cursor-pointer.cur), pointer; border: none; border-radius: 0; bottom: 0; padding: 0; } .tab__tabs__FjHUn .tab__tab-list__GUGMZ .tab__tab__274EE span { font-size: 14px; line-height: 14px; text-align: center; color: #828da3; position: absolute; bottom: 13px; left: 0; right: 0; margin: auto; } .tab__tabs__FjHUn .tab__tab-list__GUGMZ .tab__tab__274EE:hover span { color: var(--theme-primary); } .tab__tabs__FjHUn .tab__tab-list__GUGMZ .tab__tab__274EE.tab__tab_hidden__22rbz { display: none; } .tab__tabs__FjHUn .tab__tab-list__GUGMZ .tab__tab__274EE.tab__is-selected__9Y_Mi { background-color: transparent; /* Make sure selected is always above */ } .tab__tabs__FjHUn .tab__tab-list__GUGMZ .tab__tab__274EE.tab__is-selected__9Y_Mi span { color: var(--theme-primary); font-size: 15px; line-height: 15px; font-weight: bold; } .tab__tabs__FjHUn .tab__tab-list__GUGMZ .tab__tab__274EE.tab__is-selected__9Y_Mi::after { content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 10px; height: 3px; background-color: var(--theme-primary); border-radius: 2px; } .tab__tabs__FjHUn .tab__tab-panel__C6Aca { position: relative; flex-grow: 1; display: none; } .tab__tabs__FjHUn .tab__tab-panel__C6Aca.tab__is-selected__9Y_Mi { display: flex; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .programming-mode-select__flex-center__11nWK { display: flex; align-items: center; justify-content: center; } .programming-mode-select__full-filled__22K_b { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } /* 弹窗遮罩层样式 start */ .programming-mode-select__modal-mask__Rw4vZ { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.64); z-index: 1050; } .programming-mode-select__modal-mask__Rw4vZ .programming-mode-select__modal-wrap__wN5M5 { width: 804px; height: 556px; background-color: #ffffff; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(12px); } .programming-mode-select__modal-mask__Rw4vZ .programming-mode-select__modal-wrap__wN5M5 .programming-mode-select__modal-header-wrap__2nYCA { display: flex; align-items: center; justify-content: center; justify-content: normal; flex-shrink: 0; position: relative; width: 100%; height: 40px; padding: 0 calc(44px) 0 calc(16px); border-bottom: 1px solid #e8efff; color: #3d4554; } .programming-mode-select__modal-mask__Rw4vZ .programming-mode-select__modal-wrap__wN5M5 .programming-mode-select__modal-header-wrap__2nYCA .programming-mode-select__modal-header-bg__2v8PX { position: absolute; top: 0; left: 20px; width: auto; height: 40px; } .programming-mode-select__modal-mask__Rw4vZ .programming-mode-select__modal-wrap__wN5M5 .programming-mode-select__modal-header-wrap__2nYCA .programming-mode-select__modal-header-label__UpUsk { flex-shrink: 0; font-size: 16px; font-weight: bold; } .programming-mode-select__modal-mask__Rw4vZ .programming-mode-select__modal-wrap__wN5M5 .programming-mode-select__modal-header-wrap__2nYCA .programming-mode-select__modal-header-close__18jrk { position: absolute; right: 20px; font-size: 14px; color: #b5bccb; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .programming-mode-select__modal-mask__Rw4vZ .programming-mode-select__modal-wrap__wN5M5 .programming-mode-select__modal-header-wrap__2nYCA .programming-mode-select__modal-header-close__18jrk:hover { color: #98a2b4; } .programming-mode-select__modal-mask__Rw4vZ .programming-mode-select__modal-wrap__wN5M5 .programming-mode-select__modal-body-wrap__1UEnb { width: 100%; flex-grow: 1; display: flex; overflow: hidden; } .programming-mode-select__modal-mask__Rw4vZ .programming-mode-select__modal-wrap__wN5M5 .programming-mode-select__modal-footer-wrap__1E8s1 { flex-shrink: 0; display: flex; } .programming-mode-select__modal-header__AY0-M { flex-grow: 1; display: flex; align-items: center; justify-content: center; justify-content: flex-end; padding-right: 32px; /* 上传按钮 */ /* 搜索输入框 */ } .programming-mode-select__modal-header__AY0-M .programming-mode-select__modal-header-upload__2zYEs { display: flex; align-items: center; justify-content: center; position: relative; border: none; min-width: 80px; height: 24px; margin-right: 8px; background-color: #f0f4ff; font-size: 14px; color: var(--theme-primary); border-radius: calc(12px); } .programming-mode-select__modal-header__AY0-M .programming-mode-select__modal-header-upload__2zYEs:hover { background-color: #e0e9ff; } .programming-mode-select__modal-header__AY0-M .programming-mode-select__modal-header-upload__2zYEs:active { background-color: #ccdaff; } .programming-mode-select__modal-header__AY0-M .programming-mode-select__modal-header-upload__2zYEs .programming-mode-select__upload-img__dvytM { font-size: 16px; margin-right: calc(2px); } .programming-mode-select__modal-header__AY0-M .programming-mode-select__modal-header-upload__2zYEs .programming-mode-select__upload-label__YzQgo { font-size: 14px; } .programming-mode-select__modal-header__AY0-M .programming-mode-select__modal-header-upload__2zYEs .programming-mode-select__upload-input__1uaqF { width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0; outline: none; font-size: 0; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .programming-mode-select__modal-header__AY0-M .programming-mode-select__modal-header-search__10ivA { position: relative; } .programming-mode-select__modal-header__AY0-M .programming-mode-select__modal-header-search__10ivA .programming-mode-select__search-input__15oAj { width: 128px; height: 24px; padding-left: calc(12px); border: 1px solid #edeff5; outline: none; font-size: 14px; border-radius: calc(12px); -webkit-user-select: auto; -ms-user-select: auto; user-select: auto; } .programming-mode-select__modal-header__AY0-M .programming-mode-select__modal-header-search__10ivA .programming-mode-select__search-input__15oAj::-webkit-input-placeholder { color: #98a2b4; } .programming-mode-select__modal-header__AY0-M .programming-mode-select__modal-header-search__10ivA .programming-mode-select__search-input__15oAj::-moz-placeholder { color: #98a2b4; } .programming-mode-select__modal-header__AY0-M .programming-mode-select__modal-header-search__10ivA .programming-mode-select__search-input__15oAj:-ms-input-placeholder { color: #98a2b4; } .programming-mode-select__modal-header__AY0-M .programming-mode-select__modal-header-search__10ivA .programming-mode-select__search-input__15oAj:hover { border-color: #d1d7e1; } .programming-mode-select__modal-header__AY0-M .programming-mode-select__modal-header-search__10ivA .programming-mode-select__search-input__15oAj:active { border-color: #d1d7e1; } .programming-mode-select__modal-header__AY0-M .programming-mode-select__modal-header-search__10ivA .programming-mode-select__search-img__3n78- { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); font-size: 14px; color: #98a2b4; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .programming-mode-select__modal-body__3j3Pg { flex-grow: 1; display: flex; } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-left__K-PSk, .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-main__2eNDI { flex-grow: 1; display: flex; background-color: #ffffff; overflow: hidden; } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-left__K-PSk { padding-bottom: calc(4px); border-right: 1px solid #e8efff; } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-left__K-PSk .programming-mode-select__modal-body-left-scroll__1R2Zh { width: 121px; flex-shrink: 0; overflow-x: hidden; overflow-y: auto; } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-left__K-PSk .programming-mode-select__modal-body-left-scroll__1R2Zh .programming-mode-select__modal-body-left-inner__2CmuG { width: 121px; padding: calc(12px); color: #5e6b81; } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-left__K-PSk .programming-mode-select__modal-body-left-scroll__1R2Zh .programming-mode-select__modal-body-left-inner__2CmuG .programming-mode-select__menu-item-current__3ese7 { color: var(--theme-primary); background-color: #e0e9ff; } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-left__K-PSk .programming-mode-select__modal-body-left-scroll__1R2Zh .programming-mode-select__modal-body-left-inner__2CmuG .programming-mode-select__menu-item__25PYR { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; margin-bottom: 8px; padding-left: 12px; border-radius: calc(4px); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-left__K-PSk .programming-mode-select__modal-body-left-scroll__1R2Zh .programming-mode-select__modal-body-left-inner__2CmuG .programming-mode-select__menu-item__25PYR:hover { background-color: #edeff5; } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-left__K-PSk .programming-mode-select__modal-body-left-scroll__1R2Zh .programming-mode-select__modal-body-left-inner__2CmuG .programming-mode-select__menu-item__25PYR .programming-mode-select__menu-item-img__24G5G { flex-shrink: 0; width: 20px; margin-right: 8px; } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-left__K-PSk .programming-mode-select__modal-body-left-scroll__1R2Zh .programming-mode-select__modal-body-left-inner__2CmuG .programming-mode-select__menu-item__25PYR .programming-mode-select__menu-item-label__2iMTv { flex-grow: 1; font-size: 14px; white-space: nowrap; overflow: hidden; } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-main__2eNDI { padding: calc(12px) 0; } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-main__2eNDI .programming-mode-select__modal-body-main-scroll__24U1z { width: calc(682px); flex-grow: 1; overflow-x: hidden; overflow-y: auto; } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-main__2eNDI .programming-mode-select__modal-body-main-scroll__24U1z .programming-mode-select__modal-body-main-inner__3PW5s { width: calc(682px); display: flex; flex-wrap: wrap; padding: 0 0 0 calc(12px); } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-main__2eNDI .programming-mode-select__modal-body-main-scroll__24U1z .programming-mode-select__modal-body-main-inner__3PW5s .programming-mode-select__selector-btn-add__1-jR0, .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-main__2eNDI .programming-mode-select__modal-body-main-scroll__24U1z .programming-mode-select__modal-body-main-inner__3PW5s .programming-mode-select__selector-btn-item__3ba9J { width: 155px; height: 155px; margin: 0 calc(12px) calc(12px) 0; padding: calc(12px); background-color: #f0f4ff; flex-shrink: 0; } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-main__2eNDI .programming-mode-select__modal-body-main-scroll__24U1z .programming-mode-select__modal-body-main-inner__3PW5s .programming-mode-select__selector-btn-add__1-jR0:hover, .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-main__2eNDI .programming-mode-select__modal-body-main-scroll__24U1z .programming-mode-select__modal-body-main-inner__3PW5s .programming-mode-select__selector-btn-item__3ba9J:hover { background-color: #e0e9ff; } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-main__2eNDI .programming-mode-select__modal-body-main-scroll__24U1z .programming-mode-select__modal-body-main-inner__3PW5s .programming-mode-select__selector-btn-add__1-jR0:active, .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-main__2eNDI .programming-mode-select__modal-body-main-scroll__24U1z .programming-mode-select__modal-body-main-inner__3PW5s .programming-mode-select__selector-btn-item__3ba9J:active { background-color: #ccdaff; } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-main__2eNDI .programming-mode-select__modal-body-main-scroll__24U1z .programming-mode-select__modal-body-main-inner__3PW5s .programming-mode-select__selector-btn-add__1-jR0:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-main__2eNDI .programming-mode-select__modal-body-main-scroll__24U1z .programming-mode-select__modal-body-main-inner__3PW5s .programming-mode-select__selector-btn-add__1-jR0:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-main__2eNDI .programming-mode-select__modal-body-main-scroll__24U1z .programming-mode-select__modal-body-main-inner__3PW5s .programming-mode-select__selector-btn-add__1-jR0 .programming-mode-select__add-img__2Wt-W { font-size: 28px; height: auto; margin-bottom: 8px; } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-main__2eNDI .programming-mode-select__modal-body-main-scroll__24U1z .programming-mode-select__modal-body-main-inner__3PW5s .programming-mode-select__selector-btn-add__1-jR0 .programming-mode-select__add-label__2d9Zp { margin-top: 14px; font-size: 14px; color: var(--theme-primary); } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-main__2eNDI .programming-mode-select__modal-body-main-scroll__24U1z .programming-mode-select__modal-body-main-inner__3PW5s .programming-mode-select__selector-btn-item__3ba9J { justify-content: space-between; } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-main__2eNDI .programming-mode-select__modal-body-main-scroll__24U1z .programming-mode-select__modal-body-main-inner__3PW5s .programming-mode-select__selector-btn-item__3ba9J .programming-mode-select__item-img__388oR { display: flex; align-items: center; justify-content: center; width: 131px; height: 105px; background-color: transparent; overflow: hidden; border: none; } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-main__2eNDI .programming-mode-select__modal-body-main-scroll__24U1z .programming-mode-select__modal-body-main-inner__3PW5s .programming-mode-select__selector-btn-item__3ba9J .programming-mode-select__item-img__388oR img { width: auto; height: 105px; } .programming-mode-select__modal-body__3j3Pg .programming-mode-select__modal-body-main__2eNDI .programming-mode-select__modal-body-main-scroll__24U1z .programming-mode-select__modal-body-main-inner__3PW5s .programming-mode-select__selector-btn-item__3ba9J .programming-mode-select__item-label__5IDR- { font-size: 14px; color: #565266; padding-bottom: calc(4px); } .programming-mode-select__modal-footer__znY90 { display: flex; flex-grow: 1; justify-content: flex-end; padding: 0 calc(16px) calc(16px); } /* 弹窗遮罩层样式 end */ /* target 添加/选择 按钮 start */ .programming-mode-select__selector-btn-add__1-jR0, .programming-mode-select__selector-btn-item__3ba9J { display: flex; align-items: center; justify-content: center; width: 80px; height: 72px; flex-direction: column; flex-shrink: 0; border-radius: 8px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } /* target 添加按钮 */ .programming-mode-select__selector-btn-add__1-jR0 { background-color: var(--selector-sprite-bg_primary); } .programming-mode-select__selector-btn-add__1-jR0:hover { background-color: #c2d2ff; border: 1px dashed #b6c7ff; } .programming-mode-select__selector-btn-add__1-jR0:active { background-color: #b2c7ff; border: 1px dashed #b6c7ff; } .programming-mode-select__selector-btn-add__1-jR0 .programming-mode-select__add-img__2Wt-W { font-size: 22px; font-weight: bold; margin-bottom: 8px; color: var(--theme-dark); } .programming-mode-select__selector-btn-add__1-jR0 .programming-mode-select__add-label__2d9Zp { font-size: 14px; line-height: 14px; color: var(--theme-dark); } /* target 选择按钮 */ .programming-mode-select__selector-btn-item__3ba9J { padding: calc(2px); background-color: var(--selector-sprite-bg_primary); } .programming-mode-select__selector-btn-item__3ba9J .programming-mode-select__item-img__388oR { display: flex; align-items: center; justify-content: center; width: 72px; height: 48px; border-radius: 6px; border: 2px solid var(--selector-sprite-bg_primary); overflow: hidden; background-color: #ffffff; } .programming-mode-select__selector-btn-item__3ba9J .programming-mode-select__item-img__388oR img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; flex-shrink: 0; object-fit: contain; } .programming-mode-select__selector-btn-item__3ba9J .programming-mode-select__item-label__5IDR- { width: 100%; height: 20px; line-height: 22px; flex-shrink: 0; white-space: nowrap; overflow: hidden; font-size: 14px; color: #565266; padding: 0; text-align: center; } .programming-mode-select__selector-btn-item__3ba9J:hover { background-color: var(--selector-sprite-bg_primary); } .programming-mode-select__selector-btn-item__3ba9J:hover .programming-mode-select__item-img__388oR { border-color: var(--selector-sprite-bg_primary); } .programming-mode-select__selector-btn-item_selected__16joi { background-color: var(--selector-sprite-bg_primary); } .programming-mode-select__selector-btn-item_selected__16joi .programming-mode-select__item-img__388oR { border-color: var(--theme-primary); } /* target 添加/选择 按钮 end */ /* 头部按钮，多配色样式 start */ .programming-mode-select__menu-bar-btn__2MKpr { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: auto; min-width: 50px; height: 24px; line-height: 24px; margin-left: 12px; padding: 0 12px; font-size: 14px; color: #ffffff; text-align: center; cursor: url(static/cursor/cursor-pointer.cur), pointer; border-radius: 12px; } .programming-mode-select__menu-bar-btn_green__jyW8f, .programming-mode-select__menu-bar-btn_create__iyrSX { background-color: #3cdc8f; } .programming-mode-select__menu-bar-btn_green__jyW8f:hover, .programming-mode-select__menu-bar-btn_create__iyrSX:hover { background-color: #00d374; } .programming-mode-select__menu-bar-btn_green__jyW8f:active, .programming-mode-select__menu-bar-btn_create__iyrSX:active { background-color: #00d374; } .programming-mode-select__menu-bar-btn_save__1TGxX, .programming-mode-select__menu-bar-btn_reset__neAgJ { background-color: #6ac8ff; } .programming-mode-select__menu-bar-btn_save__1TGxX:hover, .programming-mode-select__menu-bar-btn_reset__neAgJ:hover { background-color: #57bcfe; } .programming-mode-select__menu-bar-btn_save__1TGxX:active, .programming-mode-select__menu-bar-btn_reset__neAgJ:active { background-color: #4fb0fc; } .programming-mode-select__menu-bar-btn_submit__1JNsE, .programming-mode-select__menu-bar-btn_open__iKAC0 { background-color: #ff9e23; } .programming-mode-select__menu-bar-btn_submit__1JNsE:hover, .programming-mode-select__menu-bar-btn_open__iKAC0:hover { background-color: #f47b04; } .programming-mode-select__menu-bar-btn_submit__1JNsE:active, .programming-mode-select__menu-bar-btn_open__iKAC0:active { background-color: #fe8f22; } .programming-mode-select__menu-bar-btn_link__VbBqt { background-color: #e8efff; color: var(--theme-primary); } .programming-mode-select__menu-bar-btn_link__VbBqt:hover { background-color: #b6c7ff; } .programming-mode-select__menu-bar-btn_link__VbBqt:active { background-color: #cfdcff; } .programming-mode-select__menu-bar-btn_disabled__2nDKw { color: #565266; background-color: #e6e9ed; } .programming-mode-select__menu-bar-btn_disabled__2nDKw:hover { cursor: not-allowed; } .programming-mode-select__menu-bar-btn_help__3KSux { width: 20px; min-width: 20px; height: 20px; padding: 0; background-color: #9cb0ff; color: var(--theme-primary); border-radius: 50%; } .programming-mode-select__menu-bar-btn_help__3KSux:hover { background-color: #8398ff; } .programming-mode-select__menu-bar-btn_help__3KSux:active { background-color: #8ca3ff; } .programming-mode-select__menu-bar-separator__GU-f- { width: 1px; height: 16px; margin-left: 12px; background-color: rgba(232, 239, 255, 0.3); } /* 头部按钮，多配色样式 end */ .programming-mode-select__programming-mode-select__3egYq { width: 96px; height: 24px; background-color: var(--theme-primary) !important; color: #ffffff !important; border-radius: 12px !important; border: none !important; font-size: 14px; margin: auto 10px auto auto; } .programming-mode-select__programming-mode-select__3egYq .ant-select-selector { height: 24px !important; border: none; } .programming-mode-select__programming-mode-select__3egYq .ant-select-selector .ant-select-selection-item { padding-right: 0; line-height: 24px !important; color: #e8efff !important; } .programming-mode-select__programming-mode-select__3egYq .ant-select-arrow svg { color: #ffffff !important; } /* make sure to keep these in sync with other constants, e.g. STAGE_DIMENSION_DEFAULTS in lib/screen-utils.js */ /* 同步到 /ada-school-blocks/core/css.js */ @font-face { font-family: DejaVuSansMono; src: url(static/font/DejaVuSansMono-Bold.ttf); } /* 弹窗 modal */ /* menu-bar */ /* 舞台 stage 头部 */ /* 以下为源码部分 */ /* @language-selector-width: 3rem; */ /* layout contants from `layout-constants.js` */ /* @menu-bar-standard-font-size: 0.75rem; */ ::-webkit-scrollbar { /*滚动条整体样式*/ width: 8px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 8px; background: #e7eaff; } ::-webkit-scrollbar-track { /*滚动条里面轨道*/ border-radius: 8px; background: transparent; } ::-webkit-scrollbar-track ::-webkit-scrollbar-button { display: none; } /* 常用色 */ /* primary 常规 */ /* secondary hover */ /* tertiary active */ /* 主题色 */ /* target 添加/选择 按钮颜色 */ /* 积木块分类按钮 */ /* 线框色 */ /* #94a6ff80 */ /* 底色 */ /* 面板色 */ /* 文字色 */ /* 头部 */ /* hover / 头部输入框 input */ /* active / focus */ /* selector 按钮 */ /* stage-header */ /* ------------------------ 此部分样式变量大量复用，待沟通 start ------------------------ */ /* 35% transparent version of theme-primary */ /* #FFFFFF */ /* 90% transparent version of motion-primary */ /* 25% transparent version of ui-white */ /* ------------------------ 此部分样式变量大量复用，待沟通 end ------------------------ */ /* 以下为源码部分 */ /* 15% transparent version of theme-primary */ /* #E64D00 */ /* #BD42BD */ /* #FFAB19 */ /* #FF8C1A */ /* #FF8C1A */ /* #0FBD8C */ /* #0B8E69 */ /* 35% transparent version of extensions-primary */ /* opaque version of extensions-transparent, on white bg */ /* @TrumanGao 待定位 */ /* 15% transparent version of black */ /* Contains constants for the z-index values of elements that are part of the global stack context. In other words, z-index values that are "inside" a component are not added here. This prevents conflicts between identical z-index values in different components. */ /* confirm层级(模拟原浏览器confirm弹窗, 该层级应为最高) */ /* 教师打分 / 练习解析等 面板 */ /* 打开作品/练习 / 资源库 / 分享作品 / 录制声音 / 制作积木 等 */ /* 互动分组弹窗 */ /* antd 消息 */ /* 请求加载loading */ /* Toolbox z-index: 40; set in scratch-blocks */ /* tooltips should go over add buttons if they overlap */ /* monitors go over add buttons */ /* "ask" block text input goes above monitors */ /* 工作区 工具栏 => 放大/缩小/撤回 */ /* menu-bar should go over monitors, alerts and tutorials */ /* 运行时的遮罩层，需要盖住层级为1000的积木的计算值 */ /* Block drag z-index: 1000; default 50 is overriden in blocks.css */ /* so it is draggable into other panes */ /* in most interfaces, the context menu is always on top */ /* block的下拉弹窗 .blocklyDropDownDiv z-index: 1000; */ /* antd select组件 .ant-select-dropdown z-index: 1050;*/ .hardware-dropdown { width: 150px !important; } .hardware-code__hardware-wrapper__WV404 { display: flex; flex-direction: column; height: 100%; position: relative; border-radius: 12px; border: 1px solid #d1dfff; background: #e9ebff; overflow: hidden; } .hardware-code__hardware-wrapper__WV404 .hardware-code__wrapper__3LoBb { display: flex; flex: 1; flex-direction: column; box-sizing: border-box; border-radius: 0px; overflow: hidden; } .hardware-code__hardware-wrapper__WV404 .hardware-code__wrapper__3LoBb:last-child { border-top: 1px solid #d1dfff; } .hardware-code__hardware-wrapper__WV404 .hardware-code__wrapper__3LoBb header { padding: 0 0 0 16.5px; flex-shrink: 0; height: 32px; display: flex; width: 100%; align-items: center; justify-content: space-between; border-bottom: 1px solid #d1dfff; } .hardware-code__hardware-wrapper__WV404 .hardware-code__wrapper__3LoBb header h4 { padding: 0; margin: 0; color: #565266; font-size: 14px; font-weight: 400; } .hardware-code__hardware-wrapper__WV404 .hardware-code__wrapper__3LoBb header section { margin-right: 10px; } .hardware-code__hardware-wrapper__WV404 .hardware-code__wrapper__3LoBb header section label { font-size: 12px; font-weight: 400; color: #565266; cursor: unset; } .hardware-code__hardware-wrapper__WV404 .hardware-code__wrapper__3LoBb header section label span { display: inline-block; margin-right: 8px; } .hardware-code__hardware-wrapper__WV404 .hardware-code__wrapper__3LoBb header section label > button { transform: rotate(180deg); margin-top: -2px; } .hardware-code__hardware-wrapper__WV404 .hardware-code__wrapper__3LoBb header section label .ant-switch { cursor: url(static/cursor/cursor-pointer.cur), pointer; } .hardware-code__hardware-wrapper__WV404 .hardware-code__wrapper__3LoBb header section .hardware-code__hardware-panel-btn__2QVl3 { margin-left: 11px; cursor: url(static/cursor/cursor-pointer.cur), pointer; } .hardware-code__hardware-wrapper__WV404 .hardware-code__wrapper__3LoBb header section .hardware-code__hardware-panel-btn__2QVl3 > span { font-size: 18px; vertical-align: middle; color: #8a97ad; } .hardware-code__hardware-wrapper__WV404 .hardware-code__wrapper__3LoBb header section .hardware-code__hardware-panel-btn__2QVl3 > span:hover { color: var(--theme-primary); } .hardware-code__hardware-wrapper__WV404 .hardware-code__code-editor-wrapper__39_bH { flex-basis: 60%; } .hardware-code__hardware-wrapper__WV404 .hardware-code__code-editor-wrapper__39_bH .code-editor { width: 100%; flex-grow: 1; } .hardware-code__hardware-wrapper__WV404 .hardware-code__code-editor-wrapper__39_bH .monaco-editor, .hardware-code__hardware-wrapper__WV404 .hardware-code__code-editor-wrapper__39_bH .monaco-editor-background, .hardware-code__hardware-wrapper__WV404 .hardware-code__code-editor-wrapper__39_bH .monaco-editor .inputarea.ime-input { background-color: #f7f7ff; } .hardware-code__hardware-wrapper__WV404 .hardware-code__hardware-console-wrapper__1G_Vi { flex-basis: 40%; } .hardware-code__hardware-size-btn__yjP8z { height: 24px; width: 24px; box-shadow: 0px 2px 6px 0px #474e7a0f; border: 1px solid #edeff5; border-radius: 50%; box-sizing: content-box; display: block; position: absolute; top: 50%; right: -10px; overflow: hidden; z-index: 42; transform: rotate(90deg); cursor: url(static/cursor/cursor-pointer.cur), pointer; } .hardware-code__hardware-size-btn__yjP8z img { vertical-align: middle; border-style: none; height: 100%; width: 100%; object-fit: cover; } .hardware-code__hardware-size-btn__yjP8z.hardware-code__hide__1q3mK { transform: rotate(-90deg); } .hardware-code__hardware-popover__5a9cR * { transition: none !important; } .hardware-code__hardware-popover__5a9cR .ant-popover-arrow { display: none; } .hardware-code__hardware-popover__5a9cR .ant-popover-inner { box-shadow: none; width: 194px; background: #ffffff; border: 1px solid #e7eeff; box-sizing: border-box; box-shadow: 8px 4px 8px rgba(39, 71, 154, 0.04); border-radius: 8px; } .hardware-code__hardware-popover__5a9cR .ant-popover-inner .ant-popover-inner-content > * { display: flex; flex-direction: column; } .hardware-code__hardware-popover__5a9cR .ant-popover-inner .ant-popover-inner-content > * label { font-size: 12px; height: 30px; font-weight: 400; display: flex; justify-content: space-between; align-items: center; } .hardware-code__hardware-popover__5a9cR .ant-popover-inner .ant-popover-inner-content > * label .ant-select { width: 96px; } .hardware-code__hardware-popover__5a9cR .ant-popover-inner .ant-popover-inner-content > * label .ant-select .ant-select-selector { height: 20px; width: 100px; font-size: 12px; font-weight: 400; border: 1px solid #d1dfff; box-sizing: border-box; border-radius: 4px; padding: 0 8px; } .hardware-code__hardware-popover__5a9cR .ant-popover-inner .ant-popover-inner-content > * label .ant-select .ant-select-selector .ant-select-selection-item { line-height: 20px; } .hardware-code__hardware-popover__5a9cR .ant-popover-inner .ant-popover-inner-content > * label .ant-switch { transform: rotate(180deg); cursor: url(static/cursor/cursor-pointer.cur), pointer !important; } .ant-select-arrow .anticon { margin-top: -2px; font-size: 16px !important; } .ant-select-arrow .anticon svg { height: 18px; width: 18px; }