From 34a0220d8f02151846783ba22fbca06e376edbf5 Mon Sep 17 00:00:00 2001 From: chenyabin <Chenab123!> Date: 星期一, 19 四月 2021 18:02:35 +0800 Subject: [PATCH] 完成附属设施功能。 --- src/assets/css/map/map-panel-style.less | 464 ++++++++++++++++++++++++++++++++++++++++++++++++++------- 1 files changed, 401 insertions(+), 63 deletions(-) diff --git a/src/assets/css/map/map-panel-style.less b/src/assets/css/map/map-panel-style.less index 247200e..751ab6a 100644 --- a/src/assets/css/map/map-panel-style.less +++ b/src/assets/css/map/map-panel-style.less @@ -1,14 +1,50 @@ @import "_map-variable"; -/*鍏ㄥ眬璁剧疆***********/ -h1,h2,h3,h4,h5,h6,ul,li,p{ - padding: 0; - margin: 0; - list-style: none; +.leaflet-container, +html, body { + // font-family: 'Microsoft YaHei'; + font: 12px/1.5 "Microsoft YaHei", Arial, Helvetica, sans-serif; } +/*鍏ㄥ眬璁剧疆***********/ +h1, h2, h3, h4, h5, h6, ul, li, p,i ,span,div{ + padding: 0; + margin: 0; + list-style: none; + -moz-user-select:none; /*鐏嫄*/ + -webkit-user-select:none; /*webkit娴忚鍣�*/ + -ms-user-select:none; /*IE10*/ + -khtml-user-select:none; /*鏃╂湡娴忚鍣�*/ + user-select:none; +} +.rt{ + float:right; +} +.lt{ + float:left; +} +.el-button--mini, .el-button--mini.is-round{ + padding: 0.02rem 0.04rem; +} +/*闅愯棌*/ +.el-dialog__wrapper{ + height: 0; +} +.el-dialog{ + margin: 0 !important; + position: fixed; + z-index: 2000; +// left: 50%; + //bottom:15px; + .el-dialog__header{ + border-bottom: 1px solid @background-color-split; + } +} +i { + font-style: normal +} .el-button--primary { color: @color; @@ -55,6 +91,7 @@ .select-down { border: none !important; background-color: @background-color; + margin: 0; //.el-scrollbar{ // @@ -107,6 +144,7 @@ thead.is-group th { background: transparent; + padding: 0 } .el-table__expanded-cell { @@ -201,83 +239,239 @@ display: none !important; } -.el-tabs--card>.el-tabs__header .el-tabs__nav{ +.el-tabs--card > .el-tabs__header .el-tabs__nav { border: none; } -.el-tabs--card>.el-tabs__header .el-tabs__item{ +.el-tabs--card > .el-tabs__header .el-tabs__item { border: none; margin-left: 10px; } -.el-scrollbar__wrap{ - -} -.el-scrollbar__wrap::-webkit-scrollbar { - /*婊氬姩鏉℃暣浣撴牱寮�*/ - width : 5px; /*楂樺鍒嗗埆瀵瑰簲妯珫婊氬姩鏉$殑灏哄*/ - height: 1px; -} -.el-scrollbar__wrap::-webkit-scrollbar-thumb { - /*婊氬姩鏉¢噷闈㈠皬鏂瑰潡*/ - border-radius : 10px; - background: none; -} -.el-scrollbar__wrap::-webkit-scrollbar-track { - /*婊氬姩鏉¢噷闈㈣建閬�*/ - box-shadow : inset 0 0 5px rgba(0, 0, 0, 0.2); - background : none; - border-radius: 10px; -} -#el-scrollbar__wrap::-webkit-scrollbar-button { /*婊氬姩鏉′袱绔殑鎸夐挳锛屽彲浠ョ敤display:none璁╁叾涓嶆樉绀猴紝涔熷彲浠ユ坊鍔犺儗鏅浘鐗囷紝棰滆壊鏀瑰彉鏄剧ず鏁堟灉锛堜綅缃�2锛�*/ - background: #74D334; -} /*******************鎿嶄綔鎸夐挳鐐瑰嚮閫変腑鏁翠綋鏍峰紡******************************/ -.el-button{ +.el-button { } -.active-button{ + +.hover-bottom:hover, +.hover-bottom.hover{ + box-shadow: 0 0 0.03rem #fff700 inset !important; + color: #fff700 !important; + cursor: pointer; +} +.active-button { border: 0.00521rem solid #fff700 !important; box-shadow: 0 0 0.03rem #fff700 !important; - color:#fff700 !important; + color: #fff700 !important; } /***************Company 鍥惧眰 鎮诞妗嗘牱寮忋��*********************************/ -.company-bindTooltip{ - background:none; - border:none; - color:red; - font-size: 16px; - font-weight: 900 !important; - text-shadow: 0 0 5px #fff; - box-shadow: none; -} -.company-bindTooltip-hover h3{ - text-align: center; - border-bottom:1px solid #0B3B6D; - margin: 0; - padding:0; -} -.company-bindTooltip-hover ul{ - list-style: none; - margin: 0; - padding:0; - width: 260px; +.company-bindTooltip { + position: absolute; + top: 0; + left: 0; display: flex; - flex-wrap: wrap; -} -.company-bindTooltip-hover ul li{ - margin: 0; - padding:3px 0; - width: 50%; + justify-content: center; + justify-items: center; + + img { + display: block; + width: 30px; + height: 30px; + margin-left: -15px; + margin-top: -15px + } + + ul { + width: 120px; + margin-left: -60px; + text-align: center; + display: flex; + position: absolute; + top: 20px; + left: 0; + + li { + position: absolute; + top: 0; + left: 0; + width: 100%; + font-weight: 900; + text-shadow: 0 0 4px #fff; + color: red; + font-size: 16px; + height: 20px; + line-height: 18px; + overflow: visible; + } + } } +/*.company-bindTooltip { + //background: @background-color-split; + background: none; + border: none; + color: red; + //font-size: 16px; + box-shadow: none; + text-shadow: 0 0 5px #fff; + filter:Dropshadow(offx=1,offy=0,color=white) + Dropshadow(offx=0,offy=1,color=white) + Dropshadow(offx=0,offy=-1,color=white) + Dropshadow(offx=-1,offy=0,color=white); + box-shadow: none; + -webkit-text-stroke: 0.1px #fff; + font: 16px "Microsoft YaHei", Arial, Helvetica, sans-serif; + ul{ + position: relative; + li:not(:first-child){ + position: absolute; + top:0; + left:0; + width: 100%; + font-weight: 900; + } + li{ + text-shadow: 0 0 4px #fff; + } + } +}*/ +.company-bindTooltip:before { + display: none; +} + +.company-bindTooltip-hover h3 { + text-align: center; + border-bottom: 1px solid #0B3B6D; + margin: 0; + padding: 0; +} + +.company-bindTooltip-hover ul { + list-style: none; + margin: 0; + padding: 0; + //width: 260px; + //display: flex; + flex-wrap: wrap; +} + +.company-bindTooltip-hover ul li { + margin: 0; + padding: 3px 0; + //width: 50%; +} + +/*************** PublicTable 琛ㄦ牸鏍峰紡銆�*********************************/ + +.el-table { + .cell { + padding: 0 3px !important; + i { + display: block; + font-style: normal; + font-size: 10px; + line-height: 12px; + } + } +} +.el-table--border{ + border-bottom: 1px solid #ddd; +} + +.el-dialog--center .el-dialog__body{ + padding: 0.04rem; +} + +.el-table--border th { + border-right: none; + border-left: 1px solid #ddd; +} + +.el-table--border th.gutter { + border-left: none +} + +.el-table .cell, .el-table--border td:first-child .cell, .el-table--border th:first-child .cell { + + text-align: center; +} + +.el-table th > .cell { + color: #00fff6; +} + +.el-table__row > td { + border: none; +} + +.el-table::before { //鍘绘帀鏈�涓嬮潰鐨勯偅涓�鏉$嚎 + height: 0; +} + +.el-table td, .el-table th.is-leaf { + font-size: 0.08rem; +} + +.el-table .warning-row { + background: #28304d; +} + +.el-table .success-row { + background: #30455f; +} + +.el-table tbody tr:hover > td { + background-color: #28304d !important; +} + +//淇敼琛ㄦ牸楂樺害 +.el-table td { + padding: 0 !important; + font-size: 0.01rem !important; +} +.el-scrollbar__wrap { + +} +/*****婊氬姩鏉�***/ +.scroll::-webkit-scrollbar, +.el-table__body-wrapper::-webkit-scrollbar, +.el-scrollbar__wrap::-webkit-scrollbar { + /*婊氬姩鏉℃暣浣撴牱寮�*/ + width: 10px; /*楂樺鍒嗗埆瀵瑰簲妯珫婊氬姩鏉$殑灏哄*/ + height: 10px; +} + +.scroll::-webkit-scrollbar-thumb, +.el-table__body-wrapper::-webkit-scrollbar-thumb, +.el-scrollbar__wrap::-webkit-scrollbar-thumb { + /*婊氬姩鏉¢噷闈㈠皬鏂瑰潡*/ + border-radius: 10px; + background: #000; +} +.scroll::-webkit-scrollbar-track, +.el-table__body-wrapper::-webkit-scrollbar-track, +.el-scrollbar__wrap::-webkit-scrollbar-track { + /*婊氬姩鏉¢噷闈㈣建閬�*/ + box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); + background: @background-color; + border-radius: 10px; +} + + + + +/*********瑙e喅妯悜婊氬姩**/ + + + /***********************************************鍔ㄧ敾鏁堟灉************/ -.transition{ +.transition { transition: all .5s; - /* transform-origin: top left;*/ + /* transform-origin: top left;*/ animation: bounce-in .2s; } + @keyframes bounce-in { 0% { transform: scale(0); @@ -288,9 +482,10 @@ opacity: 1; } } + /**map 椤甸潰鍥炬爣鎸夐挳*/ .iconBtn { - width:0.26rem; + width: 0.26rem; height: 0.26rem; text-align: center; background: rgba(0, 16, 30, 0.5); @@ -303,9 +498,152 @@ justify-content: center; justify-items: center; border-radius: 0.03rem; - .icon{ + + .icon { width: 20px; margin: 0 auto; + font-size: 20px; } -} \ No newline at end of file +} + +.panel-title { + color: @color-title; + font-size: 18px; + padding: 10px; + text-align: center; + border-bottom: 1px solid @background-color-split; +} + +.el-tabs__header .is-top { + +} + +.el-picker-panel { + background: @background-color; + border-color: @color; + color: @color; + + .el-picker-panel__body-wrapper { + background: @background-color; + } + + .el-input__inner { + background: @background-color; + border-color: @color; + } + + .el-date-table td.today span { + color: @color-highlight; + } + + .el-picker-panel__footer { + background: @background-color; + border-top-color: @color; + } + + .el-date-table th { + border-bottom-color: @color; + } + + .el-button { + background: @background-color; + color: @color; + border-color: @color; + } + + .el-button--text { + padding: 7px 15px; + } + + .el-button:hover { + background: @background-color; + color: @color-highlight; + border-color: @color-highlight; + } + + .el-input__inner { + color: #fff; + text-align: center; + } + + .el-date-picker__time-header { + border-bottom-color: @background-color-split; + } + + .el-date-picker__header-label { + color: #fff + } +} + +.el-select-dropdown { + background: @background-color; + border-color: @color; + color: @color; + + .el-select-dropdown__item { + color: #fff; + } + + .el-select-dropdown__item.hover { + background: @background-color; + box-shadow: 0 0 5px @color-highlight inset; + } + + .el-select-dropdown__item.selected { + color: @color-highlight; + } +} + +/***********************************************鍙充晶绠$嚎鐩稿叧************/ +.el-tabs__header { + background: none; +} + +.el-tabs--top .el-tabs__item.is-top:nth-child(2) { + padding-left: 20px; +} + +.el-tabs--border-card { + background: none; + border: none; + box-shadow: none; +} + +.el-tabs--border-card > .el-tabs__header { + background: none; + border-bottom: none; + margin: 0; +} + +.el-tabs--border-card > .el-tabs__header .el-tabs__item.is-active { + color: #409EFF; + background: none; + border: none; +} + +.el-tabs--border-card > .el-tabs__header .el-tabs__item { + border: none; +} + +.panel-right ::-webkit-scrollbar-thumb { + background: none; + border: none; +} + +.el-card { + margin-top: 15px; + background: rgba(0, 16, 30, 0.5); + border: 0.00521rem solid @color; + box-shadow: 0 0 0.03rem @color; +} + +.clearfix { + display: inline-block; + color: #ffffff; + margin: 15px 0; +} + +.fixed-table { + background: rgba(0, 16, 30, 1) !important; +} -- Gitblit v1.8.0