diff --git a/pageMarket/drainageConfig/index.vue b/pageMarket/drainageConfig/index.vue index 8930055..271928a 100644 --- a/pageMarket/drainageConfig/index.vue +++ b/pageMarket/drainageConfig/index.vue @@ -1,366 +1,432 @@ \ No newline at end of file +.new_preview { + --bg: #3f3b37; + --color: #f6dfc4; + --borderColor: #f6dfc45b; + width: 90vw; + background-color: var(--bg); + border-radius: 4px; + position: relative; + .close { + --size: 70upx; + width: var(--size); + height: var(--size); + border-radius: 50%; + background-color: var(--bg); + display: flex; + align-items: center; + justify-content: center; + position: absolute; + bottom: calc(var(--size) * -1 - 20upx); + left: 50%; + margin-left: calc(var(--size) / 2 * -1); + } + + .header { + display: flex; + align-items: center; + justify-content: center; + font-size: 16px; + color: var(--color); + height: 50px; + border-bottom: 1px dashed var(--borderColor); + } + + .content { + padding-bottom: 14px; + + .title { + font-size: 14px; + color: var(--color); + height: 50px; + display: flex; + align-items: center; + justify-content: center; + } + + .img_wrap { + display: flex; + justify-content: center; + + .img { + --size: 220px; + width: var(--size); + height: var(--size); + border-radius: 4px; + } + } + + .intro { + height: 40px; + font-size: 14px; + color: var(--color); + display: flex; + align-items: center; + justify-content: center; + padding: 0 14px; + } + + .foot { + height: 40px; + color: var(--borderColor); + font-size: 14px; + display: flex; + align-items: center; + justify-content: center; + padding: 0 14px; + text-align: center; + } + } +} +