qcast3/qcast-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/qcast-pub' into dev

Browse Source
This commit is contained in:
김민식 2025-01-09 18:03:42 +09:00
commit 1d210ac13c
6 changed files with 1467 additions and 1431 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/common/select/QSelectBox.jsx
View File

@ -35,7 +35,8 @@ export default function QSelectBox({
if (options.length === 0) return title !== '' ? title : '선택하세요.' if (options.length === 0) return title !== '' ? title : '선택하세요.'
if (showKey !== '' && !value) { if (showKey !== '' && !value) {
//value가 없으면 showKey가 있으면 우선 보여준다 //value가 없으면 showKey가 있으면 우선 보여준다
return options[0][showKey] // return options[0][showKey]
return title
} else if (showKey !== '' && value) { } else if (showKey !== '' && value) {
//value가 있으면 sourceKey와 targetKey를 비교하여 보여준다 //value가 있으면 sourceKey와 targetKey를 비교하여 보여준다
@ -58,6 +59,8 @@ export default function QSelectBox({
const ref = useRef(null) const ref = useRef(null)
const handleClickSelectOption = (option) => { const handleClickSelectOption = (option) => {
console.log('🚀 ~ handleClickSelectOption ~ option:', option)
setSelected(showKey !== '' ? option[showKey] : option.name) setSelected(showKey !== '' ? option[showKey] : option.name)
onChange?.(option, params) onChange?.(option, params)
} }

11
src/components/floor-plan/modal/roofAllocation/RoofAllocationSetting.jsx
View File

@ -10,6 +10,7 @@ import { ROOF_MATERIAL_LAYOUT } from '@/components/floor-plan/modal/placementSha
import { useCanvasSetting } from '@/hooks/option/useCanvasSetting' import { useCanvasSetting } from '@/hooks/option/useCanvasSetting'
import { useCommonCode } from '@/hooks/common/useCommonCode' import { useCommonCode } from '@/hooks/common/useCommonCode'
import { globalLocaleStore } from '@/store/localeAtom' import { globalLocaleStore } from '@/store/localeAtom'
import { useRoofShapeSetting } from '@/hooks/roofcover/useRoofShapeSetting'
export default function RoofAllocationSetting(props) { export default function RoofAllocationSetting(props) {
const contextPopupPosition = useRecoilValue(contextPopupPositionState) const contextPopupPosition = useRecoilValue(contextPopupPositionState)
@ -29,6 +30,7 @@ export default function RoofAllocationSetting(props) {
handleChangeLayout, handleChangeLayout,
currentRoofList, currentRoofList,
} = useRoofAllocationSetting(id) } = useRoofAllocationSetting(id)
const { pitchText } = useRoofShapeSetting(id)
const { findCommonCode } = useCommonCode() const { findCommonCode } = useCommonCode()
const [raftCodes, setRaftCodes] = useState([]) const [raftCodes, setRaftCodes] = useState([])
const globalLocale = useRecoilValue(globalLocaleStore) const globalLocale = useRecoilValue(globalLocaleStore)
@ -104,6 +106,15 @@ export default function RoofAllocationSetting(props) {
{index !== 0 && <button className="delete" onClick={() => onDeleteRoofMaterial(index)}></button>} {index !== 0 && <button className="delete" onClick={() => onDeleteRoofMaterial(index)}></button>}
</div> </div>
</div> </div>
<div className="block-box">
<div className="flex-ment">
<span>{getMessage('slope')}</span>
<div className="input-grid" style={{ width: '214px' }}>
<input type="text" className="input-origin block" defaultValue={4} />
</div>
<span>{pitchText}</span>
</div>
</div>
{(roof.widAuth || roof.lenAuth) && ( {(roof.widAuth || roof.lenAuth) && (
<div className="block-box"> <div className="block-box">
{roof.widAuth && ( {roof.widAuth && (

18
src/components/floor-plan/modal/roofShape/passivity/Shed.jsx Normal file
View File

@ -0,0 +1,18 @@
import { useMessage } from '@/hooks/useMessage'
export default function Shed({ offsetRef }) {
const { getMessage } = useMessage()
return (
<>
<div className="outline-form mb10">
<span className="mr10" style={{ width: '63px' }}>
{getMessage('shed.width')}
</span>
<div className="input-grid mr5">
<input type="text" className="input-origin block" defaultValue={300} ref={offsetRef} />
</div>
<span className="thin">mm</span>
</div>
</>
)
}

23
src/hooks/useContextMenu.js
View File

@ -572,6 +572,29 @@ export function useContextMenu() {
], ],
]) ])
break break
case 'adsorptionPoint':
setContextMenu([
[
{
id: 'remove',
name: getMessage('contextmenu.remove'),
fn: () => {
canvas.remove(currentObject)
canvas.discardActiveObject()
},
},
{
id: 'removeAll',
name: getMessage('contextmenu.remove.all'),
fn: () => {
removeGrid()
removeAdsorptionPoint()
canvas.discardActiveObject()
},
},
],
])
break
case 'dimensionGroup': case 'dimensionGroup':
setContextMenu([ setContextMenu([
[ [

302
src/styles/_contents.scss
View File

@ -26,14 +26,14 @@
min-width: 1280px; min-width: 1280px;
padding-bottom: 0; padding-bottom: 0;
background-color: #383838; background-color: #383838;
transition: padding 0.17s ease-in-out; transition: padding .17s ease-in-out;
z-index: 999; z-index: 999;
.canvas-menu-inner{ .canvas-menu-inner{
position: relative; position: relative;
display: flex; display: flex;
align-items: center; align-items: center;
padding: 0 40px 0 20px; padding: 0 40px 0 20px;
background-color: #2c2c2c; background-color: #2C2C2C;
height: 46.8px; height: 46.8px;
z-index: 999; z-index: 999;
.canvas-menu-list{ .canvas-menu-list{
@ -53,7 +53,7 @@
font-weight: 600; font-weight: 600;
padding: 15px 20px; padding: 15px 20px;
opacity: 0.55; opacity: 0.55;
transition: all 0.17s ease-in-out; transition: all .17s ease-in-out;
.menu-icon{ .menu-icon{
display: block; display: block;
width: 14px; width: 14px;
@ -62,27 +62,13 @@
background-position: center; background-position: center;
background-size: contain; background-size: contain;
margin-right: 10px; margin-right: 10px;
&.con00 { &.con00{background-image: url(/static/images/canvas/menu_icon00.svg);}
background-image: url(/static/images/canvas/menu_icon00.svg); &.con01{background-image: url(/static/images/canvas/menu_icon01.svg);}
} &.con02{background-image: url(/static/images/canvas/menu_icon02.svg);}
&.con01 { &.con03{background-image: url(/static/images/canvas/menu_icon03.svg);}
background-image: url(/static/images/canvas/menu_icon01.svg); &.con04{background-image: url(/static/images/canvas/menu_icon04.svg);}
} &.con05{background-image: url(/static/images/canvas/menu_icon05.svg);}
&.con02 { &.con06{background-image: url(/static/images/canvas/menu_icon06.svg);}
background-image: url(/static/images/canvas/menu_icon02.svg);
}
&.con03 {
background-image: url(/static/images/canvas/menu_icon03.svg);
}
&.con04 {
background-image: url(/static/images/canvas/menu_icon04.svg);
}
&.con05 {
background-image: url(/static/images/canvas/menu_icon05.svg);
}
&.con06 {
background-image: url(/static/images/canvas/menu_icon06.svg);
}
} }
} }
&.active{ &.active{
@ -114,47 +100,26 @@
width: 30px; width: 30px;
height: 30px; height: 30px;
border-radius: 2px; border-radius: 2px;
background-color: #3d3d3d; background-color: #3D3D3D;
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 15px 15px; background-size: 15px 15px;
transition: all 0.17s ease-in-out; transition: all .17s ease-in-out;
&.btn01 { &.btn01{background-image: url(../../public/static/images/canvas/side_icon03.svg);}
background-image: url(../../public/static/images/canvas/side_icon03.svg); &.btn02{background-image: url(../../public/static/images/canvas/side_icon02.svg);}
} &.btn03{background-image: url(../../public/static/images/canvas/side_icon01.svg);}
&.btn02 { &.btn04{background-image: url(../../public/static/images/canvas/side_icon04.svg);}
background-image: url(../../public/static/images/canvas/side_icon02.svg); &.btn05{background-image: url(../../public/static/images/canvas/side_icon05.svg);}
} &.btn06{background-image: url(../../public/static/images/canvas/side_icon06.svg);}
&.btn03 { &.btn07{background-image: url(../../public/static/images/canvas/side_icon07.svg);}
background-image: url(../../public/static/images/canvas/side_icon01.svg); &.btn08{background-image: url(../../public/static/images/canvas/side_icon08.svg);}
} &.btn09{background-image: url(../../public/static/images/canvas/side_icon09.svg);}
&.btn04 { &.btn10{background-image: url(../../public/static/images/canvas/side_icon10.svg); background-size: 15px 14px;}
background-image: url(../../public/static/images/canvas/side_icon04.svg);
}
&.btn05 {
background-image: url(../../public/static/images/canvas/side_icon05.svg);
}
&.btn06 {
background-image: url(../../public/static/images/canvas/side_icon06.svg);
}
&.btn07 {
background-image: url(../../public/static/images/canvas/side_icon07.svg);
}
&.btn08 {
background-image: url(../../public/static/images/canvas/side_icon08.svg);
}
&.btn09 {
background-image: url(../../public/static/images/canvas/side_icon09.svg);
}
&.btn10 {
background-image: url(../../public/static/images/canvas/side_icon10.svg);
background-size: 15px 14px;
}
&:hover{ &:hover{
background-color: #1083e3; background-color: #1083E3;
} }
&.active{ &.active{
background-color: #1083e3; background-color: #1083E3;
} }
} }
} }
@ -170,21 +135,11 @@
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
background-size: contain; background-size: contain;
&.ico01 { &.ico01{background-image: url(../../public/static/images/canvas/ico-flx01.svg);}
background-image: url(../../public/static/images/canvas/ico-flx01.svg); &.ico02{background-image: url(../../public/static/images/canvas/ico-flx02.svg);}
} &.ico03{background-image: url(../../public/static/images/canvas/ico-flx03.svg);}
&.ico02 { &.ico04{background-image: url(../../public/static/images/canvas/ico-flx04.svg);}
background-image: url(../../public/static/images/canvas/ico-flx02.svg); &.ico05{background-image: url(../../public/static/images/canvas/ico-flx05.svg);}
}
&.ico03 {
background-image: url(../../public/static/images/canvas/ico-flx03.svg);
}
&.ico04 {
background-image: url(../../public/static/images/canvas/ico-flx04.svg);
}
&.ico05 {
background-image: url(../../public/static/images/canvas/ico-flx05.svg);
}
} }
.name{ .name{
font-size: 12px; font-size: 12px;
@ -214,16 +169,16 @@
button{ button{
margin-left: auto; margin-left: auto;
height: 100%; height: 100%;
background-color: #4b4b4b; background-color: #4B4B4B;
font-size: 13px; font-size: 13px;
font-weight: 400; font-weight: 400;
color: #fff; color: #fff;
padding: 0 7.5px; padding: 0 7.5px;
transition: all 0.17s ease-in-out; transition: all .17s ease-in-out;
} }
&.on{ &.on{
button{ button{
background-color: #1083e3; background-color: #1083E3;
} }
} }
} }
@ -232,7 +187,7 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
gap: 10px; gap: 10px;
background-color: #3d3d3d; background-color: #3D3D3D;
border-radius: 2px; border-radius: 2px;
width: 100px; width: 100px;
height: 30px; height: 30px;
@ -266,7 +221,7 @@
background-color: #383838; background-color: #383838;
width: 100%; width: 100%;
height: 50px; height: 50px;
transition: all 0.17s ease-in-out; transition: all .17s ease-in-out;
.canvas-depth2-inner{ .canvas-depth2-inner{
display: flex; display: flex;
align-items: center; align-items: center;
@ -318,7 +273,7 @@
align-items: center; align-items: center;
margin-right: 34px; margin-right: 34px;
height: 100%; height: 100%;
transition: all 0.17s ease-in-out; transition: all .17s ease-in-out;
button{ button{
position: relative; position: relative;
font-size: 12px; font-size: 12px;
@ -358,7 +313,7 @@
// canvas-layout // canvas-layout
.canvas-content{ .canvas-content{
padding-top: 46.8px; padding-top: 46.8px;
transition: all 0.17s ease-in-out; transition: all .17s ease-in-out;
.canvas-frame{ .canvas-frame{
height: calc(100vh - 129.3px); height: calc(100vh - 129.3px);
} }
@ -376,11 +331,11 @@
top: 92.8px; top: 92.8px;
left: 0; left: 0;
display: flex; display: flex;
background-color: #1c1c1c; background-color: #1C1C1C;
border-top: 1px solid #000; border-top: 1px solid #000;
width: 100%; width: 100%;
min-width: 1280px; min-width: 1280px;
transition: all 0.17s ease-in-out; transition: all .17s ease-in-out;
z-index: 99; z-index: 99;
&.active{ &.active{
top: calc(92.8px + 50px); top: calc(92.8px + 50px);
@ -396,14 +351,14 @@
padding: 9.6px 20px; padding: 9.6px 20px;
border-right:1px solid #000; border-right:1px solid #000;
min-width: 0; min-width: 0;
transition: all 0.17s ease-in-out; transition: all .17s ease-in-out;
span{ span{
display: flex; display: flex;
align-items: center; align-items: center;
width: 100%; width: 100%;
font-size: 12px; font-size: 12px;
font-family: 'Pretendard', sans-serif; font-family: 'Pretendard', sans-serif;
color: #aaa; color: #AAA;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
@ -441,9 +396,9 @@
justify-content: center; justify-content: center;
width: 45px; width: 45px;
padding: 13.5px 0; padding: 13.5px 0;
background-color: #1c1c1c; background-color: #1C1C1C;
border-right: 1px solid #000; border-right: 1px solid #000;
transition: all 0.17s ease-in-out; transition: all .17s ease-in-out;
span{ span{
display: block; display: block;
width: 9px; width: 9px;
@ -461,9 +416,9 @@
.canvas-frame{ .canvas-frame{
position: relative; position: relative;
// height: calc(100% - 36.5px); // height: calc(100% - 36.5px);
background-color: #f4f4f7; background-color: #F4F4F7;
overflow: auto; overflow: auto;
transition: all 0.17s ease-in-out; transition: all .17s ease-in-out;
// &::-webkit-scrollbar { // &::-webkit-scrollbar {
// width: 10px; // width: 10px;
// height: 10px; // height: 10px;
@ -498,7 +453,7 @@
min-width: 1280px; min-width: 1280px;
height: 46px; height: 46px;
border-bottom: 1px solid #000; border-bottom: 1px solid #000;
background: #2c2c2c; background: #2C2C2C;
z-index: 999; z-index: 999;
.sub-header-inner{ .sub-header-inner{
display: flex; display: flex;
@ -521,9 +476,7 @@
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
background-size: cover; background-size: cover;
&.drawing { &.drawing{background-image: url(../../public/static/images/main/drawing_icon.svg);}
background-image: url(../../public/static/images/main/drawing_icon.svg);
}
} }
} }
&:after{ &:after{
@ -534,7 +487,7 @@
transform: translateY(-50%); transform: translateY(-50%);
width: 1px; width: 1px;
height: 16px; height: 16px;
background-color: #d9d9d9; background-color: #D9D9D9;
} }
&:first-child{ &:first-child{
padding-left: 0; padding-left: 0;
@ -564,7 +517,7 @@
span{ span{
display: flex; display: flex;
font-size: 12px; font-size: 12px;
color: #aaa; color: #AAA;
font-weight: normal; font-weight: normal;
cursor: default; cursor: default;
} }
@ -622,8 +575,8 @@
.sub-table-box{ .sub-table-box{
padding: 20px; padding: 20px;
border-radius: 6px; border-radius: 6px;
border: 1px solid #e9eaed; border: 1px solid #E9EAED;
background: #fff; background: #FFF;
box-shadow: 0px 3px 30px 0px rgba(0, 0, 0, 0.02); box-shadow: 0px 3px 30px 0px rgba(0, 0, 0, 0.02);
.table-box-title-wrap{ .table-box-title-wrap{
display: flex; display: flex;
@ -642,11 +595,10 @@
margin-right: 10px; margin-right: 10px;
} }
} }
.product_tit { .estimate-check-btn{
position: relative; position: relative;
font-size: 15px; display: flex;
font-weight: 600; align-items: center;
color: #1083e3;
padding-left: 10px; padding-left: 10px;
&::before{ &::before{
content: ''; content: '';
@ -656,7 +608,24 @@
transform: translateY(-50%); transform: translateY(-50%);
width: 1px; width: 1px;
height: 11px; height: 11px;
background-color: #d9d9d9; background-color: #D9D9D9;
}
}
.product_tit{
position: relative;
font-size: 15px;
font-weight: 600;
color: #1083E3;
padding-left: 10px;
&::before{
content: '';
position: absolute;
top: 50%;
left: 0;
transform: translateY(-50%);
width: 1px;
height: 11px;
background-color: #D9D9D9;
} }
} }
.option{ .option{
@ -677,7 +646,7 @@
span{ span{
font-weight: 600; font-weight: 600;
&.red{ &.red{
color: #e23d70; color: #E23D70;
} }
} }
&:after{ &:after{
@ -688,17 +657,10 @@
transform: translateY(-50%); transform: translateY(-50%);
width: 1px; width: 1px;
height: 11px; height: 11px;
background-color: #d9d9d9; background-color: #D9D9D9;
}
&:first-child {
padding-left: 0;
}
&:last-child {
padding-right: 0;
&::after {
display: none;
}
} }
&:first-child{padding-left: 0;}
&:last-child{padding-right: 0;&::after{display: none;}}
} }
} }
} }
@ -800,7 +762,7 @@
width: 105px; width: 105px;
height: 30px; height: 30px;
line-height: 30px; line-height: 30px;
background-color: #f4f4f7; background-color: #F4F4F7;
border-radius: 100px; border-radius: 100px;
text-align: center; text-align: center;
font-size: 13px; font-size: 13px;
@ -815,12 +777,12 @@
&.blue{ &.blue{
font-size: 16px; font-size: 16px;
font-weight: 700; font-weight: 700;
color: #1083e3; color: #1083E3;
} }
&.red{ &.red{
font-size: 16px; font-size: 16px;
font-weight: 700; font-weight: 700;
color: #d72a2a; color: #D72A2A;
} }
} }
} }
@ -834,11 +796,11 @@
padding: 10px; padding: 10px;
.btn-area{ .btn-area{
padding-bottom: 15px; padding-bottom: 15px;
border-bottom: 1px solid #ecf0f4; border-bottom: 1px solid #ECF0F4;
.file-upload{ .file-upload{
display: inline-block; display: inline-block;
height: 30px; height: 30px;
background-color: #94a0ad; background-color: #94A0AD;
padding: 0 10px; padding: 0 10px;
border-radius: 2px; border-radius: 2px;
font-size: 13px; font-size: 13px;
@ -846,9 +808,9 @@
color: #fff; color: #fff;
font-weight: 500; font-weight: 500;
cursor: pointer; cursor: pointer;
transition: background 0.15s ease-in-out; transition: background .15s ease-in-out;
&:hover{ &:hover{
background-color: #607f9a; background-color: #607F9A;
} }
} }
} }
@ -873,7 +835,7 @@
span{ span{
position: relative; position: relative;
font-size: 13px; font-size: 13px;
color: #45576f; color: #45576F;
font-weight: 400; font-weight: 400;
white-space: nowrap; white-space: nowrap;
padding-right: 55px; padding-right: 55px;
@ -903,7 +865,7 @@
.return{ .return{
padding: 0; padding: 0;
font-size: 13px; font-size: 13px;
color: #b0bccd; color: #B0BCCD;
text-decoration: line-through; text-decoration: line-through;
} }
.return-btn{ .return-btn{
@ -918,10 +880,10 @@
padding: 0 9px; padding: 0 9px;
margin-left: 10px; margin-left: 10px;
background: none; background: none;
border: 1px solid #b0bccd; border: 1px solid #B0BCCD;
border-radius: 2px; border-radius: 2px;
font-size: 12px; font-size: 12px;
color: #b0bccd; color: #B0BCCD;
font-weight: 500; font-weight: 500;
.return-ico{ .return-ico{
display: block; display: block;
@ -941,8 +903,8 @@
display: block; display: block;
width: 20px; width: 20px;
height: 20px; height: 20px;
background-color: #94a0ad; background-color: #94A0AD;
border: 1px solid #94a0ad; border: 1px solid #94A0AD;
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
background-image: url(../../public/static/images/canvas/estiment_arr.svg); background-image: url(../../public/static/images/canvas/estiment_arr.svg);
@ -953,8 +915,8 @@
} }
&.on{ &.on{
background-color: #fff; background-color: #fff;
border-color: #c2d0dd; border-color: #C2D0DD;
background-image: url(../../public/static/images/canvas/estiment_arr_color.svg); background-image: url(../../public/static/images/canvas/estiment_arr_color.svg)
} }
} }
.estimate-check-wrap{ .estimate-check-wrap{
@ -962,7 +924,7 @@
display: block; display: block;
} }
&.hide{ &.hide{
border-bottom: 1px solid #ecf0f4; border-bottom: 1px solid #ECF0F4;
margin-bottom: 15px; margin-bottom: 15px;
.estimate-check-inner{ .estimate-check-inner{
display: none; display: none;
@ -977,18 +939,18 @@
margin-bottom: 30px; margin-bottom: 30px;
.special-note-check-item{ .special-note-check-item{
padding: 14px 10px; padding: 14px 10px;
border: 1px solid #ecf0f4; border: 1px solid #ECF0F4;
margin-top: -1px; margin-top: -1px;
margin-right: -1px; margin-right: -1px;
&.act{ &.act{
background-color: #f7f9fa; background-color: #F7F9FA;
} }
.special-note-check-box{ .special-note-check-box{
display: flex; display: flex;
align-items: center; align-items: center;
.check-name{ .check-name{
font-size: 13px; font-size: 13px;
color: #45576f; color: #45576F;
cursor: pointer; cursor: pointer;
line-height: 1.3; line-height: 1.3;
} }
@ -997,10 +959,10 @@
} }
.calculation-estimate{ .calculation-estimate{
border: 1px solid #ecf0f4; border: 1px solid #ECF0F4;
border-radius: 3px; border-radius: 3px;
padding: 24px; padding: 24px;
height: 350px; height: 170px;
overflow-y: auto; overflow-y: auto;
margin-bottom: 30px; margin-bottom: 30px;
dl{ dl{
@ -1011,13 +973,13 @@
dt{ dt{
font-size: 13px; font-size: 13px;
font-weight: 600; font-weight: 600;
color: #1083e3; color: #1083E3;
margin-bottom: 15px; margin-bottom: 15px;
} }
dd{ dd{
font-size: 12px; font-size: 12px;
font-weight: 400; font-weight: 400;
color: #45576f; color: #45576F;
margin-bottom: 8px; margin-bottom: 8px;
&:last-child{ &:last-child{
margin-bottom: 0; margin-bottom: 0;
@ -1049,11 +1011,11 @@
.product-price-tit{ .product-price-tit{
font-size: 13px; font-size: 13px;
font-weight: 400; font-weight: 400;
color: #45576f; color: #45576F;
margin-right: 10px; margin-right: 10px;
} }
.select-wrap{ .select-wrap{
width: 110px; width: 150px;
} }
} }
.product-edit-wrap{ .product-edit-wrap{
@ -1087,7 +1049,7 @@
transform: translateY(-50%); transform: translateY(-50%);
width: 1px; width: 1px;
height: 12px; height: 12px;
background-color: #d9d9d9; background-color: #D9D9D9;
} }
&:first-child{ &:first-child{
padding-left: 0; padding-left: 0;
@ -1099,7 +1061,7 @@
padding-right: 0; padding-right: 0;
} }
&.item01{ &.item01{
color: #3bbb48; color: #3BBB48;
span{ span{
background-image: url(../../public/static/images/sub/open_ico.svg); background-image: url(../../public/static/images/sub/open_ico.svg);
} }
@ -1111,13 +1073,13 @@
} }
} }
&.item03{ &.item03{
color: #0191c9; color: #0191C9;
span{ span{
background-image: url(../../public/static/images/sub/attachment_ico.svg); background-image: url(../../public/static/images/sub/attachment_ico.svg);
} }
} }
&.item04{ &.item04{
color: #f16a6a; color: #F16A6A;
span{ span{
background-image: url(../../public/static/images/sub/click_check_ico.svg); background-image: url(../../public/static/images/sub/click_check_ico.svg);
} }
@ -1179,23 +1141,23 @@
table{ table{
table-layout: fixed; table-layout: fixed;
border-collapse:collapse; border-collapse:collapse;
border: 1px solid #ecf0f4; border: 1px solid #ECF0F4;
border-radius: 4px; border-radius: 4px;
thead{ thead{
th{ th{
padding: 4.5px 0; padding: 4.5px 0;
border-bottom: 1px solid #ecf0f4; border-bottom: 1px solid #ECF0F4;
text-align: center; text-align: center;
font-size: 13px; font-size: 13px;
color: #45576f; color: #45576F;
font-weight: 500; font-weight: 500;
background-color: #f8f9fa; background-color: #F8F9FA;
} }
} }
tbody{ tbody{
td{ td{
font-size: 13px; font-size: 13px;
color: #45576f; color: #45576F;
text-align: center; text-align: center;
padding: 4.5px 0; padding: 4.5px 0;
} }
@ -1209,13 +1171,13 @@
.simulation-tit-wrap{ .simulation-tit-wrap{
flex: none; flex: none;
padding-right: 40px; padding-right: 40px;
border-right: 1px solid #eeeeee; border-right: 1px solid #EEEEEE;
span{ span{
display: block; display: block;
position: relative; position: relative;
padding-left: 60px; padding-left: 60px;
font-size: 15px; font-size: 15px;
color: #14324f; color: #14324F;
font-weight: 600; font-weight: 600;
&::before{ &::before{
content: ''; content: '';
@ -1243,7 +1205,7 @@
} }
dd{ dd{
font-size: 12px; font-size: 12px;
color: #45576f; color: #45576F;
font-weight: 400; font-weight: 400;
line-height: 24px; line-height: 24px;
} }
@ -1251,8 +1213,7 @@
margin-bottom: 0; margin-bottom: 0;
} }
} }
ul, ul, ol{
ol {
list-style: unset; list-style: unset;
} }
} }
@ -1261,10 +1222,10 @@
.module-total{ .module-total{
display: flex; display: flex;
align-items: center; align-items: center;
background-color: #f8f9fa; background-color: #F8F9FA;
padding: 9px 0; padding: 9px 0;
margin-right: 4px; margin-right: 4px;
border: 1px solid #ecf0f4; border: 1px solid #ECF0F4;
border-top: none; border-top: none;
.total-title{ .total-title{
flex: 1; flex: 1;
@ -1287,7 +1248,7 @@
.information-help-wrap{ .information-help-wrap{
display: flex; display: flex;
padding: 24px; padding: 24px;
background-color: #f4f4f4; background-color: #F4F4F4;
border-radius: 4px; border-radius: 4px;
margin-bottom: 15px; margin-bottom: 15px;
.information-help-tit-wrap{ .information-help-tit-wrap{
@ -1295,7 +1256,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
padding-right: 40px; padding-right: 40px;
border-right: 1px solid #e0e0e3; border-right: 1px solid #E0E0E3;
.help-tit-icon{ .help-tit-icon{
width: 40px; width: 40px;
height: 40px; height: 40px;
@ -1307,7 +1268,7 @@
.help-tit{ .help-tit{
font-size: 13px; font-size: 13px;
font-weight: 600; font-weight: 600;
color: #45576f; color: #45576F;
} }
} }
.information-help-guide{ .information-help-guide{
@ -1316,7 +1277,7 @@
display: block; display: block;
font-size: 12px; font-size: 12px;
font-weight: 400; font-weight: 400;
color: #45576f; color: #45576F;
margin-bottom: 7px; margin-bottom: 7px;
&:last-child{ &:last-child{
margin-bottom: 0; margin-bottom: 0;
@ -1330,7 +1291,7 @@
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
padding: 10px 0 30px 0; padding: 10px 0 30px 0;
border-bottom: 1px solid #e5e5e5; border-bottom: 1px solid #E5E5E5;
margin-bottom: 24px; margin-bottom: 24px;
.community-search-box{ .community-search-box{
position: relative; position: relative;
@ -1349,7 +1310,7 @@
font-weight: 400; font-weight: 400;
color: #101010; color: #101010;
&::placeholder{ &::placeholder{
color: #c8c8c8; color: #C8C8C8;
} }
} }
.community-search-ico{ .community-search-ico{
@ -1368,10 +1329,10 @@
.community-search-keyword{ .community-search-keyword{
font-size: 13px; font-size: 13px;
font-weight: 400; font-weight: 400;
color: #45576f; color: #45576F;
span{ span{
font-weight: 600; font-weight: 600;
color: #f16a6a; color: #F16A6A;
} }
} }
} }
@ -1386,15 +1347,15 @@
align-items: center; align-items: center;
padding: 24px; padding: 24px;
border-radius: 4px; border-radius: 4px;
border: 1px solid #e5e5e5; border: 1px solid #E5E5E5;
background: #fff; background: #FFF;
transition: all 0.15s ease-in-out; transition: all .15s ease-in-out;
.file-item-info{ .file-item-info{
.item-num{ .item-num{
display: inline-block; display: inline-block;
padding: 6px 17.5px; padding: 6px 17.5px;
border-radius: 60px; border-radius: 60px;
background-color: #f4f4f7; background-color: #F4F4F7;
font-size: 13px; font-size: 13px;
font-weight: 600; font-weight: 600;
color: #101010; color: #101010;
@ -1426,7 +1387,7 @@
} }
} }
&:hover{ &:hover{
background-color: #f4f4f7; background-color: #F4F4F7;
} }
} }
} }
@ -1439,7 +1400,7 @@
height: 148px; height: 148px;
padding: 24px; padding: 24px;
border-radius: 4px; border-radius: 4px;
border: 1px solid #e5e5e5; border: 1px solid #E5E5E5;
font-size: 16px; font-size: 16px;
font-weight: 500; font-weight: 500;
color: #344356; color: #344356;
@ -1451,8 +1412,8 @@
align-items: center; align-items: center;
width: 200px; width: 200px;
height: 30px; height: 30px;
background-color: #fafafa; background-color: #FAFAFA;
border: 1px solid #eee; border: 1px solid #EEE;
padding: 0 10px; padding: 0 10px;
input{ input{
font-size: 13px; font-size: 13px;
@ -1576,4 +1537,5 @@
} }
} }
} }
} }

19
src/styles/_table.scss
View File

@ -311,6 +311,25 @@ table{
} }
} }
} }
&.min{
table{
tbody{
max-height: 150px;
td{
height: 30px;
}
}
}
}
}
&.min{
table{
tbody{
td{
font-size: 11px;
}
}
}
} }
} }