fix:样式修改

pull/321/head
lihui_ocr 1 year ago
parent e4b165ed0f
commit b544182bea

@ -1 +1,22 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512 512"><path d="M304 192v32c0 6.6-5.4 12-12 12h-56v56c0 6.6-5.4 12-12 12h-32c-6.6 0-12-5.4-12-12v-56h-56c-6.6 0-12-5.4-12-12v-32c0-6.6 5.4-12 12-12h56v-56c0-6.6 5.4-12 12-12h32c6.6 0 12 5.4 12 12v56h56c6.6 0 12 5.4 12 12zm201 284.7L476.7 505c-9.4 9.4-24.6 9.4-33.9 0L343 405.3c-4.5-4.5-7-10.6-7-17V372c-35.3 27.6-79.7 44-128 44C93.1 416 0 322.9 0 208S93.1 0 208 0s208 93.1 208 208c0 48.3-16.4 92.7-44 128h16.3c6.4 0 12.5 2.5 17 7l99.7 99.7c9.3 9.4 9.3 24.6 0 34zM344 208c0-75.2-60.8-136-136-136S72 132.8 72 208s60.8 136 136 136s136-60.8 136-136z" fill="currentColor"></path></svg>
<?xml version="1.0" encoding="UTF-8"?>
<svg width="64px" height="64px" viewBox="0 0 64 64" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>放大</title>
<defs>
<rect id="path-1" x="0" y="0" width="64" height="64"></rect>
</defs>
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="PrevailCloud-Design-图标集" transform="translate(-1720.000000, -2805.000000)">
<g id="放大" transform="translate(1720.000000, 2805.000000)">
<mask id="mask-2" fill="white">
<use xlink:href="#path-1"></use>
</mask>
<use id="蒙版" fill="#000000" fill-rule="nonzero" opacity="0" xlink:href="#path-1"></use>
<g id="编组" mask="url(#mask-2)" fill="#666666" fill-rule="nonzero">
<g transform="translate(7.000000, 7.000000)" id="形状">
<path d="M44.560973,40.5665707 C44.6720829,40.6499032 44.7748596,40.7387911 44.8748585,40.8387901 L48.9164824,44.8776363 C49.6598018,45.5952197 49.958016,46.6580848 49.6964749,47.6576076 C49.4349339,48.6571305 48.6543527,49.4377117 47.6548299,49.6992527 C46.655307,49.9607937 45.5924419,49.6625796 44.8748585,48.9192602 L40.8360124,44.8776363 C40.7378353,44.7796968 40.6468589,44.6747954 40.563793,44.5637507 C30.189539,52.8169323 15.1768306,51.5372425 6.34910651,41.6472758 C-2.47861756,31.7573091 -2.05159696,16.6962111 7.32230707,7.32230707 C16.6962111,-2.05159696 31.7573091,-2.47861756 41.6472758,6.34910651 C51.5372425,15.1768306 52.8169323,30.189539 44.5637507,40.563793 L44.5637507,40.5665707 L44.560973,40.5665707 Z M22.855647,22.8584248 L22.855647,17.1445963 C22.8231546,16.1026764 23.3604612,15.1256909 24.2577642,14.5951247 C25.1550671,14.0645585 26.2700554,14.0645585 27.1673583,14.5951247 C28.0646612,15.1256909 28.6019679,16.1026764 28.5694755,17.1445963 L28.5694755,22.8584248 L34.2833039,22.8584248 C35.3252241,22.825932 36.3022099,23.3632385 36.8327764,24.2605416 C37.3633428,25.1578447 37.3633428,26.2728333 36.8327764,27.1701363 C36.3022099,28.0674394 35.3252241,28.604746 34.2833039,28.5722532 L28.5694755,28.5722532 L28.5694755,34.2860817 C28.6019679,35.3280017 28.0646612,36.3049871 27.1673583,36.8355533 C26.2700554,37.3661195 25.1550671,37.3661195 24.2577642,36.8355533 C23.3604612,36.3049871 22.8231546,35.3280017 22.855647,34.2860817 L22.855647,28.5722532 L17.1418186,28.5722532 C16.0998983,28.604746 15.1229125,28.0674394 14.5923461,27.1701363 C14.0617797,26.2728333 14.0617797,25.1578447 14.5923461,24.2605416 C15.1229125,23.3632385 16.0998983,22.825932 17.1418186,22.8584248 L22.855647,22.8584248 Z M24.997291,44.2859759 C31.9421392,44.3693275 38.3954099,40.7120576 41.8921184,34.7111498 C45.3888269,28.710242 45.3888269,21.2926733 41.8921184,15.2917655 C38.3954099,9.29085771 31.9421392,5.63358778 24.997291,5.71693946 C14.4370169,5.84368327 5.94283561,14.440423 5.94283561,25.0014577 C5.94283561,35.5624923 14.4370169,44.1592321 24.997291,44.2859759 Z"></path>
</g>
</g>
</g>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 678 B

After

Width:  |  Height:  |  Size: 3.1 KiB

@ -10,7 +10,8 @@ const emit = defineEmits(['close'])
const quillEditor = ref()
const cardStyle = {
'width': '500px',
'width': '560px',
'height': '397px',
'--n-padding-bottom': '17px',
'--n-padding-left': '24px',
}
@ -22,6 +23,7 @@ const options = reactive({
toolbar: [
['bold', 'italic', 'underline', 'strike'], // toggled buttons
[{ align: '' }, { align: 'center' }, { align: 'right' }, { align: 'justify' }],
[{ 'color': [] },],
],
},
theme: 'snow',
@ -64,7 +66,7 @@ const saveHandler = debounce(() => {
ref="quillEditor"
v-model:content="note"
:options="options"
style="height: 350px"
style="height: 258px"
class="quillEditor"
content-type="html"
@ready="initHandler"
@ -90,7 +92,7 @@ const saveHandler = debounce(() => {
font-family: PingFang SC, PingFang SC-Medium;
color: #333333;
margin-bottom: 24px;
font-weight: 500;
font-weight: 550;
}
.ql-toolbar.ql-snow {
@ -101,9 +103,16 @@ const saveHandler = debounce(() => {
margin-top: -10px;
background: #f8f8f8;
border: 1px solid #d8d8d8;
margin-top:-4px ;
}
.ql-container.ql-snow {
border: 1px solid #d8d8d8;
}
::v-deep(.n-card__content){
padding-left:24px !important ;
padding-right:24px !important;
margin-top: -8px!important;
}
</style>

@ -436,4 +436,10 @@ useKeydown('s', () => setShowSearch(true))
width: 0px;
}
}
::v-deep(.n-form-item-label__text){
color: #333333;
}
::v-deep(.n-form){
margin-top: -2px;
}
</style>

@ -267,7 +267,7 @@ defineExpose({
</script>
<template>
<div class="wrapper">
<div class="wrapper" >
<div class="wrapper-left">
<svg-icon name="shield" size="32" />
<n-popover
@ -448,11 +448,11 @@ defineExpose({
z-index: 10;
background: #ffffff;
left: 0;
top:0;
top:-7px;
&-left {
display: flex;
align-items: center;
margin-left:-2px;
&-dropdown {
display: flex;
flex-direction: row;
@ -463,7 +463,7 @@ defineExpose({
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 120px;
margin-right: 10px;
}
}

@ -373,7 +373,7 @@ onMounted(() => {
</template>
</n-input>
<n-scrollbar
style="max-height: 500px; border: 1px solid #cad2dd; border-radius: 2px"
style="max-height: 355px; border: 1px solid #cad2dd; border-radius: 2px;border-top:none"
>
<div class="draggable-ul">
<div class="draggable-li">
@ -424,7 +424,7 @@ onMounted(() => {
</template>
</n-input>
<n-scrollbar
style="max-height: 500px; border: 1px solid #cad2dd; border-radius: 2px"
style="max-height: 355px; border: 1px solid #cad2dd; border-radius: 2px;border-top:none"
class="scroll"
>
<VueDraggable
@ -440,7 +440,7 @@ onMounted(() => {
:draggable="true"
class="cursor-move draggable-li"
>
<SvgIcon name="drag" size="24" />
<SvgIcon name="drag" size="14" />
<span class="ml-2">{{ item.name }}</span>
<SvgIcon
v-if="!item.fix"
@ -471,11 +471,20 @@ onMounted(() => {
</n-button>
</div>
</template>
<div class="bottomline">
</div>
</n-card>
</n-modal>
</template>
<style lang="less" scoped>
.cursor-move:hover{
background: #f2f8ff;
box-shadow: 0px 2px 8px 0px rgba(125,124,124,0.16);
border-left: 2px solid #1980FF;
}
.wrapper {
display: flex;
flex-direction: column;
@ -488,7 +497,7 @@ onMounted(() => {
&-bar {
background-color: #f8f8f8 !important;
width: calc(100% + 12px);
margin-top: 20px;
margin-top: 18px;
color: #333333;
}
@ -527,12 +536,13 @@ onMounted(() => {
::v-deep(.n-card__content) {
padding-left: 0 !important;
padding-right: 0 !important;
margin-top:-28px ;
}
}
.cardstyle {
width: 620px;
height: 800px;
height: 590px;
--n-padding-bottom: 20px;
--n-padding-left: 24px;
// background-color: #f8f8f8 !important;
@ -564,6 +574,15 @@ onMounted(() => {
color: gainsboro;
}
}
.bottomline{
background: #CAD2DD;
height: 1px;
width: 100%;
position: absolute;
left: 0;
bottom: 55px;
opacity: 0.72;
}
::v-deep(.n-card.n-card--content-segmented > .n-card__content:not(:first-child)) {
border: 0px;
@ -574,15 +593,16 @@ onMounted(() => {
--n-padding-bottom: 12px;
}
::v-deep(.n-card > .n-card-header .n-card-header__main) {
font-weight: lighter !important;
font-size: 14px;
color: #666;
font-weight: 550;
}
::v-deep(.n-scrollbar) {
border-left: 1px solid #cad2dd !important;
border-right: 1px solid #cad2dd !important;
border-bottom: 1px solid #e8e8e8 !important;
border-top: 1px solid #e8e8e8 !important;
border-top: none;
}
::v-deep(.n-card__content) {
padding: 20px 24px 0 24px !important;
@ -602,4 +622,13 @@ onMounted(() => {
::v-deep(.n-button--info-type) {
background: #507afd !important;
}
.cursor-move:active {
width: 260px;
height: 44px;
border: 1px solid #cad2dd;
border-radius: 2px;
border-left: 2px solid #1980FF;
}
</style>

@ -954,7 +954,7 @@ defineExpose({
<SvgIcon
size="16"
name="magnifying-2"
style="cursor: pointer; color: #666666"
style="cursor: pointer; color: #666666;margin-top:-3px"
/>
</div>
</div>
@ -1072,9 +1072,9 @@ defineExpose({
"
>
<SvgIcon
size="13"
size="16"
name="magnifying-2"
style="cursor: pointer; color: #666666"
style="cursor: pointer; color: #666666;margin-top:-3px"
/>
</div>
</div>
@ -1084,7 +1084,7 @@ defineExpose({
class="avatar"
round
/>
<span>{{ item.upname }}</span>
<span style="font-size:12px">{{ item.upname }}</span>
</div>
</div>
</div>
@ -1215,8 +1215,8 @@ defineExpose({
}
.avatar {
width: 20px;
height: 20px;
width: 15px;
height: 15px;
margin-right: 5px;
}
}
@ -1296,6 +1296,7 @@ defineExpose({
background-color: #fff;
border-radius: 6px;
backdrop-filter: blur(10px);
}
}

@ -117,7 +117,7 @@ defineExpose({
background-image: url(../../../../assets/images/approval_modal_bg.png);
background-repeat: no-repeat;
background-size: 100%;
width: 510px;
width: 470px;
height: 361px;
box-shadow: none !important;
margin-left: 30px !important;
@ -126,7 +126,7 @@ defineExpose({
position: absolute;
left: calc(50% - 286px);
.wrapper-hearder {
margin-top: 80px;
margin-top: 68px;
margin-left: 18px;
.wrapper-title {
text-align: center;
@ -150,13 +150,13 @@ defineExpose({
.wrapper-content {
flex: 1;
border-radius: 8px;
margin: 24px 50px 16px 48px;
margin: 75px 50px 16px 48px;
.flex_box {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: space-between;
margin: 58.5px 0 0 20px;
margin: -18.5px 0 0 20px;
.item {
.num_box {
font-size: 20px;
@ -226,15 +226,14 @@ defineExpose({
width: 153px;
height: 46px;
background: linear-gradient(135deg, #3258e8, #786efc);
border: 1px solid;
border-image: linear-gradient(123deg, #d7dffe 2%, #d7d5ff 88%) 1 1;
border: 1px solid #d7d5ff;
border-radius: 24px;
box-shadow: 0px 2px 6px 0px rgba(116, 153, 253, 0.3);
cursor: pointer;
margin: 20px auto 0;
position: relative;
bottom: -35px;
bottom: -20px;
left: 20px;
font-size: 22px;
@ -243,8 +242,6 @@ defineExpose({
text-align: center;
color: #ffffff;
line-height: 46px;
border: none;
font-style: italic;
}
// .footer {

@ -689,7 +689,7 @@ function forget() {
margin-right: 12px !important;
}
::v-deep(.n-button__content){
font-size: 16px !important;
font-size: 15px !important;
line-height: 20px;
font-family: PingFang SC, PingFang SC-Medium;
}

Loading…
Cancel
Save