| | |
| | | <template> |
| | | <div class="specialTool"> |
| | | <div |
| | | class="legend" |
| | | v-for="(item, index) in list" |
| | | :key="index" |
| | | > |
| | | <div class="legend" v-for="(item, index) in list" :key="index"> |
| | | <img |
| | | class="img" |
| | | :src="item.icon" |
| | |
| | | .specialTool { |
| | | position: absolute; |
| | | bottom: 45px; |
| | | /* width: 650px; */ |
| | | /* padding: 5px; */ |
| | | width: 680px; |
| | | padding: 5px; |
| | | border: 2px solid #016ce2; |
| | | border-radius: 3px; |
| | | background-color: #0952c860; |
| | | color: #fff; |
| | | font-size: 10px; |
| | | font-size: 15px; |
| | | left: 50%; |
| | | transform: translateX(-50%); |
| | | z-index: 99999; |
| | | pointer-events: all; |
| | | padding: 10px 10px; |
| | | padding-left: 0px; |
| | | display: flex; |
| | | justify-content: space-between; |
| | | } |
| | | .legend { |
| | | /* width: 150px; */ |
| | | margin-left: 10px; |
| | | width: 150px; |
| | | display: flex; |
| | | float: left; |
| | | flex-direction: column; |
| | | justify-content: center; |
| | | align-items: center; |
| | | /* background: red; */ |
| | | } |
| | | img { |
| | | width: 20px; |
| | | width: 40px; |
| | | } |
| | | </style> |
| | | |