大屏左侧

odc.xiaohui

2024-02-28 7633cfbb1d9d75b316a004b69f7f9feea4233934

 src/views/header.vue

@@ -24,28 +24,31 @@


<template>

  <div class="d-flex jc-center title_wrap">

    <div class="zuojuxing"></div>

    <div class="youjuxing"></div>

    <div class="guang"></div>

    <div class="zuojuxing-new">

     您好，欢迎来到<span style="color:#E4D68B;">道安办市域治理数据</span>大屏！

    </div>

<!--    <div class="zuojuxing"></div>-->

<!--    <div class="youjuxing"></div>-->

<!--    <div class="guang"></div>-->

    <div class="d-flex jc-center">

      <div class="title">

        <span class="title-text">互联网设备可视化平台</span>

        <span class="title-text">道安办市域治理数据大屏</span>

      </div>

    </div>

    <div class="timers">

      {{ dateData.dateYear }} {{ dateData.dateWeek }} {{ dateData.dateDay }}

<!--    <div class="timers">-->

<!--      {{ dateData.dateYear }} {{ dateData.dateWeek }} {{ dateData.dateDay }}-->



      <div class="setting_icon"   @click="setSettingShow(true)">

          <img src="@/assets/img/headers/setting.png" alt="设置">

      </div>

    </div>

<!--      <div class="setting_icon"   @click="setSettingShow(true)">-->

<!--          <img src="@/assets/img/headers/setting.png" alt="设置">-->

<!--      </div>-->

<!--    </div>-->

  </div>

</template>



<style scoped lang="scss">

.title_wrap {

  height: 60px;

  background-image: url("../assets/img/top.png");

  height: 116px;

  background-image: url("../assets/img/top1.png");

  background-size: cover;

  background-position: center center;

  position: relative;

@@ -68,7 +71,28 @@
    height: 6px;

    background-image: url("../assets/img/headers/juxing1.png");

  }

  .zuojuxing-new::before{

    background-image: url(../assets/img/top3.png);

    content: "";

    width: 20px;

    height: 20px;

    //background-image: url(./bubble.png);

    background-size: contain;

    margin: -2px 10px;

    //background: url("../assets/img/top3.png") no-repeat;

  }

  .zuojuxing-new{

    display: flex;

    align-items: center;

    margin-top: 13px;

    position: absolute;

    top: -2px;

    width: auto;

    height: 20px;

    left: 0.2%;

    line-height: 50px;



  }

  .zuojuxing {

    left: 11%;

  }

@@ -108,15 +132,17 @@
  line-height: 46px;



  .title-text {

    font-style: italic;

    //text-shadow: 0px 2px 10px rgba(0,0,0,0.5);

    //font-family: 200-SSBoYaTi;

    font-size: 38px;

    font-weight: 900;

    letter-spacing: 6px;

    width: 100%;

    background: linear-gradient(

      92deg,

      #0072ff 0%,

      #00eaff 48.8525390625%,

      #01aaff 100%

      180deg,

      #fff 0%,

      #407BB6 100%

    );

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;