} .pageLineLeft{ .ant-btn:not(.btn-link):not(.ant-btn-link):hover, .ant-btn:not(.btn-link):not(.ant-btn-link):hover:not(:focus) { svg { fill: @iconColorA !important; } background-color:@--component-bg !important; border-color: @pageBorderN !important;; } } ._PtzCtrl_header_el .anticon { font-size: 49.8 / @px-unit !important; } ._Update_ { .remote_upgrade { width: 1000 / @px-unit; .upgrade_curVersion_tip { display: flex; } .remote_upgrade_info { height: 260 / @px-unit; margin: 20 / @px-unit 0; .update_info { display: flex; margin-bottom: 20 / @px-unit; .update_info_btns { display: flex; .update_info_btn { margin-right: 10 / @px-unit; } } } } } } @pdEyeIconA:#fff; @loginPrimaryBtnBg:#32373c; @loginPrimaryBtnBorder:#666b74; @loginActiveBtnBg:@--primary-6; @loginActiveBtnBorder:@--primary-6; @formInputDropDownBgA:@formInputDropDownBgSel; @formMuliInputBgA:@formInputBgN; @loginForgetPwdTextA:@--font-l; @MenuViewBgA: @--primary-6; @MenuViewItemShadowA: @--primary-6; @MenuViewItemTitleTextN: #fef29d; @navMenuHeight: 60 / @px-unit; @navMenuFontN:17px; @navDropdownMenuTextA: @--font-l; @navDropdownMenuBgA: @--option-bg-select; @navDropdownMenusvgA:@--font-l; @SideMenuItemSelectSvgA:@sideMenuItemTextA; @SideMenuItemSelectTextA:@sideMenuItemTextA; @buttonActiveBgA:@--primary-6; @buttonActiveBorderN:@--primary-6; @topTabBgA: @--primary-6; @tabBgN: @--menu-bg; @tableHeadTextN:#fef29d; @formCheckboxBorderA:@--font-l; @formCheckboxBgA:@--primary-6; @tableTextA:@--font-l; @tableBgA: #52555a; @navMenuIconSvgN: @--font-l; @SideMenuSubItemSelectTextA:@--primary-6; @SideMenuSubItemSelectSvgA:@--primary-6; @streamTopTabBgA: @--menu-bg; @talkAndSound_actBg:@--primary-6; @talkAndSound_actBg:@--primary-6; @iconListColorN: #4E922D; @safeSecurityStatusColor:@--primary-6; @formInputBorderA:@--primary-6; @formCheckboxInnerA:@--font-l; @navcenterColor:#1B1E20; @--primary-6:#C40222; @--primary-5:#D12C47; @--primary-7:#9E001A; @--toolbar-bg:#4C5054; @--bg:#2A2E33; @--component-bg:#2a2e33; @--component-border: #4b515c; @--component-bg-disable:#32373C; @--option-bg-select:#C40222; @--menu-bg:#393c41; @--navTitle-bg:#4c4f54; @--split:#5c5d62; @--bg-card:#424347; @--block:#17181C; @--title:#3c4348; @--font-l:#FFFFFF; @--font-r:#a6aab2; @--placeholder:#5d6263; @--font-s:#7c8284; @--font-l-l:#000000; @--font-r-l:#262626; @--placeholder-l:#BFBFBF; @--font-s-l:#8C8C8C; @--warning-6:#ffd304; @--warning-border:#B59914; @--warning-bg:#44422D; @--warning-5:#ffdc38; @--warning-7:#cca903; @--success-6:#29d67d; @--success-border:#299B64; @--success-bg:#2A423C; @--success-5:#4bd690; @--success-7:#21ab65; @--error-6:#ff4f4f; @--error-border:#B54345; @--error-bg:#443136; @--error-5:#ff7272; @--error-7:#cc3f3f; @base-rem-size-sm: 12px; @base-rem-size: 14px; @px-unit: 14rem; @current: @--primary-6; @pageTextN: .color_N(@--bg)[]; @SddFontNormalColor:@pageTextN;@SddNumberLimitRangeColor:@pageTextN;@pageTextA: .color_A(@--bg)[]; @pageTextD: .color_D(@--bg)[]; @successColor: @--success-6; @warningColor: @--warning-6; @anchorTextN: @pageTextN; @anchorTextA: @--primary-5; @mainPageSvgN: @pageTextN; @pageBorderN: @--split; @pageBorderD: @pageBorderN;@dropMenuBorder: @--split; @dividerColor: @--split; @red: #ff0000;@pdEyeIconA: @current; @iconColorN: @pageTextN; @iconColorD: .color_D(@--bg)[]; @iconColorA: @--primary-5; @homeTaskIconColorA: @--primary-5; @iconLinearStartColorN: #ffffff; @iconBgColor: #ffffff; @iconLinearStopColorN: @pageTextN; @iconLinearStartColorA: @--primary-6; @iconLinearStopColorA: @current; @iconActiveWifi: #0f0; @iconNolmal: #468429; @iconFail: #cd8b0f; @iconHover: @--warning-5; @pageBodyBg: @--bg; @theme: 'deep'; @themeMainViewurlproject:'resource';@themeMainImage:'login_bg_@{theme}'; @sliderBgN: @--block; @sliderBgA: @--block; @sliderTrackN: @current; @sliderRailA: @--primary-5; @sliderTrackA: @--primary-5; @formInputBgN: @--component-bg;@formInputBgD: @--component-bg-disable;@formInputBgA: @--primary-5;@formInputBoderN: @pageBorderN;@formInputBoderD: @pageBorderD;@formInputBorderA: @--primary-5;@formInputTextN: .color_A(@--bg)[];@formInputTextD: @pageTextD;@formInputSvgN: .color_N(@formInputBgN)[];@formInputSvgA: @--primary-5;@formInputSvgD: @pageTextD;@numberInPutHandleBgA: @pageBodyBg; @numberInPutHandleBoderA: @formInputBoderN;@formInputDropDownBgN: @formInputBgN; @formInputDropDownTextN: @pageTextN; @formInputDropDownBgA: transparent; @formMuliInputBgA:@formInputDropDownBgA;@formInputDropDownBgSel:@--option-bg-select;@formInputDropDownTextSelectN: .color_N(@formInputDropDownBgSel)[]; @formInputSwitchBgN:@--font-s;@formRadioBorderN: .lumaColorSelect(@pageBodyBg, @--font-r, @--font-r-l)[]; @formCheckboxBorderD: @--placeholder; @formCheckboxBorderN: .lumaColorSelect(@pageBodyBg, @--font-r, @--font-r-l)[]; @formCheckboxBorderA: @formInputBorderA; @formCheckboxBgA:@formInputBgN;@tableHeadTextN: .color_A(@--bg)[]; @tableBgN: @formInputDropDownBgN; @tableTextN: @pageTextN; @tableTextA: @tableHeadTextN; @tableOddBgN: @--bg; @tableEvenBgN: @--component-bg-disable; @tableBgA: @--option-bg-select; @tableBgD: @tableOddBgN; @tableBorderN: @pageBorderN; @paginationTextN: @pageTextN;@paginationTextA: @--primary-5;@paginationInputTextN: @pageTextN;@paginationBg: @pageBodyBg;@paginationBorderA: @--primary-5;@progressBg: @--block;@progressText: @pageTextN;@progressBgA:@--primary-6;@buttonNormalBgN: @--component-bg;@buttonNormalBgD: @buttonNormalBgN;@buttonNormalTextN: .color_N(@buttonNormalBgD)[];@buttonNormalTextA: .color_A(@buttonNormalBgN)[];@buttonNormalTextD: .color_D(@buttonNormalBgN)[];@buttonNormalBorderN: @pageBorderN;@buttonNormalBorderD: @buttonNormalTextD;@buttonActiveBgN: @--primary-6;@buttonActiveBgD: @buttonNormalBgD;@buttonActiveBgA: @--primary-5;@buttonActiveTextN: .color_A(@buttonActiveBgN)[];@buttonActiveTextD: @buttonNormalTextD;@buttonActiveBorderN: @buttonActiveBgN;@buttonActiveBorderD: @buttonActiveTextD;@buttonTestBgN: @buttonNormalBgN;@buttonTestBgH: @buttonTestBgN;@buttonTestBgA: @--success-7;@buttonTestBgD: @buttonNormalBgN;@buttonTestTextN: @--success-6;@buttonTestTextH: @--success-6;@buttonTestTextA: .color_A(@buttonTestBgA)[];@buttonTestTextD: .color_D(@buttonNormalBgN)[];@buttonTestBorderN: @--success-6; @buttonTestBorderH: @--success-5;@buttonTestBorderA: @buttonTestBgA;@buttonTestBorderD: @buttonNormalTextD;@buttonDangerBgN: @buttonNormalBgN;@buttonDangerBgH: @buttonDangerBgN;@buttonDangerBgA: @errorColor;@buttonDangerBgD: @buttonNormalBgN;@buttonDangerTextN: @errorColor;@buttonDangerTextH: @--error-6;@buttonDangerTextA: .color_A(@buttonDangerBgA)[];@buttonDangerTextD: @buttonNormalTextD;@buttonDangerBorderN: @errorColor;@buttonDangerBorderH: @--error-5;@buttonDangerBorderA: @buttonDangerBgA;@buttonDangerBorderD: @buttonNormalBorderD;@tabBgN: @--title;@tabBgA: @--primary-6;@tabTextN: .color_N(@--title)[];@tabTextA: .color_A(@--primary-6)[];@tabBorder: @--split;@topTabBgN: @--block;@topTabBgA: @--navTitle-bg; @topTabTextA: .color_A(@topTabBgA)[];@topTabTextN: .color_A(@topTabBgN)[];@streamTopTabBgA: @topTabBgA; @modalBg: @--bg;@modalBorder: @--split;@modalContentText: @pageTextN;@modalTitleBg: @--navTitle-bg;@modalTitleText: .color_A(@modalTitleBg)[];;@modalTitleBorder: @modalBorder;@modalFooterBg: @modalBg;@modalFooterBorder: @dividerColor;@QRCodeBg: #fff;@popover_TextN: @pageTextN;@popover_BgN: @--bg-card;@popover_BorderN: @dropMenuBorder;@passwordCheckBg: @--block;@errorColor: #f5222d; @warnColor: @--warning-6; @successColor: #52c41a; @subtitleColor: .color_A(@pageBodyBg)[]; @ocxBg: #000000; @ocxHeaderBg: #414141; @ocxBorder: @--split; @ocxDownloadBar:@--block;@loginForgetPwdTextN: .color_S(@pageBodyBg)[]; @loginForgetPwdTextA: @--primary-5; @loginIconSvg: @current; @loginFormInputBg:@formInputBgN;@loginFormInputBorder:@formInputBoderN;@loginFormInputText:@formInputTextN;@loginPrimaryBtnBg: @buttonActiveBgN; @loginPrimaryBtnBorder:@buttonActiveBorderN;@loginActiveBtnBg:@--primary-5; @loginActiveBtnBorder:@--primary-5; @scrollbarHeight: 6 / @px-unit;@navBg: @--title; @navDivider: @--split; @navMenuTextN: @pageTextN; @navMenuTextA: @current; @navMenuIconSvgN: .color_N(@topTabBgN)[]; @navMenuIconSvgA: @--primary-5; @navMenuBorderN: @dividerColor; @navMenuHeight: 38 / @px-unit; @navMenuAddScrollHeight: @navMenuHeight + @scrollbarHeight; @navMenuLineHeight: calc(@navMenuHeight - 1px); @navMenuFontN:14px;@navDropdownMenuBg: @--component-bg; @navDropdownMenuTextN: @pageTextN; @navDropdownMenuTextA: @current; @navDropdownMenuBgA: inherit; @navDropdownMenusvgA:@current;@MenuViewBg: transparent; @MenuViewBgA: transparent; @MenuViewItemTitleTextN: @pageTextN; @MenuViewItemTitleTextA: .color_A(@--bg)[]; @MenuViewItemContentTextN: .color_S(@--bg)[]; @MenuViewItemContentTextA: .color_A(@--bg)[]; @MenuViewItemShadowA: @--primary-5; @MenuViewPageSwiperSvgN: @--primary-6; @MenuViewPageSwiperSvgD: .color_D(@--bg)[]; @MenuViewPageSwitchSvgN: .color_D(@--bg)[]; @MenuViewPageSwitchSvgA: @--primary-6; @MenuViewDivideLine: @dividerColor; @preview_Sider_Bg: @--menu-bg; @preview_Left_Bg: @preview_Sider_Bg; @preview_Right_Bg: @preview_Sider_Bg; @ocx_Border: @--split; @preview_ChnlTextN: .color_N(@preview_Left_Bg)[]; @mutilPreview_Bg: @popover_BgN; @mutilPreview_border: @popover_BorderN; @talkAndSound_actBorder: @errorColor; @talkAndSound_defBorder: @buttonNormalBorderN; @talkAndSound_actBg: @errorColor; @talkAndSound_defBg: @buttonNormalBgN; @talkAndSound_actText: @pageTextA; @talkAndSound_defText: @pageTextN; @urgentRecord_actBorder: @errorColor; @urgentRecord_defBorder: @buttonNormalBorderN; @urgentRecord_actBg: @errorColor; @urgentRecord_defBg: @buttonNormalBgN; @urgentRecord_actText: @pageTextA; @urgentRecord_defText: @pageTextN; @ptz_btnBorder: @buttonNormalBorderN; @ptz_textColor: @buttonNormalTextA; @ptz_btnBg: @buttonNormalBgN; @fastPreview_btnActBg: @--primary-5; @fastPreview_border: @--component-border; @fastPreview_hoverText: @pageTextA; @fisheye_title: @--navTitle-bg; @fisheye_iconHover: @--primary-5; @fisheye_actColor: @current; @alramOut_actText: @pageTextA; @alramOut_actBorder: @current; @preview_ChnlBgA: @--bg; @preview_center_plugin_Bg: #000000; @preview_center_bottom_Bg: @--toolbar-bg; @preview_center_popover_ColorA: @--primary-5; @preview_center_separator_ColorN: @pageTextD; @preview_right_tabTitle_Bg: @--navTitle-bg; @preview_right_ptzStep_Bg: @--bg; @preview_right_ptzStepMask_ColorN: @pageTextN; @preview_right_ptzZoom_Bg: @--bg; @preview_right_ptzZoom_border_ColorN: @--split; @preview_right_ptz_borderBottom_ColorN: @--split; @preview_right_ptzBg:@--bg;@aiPanel_title_bg_color: @preview_right_tabTitle_Bg; @aiPanel_box_color: #4c4f54; @aiPanel_box_bottom-color: @--navTitle-bg; @aiPanel_box_bordere_color: transparent; @aiPanel_info_bg_color: #393c41; @aiPanel_details_bottom_bg: @--menu-bg; @aiPanel_cardBg:@--bg-card; @aiPanel_bg_color: @preview_Right_Bg; @aiSetPanel_bottom_unSelectBg: @--component-bg-disable;@winpreview_footer_Bg: @preview_center_bottom_Bg; @playback_Right_Bg: @preview_Right_Bg; @setUpBodyBg: @pageBodyBg; @setUpContentBg: @setUpBodyBg; @setUpContentBorder: @dividerColor; @setUpDivider: @dividerColor; @CalibrateSub1: #28DA83; @CalibrateSub2: aqua; @CalibrateSub3: #F2913E; @SideMenuBg: @--menu-bg; @SideMenuItemBg: @--bg; @SideMenuBorder: @dividerColor; @SideMenuTextN: .color_N(@SideMenuBg)[]; @SideMenuTextA: .color_A(@SideMenuBg)[]; @sideMenuItemTextN: .color_N(@SideMenuItemBg)[];@sideMenuItemTextA: .color_A(@SideMenuItemBg)[];@SideMenuArrowSvgA: .color_A(@SideMenuBg)[]; @MenuViewSubItemSvgA: .color_A(@SideMenuBg)[]; @SideMenuItemSelectSvgA: @current; @SideMenuItemSelectTextA:@current; @SideMenuSubItemSelectTextA:@current; @SideMenuSubItemSelectSvgA:.color_A(@SideMenuBg)[]; @BottomBarBg: @formInputDropDownBgN; @BottomBarBorder: @dividerColor; @successIcon: #20d878;@errorIcon: #ff514b;@schedulePlanEvenBg: @--block; @schedulePlanOddBg: @--bg; @SpinBg: @--bg;@SpinTextBg: @--block;@SpinTextA: .color_N(@SpinTextBg)[];@timePlanBorderN: .color_S(@pageBodyBg)[];@planGeneral:.subColor(@general)[@deep];@planDetect: .subColor(@detect)[@deep];@planAlarm: .subColor(@alarm)[@deep];@planDetectalarm: .subColor(@detectalarm)[@deep];@planIvs: .subColor(@ivs)[@deep]; @planPos: .subColor(@pos)[@deep];@planSmd:.subColor(@smd)[@deep]; @planFaceRecognition: .subColor(@faceRecognition)[@deep]; @textColorNo5: @pageTextN; @font-size-base: 14px;@font-huge: 20px; @PickerHeaderBg: @--navTitle-bg; @PickerHeaderTextN: .color_N(@PickerHeaderBg)[]; @PickerBodyBg: @--component-bg; @PickerBodyTextN: .color_N(@--component-bg)[]; @PickerBodyTextA: .color_A(@--component-bg)[]; @PickerHeaderButtonN: @PickerHeaderTextN; @pickerBorder: @--component-border; @ai_scene_bg: @--menu-bg; @ai_search_bg: @pageBodyBg; @ai_DataItem_bd: @--split; @ai_DataItem_bg: @aiPanel_cardBg; @ai_progress_default: @progressBg; @ai_progress_red: #c45453; @ai_progress_orange: #d08d42; @ai_progress_blue: #3d88bd; @ai_labelCheck_bg: @aiPanel_box_bottom-color; @ai_rightPanel_bg: @--menu-bg; @vehicle_whiteplate_bgColor: #296331; @vehicle_whiteplate_borderColor: #1f812b; @vehicle_blackplate_bgColor: #940000; @vehicle_blackplate_borderColor: #e20607; @com_facesmallpics_border: @pageBorderN; @com_detectsmallPic_bd: @pageBorderN; @com_detectsmallPic_select_bd: @current; @com_faceRegister_edit_bg: #000000; @files_upload_box_bg: @--menu-bg;; @files_upload_box_border_color: @--split; @achor_infoColor:#ff0000;@achor_infoHoverColor:#00ff00;@aiDisplayNumCheck:#39d67f;@scroll_bar_base:.lumaColorSelect(@pageBodyBg,@scroll-bar,@scroll-bar-l)[];@page_scroll_barH:fadeout(@scroll_bar_base, 50%);@page_scroll_bar:fadeout(@scroll_bar_base, 75%);@page_scroll_track:@pageTextD;@posCheckbox:{ white: #ffffff, #A6A6A6, #737373; black: #121212, #737373, #A6A6A6; red: #fb549c; orange: #f35900; yellow: #fdfc00; green: #1ee17f; dodgerblue: #009cfd; pos: #5772ff; purple: #c46cf1; };@general: #39d67f;@alarm: #ff4f4f;@detect: #e9d760;@detectalarm: #f1910a;@ivs: #39adf6;@jpg: #3ae8f8;@pos: #788ae3;@card: #7debf7;@smd:#0ebba9;@faceRecognition:#ff4bdb;@whiteMode: #FFFF00;@recordBox:{ general:@general; alarm:@alarm; detect:@detect; detectalarm:@detectalarm; ivs:@ivs; jpg:@jpg; pos:@pos; card:@card;}@iconListColorN: #1890FF; @safeSecurityStatusColor:#40a9ff; @--primary-6:#009CFF; @--primary-5:#33B0FF; @--primary-7:#007DCC; @--toolbar-bg:#4C5054; @--bg:#2A2E33; @--component-bg:#2a2e33; @--component-border: #606366; @--component-bg-disable:#32373C; @--option-bg-select: #55585D; @--menu-bg:#393c41; @--navTitle-bg:#4c4f54; @--split: #606366; @--bg-card: #56585B; @--block: #17181C; @--title:#313439; @--font-l:#FFFFFF; @--font-r: #a6aab2; @--placeholder: #5d6263; @--font-s: #7c8284; @--font-l-l:#000000; @--font-r-l: #262626; @--placeholder-l: #BFBFBF; @--font-s-l: #8C8C8C; @--warning-6:#ffd304; @--warning-border: #B59914; @--warning-bg: #44422D; @--warning-5:#ffdc38; @--warning-7:#cca903; @--success-6:#29d67d; @--success-border: #299B64; @--success-bg: #2A423C; @--success-5:#4bd690; @--success-7:#21ab65; @--error-6: #ff4f4f; @--error-border: #B54345; @--error-bg: #443136; @--error-5: #ff7272; @--error-7: #cc3f3f; @scroll-bar:rgb(255, 255, 255); @scroll-bar-l:rgb(0,0,0); .svgFont(@fontSize:30) { font-size: if((@fontSize = 0), inherit, @fontSize / @px-unit);}.svgOut (@normalColor:@iconColorN , @lineStart:@iconLinearStartColorN , @lineStop:@iconLinearStopColorN) { &:not(.disabled_icons) { svg { & + { path:first-child { fill: if((@normalColor = 0), @iconColorN, @normalColor); } } & + { linearGradient { stop:first-child { stop-color: @lineStart; } stop:last-child { stop-color: @lineStop; } } } } }}.svgHover (@hoverColor:@--primary-5 , @lineHoverStart:@iconLinearStartColorA , @lineHoverStop:@iconLinearStopColorA) { &:not(.disabled_icons):not(.noHover) { &.active, &:hover { svg { & + { path:first-child { fill: if( (@hoverColor = 0), @--primary-5, @hoverColor ); } } linearGradient stop:first-child { stop-color: @lineHoverStart; } linearGradient stop:last-child { stop-color: @lineHoverStop; } } } }}.svgDisabled (@disableColor:@iconColorD) { svg { & + { path:first-child { fill: @disableColor; } } } cursor: not-allowed; }.svgBoder (@borderColor:@buttonNormalBorderN , @bgColor:@buttonNormalBgN) { .bg (@color) when (isColor(@color)) { background-color: @color; } .border (@color) when (isColor(@color)) { border: 1 / @px-unit solid @color; } .bg(@bgColor); .border(@borderColor);}.opacity (@opacity) { @IEOpacity: @opacity * 100; -moz-opacity: @opacity; opacity: @opacity; filter: alpha(opacity= @IEOpacity);}.colorSvg (@svgId, @hoverColor:@--primary-5) { &:not(.disabled_icons):not(.noHover) { &:hover { .@{svgId} { path { fill: @hoverColor !important; } } } }}.lumaValue(@bg){ @redV:red(@bg); @greenV:green(@bg); @blueV:blue(@bg); @lumaV:(@redV * 0.2126 + @greenV * 0.7152 + @blueV * 0.0722) / 255 * 100%;}.lumaColor(@bg:@--bg, @state){ @deepFont:@--font-l,@--font-r,@--placeholder,@--font-s; @lightFont:@--font-l-l,@--font-r-l,@--placeholder-l,@--font-s-l; @result:(if((.lumaValue(@bg)[] >= 60%),extract(@lightFont,@state),extract(@deepFont,@state)));}.lumaColorSelect(@bg:@--bg, @deepColor, @lightColor){ @result:(if((.lumaValue(@bg)[] >= 60%),@lightColor,@deepColor));}.subColor(@base6){ @h:hue(@base6); @s:round(hsvsaturation(@base6)); @v:round(hsvvalue(@base6)); @s-5:round(@s - @s / 5); @v-5:round(@v + (100%- @v) / 5); @s-7:round(@s + (100% - @s) / 5); @v-7:round(@v - @v / 5); @s-8:round(@s + ((100% - @s) / 5) * 2); @v-8:round(@v - (@v / 5) * 2); @hover:hsv(@h,@s-5,@v-5); @click:hsv(@h,@s-7,@v-7); @deep:hsv(@h, @s-8 , @v-8);}.color_A(@bg:@--bg){ .lumaColor(@bg, 1);}.color_N(@bg:@--bg){ .lumaColor(@bg, 2);}.color_D(@bg:@--bg){ .lumaColor(@bg, 3);}.color_S(@bg:@--bg){ .lumaColor(@bg, 4);}.colorBox(@colorMap){ each(@colorMap, { @base: extract(@value , 1); @base_H: if(length(@value) >= 2 ,extract(@value , 2) ,.subColor(@base)[@hover]); @base_C: if(length(@value) >= 3 ,extract(@value , 3) ,.subColor(@base)[@deep]); .sdd-checked-@{key} { &.ant-checkbox-wrapper:hover .ant-checkbox-inner{ border-color: @base_H !important; } .ant-checkbox-inner { border-color: @base_C !important; background-color: @base !important; &:after{ border-color: @base_C; } } .ant-checkbox-checked::after{ border-color: @base_C !important; } } });} @secondary:{ selRuleLineColor: #ffff00; unSelRuleLineColor: #0000ff; selFilterLineColor: #06c8f9; unSelFilterLineColor: #06c8f9; pointRuleSelColor: #01ff01; testAA:fadeout(#01ff01,25%); hddDiskHealth:#009CFF; playbackUplineBgN:@--bg; playbackLineBgN: @--toolbar-bg; playbackCoordinateTextColorN: .color_N(@--toolbar-bg)[]; playbackFramePenColorN: @--bg; playbackNormalTypeColorN: #39D67F; playbackMotionTypeColorN: #D9E612; playbackIntellTypeColorN: #39ADF6; playbackAlarmTypeColorN: #D51112; faceTargetColor: rgb(0, 255, 0); bodyTargetColor: rgb(0, 204, 255); vehicleTargetColor: rgb(225, 216, 0); customTargetClolor: rgb(255, 69, 0); }; body{ background: transparent;}#root, body { height: 100%; word-wrap:break-word; overflow:hidden; color: @pageTextN; .rc-virtual-list-scrollbar-thumb { &:hover { background: @page_scroll_barH !important; } background: #8f8f8f !important; }}.cuttitle { overflow: hidden!important; white-space: nowrap; word-wrap: normal; -o-text-overflow: ellipsis; text-overflow: ellipsis;}.ant-tabs{ color: @pageTextN;}.ant-table{ .ant-table-thead{ th.ant-table-cell{ word-break: normal; } }}i { cursor: pointer;}.MainPage { width: 100%; padding: 20/@px-unit;}::-webkit-scrollbar { width: @scrollbarHeight; height: @scrollbarHeight; cursor: pointer;}::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6/@px-unit rgba(0,0,0,0); box-shadow: inset 0 0 6/@px-unit rgba(0,0,0,0); background:@pageBodyBg;}::-webkit-scrollbar-thumb { border-radius: 4/@px-unit; background: @page_scroll_bar; -webkit-box-shadow: inset 0 0 6/@px-unit rgba(0,0,0,0.1); box-shadow: inset 0 0 6/@px-unit rgba(0,0,0,0.1);}::-webkit-scrollbar-thumb:hover{ background: @page_scroll_barH;}::-webkit-scrollbar-thumb:active{ background: @page_scroll_bar;}::-webkit-scrollbar-thumb:window-inactive { background: rgba(0, 0, 0, 0.2);} .m-width-f10 { width: calc(~"100% - 10rem") !important;}.m-width-auto { width: auto !important;}.m-width-15 { width: 15/@px-unit !important;}.m-width-20 { width: 20/@px-unit !important;}.m-width-24 { width: 24/@px-unit !important;}.m-width-25 { width: 25/@px-unit !important;}.m-width-30 { width: 30/@px-unit !important;}.m-width-40 { width: 40/@px-unit !important;}.m-width-45 { width: 45/@px-unit !important;}.m-width-50 { width: 50/@px-unit !important;}.m-width-54 { width: 54/@px-unit !important;}.m-width-60 { width: 60/@px-unit !important;}.m-width-65 { width: 65/@px-unit !important;}.m-width-84 { width: 84/@px-unit !important;}.m-width-70 { width: 70/@px-unit !important;}.m-width-52 { width: 52/@px-unit !important;}.m-width-80 { width: 80/@px-unit !important;}.m-width-85 { width: 85/@px-unit !important;}.m-width-90 { width: 90/@px-unit !important;}.m-width-95 { width: 95/@px-unit !important;}.m-width-100 { width: 100/@px-unit !important;}.m-width-105 { width: 110/@px-unit !important;}.m-width-110 { width: 110/@px-unit !important;}.m-width-118 { width: 118/@px-unit !important;}.m-width-120 { width: 120/@px-unit !important;}.m-width-124 { width: 124/@px-unit !important;}.m-width-126 { width: 126/@px-unit !important;}.m-width-130 { width: 130/@px-unit !important;}.m-width-132 { width: 132/@px-unit !important;}.m-width-138 { width: 138/@px-unit !important;}.m-width-140 { width: 140/@px-unit !important;}.m-width-144 { width: 144/@px-unit !important;}.m-width-148 { width: 148/@px-unit !important;}.m-width-150 { width: 150/@px-unit !important;}.m-width-156 { width: 156/@px-unit !important;}.m-width-160 { width: 160/@px-unit !important;}.m-width-168 { width: 168/@px-unit !important;}.m-width-170 { width: 170/@px-unit !important;}.m-width-175 { width: 175/@px-unit !important;}.m-width-180 { width: 180/@px-unit !important;}.m-width-184 { width: 184/@px-unit !important;}.m-width-190 { width: 190/@px-unit !important;}.m-width-200 { width: 200/@px-unit !important;}.m-width-213 { width: 213/@px-unit !important;}.m-width-215 { width: 215/@px-unit !important}.m-width-220 { width: 220/@px-unit !important;}.m-width-224 { width: 224/@px-unit !important;}.m-width-230 { width: 230/@px-unit !important;}.m-width-240 { width: 240/@px-unit !important;}.m-width-250 { width: 250/@px-unit !important;}.m-width-260 { width: 260/@px-unit !important;}.m-width-276 { width: 276/@px-unit !important;}.m-width-280 { width: 280/@px-unit !important;}.m-width-300 { width: 300/@px-unit !important;}.m-width-310 { width: 310/@px-unit !important;}.m-width-320 { width: 320/@px-unit !important;}.m-width-330 { width: 330/@px-unit !important;}.m-width-360 { width: 360/@px-unit !important;}.m-width-372 { width: 372/@px-unit !important;}.m-width-480 { width: 480/@px-unit !important;}.m-width-510 { width: 510/@px-unit !important;}.m-width-545 { width: 545/@px-unit !important;}.m-width-600 { width: 600/@px-unit !important;}.m-width-648 { width: 648/@px-unit !important;}.m-width-910 { width: 910/@px-unit !important;}.m-width-3p { width: 3% !important;}.m-width-9p { width: 9% !important;}.m-width-10p { width: 10% !important;}.m-width-12p { width: 12% !important;}.m-width-20p { width: 20% !important;}.m-width-25p { width: 25% !important;}.m-width-30p { width: 30% !important;}.m-width-33p { width: 33% !important;}.m-width-40p { width: 40% !important;}.m-width-50p { width: 50% !important;}.m-width-55p { width: 55% !important;}.m-width-58p { width: 58% !important;}.m-width-60p { width: 60% !important;}.m-width-65p { width: 65% !important;}.m-width-70p { width: 70% !important;}.m-width-80p { width: 80% !important;}.m-width-100p { width: 100% !important;}.m-width-200p { width: 200% !important;}.m-max-w-480 { max-width: 480/@px-unit !important;}.m-minw-50 { min-width: 50/@px-unit !important;}.m-minw-70 { min-width: 70/@px-unit !important;}.m-minw-90 { min-width: 90/@px-unit !important;}.m-height-0 { height: 0 !important;}.m-height-15 { height: 15/@px-unit !important;}.m-height-24 { height: 24/@px-unit !important;}.m-height-25 { height: 25/@px-unit !important;}.m-height-26 { height: 26/@px-unit !important;}.m-height-28 { height: 28/@px-unit !important;}.m-height-30 { height: 30/@px-unit !important;}.m-height-36 { height: 36/@px-unit !important;}.m-height-40 { height: 40/@px-unit !important;}.m-height-50 { height: 50/@px-unit !important;}.m-height-60 { height: 60/@px-unit !important;}.m-height-90 { height: 90/@px-unit !important;}.m-height-100 { height: 100/@px-unit !important;}.m-height-120 { height: 120/@px-unit !important;}.m-height-150 { height: 150/@px-unit !important;}.m-height-200 { height: 200/@px-unit !important;}.m-height-201 { height: 201/@px-unit !important;}.m-height-238 { height: 238/@px-unit !important;}.m-height-276 { height: 276/@px-unit !important;}.m-height-288 { height: 288/@px-unit !important;}.m-height-300 { height: 300/@px-unit !important;}.m-height-310 { height: 310/@px-unit !important;}.m-height-350 { height: 350/@px-unit !important;}.m-height-360 { height: 360/@px-unit !important;}.m-height-380 { height: 380/@px-unit !important;}.m-height-400 { height: 400/@px-unit !important;}.m-height-432 { height: 432/@px-unit !important;}.m-height-484 { height: 484/@px-unit !important;}.m-height-648 { height: 648/@px-unit !important;}.m-height-100p { height: 100%;} .m-m-a { margin: auto;}.m-m-0 { margin: 0 !important;}.m-m-20 { margin: 20/@px-unit !important;}.m-m-10 { margin: 10/@px-unit !important;}.m-mr-0 { margin-right: 0 !important;}.m-mr-5 { margin-right: 5/@px-unit !important;}.m-mr-6 { margin-right: 6/@px-unit !important;}.m-mr-10 { margin-right: 10/@px-unit !important;}.m-mr-12 { margin-right: 12/@px-unit !important;}.m-mr-15 { margin-right: 15/@px-unit !important;}.m-mr-20 { margin-right: 20/@px-unit !important;}.m-mr-24 { margin-right: 24/@px-unit !important;}.m-mr-30 { margin-right: 30/@px-unit !important;}.m-mr-36 { margin-right: 36/@px-unit !important;}.m-mr-40 { margin-right: 40/@px-unit !important;}.m-mr-100 { margin-right: 100/@px-unit !important;}.m-mr-140 { margin-right: 140/@px-unit !important;}.m-mr-186 { margin-right: 186/@px-unit !important;}.m-mr-200 { margin-right: 200/@px-unit !important;}.m-mr-250 { margin-right: 250/@px-unit !important;}.m-mr-f2 { margin-right: -2/@px-unit !important;}.m-mr-f6 { margin-right: -6/@px-unit !important;}.m-mr-f7 { margin-right: -7/@px-unit !important;}.m-mr-f10 { margin-right: -10/@px-unit !important;}.m-mr-f14 { margin-right: -14/@px-unit !important;}.m-mr-f15 { margin-right: -15/@px-unit !important;}.m-mr-f16 { margin-right: -16/@px-unit !important;}.m-mr-f17 { margin-right: -17/@px-unit !important;}.m-mr-f18 { margin-right: -18/@px-unit !important;}.m-mr-f23 { margin-right: -23/@px-unit !important;}.m-mr-f25 { margin-right: -25/@px-unit !important;}.m-mr-f27 { margin-right: -27/@px-unit !important;}.m-ml-0 { margin-left: 0 !important;}.m-ml-3 { margin-left: 3/@px-unit !important;}.m-ml-5 { margin-left: 5/@px-unit !important;}.m-ml-6 { margin-left: 6/@px-unit !important;}.m-ml-7 { margin-left: 7/@px-unit !important;}.m-ml-8 { margin-left: 8/@px-unit !important;}.m-ml-9 { margin-left: 9/@px-unit !important;}.m-ml-10 { margin-left: 10/@px-unit !important;}.m-ml-12 { margin-left: 12/@px-unit !important;}.m-ml-15 { margin-left: 15/@px-unit !important;}.m-ml-16 { margin-left: 16/@px-unit !important;}.m-ml-17 { margin-left: 17/@px-unit !important;}.m-ml-18 { margin-left: 18/@px-unit !important;}.m-ml-20 { margin-left: 20/@px-unit !important;}.m-ml-23 { margin-left: 23/@px-unit !important;}.m-ml-24 { margin-left: 24/@px-unit !important;}.m-ml-25 { margin-left: 25/@px-unit !important;}.m-ml-29 { margin-left: 29/@px-unit !important;}.m-ml-30 { margin-left: 30/@px-unit !important;}.m-ml-33 { margin-left: 33/@px-unit !important;}.m-ml-35 { margin-left: 35/@px-unit !important;}.m-ml-36 { margin-left: 36/@px-unit !important;}.m-ml-37 { margin-left: 37/@px-unit !important;}.m-ml-40 { margin-left: 40/@px-unit !important;}.m-ml-42 { margin-left: 42/@px-unit !important;}.m-ml-47 { margin-left: 47/@px-unit !important;}.m-ml-48 { margin-left: 48/@px-unit !important;}.m-ml-49 { margin-left: 49/@px-unit !important;}.m-ml-50 { margin-left: 50/@px-unit !important;}.m-ml-50-5 { margin-left: 50.5/@px-unit !important;}.m-ml-52 { margin-left: 52/@px-unit !important;}.m-ml-60 { margin-left: 60/@px-unit !important;}.m-ml-65 { margin-left: 65/@px-unit !important;}.m-ml-70 { margin-left: 70/@px-unit !important;}.m-ml-72 { margin-left: 72/@px-unit !important;}.m-ml-75 { margin-left: 75/@px-unit !important;}.m-ml-90 { margin-left: 90/@px-unit !important;}.m-ml-100 { margin-left: 100/@px-unit !important;}.m-ml-110 { margin-left: 110/@px-unit !important;}.m-ml-112 { margin-left: 112/@px-unit !important;}.m-ml-127 { margin-left: 127/@px-unit !important;}.m-ml-130 { margin-left: 130/@px-unit !important;}.m-ml-150 { margin-left: 150/@px-unit !important;}.m-ml-170 { margin-left: 170/@px-unit !important;}.m-ml-200 { margin-left: 200/@px-unit !important;}.m-ml-220 { margin-left: 220/@px-unit !important;}.m-ml-480 { margin-left: 480/@px-unit !important;}.m-ml-540 { margin-left: 540/@px-unit !important;}.m-ml-586 { margin-left: 586/@px-unit !important;}.m-ml-590 { margin-left: 590/@px-unit !important;}.m-ml-620 { margin-left: 620/@px-unit !important;}.m-ml-765 { margin-left: 765/@px-unit !important;}.m-ml-800 { margin-left: 800/@px-unit !important;}.m-ml-f1 { margin-left: -1/@px-unit !important;}.m-ml-f3 { margin-left: -3/@px-unit !important;}.m-ml-f4 { margin-left: -4p/@px-unit !important;}.m-ml-f5 { margin-left: -5p/@px-unit !important;}.m-ml-f6 { margin-left: -6/@px-unit !important;}.m-ml-f8 { margin-left: -8/@px-unit !important;}.m-ml-f9 { margin-left: -9/@px-unit !important;}.m-ml-f10 { margin-left: -10/@px-unit !important;}.m-ml-f13 { margin-left: -13/@px-unit !important;}.m-ml-f14 { margin-left: -14/@px-unit !important;}.m-ml-f15 { margin-left: -15/@px-unit !important;}.m-ml-f16 { margin-left: -16/@px-unit !important;}.m-ml-f17 { margin-left: -17/@px-unit !important;}.m-ml-f18 { margin-left: -18/@px-unit !important;}.m-ml-f20 { margin-left: -20/@px-unit !important;}.m-ml-f24 { margin-left: -24/@px-unit !important;}.m-ml-f30 { margin-left: -30/@px-unit !important;}.m-ml-f31 { margin-left: -31/@px-unit !important;}.m-ml-f32 { margin-left: -32/@px-unit !important;}.m-ml-f33 { margin-left: -33/@px-unit !important;}.m-ml-f60 { margin-left: -60/@px-unit !important;}.m-mt-0 { margin-top: 0 !important;}.m-mt-2 { margin-top: 2/@px-unit !important;}.m-mt-3 { margin-top: 3/@px-unit !important;}.m-mt-4 { margin-top: 4/@px-unit !important;}.m-mt-5 { margin-top: 5/@px-unit !important;}.m-mt-7 { margin-top: 7/@px-unit !important;}.m-mt-8 { margin-top: 8/@px-unit!important;}.m-mt-10 { margin-top: 10/@px-unit !important;}.m-mt-11 { margin-top: 11/@px-unit !important;}.m-mt-12 { margin-top: 12/@px-unit !important;}.m-mt-15 { margin-top: 15/@px-unit !important;}.m-mt-16 { margin-top: 16/@px-unit !important;}.m-mt-18 { margin-top: 18/@px-unit !important;}.m-mt-20 { margin-top: 20/@px-unit !important;}.m-mt-30 { margin-top: 30/@px-unit !important;}.m-mt-42 { margin-top: 42/@px-unit !important;}.m-mt-32 { margin-top: 32/@px-unit !important;}.m-mt-35 { margin-top: 35/@px-unit !important;}.m-mt-36 { margin-top: 36/@px-unit !important;}.m-mt-44 { margin-top: 44/@px-unit !important;}.m-mt-50 { margin-top: 50/@px-unit !important;}.m-mt-60 { margin-top: 60/@px-unit !important;}.m-mt-70 { margin-top: 70/@px-unit !important;}.m-mt-72 { margin-top: 72/@px-unit !important;}.m-mt-100 { margin-top: 100/@px-unit !important;}.m-mt-120 { margin-top: 120/@px-unit !important;}.m-mt-180 { margin-top: 180/@px-unit !important;}.m-mt-210 { margin-top: 210/@px-unit !important;}.m-mt-f2 { margin-top: -2/@px-unit !important;}.m-mt-f3 { margin-top: -3/@px-unit !important;}.m-mt-f4 { margin-top: -4/@px-unit !important;}.m-mt-f5 { margin-top: -5/@px-unit !important;}.m-mt-f6 { margin-top: -5/@px-unit !important;}.m-mt-f8 { margin-top: -8/@px-unit !important;}.m-mt-f9 { margin-top: -9/@px-unit !important;}.m-mt-f10 { margin-top: -10/@px-unit !important;}.m-mt-f12 { margin-top: -12/@px-unit !important;}.m-mt-f15 { margin-top: -15/@px-unit !important;}.m-mt-f20 { margin-top: -20/@px-unit !important;}.m-mt-f32 { margin-top: -32/@px-unit !important;}.m-mt-f40 { margin-top: -40/@px-unit !important;}.m-mb-0 { margin-bottom: 0 !important;}.m-mb-5 { margin-bottom: 5/@px-unit !important;}.m-mb-10 { margin-bottom: 10/@px-unit !important;}.m-mb-12 { margin-bottom: 12/@px-unit !important;}.m-mb-15 { margin-bottom: 15/@px-unit !important;}.m-mb-14 { margin-bottom: 14/@px-unit !important;}.m-mb-20 { margin-bottom: 20/@px-unit !important;}.m-mb-30 { margin-bottom: 30/@px-unit !important;}.m-mb-2 { margin-bottom: 24/@px-unit !important;}.m-mb-30 { margin-bottom: 30/@px-unit !important;}.m-mb-80 { margin-bottom: 80/@px-unit !important;}.m-mb-130 { margin-bottom: 130/@px-unit !important;} .m-p-0 { padding: 0 !important;}.m-p-5 { padding: 5/@px-unit !important;}.m-p-12 { padding: 12/@px-unit !important;}.m-p-15 { padding: 15/@px-unit !important;}.m-pl-0 { padding-left: 0 !important;}.m-pl-5 { padding-left: 5/@px-unit !important;}.m-pl-6 { padding-left: 6/@px-unit !important;}.m-pl-7 { padding-left: 7/@px-unit !important;}.m-pl-8 { padding-left: 8/@px-unit !important;}.m-pl-10 { padding-left: 10/@px-unit !important;}.m-pl-12 { padding-left: 12/@px-unit !important;}.m-pl-13 { padding-left: 13/@px-unit !important;}.m-pl-15 { padding-left: 15/@px-unit !important;}.m-pl-17 { padding-left: 17/@px-unit !important;}.m-pl-20 { padding-left: 20/@px-unit !important;}.m-pl-24 { padding-left: 24/@px-unit !important;}.m-pl-25 { padding-left: 25/@px-unit !important;}.m-pl-30 { padding-left: 30/@px-unit !important;}.m-pl-35 { padding-left: 35/@px-unit !important;}.m-pl-37 { padding-left: 37/@px-unit !important;}.m-pl-40 { padding-left: 40/@px-unit !important;}.m-pl-43 { padding-left: 43/@px-unit !important;}.m-pl-45 { padding-left: 45/@px-unit !important;}.m-pl-50 { padding-left: 50/@px-unit !important;}.m-pl-60 { padding-left: 60/@px-unit !important;}.m-pl-70 { padding-left: 70/@px-unit !important;}.m-pr-0 { padding-right: 0 !important;}.m-pr-5 { padding-right: 5/@px-unit !important;}.m-pr-6 { padding-right: 6/@px-unit !important;}.m-pr-8 { padding-right: 8/@px-unit !important;}.m-pr-10 { padding-right: 10/@px-unit !important;}.m-pr-12 { padding-right: 12/@px-unit !important;}.m-pr-15 { padding-right: 15/@px-unit !important;}.m-pr-30 { padding-right: 30/@px-unit !important;}.m-pr-40 { padding-right: 40/@px-unit !important;}.m-pr-84 { padding-right: 84/@px-unit !important;}.m-pr-114 { padding-right: 114/@px-unit !important;}.m-pt-0 { padding-top: 0;}.m-pt-12 { padding-top: 12/@px-unit !important;}.m-pt-24 { padding-top: 24/@px-unit !important;}.m-pt-1 { padding-top: 1/@px-unit !important;}.m-pt-3 { padding-top: 3/@px-unit !important;}.m-pt-5 { padding-top: 5/@px-unit !important;}.m-pt-8 { padding-top: 8/@px-unit !important;}.m-pt-10 { padding-top: 10/@px-unit !important;}.m-pt-15 { padding-top: 15/@px-unit !important;}.m-pt-20 { padding-top: 20/@px-unit !important;}.m-pt-35 { padding-top: 35/@px-unit !important;}.m-pb-0 { padding-bottom: 0 !important;}.m-pb-2 { padding-bottom: 2/@px-unit !important;}.m-pb-8 { padding-bottom: 8/@px-unit !important;}.m-pb-10 { padding-bottom: 10/@px-unit !important;}.m-pb-108 { padding-bottom: 108/@px-unit !important;} .m-pos-abs { position: absolute !important;}.m-pos-static { position: static !important;}.m-pos-r { position: relative !important;}.m-top-0 { top: 0 !important;}.m-top-10 { top: 10/@px-unit !important;}.m-top-72 { top: 72/@px-unit !important;}.m-top-90 { top: 90/@px-unit !important;}.m-top-130 { top: 130/@px-unit !important;}.m-bottom-0 { bottom: 0 !important;}.m-bottom-2-4 { bottom: 2.4/@px-unit !important;}.m-bottom-3 { bottom: 3/@px-unit !important;}.m-left-0 { left: 0 !important;}.m-left-10p { left: 10% !important;}.m-right-16 { right: 16/@px-unit !important;}.m-right-84 { right: 84/@px-unit !important;}.m-right-124 { right: 124/@px-unit !important;}.m-topmax { z-index: 10004 !important;}.m-float-none { float: none !important;}.m-float-left { float: left;}.m-float-right { float: right !important;}.m-clear-both { clear: both;}.m-clearfix:after { content: '\20'; display: block; height: 0; clear: both;}.m-hor-center { position: absolute; left: 50%; transform: translate3d(-50%, 0, 0); -webkit-transform: translate3d(-50%, 0, 0);}.m-ver-center { position: absolute; top: 50%; transform: translate3d(0, -50%, 0); -webkit-transform: translate3d(0, -50%, 0);}.m-hor-ver-center { position: absolute; left: 50%; top: 50%; transform: translate3d(-50%, -50%, 0); -webkit-transform: translate3d(-50%, -50%, 0);} .m-fw-normal { font-weight: normal !important;}.m-fw-bold { font-weight: bold !important;}.m-fs-small { font-size: small;}.m-fs-15 { font-size: 15/@px-unit;}.m-fs-18 { font-size: 18/@px-unit;}.m-fs-43 { font-size: 43/@px-unit;}.m-lh-24 { line-height: 24/@px-unit;}.m-lh-28 { line-height: 28/@px-unit;}.m-lh-30 { line-height: 30/@px-unit;}.m-lh-32 { line-height: 32/@px-unit;}.m-lh-35 { line-height: 35/@px-unit;}.m-lh-40 { line-height: 40/@px-unit !important;}.m-cursor-default { cursor: default !important;}.m-cursor-pointer { cursor: pointer !important;}.m-cursor-crosshair { cursor: crosshair !important;}.m-cursor-move { cursor: move !important;}.m-cursor-text { cursor: text !important;}.m-cursor-wait { cursor: wait !important;}.m-cursor-help { cursor: help !important;}.m-cursor-notAllowed { cursor: not-allowed !important;}.m-vertical-top { vertical-align: top !important;}.m-vertical-middle { vertical-align: middle !important;}.m-vertical-bottom { vertical-align: bottom !important;}.m-vertical-text-bottom { vertical-align: text-bottom !important;}.m-text-center { text-align: center;}.m-text-left { text-align: left;}.m-text-right { text-align: right;}.m-inline-block { display: inline-block;}.m-visibility-hidden { visibility: hidden !important;}.m-display-hidden { display: none !important;}.m-display-show { display: '' !important;}.m-overflow-hidden { overflow: hidden !important;}.m-overflow-initial { overflow: initial !important;}.m-opacity-0 { opacity: 0;}.m-ws-nowrap { white-space: nowrap;}.m-text-ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle;} html,body { font-size: @base-rem-size;}#p_ocx { z-index: 1001;}@media screen and (max-width: 1280px) { html, body { font-size: @base-rem-size-sm; }}@media screen and (min-device-width: 3000px) { html, body { font-size: 2 * @base-rem-size; }}::-webkit-scrollbar-corner { background-color: @pageBodyBg;}* { font-family: arial, 'Microsoft YaHei' !important;}.iconDropitem_name { float: left;}.ant-pagination-total-text,.ant-pagination-options-size-changer,.ant-pagination-options { color: @paginationTextN; .ant-pagination-options-quick-jumper { input { background-color: @paginationBg; border-color: @mainPageSvgN; color: @paginationInputTextN; margin-left: -40px; } }}.ant-pagination-next,.ant-pagination-prev { a { &:hover { border-color: @paginationBorderA !important; color: @paginationTextA !important; } background-color: @paginationBg !important; border-color: @mainPageSvgN !important; color: @paginationTextN !important; } svg { fill: @iconColorN; }}.ant-pagination-disabled:hover { a { color: @paginationTextN !important; border-color: @mainPageSvgN !important; }}.ant-pagination-item { background-color: @paginationBg; border-color: @mainPageSvgN; a { color: @paginationTextN; }}.ant-pagination-item-active { border-color: @paginationBorderA; a { color: @paginationTextA; }}.ant-pagination-item-ellipsis { color: @paginationTextN !important;}.ant-pagination-prev .ant-pagination-item-link,.ant-pagination-next .ant-pagination-item-link { background-color: @paginationBg;}.ant-pagination-total-text { float: right;}.ant-pagination-simple .ant-pagination-simple-pager input:hover{ border-color: @formInputBorderA;}.ant-pagination-simple-pager input { background-color: @pageBodyBg !important; border-color: @pageBorderN !important; &:focus{ border-color: @formInputBorderA !important; box-shadow: 0 0 0 0 !important; } &:hover{ border-color: @formInputBorderA !important; }}.ant-picker-range .ant-picker-active-bar{ background-color: @formInputBorderA !important;}.ant-tree-checkbox-inner { background-color: @formInputBgN;}.ant-tree-checkbox-checked .ant-tree-checkbox-inner { background-color: @formInputBgA;}.ant-form { color: @formInputTextN;}.ant-form-item-label > label { color: @formInputTextN;}.ant-form-item { margin-bottom: 0px;}.ant-progress-inner { background-color: @progressBg; .ant-progress-success-bg, .ant-progress-bg{ background-color: @progressBgA; }}.ant-progress-text { color: @progressText;}.ant-layout { background-color: @setUpContentBg; color: @pageTextN;}.ant-layout-sider { background-color: @SideMenuBg; color: @pageTextN;}.has-error { .ant-input { &:hover { border-color: @buttonDangerBorderA; } &:focus { border-color: @buttonDangerBorderA; } border-color: @buttonDangerBorderA; background-color: @formInputBgN; } .ant-input-affix-wrapper { &:hover { border-color: @buttonDangerBorderA !important; } border-color: @buttonDangerBorderA; background-color: @formInputBgN; } .ant-input-affix-wrapper-focused { border-color: @buttonDangerBorderA !important; }}.ant-input,.ant-input-number { &:focus, &:hover { box-shadow: 0 0 0 0; border-color: @formInputBorderA; }}.ant-input[disabled] { color: @formInputTextD; background-color: @formInputBgD; border-color: @formInputBoderD; &:hover { border-color: @formInputBoderD; }}.ant-input[readonly] { color: @formInputTextN; background-color: @formInputBgD; border-color: @formInputBoderD !important; &:hover { border-color: @formInputBoderD; }}.ant-input,.ant-input-number { background-color: @formInputBgN; border-color: @formInputBoderN; color: @formInputTextN;}.ant-input-number-disabled { color: @formInputTextD !important; background-color: @formInputBgD !important; opacity: 1;}.ant-input-number-handler-up,.ant-input-number-handler-down { background-color: @numberInPutHandleBgA;}.ant-input-number-handler-up:active,.ant-input-number-handler-down:active { background-color: @numberInPutHandleBgA;}.ant-input-number-handler-down { border-top: 1px solid @numberInPutHandleBgA;}.ant-input-number:hover:not(.ant-input-number-borderless) .ant-input-number-handler-up, .ant-input-number-focused:not(.ant-input-number-borderless) .ant-input-number-handler-up { border-bottom: 0.5px solid @numberInPutHandleBoderA;}.ant-input-number:hover:not(.ant-input-number-borderless) .ant-input-number-handler-down, .ant-input-number-focused:not(.ant-input-number-borderless) .ant-input-number-handler-down { border-top: 0.5px solid @numberInPutHandleBoderA;}.ant-input-number-handler-wrap { border-left: 1px solid @numberInPutHandleBgA; background-color: @numberInPutHandleBgA;}.ant-input-number-handler { border-left-color: @numberInPutHandleBoderA;}.ant-input-affix-wrapper { background-color: @formInputBgN; border-color: @formInputBoderN; &.ant-input-affix-wrapper-focused:not(.ant-input-affix-wrapper-disabled), &:hover:not(.ant-input-affix-wrapper-disabled) { box-shadow: 0 0 0 0; border-color: @formInputBorderA; }}.ant-form-item-has-error { input { background-color: transparent !important; }}.labelInput-check-info { .ant-col { margin-top: -10px; line-height: 16px; } span { color: @errorColor; }}li.ant-select-dropdown-menu-item.ant-select-dropdown-menu-item-selected,div.ant-select.ant-select-enabled { color: @formInputTextN;}.ant-select,.ant-input-number { outline: none; &:hover { border-color: @formInputBorderA; svg { fill: @formInputSvgA; } } svg { fill: @formInputSvgN; } .ant-input-number-handler-up-disabled, .ant-input-number-handler-down-disabled { svg { fill: @formInputSvgD; } }}.ant-input-number-disabled { &:hover { border-color: @formInputBoderD; }}.ant-input-number-focused,.ant-select-open { svg { fill: @formInputSvgA; }}.ant-input-number-focused { border-color: @formInputBorderA; box-shadow: 0 0 0 0;}.ant-select-multiple { .ant-select-selection-item { background: @formMuliInputBgA; border: 1px solid @formInputBoderN; }}.LabelIPV4{ border: 1/@px-unit solid @formInputBoderN; &.ipv4-active{ border-color: @formInputBorderA; } input,.mac-point:hover{ border: 0px !important; } .ant-input { background-color: transparent !important; }}.has-error{ .LabelIPV4{ border-color: @errorColor !important }}.ant-select { color: @formInputTextN;}.ant-select-single.ant-select-open .ant-select-selection-item{ color: @formInputTextN;}.ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector{ border-color: @formInputBorderA; box-shadow: none;}.ant-select-focused,.ant-select-open,.ant-select { &:not(.ant-select-disabled):hover{ .ant-select-selector{ border-color: @formInputBorderA; } } .ant-select-selection { background-color: @formInputBgN; border-color: @formInputBoderN; box-shadow: 0 0 0 0; .ant-select-arrow { color: @formInputTextN; } &:hover { border-color: @formInputBorderA; } } .ant-select-selector { .ant-select-selection-overflow { max-height: 56 / @px-unit; overflow-y: auto; } }}.ant-select-open { .ant-select-selection { border-color: @formInputBorderA; box-shadow: 0 0 0 1px @formInputBorderA; }}.ant-select-disabled,.ant-select-disabled .ant-select-selection { color: @formInputTextD !important; background-color: @formInputBgD !important; opacity: 1; svg { fill: @formInputSvgD; } &:focus { border-color: @formInputBoderD; } &:hover { border-color: @formInputBoderD; svg { fill: @formInputSvgD; } }}.ant-select-dropdown { background-color: @formInputDropDownBgN; border: 1 / @px-unit solid @--component-border;}.ant-select-dropdown-menu-item { color: @formInputTextN;}.ant-select-dropdown-menu-item:hover:not(.ant-select-dropdown-menu-item-disabled) { background-color: @formInputDropDownBgA;}.ant-select-dropdown-menu-item-active:not(.ant-select-dropdown-menu-item-disabled) { background-color: @formInputDropDownBgA;}.ant-select-dropdown-menu-item-selected { background-color: @formInputDropDownBgA; font-weight: 400;}.ant-select:not(.ant-select-customize-input) .ant-select-selector { background-color: @formInputBgN; border: 1px solid @formInputBoderN; display: flex; display: -ms-flexbox; align-items: center;}.ant-select-item-option-selected:not(.ant-select-item-option-disabled) { color: @formInputDropDownTextSelectN; font-weight: normal; background-color: @formInputDropDownBgSel; .ant-select-item-option-state{ color:@formInputBorderA !important; }}.ant-select-item-option-active:not(.ant-select-item-option-disabled):not(.ant-select-item-option-selected){ color: @formInputTextN; font-weight: normal; background-color: @formInputDropDownBgA;}.ant-select-item { color: @formInputDropDownTextN; font-weight: normal;}.ant-select-disabled { &.ant-select { &:not(.ant-select-customize-input) { .ant-select-selector { background: @formInputBgD; color: @formInputTextD; } } }}.ant-checkbox-wrapper { color: @pageTextN;}.ant-checkbox-wrapper:hover .ant-checkbox-inner,.ant-checkbox:not(.ant-checkbox-disabled):hover .ant-checkbox-inner{ border-color: @formCheckboxBorderA !important; }.ant-checkbox-wrapper:hover{ .ant-checkbox-disabled{ .ant-checkbox-inner{ border-color: @formCheckboxBorderD !important; } }}.ant-checkbox-disabled + span { color: @pageTextD;}.ant-checkbox-inner { width: 19 / @px-unit; height: 19 / @px-unit; background-color: @formInputBgN !important; border: 1px solid @formCheckboxBorderN;}.ant-checkbox-checked { &::after{ border: 1px solid @formCheckboxBorderA; } .ant-checkbox-inner { background-color: @formCheckboxBgA !important; border-color: @formCheckboxBorderA !important; }}.ant-checkbox-checked { .ant-checkbox-inner::after { border: 2 / @px-unit solid @formCheckboxBorderA; border-top: 0; border-left: 0; left: 25%; width: 6 / @px-unit; height: 11 / @px-unit; top: 44%; }}.ant-checkbox-indeterminate { .ant-checkbox-inner { border-color: @formInputBorderA; &::after { background-color: @formInputBorderA; left: 51%; } }}.ant-checkbox-disabled { .ant-checkbox-inner { border-color: @formCheckboxBorderD !important; } .ant-checkbox-inner::after { border-color: @formCheckboxBorderD !important; }}.ant-checkbox-input:focus + .ant-checkbox-inner { border-color: @formCheckboxBorderN;}.ant-btn-link[disabled] { color: @pageTextD;}.ant-btn-link[disabled]:hover { color: @pageTextD;}.ant-btn-link { &.ant-btn-icon-only { width: 30 / @px-unit; height: 30 / @px-unit; color: @mainPageSvgN; text-align: center; &:hover:not(:disabled) { color: @current; } &:disabled, &:hover:disabled { opacity: 0.5; color: inherit; } }}.ant-divider-horizontal.ant-divider-with-text-left { font-weight: normal; border: none; font-size: inherit; color: inherit; background: none !important; &::after { border-top: 1px solid @setUpDivider; }}.ant-divider-horizontal.ant-divider-with-text-left::before { width: 0%;}.ant-divider { background: @setUpDivider !important;}.ant-modal { .ant-modal-content { background-color: @modalBg; border: 1px solid @modalBorder; color: @modalContentText; .ant-modal-header { background-color: @modalTitleBg; border-bottom: 1px solid @modalTitleBorder; height: 41 / @px-unit; padding: 9 / @px-unit 24 / @px-unit; .ant-modal-title { color: @modalTitleText; } } .ant-modal-close { color: @modalTitleText; opacity: 0.5; &:hover { opacity: 0.6; } } .ant-modal-close-x { height: 41px; line-height: 41px; } .ant-modal-footer { background-color: @modalFooterBg; border-top: 1px solid @modalFooterBorder; height: 60 / @px-unit; padding: 5/@px-unit 16/@px-unit 50/@px-unit 16/@px-unit; .ant-space { height: auto; } .label-normal-container { float: right; margin-left: 30/@px-unit; } } }}.ant-picker-range { background-color: @formInputDropDownBgN; border-color: @pageBorderN; .ant-picker-input > input { color: @formInputTextN; } .ant-picker-separator { color: @formInputTextN; } .ant-picker-suffix { color: @formInputTextN; } .ant-picker-clear { color: @formInputTextN; background-color: @formInputDropDownBgN; }}.ant-picker-panel-container { background-color: @formInputDropDownBgN; .ant-picker-panels { border-bottom: 1px solid @dividerColor; .ant-picker-panel { .ant-picker-time-panel-column { & > li.ant-picker-time-panel-cell .ant-picker-time-panel-cell-inner { color: @PickerBodyTextN; &:hover { background-color: @current; color: @PickerBodyTextA; } } & > li.ant-picker-time-panel-cell-selected .ant-picker-time-panel-cell-inner { background-color: @current; color: .color_A(@current)[] !important; } } } }}.ant-picker-cell-in-view.ant-picker-cell-selected.ant-picker-cell-disabled { .ant-picker-cell-inner { background: transparent !important; color: @pageTextD; }}.ant-picker-cell-in-view.ant-picker-cell-selected .ant-picker-cell-inner{ background-color: @current !important; color: .color_N(@current)[];}.ant-picker-cell-in-view.ant-picker-cell-today .ant-picker-cell-inner::before{ border-color: @current !important;}.ant-picker-cell-selected .ant-picker-cell-inner { background: @current;}.ant-picker-cell:hover .ant-picker-cell-inner { background: @current !important; color: .color_A(@current)[];}.ant-picker-cell .ant-picker-cell-inner { color: @pageTextD;}.ant-picker-cell-in-view.ant-picker-cell-range-end,.ant-picker-cell-in-view.ant-picker-cell-range-start{ .ant-picker-cell-inner{ background: @current; color: .color_N(@current)[]; }}.ant-picker-cell-in-view .ant-picker-cell-inner { color: @PickerBodyTextN;}.ant-picker-cell-disabled .ant-picker-cell-inner { color: @pageTextD;}.ant-picker-header button { color: @PickerHeaderButtonN;}.ant-picker-header > button:hover { color: .color_A(@PickerHeaderBg)[];}.ant-picker-today-btn { color: @pageTextN;}.ant-picker-today-btn:hover { color: @current;}.ant-picker-now-btn { color: @buttonActiveBgN;}.ant-picker-time-panel-column > li.ant-picker-time-panel-cell-selected .ant-picker-time-panel-cell-inner { background: @current; color: .color_A(@current)[] !important;}.ant-picker-time-panel-column > li.ant-picker-time-panel-cell .ant-picker-time-panel-cell-inner:hover { background: @current; color: .color_A(@current)[] !important;}.ant-table-body { tbody { .ant-table-row { &.ant-table-row-selected { td { background: transparent; } } .ant-table-cell { &.ant-table-column-sort { background: transparent; } } } } .editable-cell-value-wrap:hover { border-color: @current !important; }}.ant-badge-count { box-shadow: 0 0 0 1px #e9463a;}.ant-spin-blur { opacity: 1; background-color: @SpinBg;}.ant-spin-text { position: absolute; top: 50%; left: 50%; width: auto !important; padding-top: 5px; background: @SpinTextBg; color: @SpinTextA; transform: translate(-50%, 0); padding: 10px 10px;}._SideView_ { .ant-tabs-top > .ant-tabs-nav { margin: 0; } .ant-tabs-left{ .ant-tabs-nav { .ant-tabs-tab-btn { color: @pageTextN; } } } .ant-tabs-nav { .ant-tabs-tab-btn { background: @tabBgN; color: @tabTextN; border: 1px solid @tabBorder; min-width: 200 / @px-unit; padding: 0 5 / @px-unit; height: 50 / @px-unit; line-height: 50 / @px-unit; text-align: center; } .ant-tabs-tab-active { & > .ant-tabs-tab-btn { background: @current; color: @tabTextA; } } } .ant-tabs-tab { padding: 0px; & + .ant-tabs-tab { margin-left: 0px; } } .ant-tabs-ink-bar { display: none; }}._MachineConfig_.MainPage { width: 100%;}.header-tabMenu { line-height: 50 / @px-unit; .ant-tabs { &.ant-tabs { & > .ant-tabs-nav { margin-bottom: 0px; height: @navMenuLineHeight; &::before { border-width: 0px; } .ant-tabs-nav-list { .ant-tabs-tab { background-color: @topTabBgN; border: none; color: @topTabTextN; &.ant-tabs-tab-active { background-color: @topTabBgA !important; border: none; color: @topTabTextA !important; .ant-tabs-tab-btn { color: @topTabTextA !important; } } } } } } }}._Table_ { width: 100%; margin-top: 8px; .ant-table, .ant-table-small .ant-table-thead, .ant-table-placeholder { background: none; border-top-color: @tableBorderN; } .ant-empty-description { color: @tableTextN; } .ant-table-column-sorters { display: flex; flex: auto; align-items: center; justify-content: center; } .ant-table-column-title { position: relative; z-index: 1; flex: 0 1 auto; } .ant-table-body { min-height: 400 / @px-unit; } .ant-table { border: 1px solid @tableBorderN; & > .ant-table-container { border-left-width: 0px !important; border-top-width: 0px !important; & > table { border-top-width: 0px; } .ant-table-header { table { border-top: 0; } } .ant-table-thead > tr > th { padding: 0 0 !important; font-weight: 400; } .ant-table-tbody { .selected-row, .ZD-selected-row { td { color: .color_A(@tableBgA)[] !important; } background: @tableBgA !important; } } tr { td { padding: 0 0 !important; border-right-width: 0px !important; color: @tableTextN; height: 48/@px-unit; border-bottom-width: 0px; } } th { color: @tableHeadTextN; background-color: @tableBgN !important; border-color: @tableBorderN !important; height: 48/@px-unit !important; } .ant-pagination { .ant-pagination-disabled { .ant-pagination-item-link { border-color: @buttonNormalBorderD; color: @buttonNormalTextD; } } .ant-pagination-prev, .ant-pagination-next { .ant-pagination-item-link { background-color: @buttonNormalBgN; } } .ant-pagination-item { background-color: @buttonNormalBgN; border-color: @buttonNormalBorderN; } .ant-pagination-item-active { border-color: @buttonActiveBorderN; } } } } .ant-table.ant-table-bordered { & > .ant-table-container { table { border-top: 0px; & > tbody { tr { &.showZebraPattern, &.ZD-showZebraPattern { &:nth-of-type(even) { background: @tableEvenBgN; } &:nth-of-type(odd) { background: @tableOddBgN; } &.ZD-highlight-row { background: @tableBgA; } } &:hover { td { color: @tableTextA !important; background: transparent !important; } } } } } } } .ant-table-cell-scrollbar { visibility: hidden; }}.ant-btn:not(.btn-link):not(.ant-btn-link) { background-color: @buttonNormalBgN; color: @buttonNormalTextN; border: 1px solid @buttonNormalBorderN; &:focus { background-color: @buttonNormalBgN; color: @buttonNormalTextN; border-color: @buttonNormalBorderN; &.active, &:active { color: @buttonActiveTextN; background-color: @buttonActiveBgN; border-color: @buttonActiveBorderN; } } &:hover, &:hover:not(:focus) { color: @buttonNormalTextA; background-color: @buttonNormalBgN; border-color: @buttonNormalBorderN; } &[disabled], &[disabled]:hover, &[disabled]:focus, &[disabled]:active { background-color: @buttonNormalBgD; color: @buttonNormalTextD; border-color: @buttonNormalBorderD; } &.ant-btn-primary { background-color: @buttonActiveBgN; color: @buttonActiveTextN; border-color: @buttonActiveBorderN; &:focus { background-color: @buttonActiveBgN; color: @buttonActiveTextN; border-color: @buttonActiveBorderN; &.active, &:active { color: @buttonActiveTextN; border-color: @buttonActiveBgA; background-color: @buttonActiveBgA; } } &:hover:not(:focus):not([disabled]) { color: @buttonActiveTextN; border-color: @buttonActiveBgA; background-color: @buttonActiveBgA; } &[disabled], &[disabled]:hover, &[disabled]:focus, &[disabled]:active { background-color: @buttonActiveBgD; color: @buttonActiveTextD; border-color: @buttonActiveBorderD; } } &.ant-btn-test { background-color: @buttonTestBgN; color: @buttonTestTextN; border-color: @buttonTestBorderN; &:hover:not(:focus):not([disabled]) { color: @buttonTestTextH; border-color: @buttonTestBorderH; background-color: @buttonTestBgH; } &:active:not([disabled]) { color: @buttonTestTextA; border-color: @buttonTestBorderA; background-color: @buttonTestBgA; } &[disabled] { color: @buttonTestTextD; border-color: @buttonTestBorderD; background-color: @buttonTestBgD; } } &.ant-btn-dangerous { background-color: @buttonDangerBgN; color: @buttonDangerTextN; border-color: @buttonDangerBorderN; &:hover:not(:focus):not([disabled]) { color: @buttonDangerTextH; border-color: @buttonDangerBorderH; background-color: @buttonDangerBgH; } &:active:not([disabled]) { color: @buttonDangerTextA; border-color: @buttonDangerBorderA; background-color: @buttonDangerBgA; } &[disabled] { color: @buttonDangerTextD; border-color: @buttonDangerBorderD; background-color: @buttonDangerBgD; } }}.ant-btn:disabled { .cus_icons { .svgDisabled(); }}.ant-switch { background-color: @formInputSwitchBgN; &.ant-switch-checked { background-color: @current; opacity: unset; } &.ant-switch-disabled.ant-switch-checked { opacity: 0.45; }}.ant-switch { &.ant-switch-checked { &:focus { box-shadow: none; } }}.LabelSwitch-label-dark { padding-left: 5px;}.ant-radio-wrapper { color: @pageTextN;}.ant-radio { vertical-align: middle; }.ant-radio:not(.ant-radio-disabled){ &:hover{ .ant-radio-inner{ border-color: @formInputBorderA !important; } }}.ant-radio-input:focus + .ant-radio-inner{ border-color: @formInputBorderA !important;}.ant-radio-checked { .ant-radio-inner { border-color: @formInputBorderA !important; &::after { transform: scale(1); } }}.ant-radio-inner { width: 19px; height: 19px; background-color: transparent; border-color: @formRadioBorderN; box-shadow: none !important; &::after { width: 9px; height: 9px; left: 4px; top: 4px; background-color: @formInputBorderA; margin-top: 0px; margin-left: 0px; }}.ant-radio-disabled { .ant-radio-inner { &::after{ opacity: 0.45; background-color: @formCheckboxBorderD; } border-color: @formCheckboxBorderD !important; background-color: transparent; }}.ant-dropdown-menu { background-color: @navDropdownMenuBg; color: @navDropdownMenuTextN;}.ant-dropdown-menu .ant-dropdown-menu-item { height: 40 / @px-unit; line-height: 40 / @px-unit; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; color: @navDropdownMenuTextN;}.ant-dropdown-menu-item:hover { background-color: @navDropdownMenuBgA; color: @navDropdownMenuTextA !important; svg path { fill: @navDropdownMenusvgA !important; }}.ant-dropdown-menu-item-selected { background-color: @navDropdownMenuBg;}.ant-popover { color: @popover_TextN; .ant-popover-arrow-content { background-color: @popover_BgN; } .ant-popover-inner { background-color: @popover_BgN; } .ant-popover-inner-content { color: @popover_TextN; } .ant-popover-message { color: @popover_TextN; } .ant-popover-arrow-content::before { display: none; }}.ant-picker { background-color: @formInputBgN; border-color: @formInputBoderN; box-shadow: none; &:hover, .ant-picker-focused{ border-color: @formInputBorderA; } .ant-picker-input { & > input { color: @formInputTextN; } .ant-picker-suffix { svg { fill: @iconColorN; } } } &.ant-picker-disabled { background-color: @formInputBgD; border-color: @formInputBoderD; .ant-picker-input { & > input { color: @formInputTextD; } } }}.ant-picker-year-panel { .ant-picker-header { border-bottom: 1px solid @dividerColor; } .ant-picker-cell-range-hover::after { border-color: @current !important; } .ant-picker-cell-range-hover-start::after { border-color: @current !important; } .ant-picker-cell-range-hover-end::after { border-color: @current !important; }}.ant-picker-month-panel { .ant-picker-header { border-bottom: 1px solid @dividerColor; } .ant-picker-cell-range-hover::after { border-color: @current !important; } .ant-picker-cell-range-hover-start::after { border-color: @current !important; } .ant-picker-cell-range-hover-end::after { border-color: @current !important; }}.ant-picker-panel-container { .ant-picker-panel { border-bottom-width: 0px; .ant-picker-year-panel, .ant-picker-month-panel, .ant-picker-date-panel, .ant-picker-time-panel { .ant-picker-header { background-color: @PickerHeaderBg; color: @PickerHeaderTextN; border-bottom-width: 0px; } .ant-picker-body { background-color: @PickerBodyBg; .ant-picker-content { th, .ant-picker-cell-in-view { color: @PickerBodyTextN; } .ant-picker-cell-inner::after { background: none; } .ant-picker-cell-range-start::before { background: none; } .ant-picker-cell-range-end::before { background: none; } .ant-picker-cell-in-range { background: @formInputDropDownBgA; } .ant-picker-cell-range-hover { background: @formInputDropDownBgA; } .ant-picker-cell-range-hover::after { border-color: @current; } .ant-picker-cell-range-hover-start::after { border-color: @current; } .ant-picker-cell-range-hover-end::after { border-color: @current; } .ant-picker-cell-range-hover-end::before { border-color: @current; background: none !important; } .ant-picker-cell-in-range::before { background: @formInputDropDownBgA; } } } } .ant-picker-footer { border-bottom-width: 0px; border-top-width: 0px; } }}.ant-picker-panel-container { .ant-picker-panel { .ant-picker-content { color: @PickerBodyTextN; } }}.ant-picker-dropdown { .ant-picker-range-wrapper{ border: 1px solid @pickerBorder; } .ant-picker-time-panel-column:not(:first-child) { border-left: 1px solid @dividerColor; }}.ant-picker-time-panel-column { & > li.ant-picker-time-panel-cell { .ant-picker-time-panel-cell-inner { height: 30 / @px-unit; line-height: 30/@px-unit; color: @PickerBodyTextN; } }}.ant-slider-track { background-color: @current ;}.ant-slider:hover .ant-slider-track{ background-color: @sliderTrackA;}.labelSlider-center { margin: 0 30 / @px-unit; }.ant-slider-handle{ border-color: @sliderRailA; &.ant-tooltip-open { border-color: @--primary-5; }}.labelSlider-float-right { margin-right: 5 / @px-unit;}.ant-slider { &:hover { .ant-slider-rail { background-color: @sliderRailA; } .ant-slider-handle:not(.ant-tooltip-open) { border-color: @--primary-5; } } .ant-slider-rail { background-color: @sliderBgN; } &.ant-slider-disabled{ .ant-slider-rail{ background-color: @sliderBgN !important; } .ant-slider-track{ background-color:@sliderRailA !important } }}.ant-tabs-left { .ant-tabs-content-holder { border-left-color: @pageBorderN; }}.ant-tabs,.ant-tabs .ant-form,.ant-form .ant-form-item,.ant-form-item { color: @pageTextN;}.ant-form-item-has-error input { background-color: @pageBodyBg !important;}.ant-tabs-top > .ant-tabs-nav::before,.ant-tabs-bottom > .ant-tabs-nav::before,.ant-tabs-top > div > .ant-tabs-nav::before,.ant-tabs-bottom > div > .ant-tabs-nav::before { border-bottom: none;}.ant-alert { background-color: inherit; border: none; padding: 0; .ant-alert-message { color: @pageTextN; }}.ant-radio-group { .ant-radio-button-wrapper { background-color: @popover_BgN; border-color: @tabBorder; color: @pageTextN; } .ant-radio-button-wrapper-checked { background-color: @current; border-color: @current; color: @tabTextA; &:hover { color: @tabTextA; } &:active { border-color: none; } } .ant-radio-wrapper-disabled * { color: @formInputTextD !important; }}.ant-table.ant-table-bordered > .ant-table-title { border: none; color: @pageTextN; border-bottom: 1px solid @pageBorderN;}.ant-table-tbody > tr.ant-table-row-selected > td { background: transparent;}.ant-table-thead > tr > th { text-align: center;}.ant-table-tbody > tr > td { text-align: center;}.ant-table-tbody > tr.ant-table-row:hover > td { background: unset;}.ant-table-tbody > tr > td.ant-table-cell-row-hover { background: @tableBgA;}.LabelMac { .ant-input-group{ border: 1 /@px-unit solid @formInputBoderN; .mac-point, .mac-input { background-color: transparent; background-color: unset; border: 0px; } &.mac-active{ border-color: @formInputBorderA; } } &:not(.mac-disabled){ .ant-input-group:hover{ border-color: @formInputBorderA; } } }.has-error{ .LabelMac{ .ant-input:first-of-type, .ant-input:last-of-type { border-left: 0px; border-right: 0px; } .ant-input-group{ border-color: @errorColor !important; } }}._VideoTransmission_ { .box, .box .title { border: 1px solid @pageBorderN; }}.ant-collapse { border: 1px solid @pageBorderN;}.ant-collapse-content { border-top: 1px solid @pageBorderN;}.ant-collapse > .ant-collapse-item { border-bottom: 1px solid @pageBorderN;}.ant-checkbox-group { color: @pageTextN;}.ant-collapse,.ant-collapse .ant-collapse-content { background-color: unset;}.ant-collapse > .ant-collapse-item > .ant-collapse-header,.ant-collapse,.ant-collapse-content { color: unset;}.ant-tabs-dropdown { .ant-tabs-dropdown-menu-vertical { background-color: @topTabBgN; .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; color: @navMenuTextN; } span { margin-left: 4 / @px-unit; text-overflow: ellipsis; color: @navMenuTextN; white-space: nowrap; overflow: hidden; } } .ant-tabs-dropdown-menu-item { color: @navMenuTextN; &:hover { background-color: @topTabBgA; } } .ant-tabs-dropdown-menu-item-remove { color: @navMenuTextN; } }}._pannel_.ant-collapse .ant-collapse-item { border: 1px solid @pageBorderN;}.label-passwordCheck-tip { background-color: @passwordCheckBg;}.label-passwordCheck-status-weak-1 { background-color: @errorColor;}.label-passwordCheck-status-middle-1 { background-color: @warnColor;}.label-passwordCheck-status-middle-2 { background-color: @warnColor;}.label-passwordCheck-status-strong-1 { background-color: @successColor;}.label-passwordCheck-status-strong-2 { background-color: @successColor;}.label-passwordCheck-status-strong-3 { background-color: @successColor;}.label-explain { word-break: keep-all;}.ant-picker-datetime-panel { .ant-picker-time-panel { border-left: 0; }}fieldset { border: 1 / @px-unit solid @pageBorderN; padding: 25 / @px-unit;}legend { width: auto; font-size: @font-size-base;}.ant-picker-range-arrow { z-index: -1;}.ant-popover { .ant-popover-inner-content { padding-top: 0; padding-bottom: 0; }}@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .ant-picker-range-arrow { z-index: -1; width: 9 / @px-unit !important; height: 9 / @px-unit !important; } .ant-picker-panel-container { transform: translateX(-3px); }}.ant-picker-range-arrow { z-index: -1; width: 11 / @px-unit !important; height: 11 / @px-unit !important; background: @pageTextN !important;}.ant-picker-range-arrow::before { width: 11 / @px-unit !important; height: 11 / @px-unit !important; background: @pageTextN !important;}.ant-message-notice-content { color: .color_A(@modalTitleBg)[]; background: @modalTitleBg;}.ant-tooltip { max-width: 200 / @px-unit !important;}.ant-tooltip-inner { background-color: @popover_BgN; color: @pageTextN;}.ant-tooltip-arrow-content { --antd-arrow-background-color: @popover_BgN; background-color: @popover_BgN;}.ant-tabs-content-holder,.ant-tabs-content,.ant-tabs-tabpane { outline: none;}.TabsTop{ margin-top: 10/@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; } } }}.ant-message-notice.ant-move-up-leave.ant-move-up-leave-active { animation: MessageMoveOut .5s; -webkit-animation: MessageMoveOut .5s;}@keyframes MessageMoveOut { 0%{ max-height: 150px; padding: 8px; opacity: 1; } 100% { max-height: 0; padding: 0; opacity: 0; }}.ant-zoom-appear.ant-zoom-appear-active { animation: ZoomIn .2s; -webkit-animation: ZoomIn .2s;}.ant-zoom-leave.ant-zoom-leave-active { animation: ZoomOut .2s; -webkit-animation: ZoomOut .2s;}.ant-fade-leave.ant-fade-leave-active { animation: FadeOut .2s; -webkit-animation: FadeOut .2s;}.ant-slide-up-leave.ant-slide-up-leave-active { animation: SlideOut .2s; -webkit-animation: SlideOut .2s;}.ant-slide-up-enter.ant-slide-up-enter-active { animation: SlideIn .2s; -webkit-animation: SlideIn .2s;}@keyframes ZoomIn { 0%{ transform: scale(0); opacity: 0; } 100%{ transform: scale(1); opacity: 1; }}@keyframes ZoomOut { 0%{ transform: scale(1); opacity: 1; } 100%{ transform: scale(0); opacity: 0; }}@keyframes FadeOut { 0%{ opacity: 1; } 100%{ opacity: 0; display: none; }}@keyframes SlideIn { 0%{ opacity: 0; } 100%{ opacity: 1; }}@keyframes SlideOut { 0%{ opacity: 1; } 100%{ opacity: 0; }}.hyperlink{ color: @current; &:hover{ color: @--primary-5; }}.assistanceColor{ each(@secondary,{ &.@{key}{ color:@value } });}.colorBox(@recordBox);.colorBox({green:@aiDisplayNumCheck});.report-icon { width: 100%; font-size: 200px !important; margin: auto;}.wifi_sign { display: inline-block; width: 20px; height: 20px;}.label-normal-behind,.label-append-unit{ color:.color_N(@pageBodyBg)[];}.ant-modal-confirm-body { .ant-modal-confirm-title{ color: @modalContentText; } .ant-modal-confirm-content { color: @modalContentText; }}.ant-table-column-sorter-up.active, .ant-table-column-sorter-down.active{ color: @--primary-6;}.label-normal-wrapper .labelTimeRangePicker{ &+a{ color: @pageTextN; }}.ant-spin.ant-spin-spinning{ .ant-spin-dot-item{ background-color: @--primary-6; }}.ant-picker-header-view button:hover{ color: @--primary-5;}._SAFESecurityStatus_{ .status-title-tip{ .m-highlight-text{ color: @pageTextN; } } ._SAFESecurityStatus_titleText.m-highlight-text{ color: @pageTextN; }}._publicHttps_,._WlanAgree_,._VideoTransmission_{ ._Table_{ a{ color: @anchorTextA; } }} .label-button { max-width: 150/@px-unit; min-width: 100/@px-unit; .ant-btn { padding: 4/@px-unit 4/@px-unit; }}.labelText-wrapper{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis;} .subtitle { margin: 0; font-weight: bold; color: @subtitleColor; width: 100%;} .site-calendar-demo-card { border: 1px solid @pageBorderN; border-radius: 2px; .calender-point { position: absolute; background-color: @pageTextN; width: 4px; height: 4px; border: 1px solid @pageTextN; border-radius: 100%; left: 46%; bottom: -1px; transform: translate(0, -50%); }}.ant-picker-calendar { background-color: @preview_center_bottom_Bg !important; .ant-picker-content { color: @pageTextN !important; } .ant-picker-panel { border-top: 1px solid @pageBorderN; background-color: @formInputBgN !important; } .ant-picker-cell { color: @pageTextD !important; } .ant-picker-cell-in-view { color: @pageTextN !important; } .ant-picker-content th { color: @pageTextN; } .ant-select-selector { width: 100 / @px-unit !important; } } .virtual-table { .ant-table-header { th{ border-right: 1/@px-unit solid; } } .ant-empty-normal { height: 180/@px-unit; margin: 0 0; display: flex; flex-direction: column; justify-content: center; } .ant-table-tbody { height: 180/@px-unit; } .ZD-showZebraPattern-even { background-color: @tableOddBgN; } .ZD-showZebraPattern-odd { background-color: @tableEvenBgN; } .ZD-selected-row { background-color: @tableBgA; } .virtual-table-cell { display: flex; align-items: center; justify-content: center; color: @tableTextN; } .center { text-align: center; }} .similarity-progress{ display: flex; height: 100%; align-items: center; .temp-picData-progress{ height: 18/@px-unit; width: 100%; padding: 0/@px-unit 15/@px-unit; display: flex; .temp-progress-bar-swrap{ width: 67%; display: flex; align-items: center; padding: 0/@px-unit 5/@px-unit 0/@px-unit 0/@px-unit; .temp-progress-bar{ background-color: @progressBg; height: 8/@px-unit; width: 100%; border-radius: 5/@px-unit; } } .temp-progress-similar{ display: flex; align-items: center; width: 33%; } } .picData-progress { display: flex; width: 100%; align-items: center; background: @ai_progress_default; height: 14/@px-unit; position: relative; color: @pageTextA; .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; } }} .native-tooltip{ display: inline; } ._ChannelGroupModal_ {}.ChannelGroupModal_textlabel{ user-select: none} .pageLine { display: flex; float: left; margin-top: 10 / @px-unit; width: 100%; min-width: 600 / @px-unit; justify-content: space-between; align-items: center; .pageLineLeft { .ant-pagination-simple .ant-pagination-prev .ant-pagination-item-link, .ant-pagination-simple .ant-pagination-next .ant-pagination-item-link{ height: 100%; } button, & span.anticon { display: flex; justify-content: center; align-items: center; } .ant-btn-default{ width: 46 / @px-unit; height: 32 / @px-unit; } display: flex; .ant-pagination { display: flex; justify-content: center; align-items: center; .ant-pagination-prev, .ant-pagination-next, .ant-pagination-disabled { padding: 4 / @px-unit 4 / @px-unit; border: 1 / @px-unit solid @buttonNormalBorderD; width: 32 / @px-unit; height: 32 / @px-unit; margin: 0 10 / @px-unit; } .ant-pagination-disabled { border: 1 / @px-unit solid @buttonNormalBorderD; background-color: @buttonNormalBgD; svg { & + { path:first-child { fill: @buttonNormalBorderD; } } } } } .anticon-left, .ant-pagination-simple-pager, .anticon-right { color: @pageTextA; } .ant-pagination-simple-pager input { background-color: @pageBodyBg; border-color: @pageBorderN; } .ant-pagination-simple-pager { height: 32 / @px-unit; } } .pageLineRight { display: flex; justify-content: center; align-items: center; }} .autoComplete { .ant-select-selector { &:hover { border-color: @current !important; } } } .autoComplete-error { .ant-select-selector { border: 1px solid @errorColor; } } .error-text { color: @errorColor; } .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; .header-right { display: flex; justify-content: flex-end; align-items: center; padding-right: 0.5rem; height: @navMenuLineHeight; > span:first-child { font-size: @navMenuFontN; min-width: 220 / @px-unit; } .headerDivider { height: @navMenuLineHeight; top: 0; margin: 0 0.5rem; } }}.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 { 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; }} ._ColorCheckGroup_ { display: flex; flex-direction: row; .color_checkbox_all_box { height: 28px; line-height: 28px; } &alarm { .ant-checkbox-inner { background-color: @alarm !important; } } &general { .ant-checkbox-inner { background-color: @general !important; } } &detect { .ant-checkbox-inner { background-color: @detect !important; } } &ivs { .ant-checkbox-inner { background-color: @ivs !important; } } &pos { .ant-checkbox-inner { background-color: @pos !important; } } &card { .ant-checkbox-inner { background-color: @card !important; } }} .header-HelpAlarm { cursor: pointer; &:hover { .svgHover(@homeTaskIconColorA); }} ._ClusterDevice_ { padding-top: inherit; } ._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; } }} .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; } }} .login-container { height: 100%; width: 100%; .login-backgroundImage { position: absolute; height: 100%; width: 100%; left: 0; top: 0; background-size: cover; background-image: url('/static/media/login_bg_@{theme}.jpg'); } .login-box { background-color: transparent; position: absolute; left: 50%; top: 40%; margin-left: -190 / @px-unit; margin-top: -150 / @px-unit; .login-logo { height: 60 / @px-unit; width: 330 / @px-unit; background-size: contain; margin-bottom: 30 / @px-unit; background-repeat:no-repeat; background-position-x: center; background-image: url('/custom_logo/web_logo.png'); background-repeat:no-repeat; } &.logo-left{ display: flex; flex-direction: row; .login-logo{ margin-top: 20%; } } &.logo-right{ display: flex; flex-direction: row-reverse; .login-logo{ margin-top: 20%; } } }}.login-container .login-box .Login-Form,.NamePwdInput { .pd-active>svg path:first-child{ fill:@pdEyeIconA; opacity: 0.5; } .pd-default>svg path:first-child{ fill:none; opacity: 0.5; } .ant-input-affix-wrapper-focused { .pd-active>svg path:first-child{ fill:@pdEyeIconA; opacity: 1; } .pd-default>svg path:first-child{ fill:none; opacity: 1; } } .label-normal-wrapper { width: 100%; } background-color: transparent; text-align: center; margin-top: 10 / @px-unit; .ant-input{ &:not(:focus){ &:hover{ border-color: @formInputBoderN; } } &:focus{ opacity: 1; } } .ant-input, .ant-select{ background-color: transparent; color: @loginFormInputText; height: 100%; font-size: 18 / @px-unit; &:not(.ant-select-show-arrow){ opacity: 0.5; } .ant-select-selection-item{ opacity: 0.5; } } .ant-select{ &.ant-select-open{ opacity: 1; svg{ fill:@formInputSvgA !important; } .ant-select-selection-item{ opacity: 1; } } } .ant-select:not(.ant-select-customize-input) .ant-select-selector{ background-color: @loginFormInputBg; } .ant-select-single.ant-select-open .ant-select-selection-item{ color: @loginFormInputText; } .ant-btn:not(.btn-link):not(.ant-btn-link).ant-btn-primary{ background-color: @loginPrimaryBtnBg; border-color: @loginPrimaryBtnBorder; } .ant-btn:not(.btn-link):not(.ant-btn-link).ant-btn-primary:hover:not(:focus):not([disabled]) { background-color: @loginActiveBtnBg; border-color: @loginActiveBtnBorder; } .ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector{ box-shadow: none; } .ant-select-selector{ border-color: @loginFormInputBorder; } .ant-select:not(.ant-select-disabled):hover .ant-select-selector{ border-color: @loginFormInputBorder; } .ant-select.ant-select-open:not(.ant-select-disabled):hover{ .ant-select-selector{ border-color: @formInputBorderA; } } .ant-select:not(.ant-select-disabled):hover{ border-color: @loginFormInputBorder; svg{ fill:@formInputSvgN; } } .ant-input-affix-wrapper, .label-normal-wrapper { display: flex; height: 40 / @px-unit; background-color: @loginFormInputBg; border-color: @loginFormInputBorder; color: @formInputTextN; } .ant-input-affix-wrapper-focused { box-shadow: 0 0 0 0; border-color: @formInputBorderA; .ant-input-prefix { .svgOut(@pdEyeIconA); } .ant-input { opacity: 1; } } .ant-input-suffix:hover { color: rgb(255, 96, 184); } .ant-input-suffix:focus { color: rgb(255, 96, 184); } .ant-input-suffix { color: yellow; } input::-webkit-input-placeholder { color: #616265 } input::-ms-input-placeholder { color: #616265 } .login-icon { color: @loginIconSvg; } .ant-row { .ant-col { padding-top: 0 !important; padding-bottom: 0 !important; } } .login-button { font-size: 20 / @px-unit; width: 100%; height: 40 / @px-unit; } .login-forget { font-size: 13 / @px-unit; margin: 5 / @px-unit 0 30 / @px-unit 0; padding-left: 10 / @px-unit; float: right; cursor: pointer; color: @loginForgetPwdTextN; &:hover { color: @loginForgetPwdTextA; } } .ant-select-selector { height: 40 / @px-unit; }}.nextTag_current{ path:first-child{ fill: @current !important; }}.nextTag:hover{ svg path{ fill: @modalContentText !important; }}.modalContentContainer{ height: 510 / @px-unit; overflow-y: auto; .modalHeader{ display: flex; align-items: center; justify-content: center; border-bottom: 1 / @px-unit solid @modalFooterBorder; padding-bottom: 18px; .headerText{ text-align: center; width: 200 / @px-unit; font-size: 16px; } .headerText_current{ text-align: center; width: 200 / @px-unit; color: @current; font-size: 16px; } } .resetTip{ margin: 175 / @px-unit; width: 475 / @px-unit; } .ResetType{ margin-left: 30 / @px-unit; .resetSelect{ display: flex; .SerialNo{ margin-left: 80 / @px-unit; align-items: center; display: flex; } } .resetContent{ display: flex; .QR_background{ width: 292 / @px-unit; height: 292 / @px-unit; padding: 12 / @px-unit; background-color: @formInputTextN; } .QRCodeTip{ width: 250 / @px-unit; margin-left: 40 / @px-unit; margin-top: 124 / @px-unit; word-break: break-all; } .QRCodeTipEmail { width: 250 / @px-unit; margin-left: 40 / @px-unit; word-break: break-word; } .ForeignDevice{ width: 250 / @px-unit; margin-left: 40 / @px-unit; word-break: break-all; } } } .CodeSend{ color: @successColor; } .Safecode { width:100%; .label-normal-container { width: 100%; .label-normal-wrapper { width:70% !important; } } } .PasswordPage{ margin-left: 50 / @px-unit; margin-top: 40 / @px-unit; .PasswordItem{ margin-bottom: 40 / @px-unit; } .PasswordConfirm{ display: flex; .PasswordTip{ width: 200 / @px-unit; margin-left: 12 / @px-unit; } } .PasswordInput{ width: 260 / @px-unit; } .passwordCheck_Box{ width: 260 / @px-unit; } }}.passwordSyncSuccess{ color:@successColor;}.passwordSyncFail{ color:@errorColor;}.DeviceInit{ height: auto; .FlexLine{ display: flex; margin-top: 30 / @px-unit; .PasswordTip{ width: 260 / @px-unit; margin-left: 12 / @px-unit; } } .modalHeader{ display: flex; align-items: center; padding-left: calc(50% - 1.097*@px-unit); border-bottom: 1 / @px-unit solid @modalFooterBorder; padding-bottom: 18px; .headerText{ text-align: center; width: 200 / @px-unit; } .headerText_current{ text-align: center; width: 200 / @px-unit; color: @current; } } .quick{ justify-content:center; padding-left:0; } .InitItem{ margin-left: 40 / @px-unit; margin-top: 40 / @px-unit; .quickInitLicenceNoted{ white-space: nowrap; text-decoration: underline; cursor: pointer; display: inline-block; } } .IsInherit{ border-bottom: 1 / @px-unit solid @modalFooterBorder; margin-top: 20 / @px-unit; margin-bottom: 20 / @px-unit; } .InitQuestion{ margin-left: 120 / @px-unit; }}.InitGuide{ height: auto; max-height: 680 / @px-unit; width: 80%; overflow-y: auto; overflow-x: hidden; margin-left: 90 / @px-unit; >div { width: 700 / @px-unit; } .startAndEndTimePicker,.label-normal-behind { padding: 0!important; .label-normal-container { padding: 0!important; } } .label-normal-wrapper > .ant-picker { width: 115 / @px-unit; } .label-date-picker > .ant-picker { width: 135 / @px-unit; } .autoCheckNote{ width: 100%; }}.InitGuide_Law{ height: 600 / @px-unit; .HeaderTab{ display: flex; cursor: pointer; .Tab_Current{ display: flex; width: 240 / @px-unit; text-align: center; height: 50 / @px-unit; background: @current; justify-content: center; align-items: center; border: 1px solid @tabBorder; color: @pageTextA; } .Tab{ display: flex; width: 240 / @px-unit; text-align: center; height: 50 / @px-unit; background: @tabBgN; align-items: center; justify-content: center; border: 1px solid @tabBorder; } } .LegalText{ height: 540 / @px-unit; padding: 20 / @px-unit; margin-top: 20 / @px-unit; overflow: auto; } .LicenceNoted{ margin-top: 20 / @px-unit; margin-left: 20 / @px-unit; }} ._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; } .ant-card-grid-hoverable: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; }} .clusterControl { display: flex; .open { padding-right: 20 / @px-unit !important; }} .Ocx_download_bottom{ position: fixed; text-align: center; bottom: 0; left: 0; width: 100%; padding: 10/@px-unit 0; border-top: 1/@px-unit solid @ocxBorder; background: @ocxDownloadBar; color: .color_N(@ocxDownloadBar)[]; z-index: 10000; span{ padding-top: 6/@px-unit; display: inline-block; } a { text-decoration: underline; color: @anchorTextA; } .closeBtn{ float: right; margin-right: 20/@px-unit; border: 1/@px-unit solid @buttonNormalBorderN; background-color: @buttonNormalBgN; color: .color_N(@buttonNormalBgN)[]; border-radius: 4/@px-unit; padding: 4/@px-unit 10/@px-unit; cursor: pointer; &:hover{ color: .color_A(@buttonNormalBgN)[]; } }} ._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: scroll; .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 } } } } } .ant-tabs-nav .ant-tabs-tab-btn { width: 170/@px-unit !important; }} .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; }} ._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; } } ._Input-Test_ { margin-left: 0 !important;} .Ocx_download_center{ z-Index: 9999; position: relative; width: 100%; height: 100%; .pluginMsg { left: 50%; top: 50%; transform: translateX(-50%); position: absolute; width: auto; max-width: 80%; border-bottom: 1/@px-unit dashed @pageTextN; a, svg{ color: @pageTextN; } &:hover { border-bottom: 1/@px-unit dashed @current; a, svg{ color: @current; } } }} ._RebootTimePicker_ { margin-left: 0 !important; .time-selector { margin-left: 5 / @px-unit; }} ._ScheduleModal_ { padding-top: inherit; }.ant-drawer-wrapper-body { background-color: #2A2E33; .ant-drawer-header { background-color: #2A2E33; .ant-drawer-title { color: #fff; } }} ._PtzZoom_ { margin: 10 / @px-unit 0 0 7.5 / @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; &wrap{ display: flex; align-items: center; } &part { width: 60 / @px-unit; height: 26 / @px-unit; background-color: @preview_right_ptzZoom_Bg; display: flex; align-items: center; justify-content: center; } &wrap:first-child{ ._PtzZoom_part:not(:last-child) { border-bottom: 1 / @px-unit solid @preview_right_ptzZoom_border_ColorN; border-right: 1 / @px-unit solid @preview_right_ptzZoom_border_ColorN; } ._PtzZoom_part:last-child { border-bottom: 1 / @px-unit solid @preview_right_ptzZoom_border_ColorN; } } &wrap:last-child{ ._PtzZoom_part:not(:last-child) { border-right: 1 / @px-unit solid @preview_right_ptzZoom_border_ColorN; } } & &Icon { .svgFont(25); cursor: pointer; }} ._IntelliAreaRuleBtn_ivs-color{ svg path:first-child { fill: @current !important; } } ._AlarmController_ { margin-top: 20 / @px-unit; .mode { display: flex; align-items: center; .label { width: 150 / @px-unit; height: 30 / @px-unit; line-height: 30 / @px-unit; } .textItem { width: 30 / @px-unit; height: 30 / @px-unit; margin: 0 6 / @px-unit; line-height: 30 / @px-unit; } .radioItem { width: 30 / @px-unit; height: 30 / @px-unit; line-height: 16 / @px-unit; margin: 0 7 / @px-unit 0 5 / @px-unit; padding: 0 !important; } } .status { display: flex; align-items: center; .label { width: 150 / @px-unit; height: 30 / @px-unit; line-height: 30 / @px-unit; } .checkboxItem { width: 30 / @px-unit; height: 30 / @px-unit; margin: 0 7 / @px-unit 0 5 / @px-unit; padding: 0 !important; } } } ._SplitScreen_ { position: relative; margin-bottom: 0 / @px-unit; &title{ padding: 0 10/@px-unit; line-height: 40/@px-unit; color: @pageTextN; font-size: 14/@px-unit; background-color: @fisheye_title; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } &wrap{ padding: 10/@px-unit 0/@px-unit; display: flex; justify-content: flex-start; flex-wrap: wrap; } &item{ height:40/@px-unit; width:40/@px-unit; margin:10/@px-unit; font-size:40/@px-unit!important; svg:hover { path:first-child { fill:@fisheye_iconHover!important; } } } &active{ svg path:first-child{ fill:@fisheye_actColor!important; } svg:hover { path:first-child { fill:@fisheye_actColor!important; } } } } ._CompliantInfoModal_ { .ant-tabs-tab-active { .label-normal-container { .label-normal { color: @current; } } } &left { display: flex; align-items: center; height: 32/@px-unit; .label-div-Container{ margin-left: 20/@px-unit; } span { color: @pageTextN; } } ._WorkClothes_ { .left-tip { visibility: hidden; } .warning-tip { color: @errorColor !important; } } .ant-checkbox-wrapper + .ant-checkbox-wrapper { margin-left: 0px !important } } .flexBetween(){ display: flex; align-items: center; justify-content: space-between; } .hdd-modal { width: 1010 /@px-unit !important; height: 600 /@px-unit; .btn-wrap { .flexBetween(); .right { .flexBetween(); .label-div-Container:last-child{ margin-left: 10/@px-unit; } } } .warning-tip{ margin-top: 15 /@px-unit; } } .LayoutOcxLeft{ .leftOcx{ width: 450/@px-unit; height: 337/@px-unit; } } .ocxRight{ padding-left: 15/@px-unit; flex: 1; } .ocxBottom{ padding-top: 15/@px-unit; width: 450/@px-unit; height: 120px; } @length :46/@px-unit;@close :34/@px-unit;.WinPreviewWarp { overflow: hidden; .ant-modal { width: 472px !important; } .ant-modal-close { width: @length; height: @length; .ant-modal-close-x{ width: @length; height: @length; line-height: @length; } } .ant-modal-header { padding: 12/@px-unit; .ant-modal-title { width: calc(~"100% - @{close}"); height: 22/@px-unit; overflow: hidden; .TransparentTitle { color: @MenuViewBg; } .NormalTitle { color: .color_N(@modalTitleBg)[]; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } } } .ant-modal-body { padding: 0; .WinPreview { padding: 0 !important; } } .ant-modal-footer { display: none; }} ._FishEye_ { position: relative; margin-bottom: 0 / @px-unit; &title{ padding: 0 10/@px-unit; line-height: 40/@px-unit; color: .color_N(@fisheye_title)[]; font-size: 14/@px-unit; background-color: @fisheye_title; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } &wrap{ padding: 10/@px-unit 0/@px-unit; display: flex; justify-content: flex-start; flex-wrap: wrap; } &item{ height:40/@px-unit; width:40/@px-unit; margin:10/@px-unit; font-size:40/@px-unit!important; svg:hover { path:first-child { fill:@fisheye_iconHover!important; } } } &active{ svg path:first-child{ fill:@fisheye_actColor!important; } svg:hover { path:first-child { fill:@fisheye_actColor!important; } } } .show{ display: ''; } .hide{ display: none; } } ._WinSecAuth_ { width: 600/@px-unit !important; .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; } } .pd-active > svg path:first-child{ fill:@pdEyeIconA !important; } .pd-default > svg path:first-child{ fill:none !important; }} ._BackupWindow_ { padding-top: inherit; }.backupModal{ width: 650/@px-unit !important; .label-normal-container { padding-top: 0 !important; }} ._RemoteAlarmOutput_ { padding-top: inherit; } ._ApplyTo_ { max-height: calc(100vh - 50vh); height: auto; overflow-y:scroll; .check-box-group-container{ width: 100% !important; } .check-box-group-wrapped{ width: 100% !important; } .checkBoxRow{ width: 100%; display: flex; justify-content: space-between; .checkBoxItem-all{ display: flex; align-items: center; } .checkBoxItem{ width: 46%; } .rightItem{ display: flex; justify-content: center; } } .label-normal-behind{ line-height: 28 / @px-unit; }} .add-content-box { padding-top: 8/@px-unit; .box { display: inline-block; width: 100%; border: 1px solid #4b515c; margin-right: 8px; font-size: 14rem; font-weight: 400; vertical-align: top; .active { color: #fff; background-color: #52555a; cursor: pointer; opacity: 1; } .item { margin: 0; text-indent: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; user-select: none; text-align: left; cursor: default; } table { border: 0 !important; .ZD-highlight-row{ background-color: @tableBgA !important; color: @pageTextA !important; } } } .sub { display: inline-flex; .reducer { align-self: flex-start; transform: translateY(0.5rem); margin-left: 8/@px-unit; } .label-normal-container { padding-top: 0px !important; } ._Table_ { .ant-table { border-top: 0; border-left: 0; border-right: 0; border-bottom: 1px solid #4b515c; } } }} ._AiRulePlugin_ { width: 460/@px-unit; padding: 5/@px-unit; padding-top: inherit; &ocx { width: 450/@px-unit; height: 337/@px-unit; } &button, ÷r { width: 450/@px-unit; } &filter { div { display: inline-block; } } button { width: 100/@px-unit; } .left { float: left; } .right { float: right; } .ant-radio-wrapper { display: block; } .ant-radio-wrapper { margin-right: 0/@px-unit; } .ant-radio, span.ant-radio + * { vertical-align: top; }} ._AiRuleTable_ { padding-top: inherit; width: 590 / @px-unit; ._Table_ { .ant-table-body { min-height: 150 / @px-unit; } .ant-table-body { .editable-cell-value-wrap { padding: 0 0; } } .add { .svgOut(.color_N(@tableBgN)[]); } .ant-table.ant-table-bordered { & > .ant-table-container { table { border-top: 0px; & > tbody { tr { &.ZD-selected-row { background-color: transparent !important; } &.ZD-highlight-row { background: @tableBgA !important; } } } } } } }} ._OSDPlugin_ { width: 460/@px-unit; padding: 5/@px-unit; &ocx { width: 450/@px-unit; height: 337/@px-unit; }} ._ChannelSelect_ { padding-top: inherit; .check-box-group-wrapped { .ant-checkbox-group .ant-checkbox-wrapper { width: 160 / @px-unit !important; margin-top: 10 / @px-unit; } .label-normal-wrapper { width: 100% !important; } .ant-checkbox-wrapper + .ant-checkbox-wrapper { margin-left: 0; } } width: 400 / @px-unit !important; ._ChannelSelect_box { overflow-y:scroll; height: 250 / @px-unit; } } ._PtzLink_ { height: 450px; overflow-y: scroll; margin: 10px;} ._SetMore_ { padding-top: inherit; }._setMoreView_ .checkboxListByRow .checkboxList { .label-div-Container { display: inline-block; width: 50%; }} .event-handler { .ant-space-item { margin-right: 0px !important; } .flex{ display: flex; .set-style{ display: flex; align-items: center; .text{ display: inline-block; width:180px; text-align: right; margin-right:10px; } } .left{ .text{ text-align: left; } } } } ._AlarmOutChn_ { padding-top: inherit; } ._RemoteAudio_ { padding-top: inherit; } ._RemoteAlarmLight_ { padding-top: inherit; } .schedule-wrapper { ._ScheduleComponent_ { padding-top: 0px; .button-container { .ant-btn { width: 100 / @px-unit; } } .main-container { border-color: transparent; padding-top: 0px; padding-bottom: 0px; overflow: visible; .label { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .copyBtn { background-color: @buttonNormalBgN; color: @buttonNormalTextN; height: 32 / @px-unit; line-height: unset; width: 100 / @px-unit; margin-left: 16 / @px-unit; border: 1px solid @buttonNormalBorderN; } &:nth-of-type(odd) { .dayplan { background-color: @schedulePlanOddBg; } } .dayplan { background-image: linear-gradient(90deg, @timePlanBorderN 1px, transparent 0), linear-gradient(90deg, @timePlanBorderN 1px, transparent 0); background-size: 4.17% 99%; background-color: @schedulePlanEvenBg; border-color: #4b515c; margin-bottom: 0px; height: 0.714rem; .handle { z-index: 1; } .track { &.timeplan-motion { background: @detect; } &.timeplan-ivs { background: @ivs; } &.timeplan-pos { background: @pos; } &.timeplan-gernal { background: @general; } &.timeplan-orange{ background: @detectalarm; } &.timeplan-smd{ background: @smd; } &.timeplan-fr{ background: @faceRecognition; } &.whiteMode{ background: @whiteMode } } } } .circle { &.timeplan-motion { background: @detect; } &.timeplan-ivs { background: @ivs; } &.timeplan-pos { background: @pos; } &.timeplan-gernal { background: @general; } &.timeplan-orange{ background: @detectalarm; } &.timeplan-smd{ background: @smd; } &.timeplan-fr{ background: @faceRecognition; } &.whiteMode{ background: @whiteMode } } .timeplan-ruler { border-bottom: 0.07142857rem solid @timePlanBorderN; div{ border-left-color: @timePlanBorderN; } .ruler-text { white-space: nowrap; } } .slider-container { .dayplan{ &.general:hover{ background: @planGeneral !important; } &.alarm:hover{ background: @planAlarm !important; } &.mdtalarm:hover{ background: @planDetectalarm !important; } &.ivs:hover{ background: @planIvs !important; } &.pos:hover{ background: @planPos !important; } &.motion:hover, &.AIMode:hover{ background: @planDetect !important; } &.InfraredMode:hover{ background: @planDetectalarm !important; } &.WhiteMode:hover{ background: @planIvs !important; } &.smd:hover{ background: @planSmd !important; } &.fr:hover{ background: @planFaceRecognition !important; } } } } .ant-tooltip-inner { background-color: @popover_BgN; } .ant-tooltip-arrow-content { --antd-arrow-background-color: @popover_BgN; background-color: @popover_BgN; } .timer-box { display: flex; .ant-input, p { background-color: @popover_BgN; color: @pageTextN; } } .label-normal-behind { &.pl-0 { padding-left: 0px !important; } .label-normal-container { padding-top: 0px !important; button { margin-left: 1.5rem; } } } .ant-drawer-content-wrapper { width: 935 / @px-unit; top: 258 / @px-unit; left: 50%; transform: translateX(-50%); .ant-drawer-content { background: @modalBg; border: 1px solid @modalBorder; .ant-drawer-header { background: @modalTitleBg; border-bottom-color: @modalTitleBorder; .ant-drawer-title { color: @modalTitleText; } } .ant-drawer-body { &:last-child { button { float: right; margin-left: 20 / @px-unit; } } } } }} ._UploadFiles_ { padding-top: inherit; input { width: 95%; margin-right: 15/@px-unit; }}.uploadBtn{ height: 10/@px-unit;}.uploadBtn_div{ display: flex;} .ai_result_window { width: 100vw !important; height: 100% !important; margin: 0 !important; max-width: 100% !important; top: 0; .ant-spin-nested-loading{ width: 100%; } .ant-modal-header{ width: 100vw; height: 100vh; overflow-y:auto !important; overflow-x: auto !important; min-width: 1280/@px-unit; } .ant-modal-body{ width: 100%; padding-left: 12/@px-unit !important; padding-right: 0px !important; padding-top: 0px !important; max-width: 100% !important; } .ant-modal-content { top: 0; border: none !important; left: 0; width: 100vw; height: 100vh; overflow-y:auto !important; overflow-x: auto !important; min-width: 1280/@px-unit; ._AiSearchResultWindow_left{ margin-left: 15/@px-unit; .ant-divider{ margin:1/@px-unit !important; } width: calc(100vw - 400px) !important; } ._AiSearchResultWindow_left_top { .allCheckWrap{ min-width: 100 / @px-unit; } .allCheckBehind{ width: auto !important; min-width: 70/@px-unit; } display: flex; flex-direction: row; .label-div-Container { margin-right: 12/@px-unit; } .sort_span{ height: 55/@px-unit; line-height: 55/@px-unit; margin-right: 12/@px-unit; margin-left: 12/@px-unit; } .iconSortBtn{ display: inline-block; margin-top: 7/@px-unit; margin-left: 5/@px-unit; } .icosortActiveBtn{ svg{ &+{ path:first-child{ fill: @current; } } } } .search_progress{ margin-left: 15/@px-unit; } .cus_icons { .svgFont(20); } } ._PicDataview_ { height: 700/@px-unit; } ._AiSearchResultWindow_right { width: 400/@px-unit !important; min-width: 400/@px-unit !important; ._AiSearchResultWindow_right_ocx { padding:10/@px-unit; } } } }.tagadd_modal{ .tag_defaultBtn{ float: left; }}.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;} .WinPreview { .WinPreview_ocx { background-color: @iconBgColor; height: 285/@px-unit; img { width: 100%; height: 100%; background-repeat: no-repeat; } &_ocx { width: 100%; height: 100%; } } &_footer{ position: relative; top: 0; background-color: @winpreview_footer_Bg; padding: 0 10/@px-unit; flex-direction: row-reverse; align-items: center; .sub_footer { height: 40/@px-unit; display: flex; align-items: center; } .footer_control { flex:1; span { padding: 0 10/@px-unit; width: 90/@px-unit; } .control_slider,.ant-slider-disabled{ flex:1; position: relative; margin:0!important; line-height: 12/@px-unit; .ant-slider-rail { background-color: @sliderBgN !important; height: 3/@px-unit; } .ant-slider-handle{ width: 8/@px-unit!important; height: 8/@px-unit!important; margin-top: -3/@px-unit; border-radius: 0; } } } .footer_button { justify-content: space-between; .footer_icon { display: flex; padding: 0 10/@px-unit; justify-content: flex-start; } .cus_icons{ .svgOut(.color_N(@winpreview_footer_Bg)[]); &.disabled_icons{ .svgDisabled(.color_D(@winpreview_footer_Bg)[]); } } span { display: inline-block; width:35/@px-unit; } .activeButton { .svgOut(@current); } .timePeriods { display: flex; justify-content: center; align-items: center; .timeButton { display: flex; justify-content: center; align-items: center; cursor:pointer; width: 34/@px-unit; height: 22/@px-unit; box-sizing: content-box; border-radius: 5/@px-unit; background-color: @buttonNormalBgN; padding: 2/@px-unit 2/@px-unit; margin: 0 2/@px-unit; font-size: 13/@px-unit; color: .color_N(@buttonNormalBgN)[]; } .activeButton { background-color: @current; border: 0; color: .color_N(@current)[]; } } } }} @ant-modal-height-height: 42/@px-unit; @arrow-icon-bg: @modalTitleBg; @content-header-bg: @--menu-bg; @content-spilt: @--split; .acupick_window { height: 100%; width: 100% !important; max-width: none; .ant-modal-content { height: 100%; min-width: 1280/@px-unit; min-height: 800/@px-unit; .ant-modal-body { padding: 0; height: calc(100% - @ant-modal-height-height); .window-main-container { position: relative; display: flex; height: 100%; } .window-container-left { top: 0; left: 0; position: absolute; display: flex; width: 428/@px-unit; height: 100%; flex-shrink: 0; transition: left 0.3s linear; .hover-hidden-arrow { position: absolute; display: flex; align-items: center; justify-content: center; cursor: pointer; background-color: @modalTitleBg; width: 24/@px-unit; height: 64/@px-unit; border-radius: 2/@px-unit; top: 50%; right: 0; transform: translate(0, -50%); .hover-icon { .svgFont(24) } } .condition-wrapper { height: 100%; width: 100%; display: flex; flex-flow: column; .condition-header { line-height: 60/@px-unit; box-sizing: border-box; height: 61/@px-unit; padding-left: 20/@px-unit; border-bottom: 1/@px-unit solid @--split; border-right: 1/@px-unit solid @--split; background-color: @content-header-bg; } .img-wrapper { display: flex; padding: 20/@px-unit; background-color: @pageBodyBg; align-items: center; justify-content: center; height: 428/@px-unit; .condition-image { max-width: 100%; height: 100%; } } .condition-form-wrapper { flex: 1; padding-left: 20/@px-unit; background-color: @content-header-bg; .compact-picker-wrapper { display: flex; .label-div-Container { width: 50%; } } } } } .hide-container-left { left: -428/@px-unit; } .window-left-blank, .window-right-blank { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 32/@px-unit; box-sizing: border-box; background-color: @content-header-bg; border-left: 1/@px-unit solid @--split; border-right: 1/@px-unit solid @--split; .arrow-icon { .svgFont(20) } } .window-container-right { height: 100%; flex-shrink: 0; width: 400/@px-unit; min-width: 400/@px-unit; padding: 10/@px-unit; .record-preview-panel { width: 100%; } .record-preview-header { height: 41/@px-unit; width: 100%; box-sizing: border-box; background-color: @modalTitleBg; line-height: 40/@px-unit; border-bottom: 1/@px-unit solid @--split; padding-left: 20/@px-unit; } } .window-container-middle { position: relative; display: flex; height: 100%; overflow: hidden; flex-grow: 1; .hover-show-arrow { position: absolute; display: flex; align-items: center; justify-content: center; background-color: @modalTitleBg; cursor: pointer; width: 24/@px-unit; height: 64/@px-unit; border-radius: 2/@px-unit; top: 50%; left: 0; transform: translate(0, -50%); .hover-icon { .svgFont(24) } } .result-wrapper { display: flex; width: 100%; height: 100%; flex-direction: column; .result-header { display: flex; justify-content: space-between; align-items: center; line-height: 60/@px-unit; box-sizing: border-box; padding-right: 20/@px-unit; height: 61/@px-unit; border-bottom: 1/@px-unit solid @--split; background-color: @content-header-bg; .ant-tabs-nav { .ant-tabs-tab-btn { height: 60/@px-unit; line-height: 60/@px-unit; } } .return-button { margin-left: 20/@px-unit; } } ._SideView_ { min-width: 0; } .result-up-bar { display: flex; box-sizing: border-box; justify-content: space-between; align-items: center; padding-right: 20/@px-unit; flex-wrap: wrap; min-height: 61/@px-unit; border-bottom: 1/@px-unit solid @--split; background-color: @content-header-bg; .left-bar-wrapper { display: flex; .label-div-Container { margin-left: 20/@px-unit; } } .right-bar-wrapper { display: flex; .label-div-Container { margin-left: 20/@px-unit; } } } .result-down-bar { line-height: 60/@px-unit; box-sizing: border-box; padding-left: 16/@px-unit; padding-right: 16/@px-unit; display: flex; justify-content: space-between; height: 61/@px-unit; border-top: 1/@px-unit solid @--split; background-color: @content-header-bg; .down-bar-left { display: flex; align-items: center; } .down-bar-right { .pageLine { min-width: 0; margin-top: 0; .pageLineLeft { order: 2; } .pageLineRight { order: 1; margin-right: 20/@px-unit; } } } } .img-card-group { flex: 1; overflow-y: scroll; .card-group-wrapper { display: flex; flex-wrap: wrap; padding: 8/@px-unit; padding-right: 0/@px-unit; padding-left: 0/@px-unit; } .searching-mask, .no-result-mask { height: 100%; width: 100%; display: flex; align-items: center; justify-content: center; } .card-item-wrapper { width: 266/@px-unit; border: 1/@px-unit solid @--split; margin: 6/@px-unit; .card-content { position: relative; padding: 6/@px-unit; cursor: pointer; background-color: @content-header-bg; .operation-button { display: flex; position: absolute; top: 6/@px-unit; left: 6/@px-unit; .normal-icon { cursor: pointer; visibility: hidden; } .collect-icon { .svgOut(@buttonNormalBgN); .svgHover(@iconHover) } .hide-icon { svg { path:first-child { fill: none } g { path { fill: @buttonNormalBgN !important; } } } &:hover { svg { g { path { fill: @current !important; } } } } } .hide-active-icon { visibility: visible; svg { path:first-child { fill: none } g { path { fill: @current !important; } } } } .collect-active-icon { visibility: visible; .svgOut(#cfb400); } } &:hover { .operation-button { .normal-icon { visibility: visible; } } } .small-img-wrapper { height: 150/@px-unit; text-align: center; padding-bottom: 6/@px-unit; .card-image { height: 100%; max-width: 100%; } } .similar-wrapper { margin: 0 8px 7px 5px; background: @ai_progress_default; height: 14/@px-unit; position: relative; color: @pageTextA; line-height: 1; .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; } .percent-num { position: absolute; right: 0; } } } .card-footer { display: flex; align-items: center; padding-left: 8/@px-unit; .label-div-Container { flex-grow: 1; } .channel-name { margin-right: 12/@px-unit; } } } } .card-wrapper-selected { border: 1/@px-unit solid @current !important; } } .labelSlider-float-left, .labelSlider-float-right { line-height: initial; } } } } } .label-sort-btn-wrapper { height: 32/@px-unit; } .icon-sort-btn-wrapper{ display: inline-block; div { line-height: 18/@px-unit; } .icosortActiveBtn{ svg{ &+{ path:first-child{ fill: @current !important; } } } } .sort-icon-up, .sort-icon-down { .svgFont(16) } } .acuPick-search-backup { .check-group-wrapper { display: flex; } .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; } } ._AcuPickIcon_{ &.hide { display: none; } .active{ svg path:nth-of-type(1){ fill:@current!important; } }}.acupick { &-region, &-canvas{ width: 100%; height: 100%; position: absolute; &-hide { top: -10000 / @px-unit; z-index: 0; } &-show { z-index: 1001; top: 0; left: 0; } }} .SoundLight { width: 100%; display: inline-block; } .SoundConfigSpace { margin-right: 48/@px-unit !important; } ._PicViewList_ { height: 700/@px-unit; .ant-row{ max-height: 680/@px-unit; overflow:auto; } .ant-spin-nested-loading { .ant-spin-container { .ant-list-empty-text{ display: none; } } }} ._PicDetailsPanel_ { padding: 0 16/@px-unit 16/@px-unit 16/@px-unit; .label-normal-container { padding: 0px !important; height: 30/@px-unit; .label-normal{ height: 30/@px-unit; } .label-normal-wrapper{ height: 30/@px-unit; } }}.ant-divider-horizontal.ant-divider-with-text{ margin: 10/@px-unit}.person_div{ padding-top: 5/@px-unit;} .fixed-button { position: fixed; bottom: 0; right: 0; height: 66 / @px-unit; padding: 17 / @px-unit 10 / @px-unit; background-color: @BottomBarBg; border-top: 1px solid @BottomBarBorder; &.halfwidth { width: 87.5%; } &.fullwidth { width: 87.5%; } .label-normal-container { padding: 0 !important; margin: 0 10px; }}.absolute-button { position: absolute; bottom: 0; right: 0; left: 0; height: 66 / @px-unit; padding: 17 / @px-unit 10 / @px-unit; background-color: @BottomBarBg; border-top: 1px solid @BottomBarBorder; width: 100% !important; .label-normal-container { padding: 0 !important; margin: 0 10px; }}.fixed-button,.absolute-button { button { display: inline-block; } .left { float: left; } .right { float: right; }} ._PtzCtrl_ { padding-top: inherit; position: relative; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; &header_bg { width: 150 / @px-unit; height: 150 / @px-unit; margin: 25 / @px-unit 0 15 / @px-unit 25 / @px-unit; position: relative; & &_icon { .svgFont(150); svg { & + { path{ fill: @preview_right_ptzBg; } } } } } &header_el { width: 151 / @px-unit; height: 151 / @px-unit; display: flex; flex-wrap: wrap; flex-direction: row; position: absolute; justify-content: flex-start; cursor: pointer; top: 0; left: 0; .anticon{ font-size: 50 / @px-unit!important; } } .active{ svg path:nth-of-type(1){ fill:@current!important; } }} ._PtzMenu_ { padding-top: inherit; display: flex; justify-content: center; align-items: center; flex-direction: column; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; &header_bg { position: relative; width: 120 / @px-unit; height: 120 / @px-unit; margin: 10 / @px-unit 0 30 / @px-unit 0; & &_icon { .svgFont(120); svg { & + { path{ fill: @preview_right_ptzBg; } } } } } &header_el { width: 120 / @px-unit; height: 120 / @px-unit; display: flex; flex-wrap: wrap; position: absolute; top: 0; left: 0; .cus_icons:not(.disabled_icons):not(.noHover):hover svg path:nth-child(2) { fill:@current; } & &_icon { .svgFont(30); width: 30 / @px-unit; height: 30 / @px-unit; margin: 5 / @px-unit 5 / @px-unit 5 / @px-unit 5 / @px-unit; &:hover { cursor: pointer; } } } &btngroups{ display: flex; justify-content: flex-start; color:@pageTextN; margin:-17/@px-unit 0 0 0; .btn3{ width:60/ @px-unit!important; } }} ._PtzStep_ { width: 180 / @px-unit; height: 48 / @px-unit; margin: 0 0 0 7.5 / @px-unit; background-color: @preview_right_ptzStep_Bg; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; .label-normal-container { display: flex; padding: 0 !important; } &label { width: 45 / @px-unit !important; height: 48 / @px-unit !important; line-height: 48 / @px-unit !important; margin-left: 4/ @px-unit; text-align: center !important; padding-right: 0; } &slider { width: 120 / @px-unit !important; line-height: 48 / @px-unit !important; .labelSlider-float-left, .labelSlider-float-right { width: 0 / @px-unit; } .labelSlider-center { margin: 0 / @px-unit; .ant-slider { margin-top: 9 / @px-unit !important; margin-bottom: 9 / @px-unit !important; } .ant-slider-mark-text, .ant-slider-mark-text-active { color: @preview_right_ptzStepMask_ColorN; font-size: 12 / @px-unit; } .ant-slider-step { .ant-slider-dot { width: 0; height: 0; border: none; } } } }} .audioFile { display: flex; .audioCheckBox{ display: inline-block; } .audioSelect{ display: inline-block; } } .http-push { display: flex; .label-normal-behind { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; word-wrap: normal; } } ._PtzSet_ { height:200/ @px-unit; padding-left: 15 / @px-unit; width: 100%; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; .label-normal-container { padding-top: 0 !important; } .btnGroups{ display: flex; width: 180/ @px-unit; flex-wrap: wrap; } .btn{ width:87/ @px-unit !important; } .btn3{ width:60/ @px-unit!important; } .inputWrap{ display: flex; justify-content: flex-start; align-items: center; >span{ margin-left:10/ @px-unit; color:@pageTextN; font-size:14/ @px-unit } } .vertical{ margin-top:40/ @px-unit; } .show{ display: ''; } .hidden{ display: none; }} .hard-disk-management-table .ant-table-body{ min-height: 230 / @px-unit !important;} ._PicDetailsVehicle_ { padding: 16/@px-unit;; .label-normal-container { padding: 0px !important; height: 30/@px-unit; .label-normal{ height: 30/@px-unit; } .label-normal-wrapper{ height: 30/@px-unit; } }} ._PicDetailsNonMotor_ { padding: 16/@px-unit;; padding: 0px !important; height: 30/@px-unit; .label-normal{ height: 30/@px-unit; } .label-normal-wrapper{ height: 30/@px-unit; }} ._PicDetailHuman_ { .label-normal-container { height: 30/@px-unit; .label-normal{ height: 30/@px-unit; } .label-normal-wrapper{ height: 30/@px-unit; } } .redClass { .label-normal { color: @errorColor; } color: @errorColor; }} @IEBrowerColor: @current; ._IPSpeakerModal_{ .blueIEBrowser { .svgOut(@IEBrowerColor); } .manage-grid-successIcon { .svgOut(@successIcon); .svgFont(20); } .manage-grid-errorIcon { .svgOut(@errorColor); .svgFont(20); } } ._PicDetailOperateMonitor_ { .label-normal-container { height: 30/@px-unit; .label-normal{ height: 30/@px-unit; } .label-normal-wrapper{ height: 30/@px-unit; } } .redClass { .label-normal { color: @errorColor; } color: @errorColor; } } ._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: scroll; } } } ._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; } }}.password-reset-modal { width:430 /@px-unit !important;} ._BaseConfig_ { overflow-y: scroll; padding-left: 2%; width: 100%; padding-top: 30 / @px-unit; .fullTimeSelecion { margin-left: 20 / @px-unit; } .leftmargin { margin-left: 20 / @px-unit; } .label-normal-behind { margin-left: 20 / @px-unit; } .addCustomDays { margin-left: 20 / @px-unit; .check-box-group { .label-normal-wrapper { width: 700px !important; .labelCheckboxGroup { display: flex; .ant-checkbox-wrapper { width: 200px; } } } } }}.addCustomDays-modal { .ant-modal-content { .ant-modal-body { padding: 0 !important; padding-bottom: 30px !important; ._Holiday_ { position: relative !important; .ant-row { .fixed-button { position: absolute !important; padding-top: 40px; border-top: none !important; } } } } }} .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; }} .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; }} .MultipleLinkage_tableModal { .playTimes, .delayTime { text-align: center; line-height: 20 / @px-unit; } ._Table_ { .ant-table-body { .editable-cell-value-wrap { padding: 0px 0px 0px 0px; } .editable-cell-value-wrap:hover { border-width: 0px; padding: 0px 0px 0px 0px; } } } .MultipleLinkage_buttons { div { display: inline-block; } } .filename-selector-container { .label-normal-container, .label-normal-wrapper, .filename-selector { width: 100% !important; } } } ._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; } }} .H5 { z-Index: 9999; position: relative; .h5player { background-color: @ocxBg; .h5player_header { background-color: @ocxHeaderBg; color:.color_N(@ocxHeaderBg)[]; height: 15/@px-unit; width: 100%; display: flex; justify-content: space-between; } .h5player_header_left { height: 15/@px-unit; font-size: 12/@px-unit !important; margin-left: 2/@px-unit; span { padding-right: 10/@px-unit; span { padding-left: 10/@px-unit; } } } .h5player_header_right { display: flex; justify-content: flex-end; height: 15/@px-unit; font-size: 12/@px-unit !important; .cus_icons{ .svgOut(.color_N(@ocxHeaderBg)[]); font-size: 12/@px-unit !important; margin-right: 2/@px-unit; display: flex; justify-content: flex-end; &:hover{ .svgHover(@homeTaskIconColorA); } } } .h5playerProptip { width: 100%; height: 96/@px-unit; position: absolute; text-align: center; font-weight: 700/@px-unit !important; padding-top: 15/@px-unit; font-size: 30/@px-unit; color: @pageTextA; top: 50%; margin-top: -40/@px-unit; } } } .startAndEndTimePicker { .time-select-wrapper { display: flex; width: 100%; &>div { width: 100%; padding-top: 0rem !important; &>div { width: 100%; } } }} ._ExtraStreamDisc_ { padding:20 / @px-unit; width: 100%;} .syncinfo_modal { ._Table_ .ant-table-body { min-height: 200 / @px-unit; } } @textHighlightColor: #fff;@icon-success-color: @iconNolmal; @icon-warning-color: @iconFail; @icon-fail-color: @iconFail; @icon-ignore-color: @iconColorD; @icon-list-color: @iconListColorN; .m-highlight-text { color: @textHighlightColor}._SAFESecurityStatus_ { ._SAFESecurityStatus_title { background-color: inherit !important; } ._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;}.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;} ._RecordPlan_ { .childLableContainer-d-inlineBlock { &>div { display: inline-block; } } .labelCheckBox-behind-labelText { .label-normal-container { padding-bottom: 0 !important; } } } ._MainStreamDisc_ { padding:20 / @px-unit; width: 100%;} ._Pppoe_ { padding-top: inherit; } ._SymServer_ { .gap-divider { margin-top: 0; margin-bottom: 0; }} .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; } } ._Multicast_ { padding: 22 / @px-unit; .behindSpan { padding: 5 / @px-unit; }} ._SNMP_ { .subform { display: flex; justify-content: space-between; .box { width: 50%; } }} ._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; } }} .RaidHotSpare_FlexLine{ display: flex; .AddTo{ margin-left: 15 / @px-unit; }}._RaidHotSpare_ { ._Table_ .ant-table-body { min-height: 450 / @px-unit; } } ._MachineConfig_ { padding-top: inherit; .ant-row .label-normal-container { min-width:550/@px-unit; } .syncRemoteCheckBox .label-normal-container>.label-normal-wrapper{ width: auto !important; }} ._Aging_{ .hdd-mode-swrap{ margin-bottom: 10 /@px-unit; .hdd-mode { display: flex; align-items: center; justify-content: space-between; } }} ._HddHealth_ { ._Table_ .ant-table-body { min-height: 220 / @px-unit; } } ._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%; } } } ._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: scroll; .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 } } .label-normal-container { padding: 5/@px-unit 0 !important; } } } } .ant-tabs-nav .ant-tabs-tab-btn { width: 170/@px-unit !important; }} ._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; }} ._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%; } }} .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; } } ._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: 100 / @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; } } } .Channel{ .label-normal{ margin-top: 8 / @px-unit; } }} ._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; } } .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;} .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; } ._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;; } } } } } } }} ._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; } } } ._SnapDisc_ { padding:20 / @px-unit; width: 100%;} ._NetCloud_ { position: relative; .tip { width: 20rem; word-wrap:break-word; word-break:break-all; } .qrcodes { display: flex; width: 800px; height: 350px; margin-top: 30px; margin-left: 20px; .qrbox { display: flex; width: 300px; height: 250px; flex-direction: column; justify-content: space-between; .qrImg { width: 215px; height: 215px; padding: 5px; background-color: @QRCodeBg; img { width: 100%; height: 100%; } } p { margin: 0; font-size: 14px; font-weight: 400; color: .color_N(@pageBodyBg)[]; } } } .step{ height: 212px, } .wrap{ display: flex; flex-direction: row; justify-content: flex-start; .left_part{ min-width: 40rem; } }}.modal-button { button { width: 100%; }} ._LeCheng_ { position: relative; .tip { width: 60rem; } .qrcodes { display: flex; width: 800px; height: 350px; margin-top: 30px; margin-left: 20px; .qrbox { display: flex; width: 300px; height: 250px; flex-direction: column; justify-content: space-between; .qrImg { width: 215px; height: 215px; padding: 5px; background-color: @QRCodeBg; img { width: 100%; height: 100%; } } p { margin: 0; font-size: 14px; font-weight: 400; color: .color_N(@pageBodyBg)[]; } } }}.modal-button { button { width: 100%; }} ._Email_ { height: 90%; overflow-x: hidden; overflow-y: scroll; padding-bottom: 75px !important; .Receiver { .svg { font-size: 20px; cursor: default; } .active { color: #fff; background-color: #52555a; cursor: pointer; } .receiver-box { width: 288px; .box { display: inline-block; width: 260px; height: 118px; margin-right: 8px; border: 1px solid #4b515c; font-size: 13px; font-weight: 400; vertical-align: top; .cell { height: 35px; line-height: 35px; padding: 0 10px; margin: 0; font-size: 14px; vertical-align: top; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; &:hover { color: #fff; } } } span { display: inline-block; vertical-align: top; } } } .ant-divider-horizontal { margin: 5px 0; }} ._P2P_ { position: relative; word-break: keep-all; .tip { width: 60rem; } .qrcodes { display: flex; width: 800px; height: 350px; margin-top: 30px; margin-left: 20px; .qrbox { display: flex; width: 300px; height: 350px; flex-direction: column; justify-content: space-between; .qrImg { width: 210px; padding: 5px; background-color: @QRCodeBg; } p { margin: 0; font-size: 14px; font-weight: 400; color: .color_N(@pageBodyBg)[]; } } }}.modal-button { button { width: 100%; }} ._BPSLimit_{ padding: 20 / @px-unit; } @IEBrowerColor: @current; ._IPSpeaker_{ padding: 20 / @px-unit; .blueIEBrowser { .svgOut(@IEBrowerColor); } .manage-grid-successIcon { .svgOut(@successIcon); .svgFont(20); } .manage-grid-errorIcon { .svgOut(@errorColor); .svgFont(20); } } ._Holiday_ { ._Table_ .ant-table-body { min-height: 450 / @px-unit; } } ._Port_ { padding-top: inherit; } ._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%; }} ._WIFI_ { .header-btn-group { display: flex; justify-content: space-between; .btn { align-self: center; } } .wifi-info-container { padding: 0 20px; margin-top: 10px; border: 1px solid rgb(75, 81, 92); .boss { color: #fff; font-weight: bold; } p { margin-bottom: 5px; } } .table-body { margin: 0; text-align: center; } .ant-table-body { min-height: 150px; } .wifi { & + { path:second-child { fill: @iconActiveWifi; } } &.s_05 { .svgOut(@iconActiveWifi); } }} ._FourG_ { width: 100%;} ._TCPIP_ { width: 100%; .table-item { margin: 0; text-align: center; .delete-icon { cursor: pointer; &:hover { svg { & + { path:first-child { fill: #f00 !important; opacity: 0.3 !important; } } } } } } .info-container { padding: 0 10px; margin-top: 10px; border: 1px solid #4b515c; .label-normal-wrapper { width: 150px !important; } } .input-enabled:hover:not(.ant-input-disabled) { } ._Table_ { .ant-table-content { min-height: 260 / @px-unit; } }}._RouteTable_ { width: 100%; .table-header { user-select: none; } .delete-icon { cursor: pointer; &:hover { svg { & + { path:first-child { fill: #f00 !important; } } } } }}.netCardMenber_checkbox .ant-checkbox-wrapper{ margin-left: 0; margin-right: 6 / @px-unit;}.netCardMenber_checkbox .ant-checkbox-wrapper:last-child{ margin-right: 0;} ._PhoneSetting_ { .container { display: flex; width: 100%; }} ._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; } } ._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; }} ._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; }} .holidayRadioGroup{ label{ width: 45%; } } ._UPnP_ { padding-top: inherit; } ._IPSpeakerCfgModal_{ } ._ChannelName_ { padding-top: inherit; height: 100%; .ChannelList { height: 90%; overflow-y: auto; .gutter-row { padding: 0 10px; } }} ._AlarmCenter_ { .divider { margin: 5 / @px-unit 0; }} ._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; } } ._AutoRegister_ { padding-top: inherit; .online_bg { color: @successColor; } .offline_bg { color: @errorColor; }} ._IPSpeakerCfgModal_{ } .onlineIcon { .svgOut(@successColor) !important; .svgFont(20) !important; } .offlineIcon { .svgOut(@errorColor) !important; .svgFont(20) !important; } ._Partition_{ padding: 20 / @px-unit; } .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; } } } } } } ._RealDisplay_{ ._Table_ .ant-table-body{ min-height: 240/@px-unit; .fail{ color: @errorColor; } .ant-table-cell{ word-break:break-all; } } } ._AlarmHubSearch_ { .pageLine { float: none; } &detailButton { display: flex; justify-content: space-between; } &searchLine { display: flex; justify-content: space-between; align-items: flex-end; } &backupLine { display: flex; flex-direction: row-reverse; } } ._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; .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; } }} @IEBrowerColor: @current;._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-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%; } }}._ZDChannelGroupModal_ { display: flex; flex-wrap: wrap; .checkbox { display: inline-block; } .label { display: inline-block; height: 40px; line-height: 40px; } .chn_btn.ant-btn { color: @buttonNormalTextN; background-color: transparent; width: 30px; height: 30px; padding: 0; margin: 5px; text-align: center; &.selected { color: @buttonNormalTextA; border-color: @formInputBgA; &:focus { color: @buttonNormalTextA; border-color: @formInputBgA; } } &.allbtn { font-size: 10px; } &[disabled] { opacity: .5; &:hover, &:active, &.active{ opacity: .5; } } }}._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; } }} ._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: scroll; } } ._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;} ._HubDevice_ { .success_icon { .svgOut(@successIcon); } .error_icon { .svgOut(@errorIcon); } .setting-icon { cursor: pointer; }} ._PtzConfig_ { padding-left: 20 / @px-unit; padding-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; } }} ._TemperHumidity_wrapper{ width:100%; padding:20/@px-unit; .ant-table-cell{ word-break:break-all; }} ._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; }} .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; }} ._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; } } } @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;} ._RegionOfInterest_ { .form-head { display: flex; .form-head-right { margin-left: 30/@px-unit; margin-bottom: 20/@px-unit; } } .roi_ocx { transform-origin: left top; } } .copy-modal__wrap{ max-height: 400 / @px-unit; overflow: hidden; overflow-y: scroll;}.copy-modal__item{ display: flex; flex-wrap: wrap;} ._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; } } .search_type { padding-left: 30 / @px-unit; } .search_button { float: right; margin-top: -50 / @px-unit; } .IOTSearch_fail { color: @errorColor; } .IOTSearch_Table { ._Table_ .ant-table-body { min-height: 450 / @px-unit; } } .IOTSearch_tablebottom { display: flex; flex-wrap: nowrap; align-items: center; margin-top: 10 / @px-unit; .pageLine { margin-right: 10 / @px-unit; margin-top: 0; } & > .label-div-Container > .label-normal-container { padding: 0 !important; & > .label-normal-wrapper { line-height: normal; } } } ._EncodeEnhancement_ { height: calc(100% - 66px); overflow-y: auto; .fullsize { span { color: @pageTextN; } } &table{ width: 1000/@px-unit; } &tip{ width: 1000/@px-unit; } } @IEBrowerColor: @current;._AlarmHub_ { width: 100%; ._AllDevice_ { .all-device-upper { display: flex; justify-content: space-between; .upper-left { display: flex; align-items: center; line-height: 48/@px-unit; } .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-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%; } }}._ZDChannelGroupModal_ { display: flex; flex-wrap: wrap; .checkbox { display: inline-block; } .label { display: inline-block; height: 40px; line-height: 40px; } .chn_btn.ant-btn { color: @buttonNormalTextN; background-color: transparent; width: 30px; height: 30px; padding: 0; margin: 5px; text-align: center; &.selected { color: @buttonNormalTextA; border-color: @formInputBgA; &:focus { color: @buttonNormalTextA; border-color: @formInputBgA; } } &.allbtn { font-size: 10px; } &[disabled] { opacity: .5; &:hover, &:active, &.active{ opacity: .5; } } }}._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; } } .echart_lengend_color{ color: @pageTextN; } .echart_line{ color: @pageBorderN; } ._NetInfo_ { padding-top: inherit; ._Table_ .ant-table-body { min-height: 180 / @px-unit; } } ._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; } }} ._ChannelState_ { .anticon-left, .ant-pagination-simple-pager, .anticon-right{ color:@pageTextA } ._Table_ .ant-table-body { min-height: 600 / @px-unit; } } ._RecordInfo_{ .recordTable{ width: 80vw; } ._Table_ .ant-table-body { min-height: 360 / @px-unit; } } ._DeveloperLog_ { .FlexLine{ display: flex; .LogLevel{ margin-left: 100 / @px-unit; } } ._Table_ .ant-table-body { min-height: 500 / @px-unit; } } ._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; } }} ._VersionInfo_ { .SystemVersion { width: 300 / @px-unit; } .achor_info { .label-normal { color: @achor_infoColor; cursor: pointer; &:hover { color: @achor_infoHoverColor; } } } .serialNumber { width: 216px; height: 216px; padding: 8px; background-color: #FFF; }} ._PocInfo_ { .FlexLine{ display: flex; ._Table_{ width: 40%; } ._Table_ .ant-table-body { min-height: 500 / @px-unit; } .RightPane{ margin-left: 40 / @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; } }} ._PosSearch_ { padding-top: inherit; .ant-table { height: 450 / @px-unit; overflow-y: auto; }} ._CfgManage_ { .ConfirmTip{ padding-top: 8/@px-unit; padding-bottom: 8/@px-unit; } .ExportButton{ padding-top: 8/@px-unit; padding-bottom: 8/@px-unit; }} ._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; } }} ._PosConfig_ { padding-top: inherit; .pos_ocx { width: 450/@px-unit; height: 337/@px-unit; } .colorBox(@posCheckbox); .ant-checkbox + span { padding: 0; } } ._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); }} .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; }} ._DiskInfo_ { padding-top: inherit; .record_time_modal { ._Table_ .ant-table-body { min-height: 240 / @px-unit; } } .detect_smart_modal { ._Table_ .ant-table-body { min-height: 220 / @px-unit; } }.label-v4-version { text-align: right;} ._Table_ .ant-table-container { min-height: 500 / @px-unit; } }.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; }} ._Maintenance_ { .AutoReboot{ display: flex; .TimeSelect{ margin-left: 5/@px-unit; } }} ._AlgorithmVersion_ { .TextNormal{ color:@pageTextN } .TextRed{ color:@errorColor }} ._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-nav .ant-tabs-tab-disabled .ant-tabs-tab-btn{ color: @pageTextD; } } } ._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%; } }} ._VideoFusion_windows { display: flex; width: 1000 / @px-unit; flex-wrap: wrap; > .label-div-Container { margin-right: 50 / @px-unit; } } ._TimeBackup_{ .line-block{ display: flex; } .default-interval{ margin-left: 30 / @px-unit; } .search-btn-list{ justify-content:flex-end; }} ._VideoLoss_ { width: 100%; .form { height: 100%; overflow-x: hidden; overflow-y: scroll; }} .flex-container { display: flex; width: 100%; .flex-item { flex: 1; text-align: center; } } .flex-checkbox-container { display: flex; width: 100%; justify-content: space-around; .flex-checkbox-item { flex: 1; text-align: center; } } .paging-container { height: 40px; margin-top: 20px; margin-left: 500px; .paging-text { display: inline-block; width: 200px; height: 40px; text-align: center; } .paging-icon { display: inline-block; text-align: center; vertical-align: middle; } } ._SceneChange_ { width: 100%; .form { height: 100%; overflow-x: hidden; overflow-y: scroll; }} ._AudioDetection_ { height: calc(100% - 66px); overflow-y: auto; } ._Disarming_ { padding-top: inherit; }.chn_div{ display: flex;}.subtitle { margin: 0; font-weight: bold; color: #fff;} ._VideoBlind_ { width: 100%; .form { height: 100%; overflow-x: hidden; overflow-y: scroll; } &line { display: flex; }} ._PIRAlarm_ { width: 100%; .form { height: 100%; overflow-x: hidden; overflow-y: scroll; } ._checkbox_pad_ { padding-left: 186 / @px-unit; }} ._VideoMotion_ { width: 100%; .form { height: 100%; overflow-x: hidden; overflow-y: scroll; } &line { display: flex; } .container_left { width: 480 / @px-unit; }}.setting-modal { .video { width: 580px; height: 450px; } .form { width: 250px; height: 450px; }} ._LocalAlarm_ { .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; }} .AddModifyModalView { ._Table_ .ant-table-body { min-height: 220 / @px-unit; }}._MainSubLink_ { .MainSubGroupTable, .IPCTable { ._Table_ .ant-table-body { min-height: 220 / @px-unit; } } }.CameralListModal { ._Table_ .ant-table-body { min-height: 200 / @px-unit; } .ant-modal-body { padding: 0 !important; } ._Table_ { margin-top: 0 !important; } }.MainSubWarning { &.cus_icons:not(.disabled_icons) svg path:first-child, &.cus_icons:not(.disabled_icons):not(.noHover):hover svg path:first-child { fill: red; } &.cus_icons:not(.disabled_icons) svg path:last-child { fill: black; }}._calibrate_ocx { height: 337/@px-unit;}.CalibratePtzZoom { ._PtzZoom_part { width: 70/@px-unit; height: 70/@px-unit; background-color: transparent; border-bottom-color: transparent; border-right-color: transparent; }}.CalibrateTable { ._Table_ .ant-table-body { min-height: 200 / @px-unit; } }.ptz_colorAlarm { width: 20/@px-unit; height: 20/@px-unit;}.ptz_colorAlarm_1 { background-color: @CalibrateSub1 !important;}.ptz_colorAlarm_2 { background-color: @CalibrateSub2 !important;}.ptz_colorAlarm_3 { background-color: @CalibrateSub3 !important;} .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; }} ._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: @tableTextA; } .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;} ._VideoStructrue_ { .ivsParameterSet;} ._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; } }} ._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; } }} ._AlarmSubscription_ { display: flex; .form { width: 40%; .list { display: flex; flex-wrap: wrap; justify-content: space-between; .checkbox { width: 50%; .label-normal-container { width: 100%; .label-normal-behind { width: auto !important; } } } } .audio { width: auto !important; } } .table { width: 50%; } .fileButton{ width: 100/@px-unit; height: 32/@px-unit; text-align: center; line-height: 24/@px-unit; max-width: 150/@px-unit; min-width: 100/@px-unit; padding: 4/@px-unit 4/@px-unit; 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; } } ._IpcExtAlarm_ { &line { display: flex; } .container_left { width: 576 / @px-unit; } } ._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; 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; } } ._ImageAttr_{ .label-normal-behind { .EQ-label-slider-behind { display: flex; } } } .setting-modal { .video { width: 580px; height: 450px; } .form { width: 250px; height: 450px; .label { width: 5.5rem !important; } .wrapped { width: auto !important; padding-top: 5px; } .label-wrapper { transform: translateY(-1px); .labelSlider{ .labelSlider-center{ margin-left: 0; } } } .label-behind { position: absolute; right: 45px; } .label-div-Container { width: 350px; } .area { width: 22px; height: 22px; cursor: pointer; } .selected { border: 3px solid #13161b; } }} ._DisplayOriginalScaleWin_ { height: calc(100vh - 50vh); overflow-y:scroll; .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; } ._AlarmSiren_behind_btn { .label-div-Container { .label-normal-container { padding: 0 !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); }} ._CrowdDistriRuleConfig_ { * { font-family: "arial", "Microsoft YaHei UI", "Microsoft YaHei" !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; } }} ._VehiclesDensity_ { .ant-checkbox-wrapper + .ant-checkbox-wrapper { margin-left: 0; }} .passbyNumColor { color: #e9d760; } ._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; } }} ._VehiclesDistri_ { .ivsParameterSet;} ._CrowdDensity_ { .ant-checkbox-wrapper + .ant-checkbox-wrapper { margin-left: 0; }} ._StereoBehavior_ { .ivsParameterSet; .ant-divider-horizontal { margin: 12 / @px-unit 0; }} ._AllowBlockList_ { padding: 1rem; padding-top: 2rem; ._Table_ .ant-table-body { min-height: 380 / @px-unit; } } ._FaceFlowStat_ { .condition-type { .label-normal-wrapper { width: auto !important; } }} ._FaceConfig_ { padding: 1rem; padding-top: 2rem; .optionChoice { margin-bottom: 30px; } .label-normal { margin-top: 2px; } .buildbutton { margin-top: 20px; width: 100px; } ._Table_ .ant-table-body { min-height: 450 / @px-unit; } }.imexModal { width: 650/@px-unit !important;} ._ObjectMonitor_ { .ivsParameterSet;} ._NumberStat_ { .ivsParameterSet; height: calc(100% - 66px); .fieldsetCtn { overflow-y: auto; } .EventHandler { overflow-y: visible; }} ._FaceIdentify_ { width: 100%; height: calc(100% - 66px); .mainRow { height: 100%; } .form-container { height: 100%; display: flex; flex-direction: column; margin-left: 20px; overflow-y: auto; .channel { display: flex; .enable { width: 10.7143rem; padding-right: 0.57142857rem; } } .button-group{ display: flex; .label-div-Container:last-child { margin-left: 20px; } } .normal-alarm { .add { svg { path { fill: @current; } } } .delete { .svgHover(#f00); } svg { cursor: pointer; } .ant-table-body { min-height: 400 / @px-unit; } } fieldset { flex: 1; .event-handler { overflow-y: auto; height: 370 / @px-unit; } } }} ._FrequencyAnalysis_ { .delete { .svgHover(#f00); } svg { cursor: pointer; }} ._IVSScheme_ { .cap-item-container { display: inline-block; width: 100px; height: 100px; border: 1px solid rgba(166, 170, 178, .5); margin-right: 10px; } .disabled-cap-item-container { border: 1px solid rgba(166, 170, 178, .2); } .cap-item { width: 100px; height: 100px; margin-right: 10px; font-size: 100px !important; cursor: pointer; } .active { svg { path:first-child { fill: @current !important; } path:nth-child(2) { fill: @current !important; } linearGradient { stop:first-child { stop-color: @current !important; } stop:last-child { stop-color: transparent !important; } } } } .disabled { svg { path:first-child { fill: #696969 !important; } path:nth-child(2) { fill: #696969 !important; } linearGradient { stop:first-child { stop-color: @current !important; } stop:last-child { stop-color: transparent !important; } } } } .active.disabled { .active; svg { opacity: 0.5; } } .scene-container { max-height: 595px; overflow-y: scroll; .scene-box { width: '50%'; margin-top: 15px; .scene-title { display: flex; padding: 9px; margin-bottom: 10px; font-size: 14px; font-weight: bolder; color: .color_N(@ai_scene_bg)[]; justify-content: space-between; align-items: center; background-color: @ai_scene_bg !important; span:first-child { cursor: default; user-select: none; } } &:first-child { margin-top: 0; } } } .hide { display: none; }} ._FaceDetection_ { .fd_right { width: 495 / @px-unit; } .channelSelect { padding-top: 0px !important; padding-bottom: 0px !important; }} ._SoundMonitor_ { padding: 1rem; padding-top: 2rem; .search_type { padding-left: 30/@px-unit; } .search_button { float: right; margin-top: -50/@px-unit; } ._Table_ .ant-table-body { min-height: 380 / @px-unit; } } ._VehicleDetect_ { ._VehicleDetect-RuleConfig_ { .aiConfig { .between-divider { margin-top: 0; margin-bottom: 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; } } } .vehicleDetect-eventHandler { border: @pageBorderD solid 1/@px-unit } } }} ._AnomalyDetection_ { .ivsParameterSet; } .AnomalyDetection_crowdModal { ._Table_ .ant-table-body { min-height: 200 / @px-unit; } } ._AudioAnalyse_ { height: calc(100% - 66px); overflow-y: auto;} ._AIMode_ { height: calc(100% - 66px); overflow-y: auto; } .MainPage { width: 100%; ._AcuPickSearch_UploadImageDiv { width: 100%; .ant-divider-horizontal{ margin: 1/@px-unit !important; } ._AcuPickSearch_UploadButtons { width: 100%; margin-top: 15/@px-unit; .label-div-Container { margin-right: 15/@px-unit; display: inline-block; } .mostSelected_tip { color: @errorColor; } .clear_button { float: right; } } .upload_imgDiv{ overflow-x: auto; width: 100%; overflow-x: auto; height: 120/@px-unit; line-height: 120/@px-unit; white-space: nowrap; .upload_imgInnerDiv{ width: 100%; } .face_uploadImg { width: 100/@px-unit; height: 100/@px-unit; border: 2/@px-unit solid @com_facesmallpics_border; margin-left: 8/@px-unit; } } .face_uploadImg_selected { border-color: @current !important; } }} .MainPage { width: 100%; ._FaceReImageSearch_UploadImageDiv { width: 100%; .ant-divider-horizontal{ margin: 1/@px-unit !important; } ._FaceReImageSearch_UploadButtons { width: 100%; margin-top: 15/@px-unit; .label-div-Container { margin-right: 15/@px-unit; display: inline-block; } .mostSelected_tip { color: @errorColor; } .clear_button { float: right; } } .upload_imgDiv{ overflow-x: auto; width: 100%; overflow-x: auto; height: 120/@px-unit; line-height: 120/@px-unit; white-space: nowrap; .upload_imgInnerDiv{ width: 100%; } .face_uploadImg { width: 100/@px-unit; height: 100/@px-unit; border: 2/@px-unit solid @com_facesmallpics_border; margin-left: 8/@px-unit; } } .face_uploadImg_selected { border-color: @current !important; } }} ._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; } .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; .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; top: -4/@px-unit; } } .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: .color_N(@ai_labelCheck_bg)[]; } .label-normal-container { height: 20/@px-unit; padding: 0px !important; color: .color_N(@ai_labelCheck_bg)[]; .label-normal { color: .color_N(@ai_labelCheck_bg)[]; } } .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: @pageTextA; } .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: @pageTextA; 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;} .label-normal-behind { .label-normal-container { padding-top: 0px !important; }}._viewAiResult_ { .pic_PlateNo { clear: left; text-align: center; }} .plateNoClass { padding-left: 0 !important;} .label-normal-behind { .label-normal-container { padding-top: 0px !important; }} ._CheckBoxGroupModal_ { max-height: calc(100vh - 50vh); height: auto; overflow-y:scroll; .check-box-group-container{ width: 100% !important; } .check-box-group-wrapped{ width: 100% !important; } .checkBoxRow{ width: 100%; display: flex; justify-content: space-between; .checkBoxItem-all{ display: flex; align-items: center; } .checkBoxItem{ width: 46%; } .rightItem{ display: flex; justify-content: center; } } .label-normal-behind{ line-height: 28 / @px-unit; } } ._FaceLib_ { margin: 0; top: 0; width: 100vw !important; height: 100% !important; max-width: calc(100vw); .ant-modal-header{ width: 100vw; height: 100vh; overflow-y:auto !important; overflow-x: auto !important; min-width: 1800/@px-unit; } .ant-modal-body{ width: 100%; max-width: 100%; } .ant-modal-content { border: none !important; width: 100vw; height: 100vh; min-width: 1800/@px-unit; position: absolute; top: 0; left: 0; overflow-y:auto !important; overflow-x: auto !important; .ant-modal-footer { position: absolute; bottom: 0/@px-unit; right: 30/@px-unit; } .picContent { width: 100%; display: flex; flex-wrap: nowrap; height: 100%; .picLeftContent { width: 100%; height: 730 / @px-unit; padding-top: 0.5rem; padding-left: 0.5rem; overflow-y: auto; .intel_face_box_passby { width: 355/@px-unit; height: 162/@px-unit; margin-right: 1rem; margin-bottom: 1rem; background-color: @aiPanel_cardBg; position: relative; float: left; cursor: pointer; .PersonPic { display: block; height: 135/@px-unit; width: 120/@px-unit; float: left; } .intel_faceInfo_box_passby{ width: 220/@px-unit; height: 100%; float: left; padding-right: 10/@px-unit; padding-left: 5/@px-unit; &>div { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } } } .picCardItem { width: 280/@px-unit; height: 162/@px-unit; margin-right: 1rem; margin-bottom: 1rem; margin-top: 1px; margin-left: 1px; background-color: @aiPanel_cardBg; position: relative; float: left; cursor: pointer; .PersonPic { display: block; height: 135/@px-unit; width: 45%; float: left; } .InfoContent { width: 55%; height: 100%; float: left; padding-right: 10/@px-unit; padding-left: 5/@px-unit; &>div { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } } } } .picRightContent { width: 480 / @px-unit; height: 700 / @px-unit; overflow-y: auto; .checked_div{ position:relative; width: 150/@px-unit; height: 150/@px-unit; float: left; } .delete_icon{ position: absolute; left:2rem; top: 1rem; } .Thumbnail { display: block; width: 120/@px-unit; height: 135/@px-unit; float: left; background-color: pink; margin: 1rem 2rem; } } } .picContentLoading{ width: 100%; height: 100%; } .active { box-shadow: 0 0 3/@px-unit 2/@px-unit @current; } .buildStatus { width: 100%; position: absolute; bottom: 0; left: 0; height: 25px; line-height: 25px; background-color: @aiPanel_box_bottom-color; } .pageLine { margin-top: 10/@px-unit; display: flex; justify-content: space-between; } .ant-modal-body { padding: 10/@px-unit 24/@px-unit; } }}.modifyConfig { float: right;}.personRegistry { width: 678/@px-unit; min-width: 678/@px-unit; height: 600/@px-unit; min-height: 600/@px-unit; .ant-modal-body { display: flex; width: 100%; height: 450 /@px-unit; } .ant-modal-footer { height: 66 / @px-unit; } .facePath { width: 140/@px-unit; height: 160/@px-unit; margin: 0/@px-unit 20/@px-unit; margin-right: 40/@px-unit; background-size: cover; border: 1px dashed gray; position: relative; .person_edit_image { position: absolute; width: 100%; height: 30/@px-unit; position: absolute; top: 129/@px-unit; opacity:0.5; background-color: @com_faceRegister_edit_bg; } img{ width:100%; height: 100%; } .select_Icon{ height: 100%; width: 100%; line-height: 160/@px-unit; } } .personConfig { width: 440/@px-unit; height: 341/@px-unit; }}.Batchregitry { .batchUpload { width: 100%; height: 152/@px-unit; display: flex; justify-content: space-around; align-items: center; .upload_each, .upload_eachIE { width: 46%; height: 100%; border: 1/@px-unit dashed @files_upload_box_border_color; cursor: pointer; color: @pageTextN; text-align: center; line-height: 152/@px-unit; background-color: @files_upload_box_bg !important; } .upload_each:hover { border: 1/@px-unit dashed @--primary-5; color: @--primary-5; } .selectTip{ margin-top: -135/@px-unit; } } .uploadTips { width: 100%; margin-top: 15/@px-unit; } }.faceLibModal-btns-row { display: flex; align-items: center; .label-div-Container { margin-right: 10px; }}.bottombtnList { display: flex; float: right; .label-div-Container{ float: right; margin-left: 15/@px-unit; }}.dateAddModal { width: 260/@px-unit;}.intel_smallPic_box { width: 140/@px-unit; height: 160/@px-unit; border: 2/@px-unit solid @com_detectsmallPic_bd; margin: 5/@px-unit; float: left; img { width: 100%; height: 100%; }}.intel_smallPic_box_active { border: 2/@px-unit solid @com_detectsmallPic_select_bd;}.checkImgModal { width: 700/@px-unit !important; height: 500/@px-unit; .ant-modal-content { height: 100%; } .ant-modal-body { height: 400/@px-unit; overflow-y:auto; }}.import_Table{ height: 480/@px-unit; width: 800/@px-unit !important;}.copyTable{ height: 300/@px-unit;}.fileListModal{ width: 800/@px-unit !important; height: 700/@px-unit; ._Table_ .ant-table-body { max-height: 380/@px-unit !important; } }.import_Result{ display: flex; flex-direction: row;}.errorCls{ width: 1000/@px-unit; color: @errorColor !important;}.copy_registry_modal { ._Table_ { .ant-table-body { min-height: 250/@px-unit !important; } }} .label-normal-behind { .label-normal-container { padding-top: 0px !important; } } ._OperateMonitorSearch_ { &line { display: flex; } } ._PeopleFlow_ { height: calc(100% - 66px); overflow-y: auto;} ._WorkClothesDetection_ { .ivsParameterSet; } ._OperateMonitor_ { .ivsParameterSet; } ._OperateMonitor_ { .ivsParameterSet; } ._HeatMap_ { ._HeatMap_config{ width: 495 / @px-unit; }} ._QueueDetection_ { .ivsParameterSet; height: calc(100% - 66px); .fieldsetCtn { overflow-y: auto; } .EventHandler { overflow-y: visible; }} .popover_list { display: flex; &_item { cursor: pointer; &:hover { color: @preview_center_popover_ColorA; } &_active { color: @preview_center_popover_ColorA; } } &_separator { margin: 0 5 / @px-unit; color: @preview_center_separator_ColorN; }}.popover_icon { cursor: pointer; &:hover { .svgHover(@current); }} .DefaultImgClass{ width: 100%; height: 100%; object-fit: fill;} ._PreviewIndexView_ { padding-top: inherit; height: 100%; display: flex; &left { width: 240 / @px-unit; background-color: @preview_Left_Bg; height: 100%; display: flex; flex-direction: column; justify-content: space-between; &_fastPreview { height: auto; flex: 0 0 auto; } &_channelList { flex: 1 1 auto; overflow-y: auto; margin-top: 20 / @px-unit; border-top: 1px solid @pageBorderN; border-bottom: 1px solid @pageBorderN; } &_bottomBtn { flex: 0 0 auto; margin-bottom: 40 / @px-unit; } } ¢er { border-left: 1px solid @ocx_Border; border-right: 1px solid @ocx_Border; display: flex; flex-direction: column; justify-content: space-between; flex: 1 1 auto; &_plugin { display: flex; flex: 1 1 auto; flex-flow:inherit; background-color: @preview_center_plugin_Bg; .ocxLocation{ flex-grow:1; } } &_bottom { height: 60 / @px-unit; flex: 0 0 auto; background-color: @preview_center_bottom_Bg; display: flex; justify-content: space-between; padding: 0 10 / @px-unit; &_left { display: flex; align-items: center; } &_right { display: flex; align-items: center; } } } &ai_preview { width: auto; height: 100%; } &right { width: 200 / @px-unit; background-color: @preview_Right_Bg; overflow-y: auto; ._preview_right_header_title { height: 35 / @px-unit; background-color: @preview_right_tabTitle_Bg; color: .color_N(@preview_right_tabTitle_Bg)[]; display: flex; align-items: center; width: 200 / @px-unit; padding-left:4 / @px-unit; } .ptz_set_pd { padding-left: 15 / @px-unit; } .ant-layout-sider-children { display: flex; flex-direction: column; } &_alarmout { ._ChannelGroup_ div:nth-child(2) .chn_btn { margin-left: 0 !important; } .ant-space-item{ padding-left: 2/@px-unit; } } } ._PreviewIndexView_left{ .ant-divider-horizontal{ margin:10 / @px-unit 0 ; } } ._AIPreviewIcon_.isActive { .svgOut(@current); }} ._SmartMotionDetectSearch_behind_btn { .label-div-Container { .label-normal-container { padding: 0 !important; } }}.search_type { padding-left: 30 / @px-unit;}.search_button { float: right; margin-top: -50 / @px-unit;}.SmartMotionDetectSearch_Table { ._Table_ .ant-table-body { min-height: 450 / @px-unit; } > .ant-spin-nested-loading > .ant-spin-container { width: 100%; overflow: hidden; }} .label-date-picker { .ant-picker { width: 100%; } } ._LogManage_ { .Type{ display: flex; float: left; .TimeRange{ display: flex; align-items: center; margin-left: 15 / @px-unit; height: 48 / @px-unit; } .Search{ position:absolute; right: 20 / @px-unit; } } .Clear{ display: flex; float: right; margin-top: 40 / @px-unit; .label-div-Container{ margin-left: 10 / @px-unit; } } .pageLine{ display: flex; float: left; margin-top: 10 / @px-unit; .anticon-left, .ant-pagination-simple-pager, .anticon-right{ color: @pageTextA } .pageTip{ position: absolute; right: 16 / @px-unit; } }}.LogManage_detailModal{ width: 650/@px-unit !important; .loginfo_Table{ height: 291/@px-unit; } .ant-modal-footer{ height: 53 / @px-unit; .LogManage_detailButton{ display: flex; float: right; .label-div-Container{ margin-left: 10 / @px-unit; } } } ._Table_ .ant-table { max-height: 290 / @px-unit; overflow-y: auto; }}.FileBackupEncrypt{ width: 100 / @px-unit;}.TimeFormat{ .ant-picker-header-view{ color: @pageTextA; }} ._PlaybackIndex_ { height: 100%; width: 100%; display: flex; overflow: hidden; &layout { height: 100%; width: 100%; display: flex; } ¢er { background-color: @ocxBg; border-left: 1px solid @ocx_Border; border-right: 1px solid @ocx_Border; display: flex; flex-direction: column; justify-content: space-between; flex: 1 1 auto; &_plugin { flex: 1 1 auto; display: flex; flex-flow: inherit; .ocxLocation { flex-grow: 1; } } &_bottom { height: 192 / @px-unit; flex: 0 0 auto; background-color: @preview_center_bottom_Bg; &_btn { height: 50 / @px-unit; display: flex; align-items: center; } &_timeline { height: 80 / @px-unit; } &_split { height: 12 / @px-unit; } &_select { height: 50 / @px-unit; display: flex; flex-direction: row; justify-content: space-between; .bottom_select_left { width: 148 / @px-unit; height: 50 / @px-unit; line-height: 50 / @px-unit; padding: 0 / @px-unit 16 / @px-unit; } .bottom_select_center { flex-grow: 1; height: 50 / @px-unit; line-height: 50 / @px-unit; display: flex; flex-direction: row; align-items: center; } .bottom_select_right { width: 260 / @px-unit; height: 50 / @px-unit; line-height: 50 / @px-unit; padding: 10 / @px-unit; } } } } &right { width: 308px; background-color: @playback_Right_Bg; .ant-layout-sider-children { display: flex; flex-direction: column; } }} @keyframes arcSlideUpIn { 0% { opacity: 0; } 100% { opacity: 0.8; }}.iconDropBtn { background-color:@navBg; border: none; outline: none; cursor: pointer; display: flex; align-items: center; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; &:hover{ color:@navMenuTextA; } .cus_icons{ margin: 0 5/@px-unit; } span{ font-weight: 700; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }}.iconDropMenu { min-width: 200/@px-unit !important; border: 1px solid @dropMenuBorder; pointer-events:auto !important; .cus_icons{ font-size: 30/@px-unit; vertical-align:middle; margin-right: 15/@px-unit; } .ant-dropdown-menu-item{ padding:5/@px-unit 15/@px-unit; } .iconDropitem_name { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }}.iconDropitem { display: flex; align-items: center;}.centerItem{ justify-content: center;} .cus_icons { .svgFont(); .svgOut(); .svgHover(); &.disabled_icons { .svgDisabled(); } &.active_icons { .svgOut(@current, @iconLinearStartColorA, @iconLinearStopColorA); } .colorSvg(action_red, @errorColor);} ._TopTitleDivider_{ height: 22px; line-height: 22px; margin: 0 0 8px; font-weight: bold; } ._FirstTitleDivider_{ height: 22px; line-height: 22px; margin: 0 0 8px; font-weight: bold; font-size: 18px; } ._MidTitleDivider_ { height: 22px; line-height: 22px; margin: 36px 0 8px; font-weight: bold; } ._HighDivider_{ height: 28px; margin: 0 0; } ._ChannelGroup_ { display: flex; .ant-space{ gap:0 !important; .ant-space-item { .label-normal-wrapper { line-height: 0 !important; } } } .checkbox { display: inline-block; } .label { display: inline-block; height: 40/@px-unit; line-height: 40/@px-unit; } .btn-link{ padding-top: 10/@px-unit; } .chn_btn { color: @buttonNormalTextN; background-color: transparent; width: 35/@px-unit; height: 25/@px-unit; padding: 0; margin: 5/@px-unit; text-align: center; &.selected { color: @buttonNormalTextA; border-color: @formInputBgA; &:focus { color: @buttonNormalTextA; border-color: @formInputBgA; } } &.allbtn { width: 40/@px-unit !important; font-size: 10/@px-unit; } &[disabled] { opacity: .5; background-color: @buttonNormalBgN !important; color: @buttonNormalTextN !important; border: 1px solid @buttonNormalBorderN !important; &:hover, &:active, &.active{ opacity: .5; } } }} .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); }} .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-homeBack{ cursor: pointer; &:hover{ .svgHover(@homeTaskIconColorA); }} .header-Timer { text-overflow: ellipsis; white-space: nowrap; overflow: hidden;} .home_settingBtn{ .cus_icons{ .svgHover(@homeTaskIconColorA); margin: 0 15/@px-unit !important; }}.home_settingBtn:hover{ .cus_icons{ .svgOut(@homeTaskIconColorA); }} ._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: @tabBgN; color: @tabTextN; border: 1px solid @tabBorder; margin: 0; &.ant-tabs-tab-active { background: @tabBgA; color: @tabTextA; } } .ant-tabs-ink-bar { visibility: hidden; } } } } } } .m-side-container { 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; .fixed-button { bottom: 5/ @px-unit; } } } .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; }} .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; & > div { display: flex; 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{ flex: 1; 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; }} .userDropMenu{ &.iconDropMenu{ min-width: 130/@px-unit !important; }} .cursor { cursor: pointer; &:hover { color: @navMenuTextA; }} ._MarkPlugin_ { width: 460/@px-unit; padding: 5/@px-unit; padding-top: inherit; &ocx { width: 450/@px-unit; height: 337/@px-unit; } &button, ÷r { width: 450/@px-unit; } &filter { div { display: inline-block; } } button { width: 100/@px-unit; } .left { float: left; } .right { float: right; } .ant-radio-wrapper { display: block; } .ant-radio-wrapper { margin-right: 0/@px-unit; } .ant-radio, span.ant-radio + * { vertical-align: top; }} ._BottomPanel_ { display: flex; flex-direction: column; background-color: @preview_center_bottom_Bg; ._BottomPanel_bottom_btn { height: 50px; display: flex; align-items: center; overflow: hidden; } ._BottomPanel_bottom_timeline { height: 92px; } ._BottomPanel_bottom_select { .ant-checkbox-disabled + span { color: .color_D(@preview_center_bottom_Bg) []; } } } ._PbRightPanel_ { display: flex; flex-direction: column; align-items: center; position: relative; height: 100%; &bottom { width: 100%; height: 60 / @px-unit; padding: 0 10px 4px 10px; margin-top: auto; display: flex; justify-content: space-between; align-items: center; background-color: @playback_Right_Bg; } &bottom_x { width: 100%; height: 60 / @px-unit; padding: 0 10px 4px 10px; margin-top: auto; display: flex; justify-content: flex-end; align-items: center; background-color: @preview_Right_Bg; } &bottom_item { width: 66 / @px-unit; height: 40 / @px-unit; text-align: center; border: 1 / @px-unit solid @buttonNormalBorderN; display: flex; align-items: center; justify-content: center; } &bottom_icon { font-size: 30 / @px-unit !important; } .label-normal-wrapper { width: 290px !important; } ._PbRightPanel_bottom_itemLeft{ width: 100%; height: 40 / @px-unit; text-align: center; display: flex; align-items: center; justify-content: center; .label-normal-wrapper { width: 50px !important; } } ._PbRightPanel_chl_divider { margin: 5 / @px-unit 0; } ._PbRightPanel_chl_table { flex: 1; overflow: hidden; min-height: 150 / @px-unit; width: 290px; margin-top: 14 / @px-unit; .ant-table-body { min-height: auto !important; max-height: none !important; -ms-max-height:none !important; tbody { .ant-table-row { &.ant-table-row-selected { td { background: transparent; } } .ant-table-cell-ellipsis { text-align: left !important; &.ant-table-column-sort { background: transparent; } } } } } .ant-checkbox-indeterminate .ant-checkbox-inner { border: 1px solid @pageBorderN; } ._Table_ { height: 100%; .ant-table { & > .ant-table-container { display: flex; height: 100%; flex-direction: column; .ant-table-header{ overflow: visible !important; height:auto; } tr { td { height: 40px; } } th { height: 40px !important; } } ::-webkit-scrollbar { width: 0px; } } .ant-table-fixed-header{ height: 95%; } .m-table-showEmpty { height: 100%; .ant-table-wrapper { height: 100%; .ant-spin-nested-loading { height: 100%; .ant-spin-container { height: 100%; } } } } } } ._Table_ div:first-child{ height: 100%; } .ant-table-thead div:first-child{ height: auto ; } ._PbRightPanel_fish_eye { width: 290px !important; } .right_orgin_hide { display: none; } .right_orgin_flex { display: flex; flex-direction: column; height: 100%; } .calender_box { display: flex; flex-direction: column; align-items: center; } .chl_table { height: 350 / @px-unit; } .playback_channel_show { display: flex; justify-content: center; align-items: center; } .playback_channel_none { display: none; } ._PbRightPanel_rightpanel_show { display: flex; flex-direction: column; align-items: center; padding: 0px 8px; height: 100%; } ._PbRightPanel_rightpanel_hide { display: none; } .mask_datum { position: relative; width: 100%; } .mask_panel { position: absolute; top: 0; left: 0; height: 90%; width: 100%; z-index: 10; } .mask_panel_show { display: block; } .mask_panel_hide { display: none; }} .CompliantInfoModal { .ant-checkbox-wrapper + .ant-checkbox-wrapper { margin-left: 0px !important } .ant-checkbox-wrapper { width: 120 / @px-unit; }} ._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; }} ._IntelliRuleBtn_ivs-color { svg path:first-child { fill: @current !important; } } ._IntelligentTrack_ { display: flex;} ._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; }} ._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: @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-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: @pageTextA; } } .ant-menu-item:hover { color: @pageTextN; } } } &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; } } }} ._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; }}