yanghyo
10-24
no message
@d5a984d3b82313c1e82bcd421f97d8e19b0a2091
--- resources/front/site/SITE_00000/css/custom/page/_hwa.scss
... | ... | @@ -1,142 +0,0 @@ |
| 1 | -.summary-grid { | |
| 2 | - display: flex; | |
| 3 | - gap: $spacing-lg; | |
| 4 | - .profile-card { | |
| 5 | - display: flex; | |
| 6 | - padding: $spacing-xlg $spacing-2xlg; | |
| 7 | - align-items: center; | |
| 8 | - gap: 24px; | |
| 9 | - border-radius: $radius-md; | |
| 10 | - background: $color-background-default-secondary; | |
| 11 | - img { | |
| 12 | - width: 12rem; | |
| 13 | - height: 12rem; | |
| 14 | - border-radius: $radius-full; | |
| 15 | - border: $size-stroke-xsm solid $color-stroke-default-secondary; | |
| 16 | - background: url(<path-to-image>) lightgray -128.286px -25.307px / 318% 212% no-repeat; | |
| 17 | - } | |
| 18 | - .profile-info { | |
| 19 | - display: flex; | |
| 20 | - width: 219px; | |
| 21 | - flex-direction: column; | |
| 22 | - align-items: flex-start; | |
| 23 | - gap: $spacing-lg; | |
| 24 | - strong { | |
| 25 | - font-size: $size-font-xlg; | |
| 26 | - } | |
| 27 | - p { | |
| 28 | - color: $color-font-default-secondary; | |
| 29 | - } | |
| 30 | - } | |
| 31 | - } | |
| 32 | - .point-card { | |
| 33 | - display: flex; | |
| 34 | - padding: $spacing-xlg $spacing-2xlg; | |
| 35 | - align-items: center; | |
| 36 | - flex: 1; | |
| 37 | - border-radius: $radius-lg; | |
| 38 | - border: $size-stroke-xsm solid $color-stroke-default-tertiary; | |
| 39 | - background: $color-background-default-primary; | |
| 40 | - position: relative; | |
| 41 | - &::after { | |
| 42 | - content: ''; | |
| 43 | - position: absolute; | |
| 44 | - right: $spacing-2xlg; | |
| 45 | - bottom: 0; | |
| 46 | - width: 18.7rem; | |
| 47 | - height: 8rem; | |
| 48 | - background: url('/resources/front/site/SITE_00000/images/custom/common/img-obj.svg') | |
| 49 | - no-repeat right bottom / contain; | |
| 50 | - } | |
| 51 | - .point-list { | |
| 52 | - display: flex; | |
| 53 | - gap: $spacing-lg; | |
| 54 | - align-items: center; | |
| 55 | - } | |
| 56 | - .point-avail { | |
| 57 | - display: flex; | |
| 58 | - align-items: center; | |
| 59 | - gap: $spacing-xsm; | |
| 60 | - dt { | |
| 61 | - color: $color-font-default-tertiary; | |
| 62 | - } | |
| 63 | - dd { | |
| 64 | - min-width: $form-width-sm; | |
| 65 | - font-size: $size-font-3xlg; | |
| 66 | - text-align: right; | |
| 67 | - font-weight: bold; | |
| 68 | - } | |
| 69 | - &::after { | |
| 70 | - content: ''; | |
| 71 | - width: 4rem; | |
| 72 | - height: 4rem; | |
| 73 | - background: url('/resources/front/site/SITE_00000/images/custom/common/ico-img-point.svg')no-repeat center / contain; | |
| 74 | - } | |
| 75 | - } | |
| 76 | - .point-total { | |
| 77 | - display: flex; | |
| 78 | - height: 40px; | |
| 79 | - padding: 0 $spacing-md; | |
| 80 | - align-items: center; | |
| 81 | - gap: $spacing-2xsm; | |
| 82 | - border-radius: $radius-md; | |
| 83 | - background: $color-background-default-tertiary; | |
| 84 | - color: $color-font-default-secondary; | |
| 85 | - dd { | |
| 86 | - font-weight: bold; | |
| 87 | - } | |
| 88 | - } | |
| 89 | - } | |
| 90 | -} | |
| 91 | -.badge-set { | |
| 92 | - display: grid; | |
| 93 | - grid-template-columns: repeat(6, 1fr); | |
| 94 | - column-gap: $spacing-lg; | |
| 95 | - row-gap: $spacing-2xlg-4; | |
| 96 | - .badge-card { | |
| 97 | - display: flex; | |
| 98 | - flex-direction: column; | |
| 99 | - gap: $spacing-sm; | |
| 100 | - .badge-info { | |
| 101 | - display: flex; | |
| 102 | - flex-direction: column; | |
| 103 | - align-items: center; | |
| 104 | - gap: $spacing-lg; | |
| 105 | - padding: $spacing-lg $spacing-md; | |
| 106 | - border-radius: $radius-md; | |
| 107 | - border: $size-stroke-xsm solid $color-stroke-default-tertiary; | |
| 108 | - background: $color-background-default-primary; | |
| 109 | - flex: 1; | |
| 110 | - text-align: center; | |
| 111 | - figure { | |
| 112 | - display: flex; | |
| 113 | - width: 8rem; | |
| 114 | - height: 8rem; | |
| 115 | - justify-content: center; | |
| 116 | - align-items: center; | |
| 117 | - aspect-ratio: 1/1; | |
| 118 | - img { | |
| 119 | - width: 100%; | |
| 120 | - height: 100%; | |
| 121 | - } | |
| 122 | - } | |
| 123 | - p { | |
| 124 | - color: $color-font-default-secondary; | |
| 125 | - } | |
| 126 | - strong { | |
| 127 | - display: flex; | |
| 128 | - align-items: center; | |
| 129 | - font-size: $size-font-xlg; | |
| 130 | - gap: $spacing-2xsm; | |
| 131 | - color: $color-font-default-secondary; | |
| 132 | - &::before { | |
| 133 | - content: ""; | |
| 134 | - display: inline-block; | |
| 135 | - width: 2.4rem; | |
| 136 | - height: 2.4rem; | |
| 137 | - background: url("/resources/front/site/SITE_00000/images/custom/common/ico-img-point.svg") no-repeat center / contain; | |
| 138 | - } | |
| 139 | - } | |
| 140 | - } | |
| 141 | - } | |
| 142 | -}(파일 끝에 줄바꿈 문자 없음) |
Add a comment
Delete comment
Once you delete this comment, you won't be able to recover it. Are you sure you want to delete this comment?