.indexContainer { .anticon svg { margin-top: 0px; } } .Popconfirmtitle { .ant-popover-message-title { padding-left: 0px; } } .mapContent { display: flex; width: 100%; height: calc(100vh - 160px); .ant-radio-wrapper { min-width: 88px; } .mapTool { width: 25%; overflow-y: scroll; overflow-x: hidden; transition-property: width; transition-duration: 0.5s; position: relative; .title { text-align: center; font-weight: 700; font-size: 14px; } .colorContent { width: 100%; display: flex; justify-content: space-between; .colorBox { width: 15px; height: 15px; border: 1px solid #ccc; } .currentColor { border: 2px solid #faad14; } } .switcher { display: block; position: absolute; font-size: 18px; color: #1890ff !important; top: 42%; right:-2px; transform: translate(0%, -50%); z-index: 1; } } .mapToolHide{ width: 26px; } .mapBox { display: flex; align-items: center; position: relative; margin-left: 15px; width: 100%; height: 100%; canvas { width: 100%; height: 100%; } } .ant-cascader-menu { height: 530px; } } .borderColor{ width: 22px; height: 20px; border: 1px solid #ccc; border-radius: 2px; } .borderColor hover{ width: 22px; height: 20px; border: 1px solid rgb(241, 228, 32); border-radius: 2px; }