._FourG_ { width: 100%; .Row{ display: flex; align-items: center; } .wifi { svg path:nth-child(2){ fill: #0293ff; } &.s_05 { .svgOut(#0293ff); } } .ant-input-affix-wrapper-disabled { background-color: @--component-bg-disable; }} ._SGCC_ { .row-flex { display: flex; > div { margin-right: 50px; } }} ._AutoRegister_ { padding-top: inherit; .online_bg { color: @successColor; } .offline_bg { color: @errorColor; }} ._GBCertManage_ { .delete-icon { cursor: pointer; font-size: 2.5rem; &:hover { svg { & + { path:first-child { fill: #f00 !important; } } } } } .download-icon { cursor: pointer; } ._Table_ .ant-table-body { min-height: 350 / @px-unit; } } ._IPSpeakerCfgModal_{ } ._AlarmCenter_ { .divider { margin: 5 / @px-unit 0; }} ._Email_ { height: 90%; overflow-x: hidden; overflow-y: auto; padding-bottom: 75px !important; .ant-divider-horizontal { margin: 5px 0; }} ._IPSpeakerCfgModal_{ } ._BPSLimit_{ padding: 20 / @px-unit; } .plateNoClass { padding-left: 0 !important;} .label-normal-behind { .label-normal-container { padding-top: 0px !important; }}._viewAiResult_ { .pic_PlateNo { clear: left; text-align: center; }}._viewAiResult_ { .pic_plateImg { height: 80% !important; margin: 0; width: 120/@px-unit; float: left; text-align: center; .imageplate-panle { width: 100% !important; margin-top: 6/ @px-unit !important; height: 30% !important; } .pic_PlateNo { margin-top: 10% !important; clear: left; text-align: center; } }} ._Port_ { padding-top: inherit; } ._Multicast_ { padding: 22 / @px-unit; .behindSpan { padding: 5 / @px-unit; }} ._Pppoe_ { padding-top: inherit; } ._IPSpeaker_{ padding: 20 / @px-unit; .blueIEBrowser { .svgOut(@IEBrowerColor); } .manage-grid-successIcon { .svgOut(@successIcon); .svgFont(20); } .manage-grid-errorIcon { .svgOut(@errorColor); .svgFont(20); } } ._viewAiResult_ { .label-normal, .labelText-wrapper { height: 20/@px-unit; line-height: 20/@px-unit; } height: 212/@px-unit; .ant-row { height: 680/@px-unit; overflow: auto } .activeItem { border: 1px solid @formInputBorderA !important; } ._viewAiResult_similarity { margin: 0 8px 7px 5px; } .picData_content { margin: 5/@px-unit 5/@px-unit; width: 268/@px-unit; height: 212/@px-unit; float: left; border: 1px solid @ai_DataItem_bd; background-color: @ai_DataItem_bg; .picData_groupName { height: 35/@px-unit; line-height: 35/@px-unit; margin-left: 10/@px-unit; font-size: @font-huge; color: @pageTextA; overflow:hidden !important; } .picData_imgContent { width: 268/@px-unit; height: 112/@px-unit; margin-bottom: 8/@px-unit; img { display: inline-block; width: 120/@px-unit; height: 100%; margin: 0 5/@px-unit 0 5/@px-unit; } } .picData_imgContentByPic{ height: 137/@px-unit; margin:10/@px-unit 0 8/@px-unit 0; img { display: inline-block; width: 120/@px-unit; height: 100%; margin: 0 5/@px-unit 0 5/@px-unit; } } .picData_progress { margin: 0 8px 7px 5px; background: @ai_progress_default; height: 14/@px-unit; position: relative; color: @pageTextA; display: flex; align-items: center; .progress_item { display: inline-block; height: 100%; } .progress_red { background: @ai_progress_red; } .progress_orange { background: @ai_progress_orange; } .progress_blue { background: @ai_progress_blue; } .progress_label { position: absolute; right: 0; line-height: 14/@px-unit; top: 0; } } .picData_smallImgContent { width: 268/@px-unit; height: 112/@px-unit; margin-bottom: 8/@px-unit; img { display: inline-block; width: 120/@px-unit; height: 100%; margin: 0 5/@px-unit 0 5/@px-unit; } } .picData_imgAndInfo { overflow: hidden; margin: 35/@px-unit 0px 22/@px-unit 0px; } .picData_smallImgContent { width: 132/@px-unit; float: left; } .picData_info { display: inline-block; .label-normal-container { height: 18/@px-unit; padding: 0px !important; } color: @buttonNormalTextN; } .picData_labelCheck { background: @ai_labelCheck_bg; height: 32/@px-unit; line-height: 32/@px-unit; padding: 5/@px-unit 10/@px-unit; display: flex; flex-direction: row; justify-content: space-between; .ch_number { height: 20/@px-unit; line-height: 20/@px-unit ; color: @ai_labelCheck_font; } .label-normal-container { height: 20/@px-unit; padding: 0px !important; color: @ai_labelCheck_font; .label-normal { color: @ai_labelCheck_font; } } .ant-checkbox { top: 0px; } } } .human_detect { .compliantIcon{ font-size: 150/@px-unit; margin-top: -200/@px-unit; margin-left: 150/@px-unit; &:hover { svg { & + { path:first-child { fill: @iconColorN !important; } } } } } .compliantIcon_operatemonitor{ font-size: 120/@px-unit; position: absolute; bottom: 0; margin-left: 150/@px-unit; &:hover { svg { & + { path:first-child { fill: @iconColorN !important; } } } } } .picData_human_detect_imgAndInfo { margin-top: 20/@px-unit; height: 156/@px-unit; display: flex; flex-direction: row; justify-content: center; .human_detect_width140 { width: 140/@px-unit } .human_detect_width268 { width: 268/@px-unit } .picData_imgContentByPic { height: 137/@px-unit; margin: 0; float: left; img { display: inline-block; height: 100%; margin: 0 5/@px-unit 0 5/@px-unit; max-width: 120/@px-unit; } .pic_humanImg { height: 100%; margin: 0; width: 120/@px-unit; float: left; text-align: center; } .nonmoperson-face { height: 60%; width: 80/@px-unit; float: right; } .face { height: 137/@px-unit; margin: 0; float: right; margin-left: 30/@px-unit; } } .pic_humanImg { height: 100%; margin: 0; width: 120/@px-unit; float: left; text-align: center; } .person { margin-left: 10/@px-unit; display: inline-block; height: 100%; max-width: 120/@px-unit; width: auto; } .nonmoperson-face { height: 60%; width: 80/@px-unit; float: right; } .face { height: 137/@px-unit; margin: 0; float: right; margin-left: 30/@px-unit; } } } .vehicle_detact { .picData_vehicle_detect_imgAndInfo { margin-top: 10/@px-unit; height: 166/@px-unit; display: flex; flex-direction: row; justify-content: center; .picData_imgContentByPic { position: relative; width: 140/@px-unit; height: 155/@px-unit; margin: 0; float: left; img { width: 120/@px-unit; display: inline-block; height: 100%; margin: 0 5/@px-unit 0 5/@px-unit; } .vehicle { width: 120/@px-unit; height: 120/@px-unit; display: block; margin: 0 auto; position: absolute; top: 0/@px-unit; left: 5/@px-unit; } .plate { width: 120/@px-unit; height: 32/@px-unit; display: block; margin: 0 auto; position: absolute; top: 121/@px-unit; left: 5/@px-unit; } } .picData_info { height: 166/@px-unit; .plateWhiteListDB { width: 120/@px-unit; height: 30/@px-unit; line-height: 30/@px-unit; text-align: center; margin-top: 54/@px-unit; float: left; border: 1/@px-unit solid @vehicle_whiteplate_borderColor; background-color: @vehicle_whiteplate_bgColor; color: .color_N(@vehicle_whiteplate_bgColor)[]; } .plateBlackListDB { width: 120/@px-unit; height: 30/@px-unit; line-height: 30/@px-unit; text-align: center; margin-top: 54/@px-unit; float: left; background-color: @vehicle_blackplate_bgColor; color: .color_N(@vehicle_blackplate_bgColor)[]; border: 1px solid @vehicle_blackplate_borderColor; } .plateNormalListDB { display: none } } } }}.infotext{ width: 115/@px-unit; display: flex;}.info_label{ max-width: 70/@px-unit; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}.info_val{ max-width: 45/@px-unit; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} .homeside-enter,.homeside-appear { opacity: 0;}.homeside-enter-active,.homeside-appear-active { opacity: 1; transition: opacity 200ms ease-in;}.homeside-enter-done { opacity: 1;}.homeside-exit { opacity: 1;}.homeside-exit-active { opacity: 0; transition: opacity 200ms ease-in;}.homeside-exit-done { opacity: 0;}.clearfix { &::after { content: '.'; display: block; height: 0; visibility: hidden; clear: both; }}.header-contain { height: @navMenuHeight; background-color: @navBg; color: @navMenuTextN; z-index: 1000; border-bottom: 1px solid @navMenuBorderN; .svgOut(.color_N(@navBg)[]); .home_header_right { display: flex; justify-content: flex-end; align-items: center; padding-right: 0.5rem; height: @navMenuLineHeight; > span.header-time:first-child { font-size: @navMenuFontN; min-width: 235 / @px-unit; } .headerDivider { height: @navMenuLineHeight; top: 0; margin: 0 0.5rem; } .cus_icons{ &:not(:hover){ .svgOut(.color_N(@navBg)[]); } } .device_info { padding: 0 8/@px-unit; } } .home_header_left { display: flex; justify-content: flex-end; align-items: center; height: @navMenuLineHeight; > div:first-child { margin-left: 8px; } }}.header-time { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}.homaMain-contain { height: calc(100vh - @navMenuHeight); position: absolute; width: 100%; overflow-x: auto;}.MainPageTip { text-align: center;}.PasswordExpired { .PasswordExpiredTip { display: flex; .cus_icons:not(.disabled_icons) svg path:first-child { fill: @warningColor; } .Tip { margin-left: 5 / @px-unit; margin-top: 5 / @px-unit; } } .PasswordNoTip { margin-left: 10 / @px-unit; }}.HomeQRCode { .ant-spin-container{ display: flex; justify-content: space-around; } .QRCode { width: 212 / @px-unit; height: 212 / @px-unit; padding: 10 / @px-unit; background-color: @QRCodeBg; margin: 10 / @px-unit 20 / @px-unit; } .ImageCode { .ant-image { width: 212 / @px-unit; height: 212 / @px-unit; margin: 10 / @px-unit 20 / @px-unit; } } .DescribeText { text-align: center; }} ._DDNS_ { .label-text { width: 60rem; cursor: default; user-select: none; } p { margin: 0; } .netState_0{ color: @pageTextN; } .netState_1{ color: @successColor; } .netState_2{ color: @errorColor; }}.modal-footer { display: flex; flex-direction: row-reverse; button { width: 100%; }} ._CrowdDensity_{ .active{ svg path:nth-of-type(1){ fill:@current!important; } }} ._SNMP_ { .subform { display: flex; justify-content: space-between; .box { width: 50%; } }} ._OpenAll_ { display: flex; align-items: center; justify-content: center; margin: 20/@px-unit 0; ._OpenAll_box{ width: 210/@px-unit; height:32/@px-unit; padding: 0!important; display: flex; align-items: center; justify-content: left; cursor: pointer; } ._OpenAll_default{ border: 1px solid @talkAndSound_defBorder; background-color: @talkAndSound_defBg; color: @talkAndSound_defText; } .label-div-Container { width: 30/@px-unit; height:32/@px-unit; .label-normal-container { width: 30/@px-unit; height:32/@px-unit; padding-top: 0 !important; .label-normal-wrapper { width: 30/@px-unit !important; height:32/@px-unit !important; } } } ._OpenAll_btn { padding: 0 !important; border: 0 !important; background: none !important; height: 30/@px-unit; } ._OpenAll_down { width: 30/@px-unit; height: 30/@px-unit; border-left: 1px solid @talkAndSound_defBorder; } ._OpenAll_start { width: 210/@px-unit; height: 100%; display: flex; justify-content: left; background-color: @talkAndSound_defBg; border-right: 1px solid @talkAndSound_defBorder; } ._OpenAll_stop { width: 210/@px-unit; height: 100%; display: flex; justify-content: left; background-color: @talkAndSound_actBg; border-right: 1px solid @talkAndSound_defBorder; color: .color_A(@talkAndSound_actBg)[]; } ._OpenAll_text { line-height: 32/@px-unit; width: 64/@px-unit; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } ._OpenAll_talk { display: flex; justify-content: center; width: 180/@px-unit; >span:nth-of-type(1){ margin: 0 25/@px-unit 0 -33/@px-unit ; } .cus_icons { .svgHover(@iconColorN); } } ._OpenAll_current { color: @current !important; } } ._FastPreview_ { height: 100%; padding: 0!important; @fastPreviewBtnColor:.color_N(@preview_Left_Bg)[]; @fastPreviewBtnColor_A:.color_A(@preview_ChnlBgA)[]; &up { display: flex; align-items: center; justify-content: flex-start; margin: 7/@px-unit 0!important; cursor: pointer; color:@fastPreviewBtnColor; &:hover { background-color: @preview_ChnlBgA; color: @fastPreviewBtnColor_A; .icon_default{ svg path:nth-of-type(1){ fill:@fastPreviewBtnColor_A!important; } svg path:nth-of-type(2){ fill: .color_A(@preview_ChnlBgA)[@inverse] !important; } svg path:nth-of-type(3){ fill:@fastPreviewBtnColor_A!important; } } } &_icon{ margin:0 30/@px-unit 0 } } .active{ color: .color_A(@fastPreview_btnActBg)[]; background-color: @fastPreview_btnActBg; } .icon_active{ svg path:nth-of-type(1){ fill:@successColor!important; } svg path:nth-of-type(2){ fill:@iconBgColor!important; } svg path:nth-of-type(3){ fill:@successColor!important; } } .icon_default{ svg path:nth-of-type(1){ fill:@fastPreviewBtnColor!important; } svg path:nth-of-type(2){ fill:@iconBgColor!important; } svg path:nth-of-type(3){ fill:@fastPreviewBtnColor!important; } } &wrap{ height:32/@px-unit; width:105/@px-unit; position: relative; border:1px solid @fastPreview_border; } .btnClass{ position: absolute; background: transparent!important; right:-15/@px-unit; .cus_icons{ .svgOut(@fastPreviewBtnColor); } } &down{ height:auto!important; padding: 0 !important;; display: flex; justify-content: center; &_left{ max-height: 80vh; min-width:105 /@px-unit!important; overflow: auto; padding: 0!important; left:15/@px-unit!important; .ant-dropdown-menu-root{ width:103/@px-unit; } .ant-dropdown-menu-item{ padding:0!important; white-space: nowrap; } .ant-dropdown-menu-title-content{ display: flex; align-items: center; justify-content: center; } } &_right{ width:110/@px-unit; max-height: 80vh; overflow: auto; padding: 0!important; left:115/@px-unit!important; .ant-dropdown-menu-root{ width:103/@px-unit; } .ant-dropdown-menu-item{ padding:0!important; white-space: nowrap; height:32/@px-unit!important } .ant-dropdown-menu-title-content{ display: flex; align-items: center; justify-content: center; .iconDropitem_name{ display: flex; align-items: center; justify-content: center; } } } &_box{ width:80/@px-unit; height:32 /@px-unit!important; position: absolute; border-right:1px solid @fastPreview_border; z-index:9; display: flex; justify-content: flex-start; align-items: center; .cus_icons{ .svgOut(@fastPreviewBtnColor); } } &_text{ color: @fastPreviewBtnColor; margin-left:10/@px-unit; line-height: 35/@px-unit; } }} ._IntelligentTrack_ { display: flex;} ._ViewSplit_ { padding-top: inherit; } ._QualityBtns_ { .popover_contain{ .popover_icon:not(.disabled_icons):not(.noHover) svg path { fill: .color_N(@preview_center_bottom_Bg)[]; } .popover_icon:hover:not(.disabled_icons):not(.noHover):hover svg path { fill: @--primary-5!important; } } } ._Ptz_ { position: relative; margin-bottom: 0 / @px-unit; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-color: @preview_Right_Bg; min-width: 170px; .ant-btn{ padding:4/ @px-unit 0!important;; } .show{ display: ''; } .hidden{ display: none; } &wrap{ .ant-menu-item, .ant-menu-submenu-title{ padding:0!important; } display: flex; justify-content: flex-start; align-items: center; flex-direction: column; margin-top: 10 / @px-unit; border-bottom: 1 / @px-unit solid @preview_right_ptz_borderBottom_ColorN; .ant-menu{ background: @preview_right_tabTitle_Bg !important; color: .color_N(@preview_right_tabTitle_Bg)[]; height: 35 / @px-unit; width: 100%; } .ant-menu-horizontal { border-bottom-color: @preview_right_tabTitle_Bg; } .ant-menu-horizontal:not(.ant-menu-dark) { .ant-menu-submenu{ padding:0!important; } .ant-menu-item { height: 30 / @px-unit; margin-top: 2 / @px-unit; line-height: 30 / @px-unit; width: 49%; display: flex; justify-content: center; span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } } .ant-menu-item:hover::after, .ant-menu-item-selected::after { border-bottom: 0px solid transparent; } .ant-menu-item-selected { background: @preview_right_ptzZoom_Bg !important; border-radius: 5 /@px-unit; span { background: @preview_right_ptzZoom_Bg; color: .color_A(@preview_right_ptzZoom_Bg)[]; } } .ant-menu-item:hover { color: .color_A(@preview_right_tabTitle_Bg)[]; } } } &content { margin-top: 15 /@px-unit; height:200 /@px-unit; background-color: @preview_Right_Bg; } &font{ >svg{ font-size:30/ @px-unit!important; } } &icon{ width:20 / @px-unit } &header_bg { width: 150 / @px-unit; height: 150 / @px-unit; margin: 25 / @px-unit 0 15 / @px-unit 25 / @px-unit; & &_icon { .svgFont(150); } } &header_el { width: 150 / @px-unit; height: 150 / @px-unit; display: flex; flex-wrap: wrap; margin: 25 / @px-unit 0 15 / @px-unit 25 / @px-unit; position: absolute; top: -25 / @px-unit; left: 0; & &_icon { .svgFont(40); width: 40 / @px-unit; height: 40 / @px-unit; margin: 5 / @px-unit 5 / @px-unit 5 / @px-unit 5 / @px-unit; &:hover { cursor: pointer; } } }} ._LocalPlay_{ display: flex; align-items: center; justify-content: center; margin: 20/@px-unit 0; &box { display: flex; align-items: center; justify-content: left; cursor: pointer; border: 1px solid @urgentRecord_defBorder; background-color: @urgentRecord_defBg; color:@urgentRecord_defText; width: 210/@px-unit; height:32/@px-unit; padding: 0!important; >span:nth-of-type(1){ margin: 0 30/@px-unit 0 10/@px-unit ; } .cus_icons { .svgHover(@iconColorN); } } &text { width: 124/@px-unit; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }} ._PicturePlay_{ display: flex; align-items: center; justify-content: center; margin: 20/@px-unit 0; &box { display: flex; align-items: center; justify-content: left; cursor: pointer; border: 1px solid @urgentRecord_defBorder; background-color: @urgentRecord_defBg; color:@urgentRecord_defText; width: 210/@px-unit; height:32/@px-unit; padding: 0!important; >span:nth-of-type(1){ margin: 0 30/@px-unit 0 10/@px-unit ; } .cus_icons { .svgHover(@iconColorN); } } &text { width: 124/@px-unit; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }} .fix-header-content{ display : flex; justify-content: center; .fix-header-content-item { text-align: center; cursor : pointer; .fix-header-content-title { color : .color_N(@--primary-6)[]; } } .active-item { background-color: @--primary-7; } } ._UrgentRecord_ { display: flex; align-items: center; justify-content: center; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; &box{ width: 210/@px-unit; height:32/@px-unit; padding: 0!important; display: flex; align-items: center; justify-content: flex-start; cursor: pointer; >span:nth-of-type(1){ margin: 0 30/@px-unit 0 10/@px-unit ; } .cus_icons { .svgHover(@iconColorN); } } &checked{ border: 1px solid @urgentRecord_actBorder; background-color: @urgentRecord_actBg; color:.color_A(@urgentRecord_actBg)[]; } &default{ border: 1px solid @urgentRecord_defBorder; background-color: @urgentRecord_defBg; color:@urgentRecord_defText; } &text { width: 124/@px-unit; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }} ._TalkAndSound_ { display: flex; align-items: center; justify-content: center; margin: 20/@px-unit 0; &box{ width: 210/@px-unit; height:32/@px-unit; padding: 0!important; display: flex; align-items: center; justify-content: center; cursor: pointer; } &default{ border: 1px solid @talkAndSound_defBorder; background-color: @talkAndSound_defBg; color: @talkAndSound_defText; } .label-div-Container { width: 30/@px-unit; height:32/@px-unit; .label-normal-container { width: 30/@px-unit; height:32/@px-unit; padding-top: 0 !important; .label-normal-wrapper { width: 30/@px-unit !important; height:32/@px-unit !important; } } } &btn { padding: 0 !important; border: 0 !important; background: none !important; height: 30/@px-unit; } &down { width: 30/@px-unit; height: 30/@px-unit; border-left: 1px solid @talkAndSound_defBorder; } &start { width: 180/@px-unit; height: 100%; display: flex; justify-content: center; background-color: @talkAndSound_defBg; border-right: 1px solid @talkAndSound_defBorder; } &stop { width: 180/@px-unit; height: 100%; display: flex; justify-content: center; background-color: @talkAndSound_actBg; border-right: 1px solid @talkAndSound_defBorder; color: .color_A(@talkAndSound_actBg)[]; } &text { line-height: 32/@px-unit; width: 64/@px-unit; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } &talk { display: flex; justify-content: center; width: 140/@px-unit; >span:nth-of-type(1){ margin: 0 30/@px-unit 0 -10/@px-unit ; } .cus_icons { .svgHover(@iconColorN); } } ¤t { color: @current !important; }} @list-header-height: 35 / @px-unit;._AIPreview_ { height: 100%; &swrap{ border-right: 1px solid @--split; width: 270 / @px-unit; height: 100%; padding-right: 1 / @px-unit; background-color: @aiPanel_bg_color; &_header{ background-color: @PickerHeaderBg; height: @list-header-height; display: flex; flex-direction: row; justify-content: space-between; background-color: @aiPanel_title_bg_color; &_title{ width: 100%; color: @aiPanel_title_color_N; display: flex; align-items: center; span{ margin-left: 15 / @px-unit; } } &_set_icon{ display: flex; align-items: center; width: 50 / @px-unit; .cus_icons { .svgOut(@aiPanel_title_color_N); } } } &_list_swrap{ height: calc(100% - @list-header-height); overflow: auto; } }}._AIPreviewIcon_{ .active{ svg path:nth-of-type(1){ fill:@current!important; } }} ._AlarmOut_ { padding-top: inherit; position: relative; &up{ display: flex; justify-content: space-between; align-items: center; color: @preview_ChnlTextN; padding:10/@px-unit 15/@px-unit; ._AlarmOut_header_bg_icon{ .svgOut(@preview_ChnlTextN); } } .active{ border-color: @alramOut_actBorder; color:@alramOut_actText; } .label-div-Container{ width:35/@px-unit; height:45/@px-unit; } ._AlarmOut_right_header_title { height: 35 / @px-unit; background-color: @preview_right_tabTitle_Bg; color: .color_N(@preview_right_tabTitle_Bg)[]; padding-left: 10 / @px-unit; display: flex; align-items: center; width: 100%; } .ant-menu{ background: @preview_right_tabTitle_Bg !important; color: @pageTextN; height: 35 / @px-unit; width: 100%; } .ant-menu-horizontal { border-bottom-color: @preview_right_tabTitle_Bg; } .ant-menu-horizontal:not(.ant-menu-dark) { .ant-menu-item { height: 30 / @px-unit; margin-top: 2 / @px-unit; line-height: 30 / @px-unit; width: 49%; padding: 0 10 / @px-unit; display: flex; justify-content: center; span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } } .ant-menu-item:hover::after, .ant-menu-item-selected::after { border-bottom: 0px solid transparent; } .ant-menu-item-selected { background: @preview_right_ptzZoom_Bg !important; border-radius: 5 /@px-unit; span { background: @preview_right_ptzZoom_Bg; color: @pageTextA; } } .ant-menu-item:hover { color: @pageTextN; } } } ._DisplayScale_ { padding-top: inherit; } ._MultiPreview_ { display: flex; &item { display: flex; position: relative; } &item_split { position: absolute; right: 32/@px-unit; width: auto; height: 32/@px-unit; padding: 0 10/@px-unit; background-color: @mutilPreview_Bg; border: 1/@px-unit solid @mutilPreview_border; } &split_group { display: flex; height: 100%; align-items: center; overflow: hidden; } &split { max-width: 782/@px-unit; overflow: hidden; display: flex; height: 100%; align-items: center; } &number { width: 46/@px-unit; height: 16/@px-unit; border-right: 1/@px-unit solid @preview_center_separator_ColorN; display: flex; justify-content: center; flex-shrink: 0; font-size: 10/@px-unit; cursor: pointer; position: relative; } ¤t { color: @current; } &number:last-child { border-right: none; } &number:hover { color: @current; }} ._IntelliRuleBtn_ivs-color { svg path:first-child { fill: @current !important; } } ._ChannelList_ { height: 100%; padding-bottom: 14/@px-unit; @channelFontColor:.color_N(@preview_Left_Bg)[]; .chnlist_tooltip { .ant-tooltip-content { .ant-tooltip-inner { word-spacing: normal; word-break: break-word; } } } .chItem { display: flex; align-items: center; padding: 3/@px-unit; height:31/@px-unit; cursor: pointer; &_cameraIcon { .svgOut(@channelFontColor); margin-left: 20/@px-unit; width: 30/@px-unit; height: 30/@px-unit; } ._cameraIcon_active { .svgOut(@iconColorA); } &_title { margin-left: 15/@px-unit; width: 120/@px-unit; color: @preview_ChnlTextN; } &:hover { .chItem_title { color: .color_N(@preview_ChnlBgA)[] } background-color: @preview_ChnlBgA; .chItem_btn { display: inline-block; } } &_btn { padding: 0 !important; border: 0 !important; background: none !important; height: 30/@px-unit; display: none; } .chItem_btn{ display: none; } .label-div-Container { .label-normal-container .label-normal-wrapper { width: 50/@px-unit !important; } } }} ._MenuView_ { height: 100%; width: 100%; background-size: 100% 100%; &.bgImage { background-image: url('/static/media/@{themeMainImage}.jpg'); } .MenuView-Carousel{ color: @MenuViewItemTitleTextN; width: 95%; height: 95%; position: absolute; top: 4vh; margin-left: 3%; background-color: @MenuViewBg; } .MenuView-Carousel-Page { padding: 5vh 1vw; } .ant-card { background-color: inherit; color: @MenuViewItemTitleTextN; cursor: pointer; } .ant-card-grid { box-shadow: none; padding: 1vw; } .MenuView-Card:hover { position: relative; z-index: 1; color: @MenuViewItemTitleTextA; box-shadow: 0 0px 8px @MenuViewItemShadowA; .ViewItem-CardItem-Message { color: @MenuViewItemContentTextA; } background-color:@MenuViewBgA !important; } .ant-image-img { width: 7.5vw; } .ViewItem-CardItem { height: 22vh; .ViewItem-CardItem-Row{ height: 100%; } } .ViewItem-CardItem-Icon { font-size: 0; font-weight: bold; } .ViewItem-CardItem-Title { font-size: 1.3rem; font-weight: bold; } .ViewItem-CardItem-Message { font-size: 1.1rem; color: @MenuViewItemContentTextN; } .pageContain { display: flex; justify-content: center; align-items: center; position: absolute; top: 57vh; left: 41vw; .label-normal-wrapper{ height: 44/@px-unit; } } .pagination { z-index: 20; width: 100%; text-align: center; } .swiper-pagination-switch { position: relative; display: inline-block; width: 12/@px-unit; height: 12/@px-unit; border-radius: 50%; background: @MenuViewPageSwitchSvgN !important; margin: -1/@px-unit 10/@px-unit; border: transparent; cursor: pointer; } .swiper-active-switch { width: 16/@px-unit; height: 16/@px-unit; margin: -2/@px-unit 10/@px-unit; background: @MenuViewPageSwitchSvgA !important; } .swiper-button { font-weight: bold; z-index: 20; &.prev { &:hover { color: @MenuViewPageSwitchSvgA; } } &.next { &:hover { color: @MenuViewPageSwitchSvgA; } } &[disabled], &[disabled]:hover{ .cus_icons{ .svgDisabled(@MenuViewPageSwiperSvgD); } } &:not([disabled]){ .cus_icons{ .svgOut(@MenuViewPageSwiperSvgN); } } } [class*="m-h-icon"] { display: inline-block; width: 80/@px-unit; height: 80/@px-unit; }} .swiper-container { overflow:hidden; direction:ltr; -webkit-backface-visibility:hidden; -moz-backface-visibility:hidden; -ms-backface-visibility:hidden; -o-backface-visibility:hidden; backface-visibility:hidden; z-index:1;}.swiper-wrapper { position:relative; margin-top: -10px; width:100%; height: 42vh !important; -webkit-transition-property:-webkit-transform, left, top; -webkit-transition-duration:0s; -webkit-transform:translate3d(0px,0,0); -webkit-transition-timing-function:ease; -moz-transition-property:-moz-transform, left, top; -moz-transition-duration:0s; -moz-transform:translate3d(0px,0,0); -moz-transition-timing-function:ease; -o-transition-property:-o-transform, left, top; -o-transition-duration:0s; -o-transform:translate3d(0px,0,0); -o-transition-timing-function:ease; -o-transform:translate(0px,0px); -ms-transition-property:-ms-transform, left, top; -ms-transition-duration:0s; -ms-transform:translate3d(0px,0,0); -ms-transition-timing-function:ease; transition-property:transform, left, top; transition-duration:0s; transform:translate3d(0px,0,0); transition-timing-function:ease; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box;}.swiper-free-mode > .swiper-wrapper { -webkit-transition-timing-function: ease-out; -moz-transition-timing-function: ease-out; -ms-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; transition-timing-function: ease-out; margin: 0 auto;}.swiper-slide { float: left; height: 42vh !important; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box;}.swiper-wp8-horizontal { -ms-touch-action: pan-y;}.swiper-wp8-vertical { -ms-touch-action: pan-x;} ._QuotaMain_ { .mode-changer { display: flex; button { width: 300/@px-unit; overflow: hidden; padding: 0 10/@px-unit; text-overflow: ellipsis; white-space: nowrap; } } .scalstat-btn { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .MainPage { padding: 0 !important; }} .ClusterLog_detailModal{ width: 650/@px-unit !important; .loginfo_Table{ height: 290/@px-unit; } ._Table_ .ant-table-body { min-height: 290 / @px-unit; } .ant-modal-footer{ height: 53 / @px-unit; .ClusterLog_detailButton{ display: flex; justify-content: space-between; .ClusterLog_btnLeft { display: flex; float: left; } .label-div-Container{ margin-left: 10 / @px-unit; } } }}.ClusterLog_timePicker { display: flex; justify-content: space-between; .ClusterLog_datePicker { display: flex; .ClusterLog_right { margin-left: 20 / @px-unit; } }} ._RecordBack_ { padding-top: inherit; .editable-cell-value-wrap { height: auto; } ._Table_ .ant-table-body { min-height: 600 / @px-unit; }}.recordinfo-footer-btn { display: inline-block; .label-div-Container { display: inline-block; &:first-child { margin-right: 10 /@px-unit; } }} ._ClusterDevice_ { padding-top: inherit; } ._Quota_ { .quota-bleaSpace { display: flex; .warning-tip { color: @errorColor !important; } } .unquotad-warning-tip { width: 1000/@px-unit; color: @errorColor !important; } .hdd-mode { display: flex; justify-content: space-between; align-items: center; } #bitrate-container { .ant-select-disabled.ant-select-multiple .ant-select-selection-item { color: @pageTextD; } .ant-select-multiple.ant-select-disabled.ant-select:not(.ant-select-customize-input) .ant-select-selector { background: @pageBodyBg; } .ant-select-disabled.ant-select-multiple .ant-select-selection-item { border-color: @pageBorderN; } }} ._AiPreviewModal_{ width: 50% !important; min-width: 750px; }.modal-swrap{ .events-bar{ display: flex; flex-direction: row; margin-top: 0 / @px-unit; .events-bar-btn{ min-width: 180 / @px-unit; .tab-title-btn{ min-width: 140 / @px-unit; } } .events-bar-btn-selected { button{ background: @current!important; border: 1 / @px-unit solid @current!important; color: .color_A(@current)[] !important } } .events-bar-btn-no-selected{ button{ background: @buttonNormalBgN!important; border: 1 / @px-unit solid @buttonNormalBorderN!important; color: .color_N(@buttonNormalBgN)[] !important; } } } .object-params-swrap{ .template-list{ display: flex; margin-top:25 / @px-unit; .template-card-list-item { margin-right: 41/@px-unit; } .card-selected { border: 1 / @px-unit solid @current; } .card-no-selected { border: 1 / @px-unit solid @pageBorderN; } .template-card:last-child{ margin-right: 0 / @px-unit; } } .attri-list{ display: flex; margin-top: 20 / @px-unit; flex-wrap: wrap; min-height: 100 / @px-unit; .attri-btn-swrap{ width: 16.5%; .attri-btn{ width: 85%; .ant-btn>span{ width: 100%; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .attri-button-contain{ width: 100% !important; } .attri-button-wrap{ width: 100% !important; } } .attri-btn-selected { button{ background: @current!important; border: 1 / @px-unit solid @current!important; color: .color_A(@current)[] !important } } .attri-btn-no-selected{ button{ background: @aiSetPanel_bottom_unSelectBg!important; border: 1 / @px-unit solid @buttonNormalBorderN!important; color: .color_N(@aiSetPanel_bottom_unSelectBg)[] !important; } } } } }} .TaskBarAlarmInfo { height: 30 / @px-unit;}._SubScribeModal_ { .label-div-Container { display: inline-block; width: 25%; }}.AlarmInfoModal { .settingRefresh { .header-left { float: left; } .header-right { float: right; } } .refreshBtn { float: right; } .ant-table-filter-column { justify-content: center; } tr.ant-table-measure-row{ visibility: collapse; } .device_info .ant-badge-dot { box-shadow: 0 0 0 0.07142857rem #ff4d4f; }} .live { .liveBtn { .label-normal-container { padding-top: 0px !important; padding-bottom: 0px !important; } background-color: red !important; color: white !important; } margin-left: 8 / @px-unit; margin-right: 8 / @px-unit; @media all and (-ms-high-contrast:none) { margin-top: 11 / @px-unit; }} .LanguageButtons { .language { background-color: #007A0C !important; color: white !important; } .label-normal-container { padding-top: 0px !important; padding-bottom: 0px !important; } width: 210 / @px-unit; @media all and (-ms-high-contrast:none) { margin-top: 11 / @px-unit; }} .header-Timer { text-overflow: ellipsis; white-space: nowrap; overflow: hidden;} .header-HelpAlarm { cursor: pointer; &:hover { .svgHover(@homeTaskIconColorA); }} .ai-preview-list{ height: 100%; display: flex; flex-direction: column; align-items: center; padding-top: 5 / @px-unit; .ai-template-card-swrap{ margin: 5 / @px-unit 0 / @px-unit; }} .header-homeBack{ cursor: pointer; &:hover{ .svgHover(@homeTaskIconColorA); }} .cursor { cursor: pointer; &:hover { color: @navMenuTextA; }} @icon-success-color: @iconNolmal; @icon-warning-color: @iconFail; @icon-fail-color: @iconFail; @icon-ignore-color: @iconColorD; @icon-list-color: @iconListColorN; ._SAFESecurityStatus_ { ._SAFESecurityStatus_title { background-color: inherit; } ._SAFESecurityStatus_detect { height: 32/@px-unit; width: 100/@px-unit; } .anticon.item-icon-list { svg .icon-cicrle-part { fill: @icon-list-color; } } .item-list-btn { border-color: @buttonNormalBorderN; } .item-icon-loading { &::after { border-bottom-color: @icon-success-color; } } .anticon.icon-status-success { svg .icon-cicrle-part { fill: @icon-success-color; } } .anticon.icon-status-fail { svg .icon-cicrle-part { fill: @icon-fail-color; } } .anticon.icon-status-ignore{ svg .icon-cicrle-part{ fill:@icon-ignore-color; } } .anticon._SAFESecurityStatus_titleIcon { svg .icon-cicrle-part { fill: @icon-success-color; } } .anticon.warningTips-icon { svg .icon-cicrle-part { fill: @icon-fail-color; } } .anticon.successTips-icon { svg .icon-cicrle-part { fill: @icon-success-color; } }}.safeopr-table-normal { .ant-table-placeholder{ display: none; }}.safeopr-configBar { background-color: @BottomBarBg; border-top: 1px solid @BottomBarBorder; position: absolute; left: 0;}.FireWall-tab { a { color: @pageTextN; &:hover { color: @current; } }}.Loading-wapper { .ant-spin-text { position: initial; transform: initial; white-space: nowrap; }}._SAFESafetyWarning_ { .anticon.detail_icon { svg .icon-cicrle-part { fill: none; } }}.Cert { .anticon.detail_icon { svg .icon-cicrle-part { fill: none; } } .ant-input-number { width: 100%; } .anticon.default-select { svg .icon-cicrle-part { fill: @icon-success-color; } }}._VideoTransmission_, ._SAFESafetyWarning_, ._UserLock_, .FireWall-tab, ._publicAccountLock_, ._DOSAttack_, ._WlanAgree_, ._publicHttps_ { padding-bottom: 78/@px-unit;}._Whitelist_ { padding-bottom: 78/@px-unit !important;} .clusterControl { display: flex; .open { padding-right: 20 / @px-unit !important; }} ._AlarmOut_ { &wrapper{ width:100%; overflow: hidden; } &down{ width:330 /@px-unit; }} ._SideView_ { min-width: 1280px; height: 100%; background-color: @setUpContentBg; .ant-tabs { .ant-tabs-bar { border-bottom-color: @setUpContentBg; .ant-tabs-nav-container { height: 50px; .ant-tabs-nav-wrap { .ant-tabs-nav { .ant-tabs-tab { width: 200 / @px-unit; height: 50px; text-align: center; background: @pagetabBgN; color: .color_N(@pagetabBgN)[]; border: 1px solid @tabBorder; margin: 0; &.ant-tabs-tab-active { background: @tabBgA; color: @tabTextA; } } .ant-tabs-ink-bar { visibility: hidden; } } } } } } .m-side-container { height: 100%; width: 12.5%; min-width: 100px; overflow-y: auto; background: @SideMenuBg; } .m-main-page { height: 100%; background: @setUpBodyBg; & > div { background: @setUpContentBg; width: 100%; height: 100%; } .MainPage { padding: 16 / @px-unit; padding-bottom: 66 / @px-unit; &.noFixedButton { padding-bottom: 0px; } } @media screen and (-webkit-min-device-pixel-ratio: 1.1), (-ms-high-contrast: active), (-ms-high-contrast: none) { .MainPage { &:not(.noFixedButton) { height: calc(100% - 66px); overflow-y: auto; } } } .content-container { overflow-x: hidden; overflow-y: auto; } } .ant-spin-nested-loading, .ant-spin-container { position: static; height: 100%; } ._SideTabView_ { height: 100%; overflow-y: hidden; ._SideTabView_Tabmenu{ .ant-tabs-nav .ant-tabs-tab-btn{ border-top: 0px; border-left: 0px; } } } ._SideTabView_ > .ant-col { position: static; height: 100%; } ._SideTabView_ > .ant-col > .ant-row:nth-child(2) { height: calc(100% - 50px); overflow-y: auto; }} .userDropMenu{ &.iconDropMenu{ min-width: 130/@px-unit !important; }}.task_userBtn { min-width: 45/@px-unit ;} ._PicMapManage_ { height: 100%; padding-left: 0 !important; padding-top: 0 !important; padding-right: 0 !important; .line-row { display: flex; } } ._MachineConfig_ { padding-top: inherit; .ant-row .label-normal-container { min-width:550/@px-unit; } .syncRemoteCheckBox .label-normal-container>.label-normal-wrapper{ width: auto !important; }} .home_settingBtn{ .cus_icons{ .svgHover(@homeTaskIconColorA); margin: 0 15/@px-unit !important; }}.home_settingBtn:hover{ .cus_icons{ .svgOut(@homeTaskIconColorA); }} ._RaidManage_ { .FlexLine{ display: flex; .WorkMode{ margin-left: 15 / @px-unit; } } .fixed-button { .label-normal-wrapper { width: auto !important; } button { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; min-width: 100 / @px-unit; &#Create, &#Celerity { width: auto; padding: 4/@px-unit 5/@px-unit; } } } ._Table_ .ant-table-body { min-height: 600 / @px-unit; } } .RaidHotSpare_FlexLine{ display: flex; .AddTo{ margin-left: 15 / @px-unit; }}._RaidHotSpare_ { ._Table_ .ant-table-body { min-height: 450 / @px-unit; } } .SyncProgress_LeftTime{ padding-left: 10 / @px-unit;}.raidinfo_modal { ._Table_ .ant-table-body { min-height: 240 / @px-unit; } }._RaidInfo_ { ._Table_ .ant-table-body { min-height: 450 / @px-unit; } } ._StreamCombine_ { @padding:20 / @px-unit; padding:@padding; box-sizing: content-box; width:calc(100% - 2 * @padding); height:900 / @px-unit !important; .TitleBar{ display: flex; height: 40 / @px-unit; justify-content: space-between; align-items: center; margin-top: 4 / @px-unit; .text{ font-weight: bold; font-size: 16 / @px-unit; } } .ant-table-body{ min-height: 150 / @px-unit !important; .table-input-select-wrapped,.table-input-select-container{ width: 95% !important; } } } .header-tabMenu { width: 100%; line-height: @navMenuLineHeight; .ant-tabs.ant-tabs-card .ant-tabs-card-bar .ant-tabs-tab-active { background-color: @topTabBgA !important; border: none; color: @navMenuTextA !important; } .ant-tabs.ant-tabs-card .ant-tabs-card-bar .ant-tabs-tab { background-color: @topTabBgN; border: none; border-left: 1px solid @topTabBgA; border-right: 1px solid @topTabBgA; text-align: center; line-height: @navMenuLineHeight; width: unset; margin-right: 9/@px-unit; color:@navMenuTextN; } .ant-tabs-bar { border: none; color:@navMenuTextN; margin: 0; } .ant-tabs.ant-tabs-card .ant-tabs-card-bar .ant-tabs-nav-container { height: @navMenuLineHeight; } .ant-tabs-nav-container { line-height: @navMenuLineHeight; } .ant-tabs-tab-next{ height: @navMenuLineHeight; color:@navMenuIconSvgN; &:hover{ color:@navMenuIconSvgA; } } .ant-tabs-tab-prev{ height: @navMenuLineHeight; color:@navMenuIconSvgN; &:hover{ color:@navMenuIconSvgA; } } .ant-tabs-tab { height: auto !important; width: auto !important; padding: 0 !important; margin: 0 !important; min-width: 152 / @px-unit; & > div { display: flex; width: auto; min-width: 122 / @px-unit; align-items: center; justify-content: space-between; padding: 0 0.3rem; } .anticon-close{ color:@navMenuIconSvgN !important; margin: 0 !important; } .tab-item { display: flex; margin-left: 5/@px-unit; align-items: center; width: 100%; .ant-image{ width: 25/@px-unit; .ant-image-img{ width: 16/@px-unit; } } .tabIcon{ font-size: 20/@px-unit; } .tab-text{ margin-left: 4/@px-unit; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } } } .ant-tabs-tab-btn:focus, .ant-tabs-tab-remove:focus, .ant-tabs-tab-btn:active, .ant-tabs-tab-remove:active { color:@navMenuTextN; } .errorCls{ width: 100% !important; color: @errorColor; text-align: center; font-size: @font-size-base !important; .errorCls_text { line-height: @navMenuHeight; } }}.ant-tabs-dropdown .ant-tabs-dropdown-menu-vertical .ant-tabs-dropdown-menu-item .header-dropdown-item span { margin-left: 0; text-align: left; width: 25/@px-unit;}.ant-tabs-dropdown .ant-tabs-dropdown-menu-vertical .ant-tabs-dropdown-menu-item { min-width: 152/@px-unit;} ._ImageConfig_ { width: 100%; background-color: @preview_Left_Bg; height: 100%; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; ._ImageConfig_button{ .label-div-Container{ margin-left:50/@px-unit; .label-normal-wrapper { width:92/@px-unit!important;; } } } .label-normal-container { width:190/@px-unit!important;; } .label-normal-wrapper{ width:160/@px-unit!important; } .label-normal { width:28/@px-unit!important; } .label-normal-behind { display: none; }} ._PasswordReset_ { padding-left: 20 / @px-unit; padding-top: 20 / @px-unit; .ant-divider { background: inherit; } .ant-divider-horizontal.ant-divider-with-text-left:after { border-top: 1 / @px-unit solid #13161b; } .QR_background { width: 205 / @px-unit; height: 205 / @px-unit; padding: 10 / @px-unit; background-color: @formInputTextN; margin: 10 / @px-unit; img{ width: 185 / @px-unit; height: 185 / @px-unit; } } .ant-select-single:not(.ant-select-customize-input) .ant-select-selector{ height: 30 / @px-unit; .ant-select-selection-search-input { height: 28 / @px-unit; } }}.password-reset-modal { width:430 /@px-unit !important;} ._SymServer_ { .gap-divider { margin-top: 0; margin-bottom: 0; }} .card-selected { border: 1 / @px-unit solid @current;}.card-no-selected { border: 1 / @px-unit solid @pageBorderN;}.template-card-swrap { padding: 3px; position: relative;}.template-listcard { width: 250 / @px-unit !important;}.template-card { display: inline-block; width: 200 / @px-unit; min-height: 177 / @px-unit; background-color: @aiPanel_cardBg; .template-card-top-face-database { height: 20 / @px-unit; padding-top: 2 / @px-unit; display: flex; align-items: center; .face-database-name { width: 50%; padding-left: 15 / @px-unit; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .face-person-name { width: 50%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } } .template-card-top { height: 145 / @px-unit; display: flex; .template-card-top-swrap { width: 50%; .image-panle { display: flex; flex-direction: row; justify-content: center; width: 100%; height: 100%; } .svg-panle { height: 100%; width: 100%; background-color: @aiPanel_box_color; border: 1 / @px-unit solid @aiPanel_box_bordere_color; display: flex; justify-content: center; align-items: center; .svg-icon { font-size: 7.142857rem; svg { path { fill: @aiPanel_info_bg_color; } } .svgHover(@aiPanel_info_bg_color); } } } .left { padding: 10 / @px-unit 5 / @px-unit 10 / @px-unit 10 / @px-unit; } .center { margin-left: 60 / @px-unit; } .right { padding: 10 / @px-unit 10 / @px-unit 10 / @px-unit 5 / @px-unit; } } .template-card-top-no-center { display: flex; height: 170 / @px-unit !important; .template-card-top-swrap { width: 50%; } .right-attri-list { display: flex; flex-direction: column; height: 100%; justify-content: flex-start; .attri-item-wrapper { display: flex; .attri-left-item { text-align: left; width: 35 / @px-unit; line-height: 35 / @px-unit; flex-shrink: 0; margin-right: 4 / @px-unit; } .attri-right-item { width: 100%; line-height: 35 / @px-unit; } .attri-color-block { width: 100%; display: flex; justify-content: flex-end; align-items: center; } } .attri-item-wrapper-high { .attri-left-item { line-height: 28 / @px-unit; } .attri-right-item { line-height: 28 / @px-unit; } } .thumb-white { border: 1px solid @vehicle_whiteplate_borderColor; background-color: @vehicle_whiteplate_bgColor; color: .color_N(@vehicle_whiteplate_bgColor)[]; } .thumb-black { background-color: @vehicle_blackplate_bgColor; border: 1px solid @vehicle_blackplate_borderColor; color: .color_N(@vehicle_blackplate_bgColor)[]; } .white-black-list { display: flex; justify-content: center; border-radius: 2px; padding-top: 2 / @px-unit; } .OverSpeed{ width: 80 / @px-unit; height: 40 / @px-unit; position: absolute; bottom: 14 / @px-unit; right: 14 / @px-unit; } } .image-panle { display: flex; flex-direction: row; justify-content: center; width: 100%; height: 100%; } .imageList-panle{ width: 100%; height: 100%; .imagesmall-panle{ width: 100%; height: 80%; } .imageplate-panle{ width: 100%; margin-top: 6/ @px-unit; height: 15%; } } .svg-panle { height: 100%; width: 100%; background-color: @aiPanel_box_color; border: 1 / @px-unit solid @aiPanel_box_bordere_color; display: flex; justify-content: center; align-items: center; .svg-icon { width: 100%; font-size: 7.142857rem; svg { width: 100%; path { fill: @aiPanel_info_bg_color; } } .svgHover(@aiPanel_info_bg_color); } } .left { padding: 10 / @px-unit 5 / @px-unit 10 / @px-unit 10 / @px-unit; } .center { margin-left: 60 / @px-unit; } .right { padding: 10 / @px-unit 10 / @px-unit 10 / @px-unit 5 / @px-unit; } } .template-card-center { height: 25 / @px-unit; background-color: @preview_Sider_Bg; } .template-card-cenBtm { height: 28 / @px-unit; line-height: 28 / @px-unit; .template-card-cenBtm-left { float: left; padding-left: 14 / @px-unit; color: @red; } .template-card-cenBtm-right { float: right; padding-right: 10 / @px-unit; } } .template-card-bottom { height: 25 / @px-unit; background-color: @aiPanel_box_bottom-color; padding: 0 / @px-unit 12 / @px-unit 0 / @px-unit 12 / @px-unit; display: flex; align-items: center; width: 100%; color: .color_N(@aiPanel_box_bottom-color)[]; .template-card-bottom-left { width: 30%; } .template-card-bottom-right { width: 70%; display: flex; justify-content: center; } } .template-card-tag { position: absolute; bottom: (-35 / @px-unit); right: (-10 / @px-unit); .svg-icon { font-size: (180 / @px-unit); svg { path { } } .svgHover(@urgentRecord_defText); } .match, .mismatch { font-size: 100/@px-unit; margin: 0 15/@px-unit 30/@px-unit 0 } } .color-0{ color:#a6aab2; }; .color-1{ color:green; }; .color-2{ color:red; };}.template-list .template-card .template-card-top-no-center .right-attri-list .attri-item-wrapper .attri-left-item{ width: 66/@px-unit;}.template-card:last-child { margin-right: 0 / @px-unit;} ._Onvif_ { padding-left: 20 / @px-unit; padding-top: 20 / @px-unit; padding-right: 10 / @px-unit; width: 100%; ._Table_ { .ant-table { background-color: @pageBodyBg; .ant-table-content { height: 450 / @px-unit; overflow-y: auto; } } .not-show { display: none; } } .ant-modal { .ant-modal-body { min-height: 498 / @px-unit; overflow-y: auto; } } } ._Group_ { padding-left: 20 / @px-unit; padding-top: 20 / @px-unit; padding-right: 10 / @px-unit; width: 100%; ._Table_ { .ant-table { background-color: @pageBodyBg; .ant-table-content { height: 450 / @px-unit; overflow-y: auto; } } } .ant-modal { .ant-modal-body { min-height: 498 / @px-unit; overflow-y: auto; .ant-tabs .ant-tabs-content { [id*="Auth"] { .label-div-Container:not(:first-child) { display: inline-block; width: 190 / @px-unit } } [id*="Monitor"] { .label-div-Container:not(:first-child) { display: inline-block; width: 70 / @px-unit } } [id*="Replay"] { .label-div-Container:not(:first-child) { display: inline-block; width: 70 / @px-unit } } [id*="Voice"] { .label-div-Container:not(:first-child) { display: inline-block; width: 70 / @px-unit } } } } } .ant-tabs-nav .ant-tabs-tab-btn { width: 150/@px-unit !important; min-width: 150 / @px-unit; } .tabText { overflow: hidden; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow: ellipsis; }} .languageDropMenu { min-width: 130/@px-unit !important;}.task_languageBtn{ min-width:50/@px-unit ; .cus_icons{ .svgHover(@homeTaskIconColorA); }}.task_languageBtn:hover{ .cus_icons{ .svgOut(@homeTaskIconColorA); }} .BottomItem{ position: relative; top: 25vh; .dividerLine{ height: 1 / @px-unit; width: 95%; margin-left: 2vw; background: @MenuViewDivideLine; } .ConfigTitle{ font-size: 1.2rem; margin-top: 50 / @px-unit; font-weight: bold; margin-left: 2vw; } .ItemsWrap { display: flex; flex-wrap: wrap; } .Items{ display: flex; flex: 1; margin-top: 2vh; margin-left: 2vw; cursor: pointer; .BottomText{ margin-top: 3 / @px-unit; margin-left: 10 / @px-unit; } } .Items:hover{ color: @--primary-5; svg path{ fill: @--primary-5; } } .home_BottomMenu{ .svgOut(@pageTextN); }}.BottomItemTip { word-break: break-word;} .UI4View{ height: 95%; z-index: 400; position: relative; overflow: hidden; top: 4vh; .MenuView-Carousel-Page { height: 60vh; padding-left: 3%; padding-right: 3%; } .UI4View-MenuView-Card { padding-left: 4/@px-unit; padding-right: 2vw; } .UI4View-MenuView-Card:nth-child(3n) { padding-right:0; } .text-ellipsis { text-overflow: ellipsis; overflow: hidden; word-break: break-all; white-space: nowrap; } .hoverBorder:hover { color: @MenuViewItemTitleTextA; box-shadow: 0 0px 8/@px-unit @MenuViewItemShadowA; } .ViewItem-CardItem { background-color: @--menu-bg; border-radius: 8/@px-unit; padding: 4/@px-unit; background:no-repeat url('/static/media/menu_bg.png'); background-size:100% 100%; } .ViewItem-CardItem-Icon { text-align: center; .ant-image-img { max-width: 140/@px-unit; max-height: 140/@px-unit; } } .ViewItem-CardItem-Title { margin-bottom: 30/@px-unit; font-weight: 700; font-size: 24/@px-unit; color: .color_A(@--menu-bg)[]; } .ViewItem-CardItem-Message { font-size: 14/@px-unit; line-height: 24/@px-unit; color:.color_N(@--menu-bg)[]; } .SubMenu-item { font-size: 14/@px-unit; line-height: 24/@px-unit; color:.color_N(@--menu-bg)[]; padding-right: 12/@px-unit; &:nth-child(even) ::before { position: absolute; top: 4/@px-unit; height:16/@px-unit; left: -14/@px-unit; width: 1/@px-unit; background:.color_D(@--menu-bg)[]; content:''; } &:hover { color: @--primary-6; } } .Bottom-Item{ width: 100%; height: calc(95vh - 60vh); padding:3% 3% 0; background-color: @--bottom-bg; .title { color:.color_A(@--menu-bg)[]; font-weight: 700; font-size: 18/@px-unit; line-height: 24/@px-unit; left: 14/@px-unit; position: relative; &::before { position: absolute; height:24/@px-unit; left: -14/@px-unit; width: 4/@px-unit; background:@--primary-6; content:''; } } .item { display: flex; justify-content: flex-start; margin-top: 20/@px-unit; padding-left: 2/@px-unit; .divider { border-left: 1/@px-unit solid @--split; margin: 20/@px-unit 0; position: relative; right: 8/@px-unit; } .BottomItem-CardItem { cursor: pointer; width: 100% /6; border-radius: 4/@px-unit; padding: 16/@px-unit 20/@px-unit; margin-right: 18/@px-unit; font-weight: 400; .BottomItem-title{ display: flex; line-height: 30/@px-unit; .home_BottomMenu { margin-right: 20/@px-unit; } .BottomText{ font-size: 16/@px-unit; color:.color_A(@--menu-bg)[]; } } .subMenu-content { display: flex; margin-top: 12/@px-unit; flex-wrap: wrap; .subMenu { font-size: 14/@px-unit; width: 49%; line-height: 28/@px-unit; color:.color_N(@--menu-bg)[]; &:hover { color: @--primary-6; } &:nth-child(odd) { margin-right: 2%; } } } } } } } .bgImage { background-image:none !important; background-color: @--bg; } ._DateConfig_.MainPage { width: 100%; .label-normal-behind { height: 0; &.pl-0 { padding-left: 0rem !important; } .label-normal-container { padding-top: 0rem !important; button { margin-left: 1.5rem; } } } .holidayRadioGroup { label { width: 45%; } } } ._SnapDisc_ { padding:20 / @px-unit; width: 100%;} .record-device-info, .record-device-info { display: flex; .label-normal-wrapper { width: 150/@px-unit !important; }}.recordBackModal { ._Table_ .ant-table-body { min-height: 500 / @px-unit; }} ._TimeDelay_{ .switch-tip{ margin-top: 18 / @px-unit;; }} ._MainStreamDisc_ { padding:20 / @px-unit; width: 100%;} ._DateConfig_.MainPage { .label-normal-behind { &.pl-0 { padding-left: 0rem !important; } .label-normal-container { padding-top: 0rem !important; button { margin-left: 1.5rem; } } } .holidayRadioGroup { label { width: 45%; } }} ._RemoteDevice_ { width: 100%; ._AllDevice_ { .all-device-upper { display: flex; justify-content: space-between; .upper-left { display: flex; align-items: center; line-height: 48/@px-unit; .IPSegments-wraper { margin-left: 52/@px-unit !important; } } .upper-right { display: flex; align-items: center; } } .all-device-table { .table-header-bar { display: flex; justify-content: space-between; align-items: center; .header-left { flex-grow: 1; } .header-right { flex-shrink: 0; } .ant-tabs { .ant-tabs-nav { &::before { content: none; } .ant-tabs-tab:not(:first-of-type) { margin-left: 20/@px-unit; } .ant-tabs-tab-btn { height: 40/@px-unit; line-height: 40/@px-unit; padding: 0 8/@px-unit; text-align: center; min-width: 118/@px-unit; width: auto; } } } } .table-bottom-bar1 { display: flex; justify-content: space-between; line-height: 32/@px-unit; } .table-bottom-bar2 { display: flex; line-height: 32/@px-unit; } } } ._AddedDevice_ { .table-header-bar { display: flex; justify-content: space-between; align-items: center; height: 64/@px-unit; .ant-tabs { .ant-tabs-nav { &::before { content: none; } .ant-tabs-tab:not(:first-of-type) { margin-left: 20/@px-unit; } .ant-tabs-tab-btn { height: 40/@px-unit; line-height: 40/@px-unit; padding: 0 8/@px-unit; text-align: center; min-width: 118/@px-unit; width: auto; } } } } .blueIEBrowser { .svgOut(@IEBrowerColor); } .table-bottom-bar { display: flex; line-height: 48/@px-unit; } .manage-table-icon-wrapper { display: flex; justify-content: center; align-items: center; } ._Table_ .ant-table-body { min-height: 180 / @px-unit; } } .remoteDevice-table { ._Table_ .ant-table-body { min-height: 180 / @px-unit; } } .grid-successIcon { .svgOut(@successIcon); } .grid-wifiIcon { .svgOut(@current) } .grid-infoIcon { .svgOut(@warningColor) } .grid-errorIcon { .svgOut(@errorIcon) } .grid-unInitIcon { .svgOut(@warningColor) } .manage-grid-unInitIcon { .svgOut(@warningColor); .svgFont(20); } .manage-grid-errorIcon { .svgOut(@errorIcon); .svgFont(20); } .manage-grid-successIcon { .svgOut(@successIcon); .svgFont(20); } .grid-deleteIcon { .svgHover(@errorColor) } .grid-previewIcon { cursor: pointer; } .table-hidden { height: 0; overflow: hidden; }}.deviceTip.ant-tooltip { max-width: 400 / @px-unit !important;}.__ModifyDeviceForm__ { .label-radio-wrapper { .ant-radio-wrapper { width: 150/@px-unit; } } ._Table_ .ant-table-body { min-height: 160 / @px-unit; }}.addDevice-modal { .ant-form-item-has-error { .ant-input { border-color: @errorColor; } } .modify-labelInputNumber { .ant-input-number { width: 100%; } }}._RemoteDevInit_ { .ant-modal-body { height: 600/@px-unit; } .step1-footer { display: flex; flex-direction: row-reverse; } .step2-footer { display: flex; justify-content: space-between; .step2-footer-right { display: flex; } } .step3-footer { display: flex; justify-content: space-between; .step3-footer-right { display: flex; } } .step4-footer { display: flex; flex-direction: row-reverse; } .initSuccess { color: green; } .initFailed { color: red; } .label-radio-wrapper { .ant-radio-wrapper { width: 150/@px-unit; } } ._Table_ .ant-table-body { min-height: 200 / @px-unit; }}.__useModeErrorModal__ { .ant-modal-body { height: 260/@px-unit; }}.remote-init-failed-table { ._Table_ .ant-table-body { min-height: 200 / @px-unit; }}.IPSegments_modal { width: 560/@px-unit !important; .labelRadioGroup { display: flex; } .IPSegments-ipInput { display: flex; align-items: center; .label-normal-wrapper { width: 240/@px-unit !important; } .IPSegments-middle { margin-left: 10/@px-unit; margin-right: 10/@px-unit; } }}._RemoteTableInfoModal_ { .RemoteTable{ .remoteInfo-table{ .ant-table-thead { display: none; } } }}._MoreSetModal_ { ._MidTitleDivider_ { margin-top: 0; }}.allDevice_PlugAndPlay_behind { line-height: normal;} ._ClusterCommonModule_ { padding-top: inherit; .info_table ._Table_ .ant-table-body { min-height: 600 / @px-unit; } .clusterModal ._Table_ .ant-table-body { min-height: 500 / @px-unit; } } ._AlarmHubNew_ { .line-row { display: flex; } } ._VideoStream_ { width: 100%; .stream-content { display: flex; } .label-normal-container { padding-top:5 / @px-unit !important; padding-bottom: 5 / @px-unit !important; } .form { height: 100%; overflow-x: hidden; overflow-y: auto; } } ._AiPreviewDetailModal_SWRAP{ .ant-modal{ @modalHeight:95vh; @modalWidth:75vw; height: @modalHeight !important; width: @modalWidth !important; .ant-modal-content{ width: 100%; height: 100%; .ant-modal-header{ height: 45 / @px-unit; display: flex; flex-direction: row; align-items: center; padding: 0 / @px-unit 24 / @px-unit; } .ant-modal-body{ padding: 0 / @px-unit; @headerHeight:47 / @px-unit; height: calc(@modalHeight - @headerHeight); ._AiPreviewDetailModal_ { width: 100%; height: 100%; display: flex; .win-preview-panel-swrap{ height:100%; width: 78%; background-color: #3e3e3e; .WinPreview { height: 100%; } } .pic-win-details-swrap{ height:100%; width: 22%; } .WinPreview_ocx{ @WinPreviewFooterHeight:40 / @px-unit; height: calc(100% - @WinPreviewFooterHeight) !important; } } } } }} ._RemotePassword_ { .line-row { display: flex; }} ._AlarmGroupManage_ { width: 100%; height: 100%; .line-row { display: flex; } } ._RealDisplay_{ ._Table_ .ant-table-body{ min-height: 240/@px-unit; .fail{ color: @errorColor; } .ant-table-cell{ word-break:break-all; } } } ._User_ { padding-left: 20 / @px-unit; padding-top: 20 / @px-unit; padding-right: 10 / @px-unit; width: 100%; ._Table_ { .ant-table { background-color: @pageBodyBg; .ant-table-content { height: 450 / @px-unit; overflow-y: auto; } } .not-show { display: none; } } .ant-modal { .ant-modal-body { min-height: 498 / @px-unit; height: 580 / @px-unit; overflow-y: auto; .ant-tabs .ant-tabs-content { [id*="Auth"] { .label-div-Container:not(:first-child) { display: inline-block; width: 190 / @px-unit } } [id*="Monitor"] { .label-div-Container:not(:first-child) { display: inline-block; width: 70 / @px-unit } } [id*="Replay"] { .label-div-Container:not(:first-child) { display: inline-block; width: 70 / @px-unit } } [id*="Voice"] { .label-div-Container:not(:first-child) { display: inline-block; width: 70 / @px-unit } } .label-normal-container { padding: 5/@px-unit 0 !important; } } } } .ant-tabs-nav .ant-tabs-tab-btn { width: 150/@px-unit !important; min-width: 150 / @px-unit; } .tabText { overflow: hidden; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow: ellipsis; }} ._StreamDisc_ { .hdd-mode-swrap{ margin-bottom: 10 /@px-unit; .hdd-mode { display: flex; align-items: center; justify-content: space-between; } } .table-item { margin: 0; text-align: center; } .table-input{ width: 100% !important; .table-input-select-container{ width: 100% !important; } .table-input-select-wrapped{ width: 100% !important; } } ._Table_ .ant-table-body { min-height: 450 / @px-unit; } .hddmanage-combine-table .ant-table-body { min-height: 150 / @px-unit; }} ._StreamDisc_ { .hdd-mode-swrap{ margin-bottom: 10 /@px-unit; .hdd-mode { display: flex; align-items: center; justify-content: space-between; } } .table-item { margin: 0; text-align: center; } .table-input{ width: 100% !important; .table-input-select-container{ width: 100% !important; } .table-input-select-wrapped{ width: 100% !important; } } ._Table_ .ant-table-body { min-height: 450 / @px-unit; } .hddmanage-combine-table .ant-table-body { min-height: 150 / @px-unit; }} ._HubSensor_ { width: 100%; height: 100%; padding-top: 0 !important; padding-left: 0 !important; padding-right: 0 !important; .line-row { display: flex; } } .point-default { width: 26/@px-unit; height: 26/@px-unit; .svgFont(26); pointer-events: initial !important; } .point-unconnect { .svgOut(@--error-6); &:hover { .svgOut(@--error-6) !important; } } .point-connect { .svgOut(@--success-6); &:hover { .svgOut(@--success-6) !important; } } ._PicMapManage_ { -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; .in-dragging { cursor: grabbing } .page-view { display: flex; position: relative; height: 100%; .channel-list { flex: none; background-color: @--bg; z-index: 999; height: 100%; width: 200/@px-unit; padding-bottom: 14/@px-unit; border-right: 1/@px-unit solid @--component-border; @channelFontColor: .color_N(@preview_Left_Bg)[]; overflow-y: auto; overflow-x: hidden; .chnlist_tooltip { .ant-tooltip-content { .ant-tooltip-inner { word-spacing: normal; word-break: break-word; } } } .chItem { display: flex; align-items: center; padding: 3/@px-unit; height: 31/@px-unit; cursor: pointer; .chItem_title {} &:hover { .chItem_title { color: .color_N(@preview_ChnlBgA)[] } background-color: @preview_ChnlBgA; .chItem_btn { display: inline-block; } } &_cameraIcon { .svgOut(@channelFontColor); margin-left: 20/@px-unit; width: 30/@px-unit; height: 30/@px-unit; } ._cameraIcon_active { .svgOut(@iconColorA); } &_title { margin-left: 15/@px-unit; width: 120/@px-unit; color: @preview_ChnlTextN; } &_btn { padding: 0 !important; border: 0 !important; background: none !important; height: 30/@px-unit; display: none; } .label-div-Container { .label-normal-container .label-normal-wrapper { width: 50/@px-unit !important; } } } } .map-content { flex: auto; display: flex; width: 100%; align-items: center; justify-content: center; .drag-feedback { cursor: pointer; pointer-events: none; .detail { height: 22/@px-unit; line-height: 22/@px-unit; display: flex; position: relative; left: -60/@px-unit; pointer-events: initial !important; &:hover .delete-icon { display: initial; } .delete-icon { position: relative; top: -4/@px-unit; .svgFont(30); .svgOut(@--navTitle-bg); svg{ line-height: 22/@px-unit; } display: none; } .showName { text-align: center; width: 140/@px-unit; border-radius: 3/@px-unit; background-color: @--navTitle-bg; color: .color_A(@--navTitle-bg)[]; &:hover { background-color: @--primary-6; color: .color_A(@--primary-6)[]; } } } } .picMap { width: 100%; height: 100%; } .map-upload { width: 100%; height: 100%; &>.label-div-Container { width: 200/@px-unit; position: absolute; right: 20/@px-unit; top: 10/@px-unit; } } .ant-empty { cursor: pointer; height: 500/@px-unit; width: 500/@px-unit; .ant-empty-image { height: 300/@px-unit; width: 500/@px-unit; .NotFoundContent{ .svgFont(300); } } } } } } ._StreamDisc_ { .hdd-mode-swrap{ margin-bottom: 10 /@px-unit; .hdd-mode { display: flex; align-items: center; justify-content: space-between; } } .table-item { margin: 0; text-align: center; } .table-input{ width: 100% !important; .table-input-select-container{ width: 100% !important; } .table-input-select-wrapped{ width: 100% !important; } } ._Table_ .ant-table-body { min-height: 450 / @px-unit; } .hddmanage-combine-table .ant-table-body { min-height: 150 / @px-unit; }} ._StreamDisc_ { .hdd-mode-swrap{ margin-bottom: 10 /@px-unit; .hdd-mode { display: flex; align-items: center; justify-content: space-between; } } .table-item { margin: 0; text-align: center; } .table-input{ width: 100% !important; .table-input-select-container{ width: 100% !important; } .table-input-select-wrapped{ width: 100% !important; } } ._Table_ .ant-table-body { min-height: 450 / @px-unit; } .hddmanage-combine-table .ant-table-body { min-height: 150 / @px-unit; }} ._GAVI_ { .same-line { display: flex; align-items: center; .label-div-Container { margin-right: 30/@px-unit !important; } } .check-box-group { .sdd-checkboxGroup-container { .ant-checkbox-group { display: flex; .ant-checkbox-wrapper { margin-right: 30/@px-unit !important; } } } } .online { color: @successColor; } .offline { color: @errorColor; } } ._SFSConfig_ { padding-top: inherit; .sfs_ocx { width: 450 / @px-unit; height: 337 / @px-unit; background-color: @preview_center_plugin_Bg; } .colorBox(@posCheckbox); .ant-checkbox + span { padding: 0; } } .ChannelList-modal { height: 800/@px-unit; .ant-modal-body { max-height: 600/@px-unit; overflow-y: auto; .gutter-row { padding: 0 10/@px-unit; margin-right: 10/@px-unit; } } } ._VideoFusion_windows { display: flex; width: 1000 / @px-unit; flex-wrap: wrap; > .label-div-Container { margin-right: 50 / @px-unit; } } ._Dsiplay_ { .page-swrap{ width: 100%; display: flex; .ant-divider-horizontal { margin: 5 / @px-unit; width:85%; min-width:85%; } .main-screen-swrap{ width: 50%; } .extra-screen-swrap{ width: 50%; } }} @groupChBox: 23 / @px-unit;._MainScreen_, ._ExtraScreen_ { ._ChnSplit_ { clear: both; .ant-tag { margin: 1px; padding: 0; text-align: center; width: @groupChBox; height: @groupChBox; line-height: @groupChBox; color: @buttonNormalTextN; margin: 5 / @px-unit; background-color: @buttonNormalBgN; border-color: @buttonNormalBorderN; } .operationBtn { margin-right: 10px; } ._Table_{ .table_td_chGroup{ .tr_chGroup{ text-align: left; display: inline-block; } } } .ant-divider-vertical{ top: -8 / @px-unit; } }}.operationBtn_Div{ display: inline-block; align-items: center;}.opraBtn{ padding: 0 !important;} ._OSD_ { overflow-y: hidden !important; &.MainPage .ant-spin-container{ display: flex; } &plugin { .ptz_container { display: flex; .step_zoom_container { display: flex; flex-direction: column; justify-content: center; ._PtzZoom_ { width: 80%; } } } } &config { margin: 0 20/@px-unit; overflow-y:auto; .channelTitleColor{ .colorBox(@posCheckbox); .ant-checkbox + span { padding: 0; } } .title { display: flex; justify-content: space-between; &_checkbox { flex: 2; &.use_switch .label-normal { float: right; margin-left: 15/@px-unit; } } .setting_button { flex: 1; display: flex; justify-content: flex-end; } } .show_extend { display: flex; } .cover_zone_container { display: flex; .label-normal-wrapper { width: auto !important; min-width: auto; } } .cover_zone { width: 30/@px-unit; height: 30/@px-unit; padding: 0; margin: 5/@px-unit; &.selected { color: @buttonNormalTextA !important; border-color: @formInputBgA !important; &:focus { color: @buttonNormalTextA !important; border-color: @formInputBgA !important; } } &[disabled] { opacity: .5; &:hover, &:active, &.active{ opacity: .5; } } } .privacy_mask { display: flex; justify-content: space-between; } .color_picker { &_button { display: inline-block; cursor: pointer; width: 50/@px-unit; display: flex; align-items: center; justify-content: center; svg { width: 10/@px-unit; height: 10/@px-unit; margin-top: 5/@px-unit; margin-left: 6/@px-unit; } } &.disabled { .color_picker_button { cursor: not-allowed; pointer-events: none; } } } .color_picker_container { position: absolute; z-index: 2; .twitter_picker { position: fixed; z-index: 10; top: 0; left: 0; right: 0; bottom: 0; } } &_exceptch { max-height: 660/@px-unit; min-height: 400/@px-unit; padding-right: 60/@px-unit; > div:first-child { display: inline-block; } } } &table { .ant-table-container { width: 550/@px-unit !important; } .editable-cell-value-wrap { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: normal; } .label-normal-wrapper { width: auto !important; min-width: auto; } }} .pic-details-info{ height: 100%; position: relative; .pic-details-info-list{ height: 100%; .thumb-white { border: 1px solid @vehicle_whiteplate_borderColor; background-color: @vehicle_whiteplate_bgColor; color: .color_N(@vehicle_whiteplate_bgColor)[]; text-align: center; width:150 / @px-unit; } .thumb-black { background-color: @vehicle_blackplate_bgColor; border: 1px solid @vehicle_blackplate_borderColor; color: .color_N(@vehicle_blackplate_bgColor)[]; text-align: center; width:150 / @px-unit; } .white-black-list { display: flex; justify-content: center; border-radius: 2px; padding-top: 2 / @px-unit; } .pic-details-info-list-swrap{ overflow: auto; height: 100%; .detail-image{ width: 100%; height: 120px; display: flex; justify-content: center; padding: 10 / @px-unit 0 / @px-unit 10 / @px-unit 0 / @px-unit; .img-swrap{ width: 90px; } } .detail-text-swrap{ display: flex; justify-content: center; } } } .pic-details-bottom{ position: absolute; bottom: 0 / @px-unit; width: 100%; display: flex; height: 40 / @px-unit; border-top: 1 / @px-unit solid @BottomBarBorder; background: @aiPanel_details_bottom_bg; .pic-details-bottom-left{ width: 30%; display: flex; justify-content: center; align-items: center; } .pic-details-bottom-right{ width: 70%; display: flex; justify-content: center; align-items: center; } } .template-card-tag { position: absolute; top:0; left: 0; width: 110%; height: 200px; display: flex; justify-content: center; align-items: center; .svg-icon { font-size: (180 / @px-unit); } .match, .mismatch { font-size: 70/@px-unit; } }} ._RegionOfInterest_ { .form-head { display: flex; .form-head-right { margin-left: 30/@px-unit; margin-bottom: 20/@px-unit; } } .roi_ocx { transform-origin: left top; } } .AudioFileList { padding: 30 / @px-unit; .select_box { display: flex; flex-direction: row; .label-div-Container { margin-right: 40 / @px-unit; } } ._Table_ .ant-table-body { min-height: 190 / @px-unit; }}.file-modal { width: 360 / @px-unit !important; .file_alarm { text-align: center; }} ._ChannelName_ { padding-top: inherit; height: 100%; .ChannelList { height: 90%; overflow-y: auto; .gutter-row { padding: 0 10px; } }} ._RemotePassword_ { .page-view { .header-left { float: left; } .header-right { float: right; } .manage-grid-unInitIcon { .svgFont(20); } .manage-grid-errorIcon { .svgOut(@errorIcon); .svgFont(20); } .manage-grid-successIcon { .svgOut(@successIcon); } }} ._AlarmHubManage_ { ._Table_ .device-table .ant-table-body { min-height: 260 / @px-unit !important; } .btn-bar { display: flex; .label-div-Container { margin-right: 8 / @px-unit; } } .search-device-table { ._Table_ { margin-bottom: 8 / @px-unit; } } .added-device-table { .manage-grid-successIcon { .svgOut(@successIcon) !important; .svgFont(20); } .manage-grid-errorIcon { .svgOut(@errorColor) !important; .svgFont(20); } } } .copy-modal__wrap{ max-height: 400 / @px-unit; overflow: hidden; overflow-y: auto;}.copy-modal__item{ display: flex; flex-wrap: wrap;} @fixButtonHeight: 66 / @px-unit; @titleHeight: 50/@px-unit; @leftMenuWidth:200/ @px-unit; .manage-grid-successIcon { .svgOut(@successIcon) !important; .svgFont(20); } .manage-grid-errorIcon { .svgOut(@errorColor) !important; .svgFont(20); } ._AlarmGroupManage_ { overflow: hidden; .page-view { display: flex; height: 100%; .armedStatus-icon{ .svgOut(@successIcon) !important; } .left-menu { flex: none; width: @leftMenuWidth; border-right: 1/@px-unit solid @--component-border; .title { display: flex; width: 100%; background-color: @--navTitle-bg; height: @titleHeight; justify-content: space-between; align-items:center; padding-left: 8/@px-unit; font-weight: 700; font-size: 14/@px-unit; line-height: @titleHeight; color:.color_A(@--navTitle-bg)[]; border-bottom: 1/@px-unit solid @--component-border; .cus_icons { cursor: pointer; } } .group-sideMenu { overflow-y: auto; height: calc(100% - @titleHeight); .menu-item { cursor: pointer; display: flex; height: 50/@px-unit; padding: 0 10/@px-unit 0 0; border-bottom: 1/@px-unit solid @--component-border; line-height: 50/@px-unit; .cus_icons { line-height: 60/@px-unit; } .group-status { margin-right: 4/@px-unit; } .group-name { flex: 1; } .group-operation{ flex: none; visibility: hidden; cursor: pointer; } &:hover { .group-operation{ visibility: visible; } } } .active-menu-item{ background-color: @--menu-bg; } } } .table-content { width: calc(100% - @leftMenuWidth); padding: 0 10/@px-unit 10/@px-unit; .btn-bar { display: flex; justify-content: space-between; width: 100%; .btn-left { display: flex; } .label-div-Container { margin-right: 8 / @px-unit; } } ._Table_ { margin-top: 0; height: calc(100% - @titleHeight); margin-right: 1/@px-unit; .infoIcon { .svgFont(24); } >.m-table-showEmpty { height: 100%; >.ant-table-wrapper{ height: 100%; .ant-table{ height: 100%; >.ant-table-container{ height: 100%; } } } } .ant-table-body { min-height: calc(100% - @titleHeight); } } } } } .side-button { background-color: transparent; border: none; outline: none; } ._AudioOut_MainPage { padding: 30 / @px-unit; .title_class { display: flex; flex-direction: row; .label-div-Container { margin-right: 15 / @px-unit; } } .content_class { display: flex; flex-direction: row; .label-div-Container { margin-right: 15 / @px-unit; } } .ant-picker .ant-picker-input input { width: 100 / @px-unit; }} @fixButtonHeight: 66 / @px-unit; @titleHeight: 50/@px-unit; ._HubSensor_ { .page-view { display: flex; height: 100%; .left-menu { flex: none; width: 230/@px-unit; .title { height: @titleHeight; padding-left: 8/@px-unit; font-weight: 700; font-size: 14/@px-unit; line-height: @titleHeight; border-bottom: 1/@px-unit solid @--component-border; } .hub-sideMenu { height: calc(100% - @titleHeight); .ant-menu { overflow-y: auto; overflow-x: hidden; &:not(.ant-menu-horizontal) .ant-menu-item-selected { background-color: @SideMenuBg; color: @SideMenuTextA; a { color: @SideMenuTextN; } } &.sideMenuBody { height: 100%; border-right: 1px solid @BottomBarBorder !important; background-color: @SideMenuItemBg; color: @SideMenuTextN; &.ant-menu-inline { .ant-menu-item { margin-top: 0; margin-bottom: 0; width: calc(100%); height: 50px; line-height: 50px; &::after { border-right: none; } .hub-item { display: flex; justify-content: space-between; align-items: center; .armedStatus-icon{ .svgOut(@successIcon) !important; } } .anticon { &.cus_icons { .svgFont(30); flex: none; .svgOut(); } } a { margin-left: 15 / @px-unit; font-size: 16 / @px-unit; display: inline !important; color: @SideMenuTextN; } &:active { background: transparent; } &:hover { color: @SideMenuTextA; a { color: @SideMenuTextA; } } &.ant-menu-item-selected { a { color: @SideMenuItemSelectTextA; } .anticon { &.cus_icons { visibility: visible; .svgOut(@SideMenuItemSelectSvgA); } } } .infoBadge { float: right; } } .ant-menu-submenu { .ant-menu-submenu-title { margin-top: 0; margin-bottom: 0; height: 50 / @px-unit; line-height: 50 / @px-unit; span { font-size: 16 / @px-unit; color: @SideMenuTextN; } &:active { background: transparent; } .ant-menu-submenu-arrow { &::before, &::after { background: @SideMenuItemSvgN; } } .anticon { &.cus_icons { position: relative; top: 5 / @px-unit; .svgFont(); &.placeholder { visibility: hidden; } } } .cus_icons { .svgOut(@SideMenuItemSvgN, @SideMenuItemSvgN, @SideMenuItemSvgN ); } } &.ant-menu-submenu-open { .ant-menu-submenu-title { span { color: @SideMenuTextA; } .ant-menu-submenu-arrow { &::before, &::after { background: @SideMenuArrowSvgA; } } .cus_icons { .svgOut(@MenuViewSubItemSvgA, @MenuViewSubItemSvgA, @MenuViewSubItemSvgA ); } } } &:hover:not(.ant-menu-submenu-open) { .ant-menu-submenu-title { span { color: @SideMenuTextA; } } } .ant-menu-item { &.ant-menu-item-selected { .anticon { &.cus_icons { visibility: visible; } } a { color: @SideMenuSubItemSelectTextA; } .anticon { &.cus_icons { visibility: visible; .svgOut(@SideMenuSubItemSelectSvgA); } } } a { color: @sideMenuItemTextN; } &:hover:not(.ant-menu-item-selected) { a { color: @sideMenuItemTextA; } } } .ant-menu-sub { background-color: @setUpContentBg; width: 99.5% !important; } } } } } } } ._Table_ { margin-top: 0; margin-right: 1/@px-unit; >.m-table-showEmpty { height: 100%; >.ant-table-wrapper { height: 100%; .ant-table { height: 100%; >.ant-table-container { height: 100%; } } } } .ant-table-body { min-height: calc(100% - @titleHeight); } .manage-grid-successIcon { .svgOut(@successIcon) !important; .svgFont(20); } .manage-grid-errorIcon { .svgOut(@errorColor) !important; .svgFont(20); } } } } .side-button { background-color: transparent; border: none; outline: none; } .echart_lengend_color{ color: @pageTextN; } .echart_line{ color: @pageBorderN; } ._UpgradeIpc_ { .DeviceUpgrade{ float: left; margin-top: 8 / @px-unit; } .DeviceType { float: right; } .onlineIcon { .svgOut(@successColor); .svgFont(20); } .offlineIcon { .svgOut(@warningColor); .svgFont(20); } .errorIcon { .svgOut(@errorColor); .svgFont(20); } .LeftButton{ float: left; } .RightButton{ float: right; margin-left: 10 / @px-unit; } ._Table_ .ant-table-body { min-height: 500 / @px-unit; } .label-normal-wrapper.label-button{ line-height: 0px; }}.UpgradeIPC_Attention{ margin-top: 20 / @px-unit;} ._ImageStream_ { .ImageMain { height: 740 /@px-unit; } .FlexLine{ display: flex; .Second{ margin-left: 10 / @px-unit; } .label-normal-behind { margin-left: 8 / @px-unit; } }}.ChannelGroup{ .ant-checkbox-wrapper{ width: 150 / @px-unit; margin-left: 5 / @px-unit; }}.CheckAll{ margin-left: 5 / @px-unit; .ant-checkbox-indeterminate{ .ant-checkbox-inner{ border-color: @current; } }} .side-button { background-color: transparent; border: none; outline: none;}.sideMenu { .ant-menu { &:not(.ant-menu-horizontal) .ant-menu-item-selected { background-color: @SideMenuItemBg; color: @SideMenuTextA; a { color: @SideMenuTextN; } } &.sideMenuBody { height: 100%; border-right: 1px solid @BottomBarBorder !important; background-color: @SideMenuBg; color: @SideMenuTextN; &.ant-menu-inline { .ant-menu-item { margin-top: 0; margin-bottom: 0; width: calc(100%); height: 50px; line-height: 50px; &::after { border-right: none; } .anticon { &.cus_icons { left: 2 / @px-unit; visibility: hidden; position: relative; top: 6 / @px-unit; .svgFont(25); .svgOut(); } &.display-icon { visibility:visible; } } a { margin-left: 15 / @px-unit; font-size: 16 / @px-unit; display: inline !important; color: @SideMenuTextN; } &:active { background: transparent; } &:hover { color: @SideMenuTextA; a { color: @SideMenuTextA; } } &.ant-menu-item-selected { a { color: @SideMenuItemSelectTextA; } .anticon { &.cus_icons { visibility: visible; .svgOut(@SideMenuItemSelectSvgA); } } } .infoBadge { float: right; } } .ant-menu-submenu { .ant-menu-submenu-title { margin-top: 0; margin-bottom: 0; height: 50 / @px-unit; line-height: 50 / @px-unit; span { font-size: 16 / @px-unit; color: @SideMenuTextN; } &:active { background: transparent; } .ant-menu-submenu-arrow { &::before, &::after { background: @SideMenuItemSvgN; } } .anticon { &.cus_icons { position: relative; top: 5 / @px-unit; .svgFont(); &.placeholder { visibility: hidden; } } } .cus_icons { .svgOut( @SideMenuItemSvgN, @SideMenuItemSvgN, @SideMenuItemSvgN ); } } &.ant-menu-submenu-open { .ant-menu-submenu-title { span { color: @SideMenuTextA; } .ant-menu-submenu-arrow { &::before, &::after { background: @SideMenuArrowSvgA; } } .cus_icons { .svgOut( @MenuViewSubItemSvgA, @MenuViewSubItemSvgA, @MenuViewSubItemSvgA ); } } } &:hover:not(.ant-menu-submenu-open) { .ant-menu-submenu-title { span { color: @SideMenuTextA; } } } .ant-menu-item { padding-left: 24px !important; &.ant-menu-item-selected { .anticon { &.cus_icons { visibility: visible; } } a { color: @SideMenuSubItemSelectTextA; } .anticon { &.cus_icons { visibility: visible; .svgOut(@SideMenuSubItemSelectSvgA); } } } a { color: @sideMenuItemTextN; } &:hover:not(.ant-menu-item-selected) { a { color: @sideMenuItemTextA; } } } .ant-menu-sub { background-color: @setUpContentBg; width: 99.5% !important; } } } } }} ._RemoteStorage_ { .ant-divider-horizontal{ background-color: #090c0c !important; margin-top: 8 / @px-unit; margin-bottom: 8 / @px-unit; } .FTPEnable{ display: flex; .FTPRadio{ margin-left: 100 / @px-unit; } } .EventPreRecord { display: flex; .PerRecord{ margin-left: 308 / @px-unit; } .StreamType { margin-left: 108 / @px-unit; } } .TimePicker{ display: flex; .Connector{ padding-top: 10 / @px-unit; margin-left: 5 / @px-unit; margin-right: 5 / @px-unit; } .ant-checkbox-group{ margin-left: 20 / @px-unit; .ant-checkbox-wrapper{ margin-left: 0; } } .ant-picker-disabled{ svg{ opacity: 0.5; } } } .Channel{ .label-normal{ margin-top: 8 / @px-unit; } } .uploadChannel{ display: flex; .label-div-Container:first-child { margin-right: 109 / @px-unit; } }} ._Iscsi_ { width: 100%; padding:20 / @px-unit; .operation-btn { width: 100%; display: flex; .label-div-Container { margin-right: 10/@px-unit; } } .ant-col { .label-div-Container { margin-right: 10/@px-unit; } } ._Table_ .ant-table-body { min-height: 380 / @px-unit; } }.storage-modal { .footer-btn { display: flex; align-items: center; justify-content: flex-end; .label-div-Container { margin-right: 15/@px-unit; } }} ._ExtraStreamDisc_ { padding:20 / @px-unit; width: 100%;} ._ResetModal_ { min-width: 780px; ._StepsHeader_ { display: flex; align-items: center; justify-content:center; border-bottom: 1 / @px-unit solid @pageBorderN; .headerText{ text-align: center; width: 200 / @px-unit; font-size: 16px; } .headerText_current{ color: @current; } .headerIcon_current { fill: @current; } } .PromptTip { margin: 175 / @px-unit; width: 780 / @px-unit; .PromptTipText{ width: 100% !important; } } .ResetContainer { width: 100%; display: flex; flex: 50%; height: 480 / @px-unit; margin-top: 20 / @px-unit; .left { flex: 1; height: 100%; .label-normal-container { padding-bottom: 0 !important; padding-top: 0 !important; } .ResetInfoTip { width: 540 / @px-unit; .ResetInfoTipText{ width: 100% !important; } .cmpLabelText.spaceBreak { width: 100% !important; } } display: flex; align-items: center; justify-content: center; .qrcodes { display: flex; flex-direction: row; align-items: center; justify-content: space-around; canvas, img { width: 220/ @px-unit !important; height: 220/ @px-unit !important; } .qrcodesImg { width: 250/ @px-unit !important; height: 250/ @px-unit !important; } } } .right { flex: 1; height: 100%; border-left: 1 / @px-unit solid @pageBorderN; display: flex; align-items: center; justify-content: center; .contactform { .label-div-Container:nth-child(2) { text-align: right; } } } .QR_background { width: 250 / @px-unit; height: 250 / @px-unit; padding: 15 / @px-unit; background-color: @QRCodeBg; } .QRNumberDiv { width: 100%; height: 100%; display: flex; justify-content: center; .label-normal-wrapper { text-align: center; } } }} ._RecordPlan_ { .childLableContainer-d-inlineBlock { &>div { display: inline-block; } } .labelCheckBox-behind-labelText { .label-normal-container { padding-top: 0 !important; padding-bottom: 0 !important; } } } ._PtzConfig_ { padding-left: 20 / @px-unit; padding-top: 20 / @px-unit;} @StepsHeaderHeight:60 / @px-unit; ._AddGroupModal_ { width: 900/ @px-unit !important; .ant-modal-body{ height: 500 / @px-unit; padding-top: 0; padding-left: 0; padding-right: 0; } ._StepsHeader_ { display: flex; height: @StepsHeaderHeight; align-items: center; justify-content:center; border-bottom: 1 / @px-unit solid @pageBorderN; .headerText{ text-align: center; display: flex; font-size: 16px; line-height: 28 / @px-unit; .step-index { width: 28 / @px-unit; margin-right: 4 / @px-unit; height: 28 / @px-unit; border-radius: 50%; border: 1 / @px-unit solid @pageBorderN; } } .setted{ border-radius: 50%; width: 28 / @px-unit; margin-right: 4 / @px-unit; height: 28 / @px-unit; line-height: 28/ @px-unit; border: 1 / @px-unit solid @--primary-6; .svgOut(@--primary-6); svg{ height: 26 / @px-unit; width: 26 / @px-unit; } } .step-divider{ width: 200/ @px-unit; height: 1/ @px-unit; border-bottom: 1 / @px-unit solid @pageBorderN; } .headerText_current{ color: @--font-l; .step-index { background-color: @--primary-6; color:.color_A(@--primary-6)[]; } } .headerIcon_current { fill: @current; } } .group-name{ margin-top: -20/ @px-unit; height: 100%; justify-content: center; align-items: center; display: flex; } .clearIcon{ .svgFont(20); } ._footer_ { display: flex; } .device-transfer{ height: 440/ @px-unit; padding: 12/ @px-unit; .ant-transfer-list-body { padding-left: 8/ @px-unit; } ._Table_ { width: 400/ @px-unit; .ant-table-body{ max-height: 310 / @px-unit !important; min-height: 310 / @px-unit !important; } } } } ._RecordControl_ { .content-wrapper { display: flex; width: 100%; height: 100%; .pagination-left, .pagination-right { display: flex; align-items: center; width: 50/@px-unit; } .header-titles { width: auto; max-width: 110/@px-unit; margin-right: 30 / @px-unit; .title-wrapper { display: flex; flex-direction: column; padding: 8/@px-unit 0; .header-title-item { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; line-height: 30/@px-unit; } .header-title-first { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; line-height: 32/@px-unit; } } } .channel-radios { width: auto; .sdd-radioGroup-container{ height: auto; } .radio-group-wrapper { display: flex; .channel-radio-group { display: flex; flex-direction: column; .channel-one-radio-group { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; .ant-radio-group { margin-top: 11/@px-unit; } .ant-radio-wrapper { height: 30/@px-unit !important; line-height: 16/@px-unit !important; } .ant-checkbox-group{ margin-top: 14/@px-unit; display: flex; flex-direction: column; .ant-checkbox-wrapper{ margin-left: 0; margin-bottom: 4 / @px-unit;; } } } } } } }} ._PoeManage_{ .online { .svgOut(@successIcon); .svgFont(20); } .offline { .svgOut(@errorIcon); .svgFont(20); } .info-line { display: flex; align-items: center; margin-bottom: 10 / @px-unit; .linked { margin-right: 60 /@px-unit; .title{ margin-right: 60/@px-unit; } } } .tips-panel { margin-top: 10 / @px-unit; } ._Table_ .ant-table-body { min-height: 450 / @px-unit; } } ._HddHealth_ { ._Table_ .ant-table-body { min-height: 220 / @px-unit; } } ._Aging_{ .hdd-mode-swrap{ margin-bottom: 10 /@px-unit; .hdd-mode { display: flex; align-items: center; justify-content: space-between; } }} .flexBetween(){ display: flex; align-items: center; justify-content: space-between; } ._ChanlDiscGroup_ { width: 100%; padding:20 / @px-unit; .hdd-mode { .flexBetween(); margin-bottom: 10 /@px-unit; } ._Table_ .ant-table-body { min-height: 450 / @px-unit; } } .hddmng-table .ant-table-body{ min-height:192 / @px-unit !important; } @modalHeaderHeight: 41 / @px-unit;@modalFooterHeight: 60 / @px-unit;@modalBodyHeight: calc(100vh - @modalHeaderHeight - @modalFooterHeight - 2px);.anchor-point { position: relative;}.ChannelExchangeModal-wrap { width: 100%; height: 100%; .ant-modal { width: 100% !important; max-width: 100vw; height: 100%; .ant-modal-content { height: 100%; .ant-modal-header { height: @modalHeaderHeight; } .ant-modal-body { height: @modalBodyHeight; padding: 5 / @px-unit; } .ant-modal-footer { height: @modalFooterHeight; } } }}.content-wrap { height: 100%; overflow-y: auto; padding: 0px 5 / @px-unit; .grid-line { display: flex; margin-bottom: 5 / @px-unit; }} .modifyIpTip{ display: flex; justify-content: center; align-items: center; .grid-successIcon { .svgOut(@successIcon); } .grid-errorIcon { .svgOut(@errorIcon) } .grid-unInitIcon { .svgOut(@warningColor) } } ._Dsiplay_ { .Main8KTip{ .label-normal { visibility: hidden; } .labelText-wrapper { overflow: visible; } } .IntelRule{ display: flex; >div:nth-of-type(1){ margin-left: -8/@px-unit; } >div:nth-of-type(2){ margin-left: 33/@px-unit; } }} ._DeveloperLog_ { .FlexLine{ display: flex; .LogLevel{ margin-left: 100 / @px-unit; } } ._Table_ .ant-table-body { min-height: 500 / @px-unit; } } ._ChannelInfo_ { .FlexLine{ display: flex; ._Table_{ width: 40%; } ._Table_ .ant-table-body { min-height: 500 / @px-unit; } .RightPane{ margin-left: 40 / @px-unit; } } .channelState{ .svgOut(@successIcon); .svgFont(20); }} ._RecordInfo_{ .recordTable{ width: 80vw; } ._Table_ .ant-table-body { min-height: 360 / @px-unit; } } .detailTime { display: flex; justify-content: space-between; align-items: center;}.errStatus { color: @errorColor;}.warnStatus { color: @warningColor;}.hdd_health_modal { ._Table_ .ant-table-body { min-height: 200 / @px-unit; } } ._Update_ { .ant-btn::before { background: none!important; } .UpdateLine { display: flex; align-items: center; .update_Label { width: 110 / @px-unit; } .checkUpdateText { width: 150 / @px-unit; } .update_text { width: 140 / @px-unit; } } .UpdateButton { width: 119 / @px-unit; } .NewestVersion { padding-top: 8 / @px-unit; padding-bottom: 8 / @px-unit; color: @successColor; } .newVersion { padding-top: 8 / @px-unit; padding-bottom: 8 / @px-unit; .findNewVersion { color: @errorColor; margin-right: 5 / @px-unit; width: 150 / @px-unit; } .updatePanel { height: 200 / @px-unit; width: 620 / @px-unit; padding: 0 10 / @px-unit; border: 1 / @px-unit solid; border-color: @pageBorderN; overflow: auto; } .UpdateButton { width: 119 / @px-unit; margin-left: 500 / @px-unit; } } .newVersionLink { color: @current; } .SystemUpgrade_wrapped { min-width: 610/@px-unit; }} ._AlgorithmVersion_ { .TextNormal{ color:@pageTextN } .TextRed{ color:@errorColor }} ._NetTest_ { .FlexLine { display: flex; justify-content: center; } .ipSpan { width: 20 / @px-unit; margin-top: 3 / @px-unit; } ._Table_ .ant-table-body { min-height: 500 / @px-unit; } .label-normal-container { padding: 0 5 / @px-unit !important; } ._MidTitleDivider_ { margin-top: 0; } .addressTest-reulst { height: 160 / @px-unit; } .m-c-r { color: @errorColor !important; } .m-c-1EB149 { color: @successColor; } .addressTest-content { input { width: 240 / @px-unit; } .addressTest-content { display: inline-block; vertical-align: top; } }} ._OnlineMaintenance_ { .DateExport{ display: flex; padding-top: 30 / @px-unit; padding-left: 20 / @px-unit; .ExportTip{ margin-left: 20 / @px-unit; margin-top: 13 / @px-unit; } }} ._NetInfo_ { padding-top: inherit; ._Table_ .ant-table-body { min-height: 180 / @px-unit; } } ._ChannelState_ { .anticon-left, .ant-pagination-simple-pager, .anticon-right{ color:@pageTextA } ._Table_ .ant-table-body { min-height: 600 / @px-unit; } } ._Maintenance_ { .AutoReboot{ display: flex; .TimeSelect{ margin-left: 5/@px-unit; } } .label-normal-behind { color: @buttonDangerTextH; }} ._CfgManage_ { .ConfirmTip{ padding-top: 8/@px-unit; padding-bottom: 8/@px-unit; } .ExportButton{ padding-top: 8/@px-unit; padding-bottom: 8/@px-unit; }} ._DiskInfo_ { padding-top: inherit; .record_time_modal { ._Table_ .ant-table-body { } } .detect_smart_modal { ._Table_ .ant-table-body { } }.label-v4-version { text-align: right;} ._Table_ .ant-table-container { } }.detect_smart_modal { .detectTips { width: 600 / @px-unit !important; }}.disk_info_BtnDiv { display: flex; justify-content: flex-end; .btn-left { margin-right: 10 / @px-unit; }}.record_updata_modal { .label-normal-container { display: flex; }} ._ImageAttr_{ .ant-tabs-left > .ant-tabs-nav .ant-tabs-tab{ padding: 0 5/@px-unit 0 0; } .ant-tabs-left > .ant-tabs-nav .ant-tabs-tab + .ant-tabs-tab{ margin:5/@px-unit 0 0 0; } .ant-tabs-left{ margin-left: -10/@px-unit; } .ant-picker{ width: 127/@px-unit; } .label-normal-behind { min-width: 25/@px-unit !important; width: auto; } *:focus{ outline-width: 0px; } .ant-tabs-content-holder{ min-height: 250/@px-unit; } .ant-spin-container { .ant-row { flex-flow: row nowrap; } } } ._SideView_{ ._ImageAttr_{ .ant-tabs-nav{ .ant-tabs-tab-btn{ min-width:auto; padding-left:10/@px-unit; width: 188/@px-unit; height: 36/@px-unit; text-align: left; border: 0/@px-unit; line-height: 36/@px-unit; background-color: inherit; } .ant-tabs-tab-active { .ant-tabs-tab-btn{ background-color: @current; color: .color_A(@current); } } } .ant-tabs-nav .ant-tabs-tab-disabled .ant-tabs-tab-btn{ color: @pageTextD; } } } @barHeight:20 / @px-unit;.windows-card { margin-left: 5 / @px-unit; background-color: @preview_windowCard_Bg; position: relative; user-select: none; border: 1px solid @--component-border; .screen-content{ width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; flex-direction: column; p{ margin-bottom:0 } .logo-img{ width: 50%; height: 30%; background-size: contain; background-repeat:no-repeat; background-image: url('/custom_logo/web_logo.png'); background-repeat:no-repeat; } } .snap-img-panel{ width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; .snap-img{ width: 100%; height: 100%; object-fit: fill; user-select: none; -webkit-user-drag: none; pointer-events: none } } .channel-bar { position: absolute; bottom: 0px; height: @barHeight; width: 100%; background:none; .channel-tag{ position: absolute; right: 0px; bottom: 0px; } }}.forbiden{ pointer-events: auto!important; cursor: not-allowed!important; border: 1px solid @--component-border !important;}.normal:hover { border: 1px solid @--primary-5;}.ghost { position: fixed; background-color: @--option-bg-select; z-index: 9999; opacity: 0.9; .snap-img{ opacity: 0.9; }} ._VersionInfo_ { .SystemVersion { width: auto !important; } .achor_info { .label-normal { color: @achor_infoColor; cursor: pointer; &:hover { color: @achor_infoHoverColor; } } } .serialNumber { width: 216px; height: 216px; padding: 8px; background-color: #FFF; }} ._DefaultCfg_ { .DefaultCfgLine { display: flex; padding-top: 8 / @px-unit; padding-bottom: 8 / @px-unit; width: 800 / @px-unit; .wrapCol{ flex:inherit; button { width: 130 / @px-unit; } } .DefaultTip { margin-left: 40 / @px-unit; display: flex; align-items: center; } }} ._PosConfig_ { padding-top: inherit; .pos_ocx { width: 450/@px-unit; height: 337/@px-unit; } .colorBox(@posCheckbox); .ant-checkbox + span { padding: 0; } } ._PosSearch_ { padding-top: inherit; .ant-table { height: 450 / @px-unit; overflow-y: auto; }}.backUp_button{ margin-left: 100%; transform: translateX(-100%);} ._DisplayOriginalScaleWin_ { height: calc(100vh - 50vh); overflow-y:auto; .check-box-group-container{ width: 100% !important; } .check-box-group-wrapped{ width: 100% !important; } .selectContainer{ width: 100% !important; .selectWrapped{ width: 100% !important; } } .checkBoxRow{ width: 100%; display: flex; justify-content: space-between; .checkBoxItem-all{ display: flex; align-items: center; } .checkBoxItem{ width: 50%; .label-normal-container { display: flex; } } .checkBoxItem-behind{ width: 100%!important; } .rightItem{ display: flex; justify-content: center; } } } .targetSetting{ overflow-y:auto; } ._TimeBackup_{ .line-block{ display: flex; } .default-interval{ margin-left: 30 / @px-unit; } .search-btn-list{ justify-content:flex-end; }} ._PIRAlarm_ { width: 100%; .form { height: 100%; overflow-x: hidden; overflow-y: auto; } ._checkbox_pad_ { padding-left: 186 / @px-unit; }} ._AudioDetection_ { height: calc(100% - 66px); overflow-y: auto; } ._PreventAlarm_ { .line-row { display: flex; } } ._Disarming_ { padding-top: inherit; }.chn_div{ display: flex;}.subtitle { margin: 0; font-weight: bold; color: #fff;} ._AccessControl_ { .line-row { display: flex; } } .stream-card { width: 450 / @px-unit; border: 1px solid @tableBorderN; .card-title { padding: 0 5 / @px-unit; height: 35 / @px-unit; line-height: 35 / @px-unit; background-color: @streamTopTabBgA; font-weight: bold; color: .color_N(@streamTopTabBgA) []; font-size: 13px; } .card-content { padding: 0 15 / @px-unit; } .card-footer { display: flex; align-items: center; justify-content: center; }} ._VideoLoss_ { width: 100%; .form { height: 100%; overflow-x: hidden; overflow-y: auto; }} ._SceneChange_ { width: 100%; .form { height: 100%; overflow-x: hidden; overflow-y: auto; }} ._LocalAlarm_ { .container_left { width: 480 / @px-unit; }} .manage-table-icon-wrapper { .manage-grid-errorIcon { .svgOut(@errorColor); .svgFont(20); } .manage-grid-successIcon { .svgOut(@successColor); .svgFont(20); }}._AlarmBox_ { .container_left { width: 480 / @px-unit; }} ._ExtendedIn_ { padding-top: inherit; width: 100%; .onlineIcon { .svgOut(@successColor); .svgFont(20); } .offlineIcon { .svgOut(@warningColor); .svgFont(20); } .tag_BtnDiv { display: flex; flex-direction: row; justify-content: space-between; } .tag_RightBtnDiv { display: flex; flex-direction: row; } .save_Btn { margin-right: 10 / @px-unit; }} ._AlarmInfo_{ .period { display: flex; justify-content: space-between; align-items: flex-end; } .table { min-height: 440px; .ant-table { min-height: 440px !important; } .ant-empty-normal { margin-top: 140px; } .table-header { text-align: center; user-select: none; } .table-icon { cursor: pointer; } } .table-text { position: absolute; right: 1.14285714rem; transform: translateY(-50px); } .backup { width: 100px; } & :nth-child(5) { text-align: right; margin-right: 1.14285714rem;; }}.detail-table { border: 1px solid @tableBorderN; .detail-list-item { display: flex; color: @tableTextN; border: none !important; &:hover { color: .color_A(@tableOddBgN)[]; } .detail-key { width: 30%; text-align: center; } .detail-val { width: 70%; text-align: center; } p { margin: 0; } } .detail-list-item-odd { background-color: @tableEvenBgN; } .detail-list-item-even { background-color: @tableOddBgN;; }}.detail-footer { display: flex; justify-content: space-between;} ._StereoBehavior_ { .ivsParameterSet; .ant-divider-horizontal { margin: 12 / @px-unit 0; }} ._VehiclesDistri_ { .ivsParameterSet;} ._ElevatorDetect_ { height: calc(100% - 66px); .ivsParameterSet; .AlarmInput-channel-select { .label-normal-container { display: flex; align-items: center; } } fieldset { overflow: hidden; } } ._PassThrough_ { height: calc(100% - 66px); .ivsParameterSet; .AlarmInput-channel-select { .label-normal-container { display: flex; align-items: center; } } fieldset { overflow: hidden; } } ._HeatMapTemperReport_ { .week-label { width: 100%; padding: 0 10%; .week-label-wrap { width: 100%; display: flex; .label-item { display: flex; justify-content: center; align-items: center; } } } .selector-wrap { &green { .ant-checkbox-inner { background-color: #1ee17f !important; } } &red { .ant-checkbox-inner { background-color: #ff4f4f !important; } } &yellow { .ant-checkbox-inner { background-color: #fdfc00 !important; } } }} ._IVSRule_ { .ivsParameterSet; .objectSwitch { width: 200 / @px-unit !important; } .TrackTime { width: 200 / @px-unit !important; } .AlarmInput-channel-select { .label-normal-container { display: flex; align-items: center; } }} ._HighThrowingSearch_ { .line-row { display: flex; } .floor_range_box { padding-left: 0; } .floor_range{ display: flex; .label-normal-behind { margin-left: 0 !important; } .floor_range_line{ text-align: center !important; padding-right: 0 !important; } } } ._CrowdDistriRuleConfig_ { * { font-family: "arial", "Microsoft YaHei UI", "Microsoft YaHei" !important; }} ._HighThrowing_ { height: calc(100% - 66px); .ivsParameterSet; .AlarmInput-channel-select { .label-normal-container { display: flex; align-items: center; } } fieldset { overflow: hidden; } } ._EventTransmission_ { .form-list{ .same-line { display: flex; align-items: center; .label-div-Container { margin-right: 30/@px-unit !important; } } .search-button { width: 100%; .right { float: right; margin-left: 30/@px-unit; } } } .table-pagination{ ._Table_ .ant-table-body { min-height: 300 / @px-unit; } } .absolute-button, .fixed-button{ display: flex; } .table_button{ display: flex; justify-content: space-around; div{ cursor: pointer; } } } .LinkageItem_box{ .labelCheckboxGroup { display: flex; justify-content: space-between; flex-wrap: wrap; .ant-checkbox-wrapper{ flex:1; margin-bottom: 15 / @px-unit; } } } .BatchAdd_search{ text-align: right; } ._Template_ { .line-row { display: flex; } } .ElevatorDetect_Search{ .picData_imgAndInfo{ text-align: center; .picData_smallImgContent{ width: 100% !important; } } } ._VehiclesDensity_ { .ant-checkbox-wrapper + .ant-checkbox-wrapper { margin-left: 0; }} ._CrowdDensity_ { .ant-checkbox-wrapper + .ant-checkbox-wrapper { margin-left: 0; }} ._VideoStructrue_ { .ivsParameterSet;} ._VideoBlind_ { width: 100%; .form { height: 100%; overflow-x: hidden; overflow-y: auto; } &line { display: flex; }} .passbyNumColor { color: #e9d760; } ._FaceFlowStat_ { .condition-type { .label-normal-wrapper { width: auto !important; } }} ._Normal_ { .range-tip { margin: 10px 0 5px; } .radar-img { width: 400px; height: 300px; margin-bottom: 20px;; #heatMapCanvas { width: 100%; height: 100%; } } .heat-instruction { width: 300px; height: 18px; background-image: linear-gradient(to right, indigo, blue, green, yellow, orange, red); }} ._AlarmSiren_behind_btn { .label-div-Container { .label-normal-container { padding: 0 !important; } } } ._FishEye_ { .range-tip { margin: 10/@px-unit 0 5/@px-unit; } .radar-img { width: 300/@px-unit; height: 300/@px-unit; margin-bottom: 20/@px-unit;; } .heat-instruction { width: 300/@px-unit; height: 18/@px-unit; background-image: linear-gradient(to right, indigo, blue, green, yellow, orange, red); } ._fisheye_ocx { width: 400/@px-unit; height: 300/@px-unit; margin-bottom: 20/@px-unit; } .rule-num { width: 300/@px-unit; display: flex; > span:first-child { text-align: left; flex: 1; } > span:last-child { text-align: right; flex: 1; } >:not(:last-child):not(:first-child){ text-align: center; flex: 2; } }} ._Backup_ { ._BackupSelector_ { ._BackupSelector_fistline, ._BackupSelector_secondline , ._BackupSelector_thirdline , ._BackupSelector_fourline { display: flex; ._BackupSelector_formatbutton, ._BackupSelector_scanbutton, ._BackupSelector_typeselect, ._BackupSelector_streamtypeselect { margin-left: 30/@px-unit; } ._BackupSelector_diskSize { margin-left: 40/@px-unit; width: 300 / @px-unit; } } ._BackupSelector_button { width: 100%; .right { float: right; margin-left: 30/@px-unit; } } } ._BackupGrid_ { ._Table_ { margin-bottom: 25/@px-unit; } ._Table_ .ant-table-body { min-height: 290 / @px-unit; tbody { .ant-table-row { &.ant-table-row-selected { td { background: transparent; } } .ant-table-cell { &.ant-table-column-sort { background: transparent; } } } } } .fileType_blank { display: inline-block; width: 8/@px-unit; height: 8/@px-unit; margin-right: 10/@px-unit; } .fileType_general { background: @general; } .fileType_detect { background: @detect; } .fileType_alarm { background: @alarm; } .fileType_detectAlarm { background: @detectalarm; } .fileType_ivs { background: @ivs; } .fileType_pos { background: @pos; } .fileType_jpg { background: @jpg; } .fileType_card { background: @card; } ._BackupGrid_button { width: 100%; .label-div-Container { margin-top: -10/@px-unit; } .right { float: right; margin-left: 30/@px-unit; } ._BackupGrid_capacity { margin-left: 140/@px-unit; text-align: right; } ._BackupGrid_process { display: flex; padding-top: 10/@px-unit; width: 70%; ._BackupGrid_timebackupTip { width: 250/@px-unit; } } } }}._BackupSelector_formatModal { ._BackupSelector_formatTip, ._BackupSelector_formatType { width: 100%; .label-normal-wrapper { width: 100% !important; text-align: center; } .ant-radio { top: 0; } .ant-radio-wrapper:first-child .ant-radio{ left: 2px; } } .ant-modal-footer { padding: 5/@px-unit 16/@px-unit 50/@px-unit 16/@px-unit; .label-normal-container { float: right; margin-left: 30/@px-unit; } }}._BackupPopUpFile_Modal { width: 1200/@px-unit !important; ._Table_ .ant-table-body { min-height: 290 / @px-unit; td.ant-table-column-sort { background: transparent; } }}._BackupWarterMark_Modal { width: 900/@px-unit !important; height: 650/@px-unit !important; ._BackupWarterMark_fistline, ._BackupWarterMark_secondline, ._BackupWarterMark_thirdline { display: flex; ._BackupWarterMark_fileaddress, ._BackupWarterMark_progress { margin-left: 30/@px-unit; width: 600/@px-unit !important; } ._BackupWarterMark_wartermarkinfo { textarea { resize: none; } .label-normal { margin-left: 6/@px-unit; width: 125/@px-unit !important; } .label-normal-wrapper { width: 600/@px-unit !important; } } } ._Table_ .ant-table-body { min-height: 350 / @px-unit; } } ._AccessControl_ { .page-view { } } ._VideoMotion_ { width: 100%; .form { height: 100%; overflow-x: hidden; overflow-y: auto; } &line { display: flex; } .container_left { width: 480 / @px-unit; }}.setting-modal { .video { width: 580px; height: 450px; } .form { width: 250px; height: 450px; }} ._IpcExtAlarm_ { &line { display: flex; } .container_left { width: 576 / @px-unit; } } ._AlarmSubscription_ { display: flex; .form { width: 40%; .list { display: flex; flex-wrap: wrap; justify-content: space-between; .checkbox { width: 50%; .label-normal-container { width: 100%; } } } .audio { width: auto !important; } } .table { width: 50%; } .fileButton{ width: 100px; height: 32px; text-align: center; line-height: 24px; max-width: 150px; min-width: 100px; padding: 4px; cursor: pointer; } .fb_active{ border: 1px solid @pageBorderN; color:@pageTextN; &:hover{ color:@pageTextA; } } .fb_disabled { border: 1px solid @iconColorD; color:@iconColorD; background-color: @buttonNormalBgN; cursor: default; } .fileInput{ display: none; } } ._HighThrowing_ { .fd_right { width: 495 / @px-unit; } .channelSelect { padding-top: 0px !important; padding-bottom: 0px !important; } } ._SMDConfig_ { .ant-divider-horizontal { margin: 12 / @px-unit 0; } .flex { display: flex; align-items: center; } .AlarmInput-channel-select { .label-normal-container { display: flex; align-items: center; } }} ._ElevatorDetect_ { .fd_right { width: 495 / @px-unit; } .channelSelect { padding-top: 0px !important; padding-bottom: 0px !important; } } ._PassThrough_ { .parameter-panel { display: flex; flex-direction: column; overflow-y: hidden; margin-left: 18 / @px-unit !important; height: 100%; } } .main-container{ .label-normal-container{ padding-top: 5px !important; padding-bottom: 5px !important; } } .flex-container { display: flex; width: 100%; .flex-item { flex: 1; text-align: center; &.left{ text-align: left; &:first-child{ padding-left: 30px; } } } } .flex-checkbox-container { display: flex; width: 100%; justify-content: space-around; .flex-checkbox-item { flex: 1; text-align: center; &.left{ text-align: left; &:first-child{ padding-left: 30px; }