aidlab/aida_front
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改页面detail和coll字体以及比例

Browse Source
This commit is contained in:
X1627315083
2024-01-10 14:09:44 +08:00
parent 59c5e59347
commit 46a02478b6
35 changed files with 1191 additions and 1305 deletions
Download Patch File Download Diff File Expand all files Collapse all files

341
src/component/Detail/DesignDetailAlter.vue
View File

@@ -980,61 +980,18 @@ export default defineComponent({
flex-direction: column;
}
i{
font-size: 1.8rem;
font-size: calc(1.8rem*1.2);
display: block;
}
.detail_uploadLibrary{
.switch_type_list {
margin-bottom: 1rem;
margin-top: -1rem;
margin-bottom: calc(1rem*1.2);
margin-top: calc(-1rem*1.2);
display: flex;
align-items: center;
position: relative;
justify-content: space-around;
// .switch_type_item {
// display: flex;
// align-items: center;
// // padding: 0 2rem;
// height: 4rem;
// background: #fff;
// border-radius: 0.8rem;
// line-height: 4rem;
// font-size: 1.6rem;
// // margin-right: 2.2rem;
// color: #000;
// cursor: pointer;
// position: relative;
// text-align: center;
// transform-origin: left;
// transform: scale(1);
// transition: 0.3s all;
// &.switch_type_item::before {
// position: absolute;
// content: "";
// display: block;
// background: #000;
// height: .3rem;
// left: 50%;
// transform: translateX(-50%);
// bottom: .4rem;
// width: 0px;
// transition: 0.3s all;
// }
// &.select_swtich {
// color: #000;
// font-weight: 600;
// transform: scale(1.15);
// }
// &.select_swtich::before {
// width: 100%;
// }
// .switch_icon {
// font-size: 1.8rem;
// margin-right: 0.8rem;
// }
// }
}
@@ -1042,19 +999,19 @@ export default defineComponent({
.detail_Library{
.content_search_block{
display: flex;
margin-bottom: 1rem;
margin-bottom: calc(1rem*1.2);
.search_input{
width: 15rem;
padding-left: 1.5rem;
// height: 4rem;
// line-height: 3.8rem;
width: calc(15rem*1.2);
padding-left: calc(1.5rem*1.2);
// height: 4rem*1.2);
// line-height: 3.8rem*1.2);
// background: #FFFFFF;
border: 0.1rem solid #F1F1F1;
// font-size: 1.6rem;
font-size: 1.2rem;
border: calc(0.1rem*1.2) solid #F1F1F1;
// font-size: 1.6rem*1.2);
font-size: calc(1.2rem*1.2);
font-weight: 400;
height: 3rem;
height: calc(3rem*1.2);
&::placeholder {
color: #C2C2C2;
@@ -1062,15 +1019,15 @@ export default defineComponent({
}
.search_icon_block{
width: 5rem;
height: 3rem;
line-height: 3rem;
width: calc(5rem*1.2);
height: calc(3rem*1.2);
line-height: calc(3rem*1.2);
text-align: center;
background: #343579;
cursor: pointer;
.icon-sousuo{
font-size: 2rem;
font-size: calc(2rem*1.2);
color: #FFFFFF;
}
}
@@ -1079,7 +1036,7 @@ export default defineComponent({
.detail_Library_item,.detail_Upload_item{
width: 100%;
// height: calc(100% - 19rem);
// height: calc(100% - 19rem*1.2));
flex: 1;
overflow: hidden;
position: relative;
@@ -1095,7 +1052,7 @@ export default defineComponent({
}
.operate_file_block{
height: 1.5rem;
height: calc(1.5rem*1.2);
.select_img_type{
line-height: 1;
.select_category{
@@ -1106,7 +1063,7 @@ export default defineComponent({
}
}
.category_list{
margin-top: .1rem;
margin-top: calc(.1rem*1.2);
.category_item{
zoom: .7;
}
@@ -1117,19 +1074,19 @@ export default defineComponent({
text-align: center;
width: 100%;
img{
height: 10rem;
height: calc(10rem*1.2);
}
}
.content_img_item{
display: inline-block;
vertical-align: top;
// padding: 0 1.4rem;
// margin-bottom: 2.8rem;
margin-bottom: 2rem;
// padding: 0 1.4rem*1.2);
// margin-bottom: 2.8rem*1.2);
margin-bottom: calc(2rem*1.2);
padding: 0;
// height: 9rem;
// height: 9rem*1.2);
&.active{
margin-bottom: 2rem;
margin-bottom: calc(2rem*1.2);
.pin_block{
display: block;
}
@@ -1138,9 +1095,9 @@ export default defineComponent({
display: none;
}
.content_img_item_block{
// border: 0.1rem solid transparent;
width: 10rem;
height: 10rem;
// border: 0.1rem*1.2) solid transparent;
width: calc(10rem*1.2);
height: calc(10rem*1.2);
display: flex;
align-items: center;
justify-content: center;
@@ -1169,14 +1126,14 @@ export default defineComponent({
}
}
.content_img_name{
width: 16.5rem;
height: 3.5rem;
line-height: 3.5rem;
width: calc(16.5rem*1.2);
height: calc(3.5rem*1.2);
line-height: calc(3.5rem*1.2);
white-space: nowrap;
text-align: center;
overflow: hidden;
text-overflow: ellipsis;
font-size: 1.4rem;
font-size: calc(1.4rem*1.2);
color: #030303;
}
}
@@ -1191,9 +1148,9 @@ export default defineComponent({
.upload_file_item{
margin: 0;
margin-bottom: 2rem;
width: 9rem;
height: 9rem;
margin-bottom: calc(2rem*1.2);
width: calc(9rem*1.2);
height: calc(9rem*1.2);
display: flex;
align-items: center;
justify-content: center;
@@ -1216,18 +1173,18 @@ export default defineComponent({
}
.delete_file_block{
display: none;
width: 3.2rem;
height: 3.2rem;
width: calc(3.2rem*1.2);
height: calc(3.2rem*1.2);
background: rgba(0,0,0,0.6);
border-radius: 0.4rem;
border-radius: calc(0.4rem*1.2);
position: absolute;
top: 0.9rem;
right: 0.9rem;
top: calc(0.9rem*1.2);
right: calc(0.9rem*1.2);
text-align: center;
line-height: 3.2rem;
line-height: calc(3.2rem*1.2);
left: auto;
.icon-shanchu{
font-size: 1.6rem;
font-size: calc(1.6rem*1.2);
color: #fff;
}
}
@@ -1245,7 +1202,7 @@ export default defineComponent({
}
.detail_color{
// height: calc(100% - 5.4rem);
// height: calc(100% - 5.4rem*1.2));
height: 100%;
overflow-y: auto;
overflow-x: hidden;
@@ -1253,17 +1210,17 @@ export default defineComponent({
flex-direction: column;
.right_content_line{
position: relative;
margin-bottom: 1rem;
margin-bottom: calc(1rem*1.2);
.upload_right_header{
display: flex;
margin-bottom: 1rem;
margin-top: 1rem;
margin-bottom: calc(1rem*1.2);
margin-top: calc(1rem*1.2);
&.upload_right_header:nth-child(1){
margin-top: 0;
}
span{
margin-left: 1rem;
font-size: 1.8rem;
margin-left: calc(1rem*1.2);
font-size: calc(1.8rem*1.2);
color: #000000;
}
}
@@ -1274,18 +1231,18 @@ export default defineComponent({
display: none;
}
.color_review_block{
margin-right: 4rem;
margin-right: calc(4rem*1.2);
.color_review_content{
width: 16.5rem;
height: 16.5rem;
width: calc(16.5rem*1.2);
height: calc(16.5rem*1.2);
background: #FFFFFF;
border: 0.1rem solid #DCDCEC;
border: calc(0.1rem*1.2) solid #DCDCEC;
}
.pantong_name{
margin-top: 1rem;
font-size: 1.6rem;
margin-top: calc(1rem*1.2);
font-size: calc(1.6rem*1.2);
font-weight: 400;
color: #030303;
text-align: left;
@@ -1293,27 +1250,27 @@ export default defineComponent({
}
.clear_button{
padding: 0 2.8rem;
height: 3.2rem;
line-height: 3.2rem;
padding: 0 calc(2.8rem*1.2);
height: calc(3.2rem*1.2);
line-height: calc(3.2rem*1.2);
background: #EFEEFF;
font-size: 1.2rem;
font-size: calc(1.2rem*1.2);
font-family: Roboto;
color: #343579;
display: inline-block;
margin-top: 1rem;
margin-top: calc(1rem*1.2);
cursor: pointer;
}
}
.upload_file_item{
// margin: 0 2rem 2rem 0;
// margin: 0 2rem*1.2) 2rem*1.2) 0;
margin: 0;
display: inline-block;
// width: 16.5rem;
// height: 16.5rem;
width: 6rem;
height: 6rem;
// width: 16.5rem*1.2);
// height: 16.5rem*1.2);
width: calc(6rem*1.2);
height: calc(6rem*1.2);
border: 1px solid #F5F5F5;
vertical-align: top;
@@ -1340,11 +1297,11 @@ export default defineComponent({
.delete_file_block{
display: none;
width: 100%;
height: 4rem;
height: calc(4rem*1.2);
background: rgba(0,0,0,0.2);
font-size: 1.6rem;
font-size: calc(1.6rem*1.2);
color: #FFFFFF;
line-height: 4rem;
line-height: calc(4rem*1.2);
text-align: center;
position: absolute;
left: 0;
@@ -1354,7 +1311,7 @@ export default defineComponent({
}
.upload_img_icon{
width: 4.6rem;
width: calc(4.6rem*1.2);
}
.upload_color{
display: flex;
@@ -1362,16 +1319,16 @@ export default defineComponent({
justify-content: flex-start;
flex-direction: row;
flex-wrap: nowrap;
height: 2rem;
height: calc(2rem*1.2);
.upload_color_item{
width: 2rem;
height: 2rem;
width: calc(2rem*1.2);
height: calc(2rem*1.2);
position: relative;
cursor: pointer;
margin-right: 1rem;
margin-right: calc(1rem*1.2);
.upload_color_item_bg{
width: 2rem;
height: 2rem;
width: calc(2rem*1.2);
height: calc(2rem*1.2);
}
img{
position: absolute;
@@ -1390,11 +1347,11 @@ export default defineComponent({
}
}
.color_setting_block{
width: 17.5rem;
width: calc(17.5rem*1.2);
margin: auto;
background: linear-gradient(70deg, #eee4f3, #f3f4e6);
border-radius: 1rem;
border-radius: calc(1rem*1.2);
overflow: hidden;
// box-shadow: 2px 2px 8px #000;
box-shadow: 2px 2px 8px rgba(0,0,0,.3);
@@ -1403,56 +1360,56 @@ export default defineComponent({
}
.chrome_color{
width: 17.5rem;
// height: 16.5rem;
width: calc(17.5rem*1.2);
// height: 16.5rem*1.2);
overflow: hidden;
.vc-chrome-saturation-wrap{
height: 100%;
width: 16rem;
height: 16rem;
max-height: 17rem;
max-width: 17rem;
margin: .7rem auto;
width: calc(16rem*1.2);
height: calc(16rem*1.2);
max-height: calc(17rem*1.2);
max-width: calc(17rem*1.2);
margin: calc(.7rem*1.2) auto;
padding-bottom: 0;
}
.vc-chrome-body{
padding: 0;
width: 90%;
margin: 0.5rem auto;
margin: calc(0.5rem*1.2) auto;
margin: 0 auto;
background: rgba(0,0,0,0);
margin-bottom: 1rem;
margin-bottom: calc(1rem*1.2);
// display: none;
.vc-chrome-fields-wrap{
margin-top: 5%;
padding: 0;
position: relative;
.vc-chrome-toggle-btn{
width: 3.2rem;
width: calc(3.2rem*1.2);
.vc-chrome-toggle-icon{
height: auto;
margin-right: -0.4rem;
margin-top: 0rem;
margin-right: calc(-0.4rem*1.2);
margin-top: calc(0rem*1.2);
display: flex;
flex-direction: column;
align-items: center;
svg{
width: 2.4rem !important;
height: 2.4rem !important;
width: calc(2.4rem*1.2) !important;
height: calc(2.4rem*1.2) !important;
}
}
}
.vc-chrome-fields{
.vc-chrome-field{
padding-left: .6rem;
padding-left: calc(.6rem*1.2);
}
.vc-input__label{
font-size: 1.6rem;
font-size: calc(1.6rem*1.2);
}
.vc-input__input{
font-size: 1.1rem;
height: 2.1rem;
font-size: calc(1.1rem*1.2);
height: calc(2.1rem*1.2);
}
}
.ant-upload-list{
@@ -1463,24 +1420,24 @@ export default defineComponent({
// background-image: url(@../../../../assets/images/homePage/裁剪后1.jpg);
// background-image: url(@../../../../assets/images/homePage/裁剪后2.jpg);
// background-image: url(@../../../../assets/images/homePage/裁剪后3.jpg);
background-size: 1.5rem;
background-size: calc(1.5rem*1.2);
background-repeat: no-repeat;
background-position: 50%;
cursor: pointer;
margin: 0;
width: 2.2rem;
height: 2.2rem;
padding: .7rem;
width: calc(2.2rem*1.2);
height: calc(2.2rem*1.2);
padding: calc(.7rem*1.2);
border: 1px solid;
position: absolute;
bottom: -.5rem;
right: .5rem;
border-radius: .5rem;
bottom: calc(-.5rem*1.2);
right: calc(.5rem*1.2);
border-radius: calc(.5rem*1.2);
}
.vc-chrome-fields{
.vc-input__label{
margin-top: 1rem;
margin-top: calc(1rem*1.2);
}
}
.vc-chrome-fields:nth-child(2){
@@ -1498,15 +1455,15 @@ export default defineComponent({
align-items: center;
flex-direction: row-reverse;
.vc-chrome-color-wrap{
// width: 3.6rem;
margin-left: 2rem;
// width: 3.6rem*1.2);
margin-left: calc(2rem*1.2);
width: auto;
.vc-chrome-active-color{
border-radius: 50%;
}
.vc-chrome-active-color,.vc-checkerboard{
width: 3rem;
height: 3rem;
width: calc(3rem*1.2);
height: calc(3rem*1.2);
}
}
.vc-chrome-hue-wrap,.vc-chrome-alpha-wrap{
@@ -1517,76 +1474,76 @@ export default defineComponent({
border-radius: 15px;
overflow: hidden;
}
height: 1rem;
height: calc(1rem*1.2);
.vc-hue-picker{
width: 1.4rem;
height: 1.4rem;
width: calc(1.4rem*1.2);
height: calc(1.4rem*1.2);
}
.vc-alpha-picker{
width: 1.4rem;
height: 1.4rem;
transform: translate(-.6rem,-.4rem);
width: calc(1.4rem*1.2);
height: calc(1.4rem*1.2);
transform: translate(calc(-.6rem*1.2),calc(-.4rem*1.2));
}
}
.vc-chrome-alpha-wrap{
display: none;
}
.vc-chrome-hue-wrap{
margin-bottom: .5rem;
margin-bottom: calc(.5rem*1.2);
}
}
}
.vc-chrome-saturation-wrap .vc-saturation-circle{
width: 1rem;
height: 1rem;
width: calc(1rem*1.2);
height: calc(1rem*1.2);
}
}
.sileder_color{
margin-top:1.3rem;
margin-top:calc(1.3rem*1.2);
.vc-slider-swatches{
display:none
}
.vc-slider-hue-warp {
width: 16.5rem;
height: 2.4rem;
border-radius: 1.2rem;
width: calc(16.5rem*1.2);
height: calc(2.4rem*1.2);
border-radius: calc(1.2rem*1.2);
overflow: hidden;
.vc-hue-picker{
width: 1.4rem;
height: 1.4rem;
width: calc(1.4rem*1.2);
height: calc(1.4rem*1.2);
border-radius: 50%;
transform: translate(-0.7rem, -0.2rem);
transform: translate(calc(-0.7rem*1.2), calc(-0.2rem*1.2));
}
}
.vc-hue-pointer{
top: 0.5rem !important;
top: calc(0.5rem*1.2) !important;
}
}
.color_block{
// margin-top: 1rem;
// margin-top: 1rem*1.2);
// display: flex;
// justify-content: space-between;
// font-size: 1.6rem;
// font-size: 1.6rem*1.2);
width: 100%;
padding: 0 5%;
padding-bottom: 5%;
margin: 0.5rem auto;
margin: calc(0.5rem*1.2) auto;
display: flex;
justify-content: space-between;
align-items: center;
.color_right{
width: 11rem;
font-size: 1,2rem;
width: calc(11rem*1.2);
font-size: calc(1,2rem*1.2);
color: #666666;
.color_rgb_block{
display: flex;
.rgb_item{
margin-left: .2rem;
margin-left: calc(.2rem*1.2);
}
}
}
@@ -1600,15 +1557,15 @@ export default defineComponent({
align-items: center;
}
.color_HEX_block,.color_rgb_block{
padding: .2rem .5rem;
padding: calc(.2rem*1.2) calc(.5rem*1.2);
box-shadow: inset 0 0 0 1px #ccc;
border-radius: .4rem;
border-radius: calc(.4rem*1.2);
justify-content: space-around;
text-transform:uppercase;
.color_block_bg{
width: 1.5rem;
height: 1.5rem;
// margin-right: .5rem;
width: calc(1.5rem*1.2);
height: calc(1.5rem*1.2);
// margin-right: .5rem*1.2);
display: flex;
justify-content: space-between;
}
@@ -1624,13 +1581,13 @@ export default defineComponent({
display: flex;
flex-direction: row;
.get_color_input{
width: 15rem;
height: 2.8rem;
width: calc(15rem*1.2);
height: calc(2.8rem*1.2);
background: #FFFFFF;
border: 0.1rem solid #DCDCEC;
padding: 1rem 1.3rem;
border: calc(0.1rem*1.2) solid #DCDCEC;
padding: calc(1rem*1.2) calc(1.3rem*1.2);
box-sizing: border-box;
font-size: 1.4rem;
font-size: calc(1.4rem*1.2);
text-align: left;
&::placeholder {
@@ -1639,12 +1596,12 @@ export default defineComponent({
}
.get_color_button{
padding: 0 .2rem;
height: 2.8rem;
padding: 0 calc(.2rem*1.2);
height: calc(2.8rem*1.2);
background: #EFEEFF;
display: inline-block;
line-height: 3rem;
font-size: 1.2rem;
line-height: calc(3rem*1.2);
font-size: calc(1.2rem*1.2);
color: #343579;
vertical-align: middle;
cursor: pointer;
@@ -1653,8 +1610,8 @@ export default defineComponent({
justify-content: center;
flex: 1;
.icon-huoquduixiang{
margin-right: 0.5rem;
font-size: 2rem;
margin-right: calc(0.5rem*1.2);
font-size: calc(2rem*1.2);
color:#343579;
vertical-align: middle;
}
@@ -1668,7 +1625,7 @@ export default defineComponent({
}
.upload_item{
margin-bottom: .5rem;
margin-bottom: calc(.5rem*1.2);
display: flex;
justify-content: center;
.ant-upload-picture-card-wrapper{
@@ -1676,11 +1633,11 @@ export default defineComponent({
display: flex;
justify-content: center;
.ant-upload-select-picture-card{
// margin: 0 2rem 2rem 0;
// margin: 0 2rem*1.2) 2rem*1.2) 0;
margin: 0;
display: inline-block;
width: 6rem;
height: 6rem;
width: calc(6rem*1.2);
height: calc(6rem*1.2);
border: 1px solid #F5F5F5;
vertical-align: top;
i{