| | |
| | | >
|
| | | <div class="color-option"
|
| | | v-if="universalColor != index"
|
| | | :style="{cursor: pointer,backgroundColor:item.color}"
|
| | | :style="{cursor: 'pointer',backgroundColor:item.color}"
|
| | | @click="colorCard(item.color,index)"
|
| | | />
|
| | |
|
| | | <div class="color-option color-option-active"
|
| | | v-else
|
| | | :style="{cursor: pointer,border:`2px solid ${item.color}`}"
|
| | | :style="{cursor: 'pointer',border:`2px solid ${item.color}`}"
|
| | | @click="colorCard(item.color,index)">
|
| | | <div
|
| | | :style="{backgroundColor:item.color}"
|
| | |
| | | this.universalColor = index
|
| | | document.documentElement.style.setProperty('--colorCard',`${color}`)
|
| | | localStorage.setItem('--colorCard',`${color}`)
|
| | | window.parent.postMessage({msg:'changeColor',color},'*')
|
| | | }
|
| | | },
|
| | | };
|
| | |
| | | overflow: auto;
|
| | | box-sizing: border-box;
|
| | | flex-shrink: 0;
|
| | | padding: 24px 10px;
|
| | | padding: 10px 10px;
|
| | | border-right: 4px solid #f2f2f7;
|
| | | background-color: #fbfaff;
|
| | |
|
| | |
| | | text-align: left;
|
| | | margin-bottom: 5px;
|
| | | }
|
| | | .voice-title {
|
| | | .bar.title.voice-title {
|
| | | justify-content: center !important;
|
| | | text-align: center;
|
| | | font-weight: 700;
|
| | | border: none;
|
| | | }
|
| | | .bar-group {
|
| | | overflow: auto;
|
| | | <<<<<<< HEAD
|
| | | height: 400px;
|
| | | }
|
| | | .bar {
|
| | | height: 48px;
|
| | | background-color: #f8f8f8;
|
| | | border-radius: 10px;
|
| | | line-height: 48px;
|
| | | box-sizing: border-box;
|
| | | padding: 0 20px 0 20px;
|
| | | font-weight: 700;
|
| | | display: flex;
|
| | | justify-content: space-between;
|
| | | margin-bottom: 2px;
|
| | | border: 2px solid #fff;
|
| | | .name {
|
| | | font-size: 14px;
|
| | | }
|
| | | .btns {
|
| | | width: 52px;
|
| | | =======
|
| | | height: 520px;
|
| | | height: calc(100% - 100px);
|
| | | .general-bar {
|
| | | height: 48px;
|
| | | background-color: #f8f8f8;
|
| | |
| | | box-sizing: border-box;
|
| | | padding: 0 20px 0 20px;
|
| | | font-weight: 700;
|
| | | >>>>>>> 0892efe5131551631fe287cfda29e59e4f2f6707
|
| | | display: flex;
|
| | | justify-content: space-between;
|
| | | margin-bottom: 2px;
|
| | | border: 2px solid #fff;
|
| | | border: 2px solid #f8f8f8;
|
| | | .name {
|
| | | font-size: 14px;
|
| | | }
|
| | |
| | | height: 30px;
|
| | | border-radius:50% ;
|
| | | background-color: #fff;
|
| | | padding: 3px;
|
| | | padding: 4px;
|
| | | .color-option-content {
|
| | | width: 100%;
|
| | | height: 100%;
|