更新某些样式

gaosp

2024-03-08 ebce136ebb10c8a1fa9859994e6ba1b992eee953

更新某些样式

 src/assets/img/login/footer.png

 src/components/home/index.vue

@@ -1,7 +1,7 @@
<!--
 * @Date: 2024-01-04 19:40:32
 * @LastEditors: Sneed
 * @LastEditTime: 2024-01-23 20:08:52
 * @LastEditTime: 2024-03-08 08:45:49
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/mdc/src/components/home/index.vue
-->
<template>
@@ -11,13 +11,14 @@
            <div class="menu">
              <slot name="menu"></slot>
            </div>
            <p v-if="showTime" class="time">{{time1}}<span>{{time2}}</span></p>
            <p v-if="showTime" class="time"><span>{{time1}}</span><span  style="position: relative;">{{time2}}</span></p>
        </div>
        <div class="content">
            <slot name="content"></slot>
            <slot class="copy" name="content"></slot>
            <div class="footer">
            </div>
        </div>
        <div class="footer">
        </div>
        
    </div>
</template>
<script>
@@ -93,22 +94,34 @@
    // justify-content: space-between;
    & > img {
      flex: 0 0 auto;
      width: 500px;
      width: 599px;
      max-height: 91px;
      align-self: flex-start;
    }
    .menu {
      height: 50px;
      margin-left: auto;
      margin-left: 20px;
      flex: 1 1 auto;
    }
    .time {
      // position: absolute;
      color: #fff;
      font-size: 20px;
      span {
      height: 30px;
      position: relative;
      span:first-child {
        // display: flex;
        position: absolute;
        top: 50%;
        transform: translate(0,-50%);
        left: -100px;
        font-size: 20px;
        line-height: 30px;
      }
      span:last-child {
        margin-left: 14px;
        font-family: digital;
        font-size: 30px;
        line-height: 30px;
      }
    }
  }
@@ -127,10 +140,13 @@
      left: 0;
      right: 0;
      text-align: center;
      bottom: 30px;
      bottom: 50px;
    }
  }
  .footer {
    position: absolute;
    width: 100%;
    bottom: 0;
    height: 46px;
    background-image: url('~@/assets/img/login/footer.png');
    background-size: cover;

 src/container/home/index.vue

@@ -288,7 +288,7 @@
        }
    }
    .user {
        margin-left: 30px;
        margin-left: auto;
        width: 114px;
        height: 37px;
        background: rgba(38, 36, 36, 0.58);

 src/container/workshop/device.vue

@@ -1,7 +1,7 @@
<!--
 * @Date: 2024-01-13 20:46:33
 * @LastEditors: Sneed
 * @LastEditTime: 2024-01-31 22:07:47
 * @LastEditTime: 2024-03-06 09:51:37
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/mdc/src/container/workshop/device.vue
-->
<template>
@@ -76,6 +76,7 @@
    data() {
        return {
            devicePng,
            scale: 1,
            concern: false,
            item: {}
        }
@@ -138,6 +139,15 @@
    },
    mounted () {
        this.concern = !!this.info.concern
        console.log(this.$el.getBoundingClientRect().width,'/////',this.$el.getBoundingClientRect().width / 200)
        this.$nextTick(() => {
            if (this.$el.getBoundingClientRect().width <  400) {
                this.$el.querySelector('.device-item-box').style = `transform:scale(${this.$el.getBoundingClientRect().width / 400})`
            }
        })
        
        
        
    },
    methods: {
        toDetail () {
@@ -157,8 +167,10 @@
</script>
<style lang="scss" scoped>
.device-item {
    width: 394px;
    height: 321px;
    width: 100%;
    height: 100%;
    // min-width: 394px;
    // min-height: 321px;
    border-radius: 10px;
    border: 1px solid #3C4249;
    padding: 20px;
@@ -210,6 +222,7 @@
    }

    &>div.device-item-box {
        min-width: 100px;
        flex: 1 1 auto;
        margin-top: 20px;
        display: flex;
@@ -219,6 +232,7 @@
        overflow: hidden;

        .img {
            // min-width: 100px;
            width: 50%;
            height: 100%;
            border: 1px solid #444C55;

 src/views/login/index.vue

@@ -196,7 +196,7 @@
            left: 0;

            right: 0;

            text-align: center;

            bottom: 30px;

            bottom: 80px;

        }

    }