|
@@ -9,8 +9,8 @@
|
|
|
<div class="line"></div>
|
|
|
</div>
|
|
|
<el-popover placement="left"
|
|
|
- trigger="click"
|
|
|
- popper-class="popver">
|
|
|
+ trigger="hover"
|
|
|
+ popper-class="Mopopver">
|
|
|
<div>
|
|
|
<p class="hoverTitle">咨询电话:</p>
|
|
|
<p class="hoverMsg">400-8851569</p>
|
|
@@ -24,7 +24,8 @@
|
|
|
</div>
|
|
|
</el-popover>
|
|
|
<el-popover placement="left"
|
|
|
- trigger="hover">
|
|
|
+ trigger="hover"
|
|
|
+ popper-class="Mopopver">
|
|
|
<div>
|
|
|
<div class="code-item">
|
|
|
<img src="../assets/images/download.png"
|
|
@@ -43,7 +44,8 @@
|
|
|
</div>
|
|
|
</el-popover>
|
|
|
<el-popover placement="left"
|
|
|
- trigger="hover">
|
|
|
+ trigger="hover"
|
|
|
+ popper-class="Mopopver">
|
|
|
<div>
|
|
|
<div class="code-item">
|
|
|
<img src="../assets/images/public-code.jpg"
|
|
@@ -194,36 +196,36 @@ export default {
|
|
|
height: 268px;
|
|
|
|
|
|
border: 1px solid #ececec;
|
|
|
- /deep/.el-popover {
|
|
|
- .silderItem {
|
|
|
- cursor: pointer;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- padding: 11px 0 0;
|
|
|
- font-size: 12px;
|
|
|
- overflow: hidden;
|
|
|
+
|
|
|
+ .silderItem {
|
|
|
+ cursor: pointer;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ padding: 11px 0 0;
|
|
|
+ font-size: 12px;
|
|
|
+ overflow: hidden;
|
|
|
+ p {
|
|
|
+ margin-top: 8px;
|
|
|
+ color: #666666;
|
|
|
+ }
|
|
|
+ .line {
|
|
|
+ margin-top: 10px;
|
|
|
+ width: 48px;
|
|
|
+ height: 1px;
|
|
|
+ background-color: #ececec;
|
|
|
+ }
|
|
|
+ &:hover {
|
|
|
p {
|
|
|
- margin-top: 8px;
|
|
|
- color: #666666;
|
|
|
- }
|
|
|
- .line {
|
|
|
- margin-top: 10px;
|
|
|
- width: 48px;
|
|
|
- height: 1px;
|
|
|
- background-color: #ececec;
|
|
|
+ color: #2dc7aa;
|
|
|
}
|
|
|
- &:hover {
|
|
|
- p {
|
|
|
- color: #2dc7aa;
|
|
|
- }
|
|
|
- img {
|
|
|
- filter: drop-shadow(#2dc7aa 80px 0);
|
|
|
- transform: translateX(-80px);
|
|
|
- }
|
|
|
+ img {
|
|
|
+ filter: drop-shadow(#2dc7aa 80px 0);
|
|
|
+ transform: translateX(-80px);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
.silderItem {
|
|
|
cursor: pointer;
|
|
|
display: flex;
|
|
@@ -253,26 +255,7 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- /deep/.code-item {
|
|
|
- width: 100%;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- }
|
|
|
- .hoverTitle {
|
|
|
- font-size: 12px;
|
|
|
|
|
|
- font-weight: 400;
|
|
|
- color: #999999;
|
|
|
- line-height: 17px;
|
|
|
- }
|
|
|
- /deep/.hoverMsg {
|
|
|
- padding-top: 10px;
|
|
|
- font-size: 16px;
|
|
|
- color: #1a1a1a;
|
|
|
- line-height: 22px;
|
|
|
- font-weight: 700;
|
|
|
- }
|
|
|
.goTop {
|
|
|
cursor: pointer;
|
|
|
margin-top: 20px;
|
|
@@ -310,4 +293,53 @@ export default {
|
|
|
.submsg {
|
|
|
color: #999;
|
|
|
}
|
|
|
+.Mopopver {
|
|
|
+ /deep/.code-item {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ .hoverTitle {
|
|
|
+ font-size: 12px;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #999999;
|
|
|
+ line-height: 17px;
|
|
|
+ }
|
|
|
+ /deep/.hoverMsg {
|
|
|
+ padding-top: 5px;
|
|
|
+ font-size: 16px;
|
|
|
+ color: #1a1a1a;
|
|
|
+ line-height: 22px;
|
|
|
+ font-weight: 700;
|
|
|
+ }
|
|
|
+ .silderItem {
|
|
|
+ cursor: pointer;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ padding: 11px 0 0;
|
|
|
+ font-size: 12px;
|
|
|
+ overflow: hidden;
|
|
|
+ p {
|
|
|
+ margin-top: 8px;
|
|
|
+ color: #666666;
|
|
|
+ }
|
|
|
+ .line {
|
|
|
+ margin-top: 10px;
|
|
|
+ width: 48px;
|
|
|
+ height: 1px;
|
|
|
+ background-color: #ececec;
|
|
|
+ }
|
|
|
+ &:hover {
|
|
|
+ p {
|
|
|
+ color: #2dc7aa;
|
|
|
+ }
|
|
|
+ img {
|
|
|
+ filter: drop-shadow(#2dc7aa 80px 0);
|
|
|
+ transform: translateX(-80px);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|