| | |
| | | |
| | | /* Home页面 */ |
| | | .home { |
| | | height: 100vh; |
| | | position: relative; |
| | | height: 100vh; |
| | | position: relative; |
| | | } |
| | | |
| | | .el-container { |
| | | height: 100%; |
| | | height: 100%; |
| | | } |
| | | |
| | | .el-header { |
| | | padding: 0; |
| | | height: 60px !important; |
| | | padding: 0; |
| | | height: 60px !important; |
| | | } |
| | | |
| | | .el-main { |
| | | margin: 0px; |
| | | padding: 0px !important; |
| | | background: #3B4D6E; |
| | | margin: 0px; |
| | | padding: 0px !important; |
| | | background: #3B4D6E; |
| | | } |
| | | |
| | | /* 导航栏页面 */ |
| | | .NavBox { |
| | | width: 100%; |
| | | height: 100%; |
| | | background-image: url("../../assets/img/menu/navbg.jpg"); |
| | | background-repeat: no-repeat; |
| | | background-size: 100% 100%; |
| | | /*background-image: linear-gradient(rgb(34, 33, 33), rgb(27, 31, 78));*/ |
| | | width: 100%; |
| | | height: 100%; |
| | | background-image: url("../../assets/img/menu/navbg.png"); |
| | | background-repeat: no-repeat; |
| | | background-size: 100% 100%; |
| | | /*background-image: linear-gradient(rgb(34, 33, 33), rgb(27, 31, 78));*/ |
| | | } |
| | | |
| | | .topBox { |
| | | width: 100%; |
| | | height: 100%; |
| | | display: flex; |
| | | justify-content: space-around; |
| | | align-items: center; |
| | | width: 100%; |
| | | height: 100%; |
| | | display: flex; |
| | | justify-content: space-around; |
| | | align-items: center; |
| | | } |
| | | |
| | | .topTitle { |
| | | /* width: 415px; |
| | | /* width: 415px; |
| | | height: 70px; |
| | | background: url("../img/LOGO.png") no-repeat center; */ |
| | | width: 18%; |
| | | height: 50px; |
| | | background: url("../img/menu/navtitle.png") no-repeat center center; |
| | | background-size: 100% 100%; |
| | | width: 18%; |
| | | height: 50px; |
| | | /* background: url("../img/menu/navtitle.png") no-repeat center center; */ |
| | | background-size: 100% 100%; |
| | | } |
| | | |
| | | .topMenu { |
| | | width: auto; |
| | | flex: 1; |
| | | height: 60px; |
| | | margin-left: 3%; |
| | | width: auto; |
| | | flex: 1; |
| | | height: 60px; |
| | | margin-left: 3%; |
| | | |
| | | } |
| | | |
| | | .menuContent { |
| | | width: 100%; |
| | | height: 100%; |
| | | display: flex; |
| | | align-items: center; |
| | | /* justify-content: center; */ |
| | | width: 100%; |
| | | height: 100%; |
| | | display: flex; |
| | | align-items: center; |
| | | /* justify-content: center; */ |
| | | } |
| | | |
| | | .topUser { |
| | | |
| | | color: white; |
| | | width: 9%; |
| | | height: 100%; |
| | | display: flex; |
| | | align-items: center; |
| | | padding-left: 10px; |
| | | color: white; |
| | | width: 9%; |
| | | height: 100%; |
| | | display: flex; |
| | | align-items: center; |
| | | padding-left: 10px; |
| | | } |
| | | |
| | | .contentDiv { |
| | | margin-left: 1%; |
| | | margin-left: 1%; |
| | | } |
| | | |
| | | .ImgMenu { |
| | | /*width: 100%;*/ |
| | | width: 40px; |
| | | height: auto; |
| | | display: flex; |
| | | justify-content: center; |
| | | /*width: 100%;*/ |
| | | width: 40px; |
| | | height: auto; |
| | | display: flex; |
| | | justify-content: center; |
| | | } |
| | | |
| | | .menuImage { |
| | | width: 40px; |
| | | height: 40px; |
| | | width: 40px; |
| | | height: 40px; |
| | | } |
| | | |
| | | .menulabel { |
| | | font-size: 15px; |
| | | font-family: Source Han Sans CN; |
| | | text-align: left; |
| | | padding: 0 10px; |
| | | /*width: 100px;*/ |
| | | /*width: 120px;*/ |
| | | color: #fff |
| | | font-size: 15px; |
| | | font-family: Source Han Sans CN; |
| | | text-align: left; |
| | | padding: 0 10px; |
| | | /*width: 100px;*/ |
| | | /*width: 120px;*/ |
| | | color: #fff |
| | | } |
| | | |
| | | .changeStyle { |
| | | color: #fec801; |
| | | color: #fec801; |
| | | } |
| | | |
| | | .m1 { |
| | | background: url("../img/menu/menu11.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | background: url("../img/menu/menu11.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | } |
| | | |
| | | .m2 { |
| | | background: url("../img/menu/menu21.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | background: url("../img/menu/menu21.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | } |
| | | |
| | | .m3 { |
| | | background: url("../img/menu/menu31.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | background: url("../img/menu/menu31.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | } |
| | | |
| | | .m4 { |
| | | background: url("../img/menu/menu41.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | background: url("../img/menu/menu41.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | } |
| | | |
| | | .m5 { |
| | | background: url("../img/menu/menu51.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | background: url("../img/menu/menu51.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | } |
| | | |
| | | .m6 { |
| | | background: url("../img/menu/menu61.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | background: url("../img/menu/menu61.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | } |
| | | |
| | | .m7 { |
| | | background: url("../img/menu/qwyzt.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | background: url("../img/menu/qwyzt.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | } |
| | | |
| | | .m11 { |
| | | background: url("../img/menu/menu12.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | background: url("../img/menu/menu12.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | } |
| | | |
| | | .m21 { |
| | | background: url("../img/menu/menu22.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | background: url("../img/menu/menu22.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | } |
| | | |
| | | .m31 { |
| | | background: url("../img/menu/menu32.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | background: url("../img/menu/menu32.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | } |
| | | |
| | | .m41 { |
| | | background: url("../img/menu/menu42.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | background: url("../img/menu/menu42.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | } |
| | | |
| | | .m51 { |
| | | background: url("../img/menu/menu52.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | background: url("../img/menu/menu52.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | } |
| | | |
| | | .m61 { |
| | | background: url("../img/menu/menu62.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | background: url("../img/menu/menu62.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | } |
| | | |
| | | .m71 { |
| | | background: url("../img/menu/qwyzt-h.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | background: url("../img/menu/qwyzt-h.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | } |
| | | |
| | | |
| | | |
| | | .userName { |
| | | margin: 0px 10px 0 5px; |
| | | /*margin-right: 10px;*/ |
| | | display: flex; |
| | | justify-content: space-between; |
| | | height: 30px; |
| | | align-items: center; |
| | | margin: 0px 10px 0 5px; |
| | | /*margin-right: 10px;*/ |
| | | display: flex; |
| | | justify-content: space-between; |
| | | height: 30px; |
| | | align-items: center; |
| | | } |
| | | |
| | | .userLanguage { |
| | | /*margin: 0px 10px;*/ |
| | | /*margin-top: 10px;*/ |
| | | display: flex; |
| | | height: 30px; |
| | | align-items: center; |
| | | /*margin: 0px 10px;*/ |
| | | /*margin-top: 10px;*/ |
| | | display: flex; |
| | | height: 30px; |
| | | align-items: center; |
| | | } |
| | | |
| | | .userImage { |
| | | width: 20px; |
| | | height: 20px; |
| | | float: left; |
| | | margin-right: 10px; |
| | | width: 20px; |
| | | height: 20px; |
| | | float: left; |
| | | margin-right: 10px; |
| | | } |
| | | |
| | | .user1 { |
| | | /*background: url("../img/user.png") no-repeat;*/ |
| | | background: url("../img/menu/user.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | /*background: url("../img/user.png") no-repeat;*/ |
| | | background: url("../img/menu/user.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | } |
| | | |
| | | .user2 { |
| | | /*background: url("../img/EN.png") no-repeat;*/ |
| | | background: url("../img/menu/en.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | cursor: pointer; |
| | | /*background: url("../img/EN.png") no-repeat;*/ |
| | | background: url("../img/menu/en.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | cursor: pointer; |
| | | } |
| | | |
| | | .theme { |
| | | background: url("../img/menu/theme.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | cursor: pointer; |
| | | background: url("../img/menu/theme.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | cursor: pointer; |
| | | } |
| | | |
| | | .userText { |
| | | font-size: 10px; |
| | | line-height: 15px; |
| | | font-family: Microsoft YaHei; |
| | | font-weight: 400; |
| | | font-size: 10px; |
| | | line-height: 15px; |
| | | font-family: Microsoft YaHei; |
| | | font-weight: 400; |
| | | |
| | | text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.35); |
| | | text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.35); |
| | | } |
| | | |
| | | .TextLanguage { |
| | | font-size: 10px; |
| | | line-height: 15px; |
| | | font-family: Microsoft YaHei; |
| | | font-weight: 400; |
| | | font-size: 10px; |
| | | line-height: 15px; |
| | | font-family: Microsoft YaHei; |
| | | font-weight: 400; |
| | | |
| | | text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.35); |
| | | text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.35); |
| | | } |
| | | |
| | | .elLink { |
| | | margin-left: 5px; |
| | | font-size: 10px; |
| | | margin-bottom: 4px; |
| | | color: white; |
| | | margin-left: 5px; |
| | | font-size: 10px; |
| | | margin-bottom: 4px; |
| | | color: white; |
| | | } |
| | | |
| | | |
| | | |
| | | .topUser .el-link--default:hover { |
| | | color: #409eff !important; |
| | | color: #409eff !important; |
| | | } |
| | | |
| | | .topUser .el-link--default { |
| | | color: white !important; |
| | | color: white !important; |
| | | } |
| | | |
| | | .el-menu { |
| | | border: transparent; |
| | | border: transparent; |
| | | } |
| | | |
| | | .secondMenuDiv { |
| | | position: absolute; |
| | | z-index: 1024; |
| | | margin-top: 15px; |
| | | background: rgba(244, 248, 255, 1); |
| | | box-shadow: 0px 0px 6px 2px rgba(244, 248, 255, 0.85); |
| | | border-radius: 5px; |
| | | border: 1px solid #DCDFE6; |
| | | position: absolute; |
| | | z-index: 1024; |
| | | margin-top: 15px; |
| | | background: rgba(244, 248, 255, 1); |
| | | box-shadow: 0px 0px 6px 2px rgba(244, 248, 255, 0.85); |
| | | border-radius: 5px; |
| | | border: 1px solid #DCDFE6; |
| | | } |
| | | |
| | | .secondMenuDiv div { |
| | | line-height: 30px; |
| | | padding: 10px; |
| | | font-size: 12px; |
| | | font-family: Microsoft YaHei; |
| | | font-weight: 400; |
| | | text-align: center; |
| | | line-height: 20px; |
| | | min-width: 100px; |
| | | line-height: 30px; |
| | | padding: 10px; |
| | | font-size: 12px; |
| | | font-family: Microsoft YaHei; |
| | | font-weight: 400; |
| | | text-align: center; |
| | | line-height: 20px; |
| | | min-width: 100px; |
| | | } |
| | | |
| | | .secondMenuDiv .changeLiStyle { |
| | | color: #409eff; |
| | | box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1); |
| | | border: 1px solid #409eff; |
| | | /* background: #182E45 */ |
| | | /* |
| | | color: #409eff; |
| | | box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1); |
| | | border: 1px solid #409eff; |
| | | /* background: #182E45 */ |
| | | /* |
| | | */ |
| | | |
| | | } |
| | | |
| | | .distance-legend { |
| | | bottom: 55px !important; |
| | | bottom: 55px !important; |
| | | } |
| | | |
| | | .ol-scale-line { |
| | | bottom: 70px !important; |
| | | right: 110px |
| | | bottom: 70px !important; |
| | | right: 110px |
| | | } |
| | | |
| | | .ol-scale-line { |
| | | display: block !important; |
| | | display: block !important; |
| | | } |
| | | |
| | | /*.mapTerrain {*/ |