152 lines
2.5 KiB
Plaintext
152 lines
2.5 KiB
Plaintext
@import "../../../style/CommonStyle.module.less";
|
|
@import "../../../style/utils.module.less";
|
|
|
|
.container {
|
|
border-radius: 10px;
|
|
box-shadow: 0 0 50px 0 rgba(2, 3, 3, 0.5);
|
|
border: solid 6px #1a1a1a;
|
|
background-color: #7a808d;
|
|
padding: 6px;
|
|
color: #fff;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
line-height: 1.29;
|
|
word-break: normal;
|
|
&.us {
|
|
.size(@w: 180px , @h: 270px);
|
|
> div {
|
|
> div {
|
|
flex: none;
|
|
&:nth-child(1) {
|
|
.size(@w:156px,@h:156px);
|
|
}
|
|
}
|
|
.text {
|
|
font-size: 27px;
|
|
margin-top: 12px;
|
|
}
|
|
}
|
|
}
|
|
&.gb {
|
|
.size(@w: 156px , @h: 228px);
|
|
> div {
|
|
.text {
|
|
font-size: 25px;
|
|
margin-top: 11px;
|
|
}
|
|
}
|
|
}
|
|
&.ru {
|
|
.size(@w: 180px , @h: 270px);
|
|
> div {
|
|
> div {
|
|
flex: none;
|
|
&:nth-child(1) {
|
|
.size(@w:156px,@h:156px);
|
|
}
|
|
}
|
|
.text {
|
|
font-size: 17px;
|
|
margin-top: 23px;
|
|
}
|
|
}
|
|
}
|
|
|
|
&.de {
|
|
.size(@w: 180px , @h: 272px);
|
|
> div {
|
|
> div {
|
|
flex: none;
|
|
&:nth-child(1) {
|
|
.size(@w:156px,@h:156px);
|
|
}
|
|
}
|
|
.text {
|
|
margin-top: 10px;
|
|
font-size: 26px;
|
|
line-height: 26px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.qrRollingWrap {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: center;
|
|
align-items: center;
|
|
text-align: center;
|
|
width: 100%;
|
|
height: 100%;
|
|
background: @COLOR_WHITE;
|
|
|
|
.innerText {
|
|
width: 100%;
|
|
padding: 0 10px;
|
|
|
|
h3 {
|
|
word-break: break-word;
|
|
font-size: 24px;
|
|
font-weight: bold;
|
|
color: @PRIMARY_COLOR_RED;
|
|
|
|
& + p {
|
|
margin-top: 10px;
|
|
}
|
|
}
|
|
|
|
p {
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
line-height: 1.2;
|
|
color: @COLOR_GRAY05;
|
|
word-break: keep-all;
|
|
}
|
|
}
|
|
}
|
|
|
|
// 국가별 롤링 텍스트 크기 조정 (폰트 사이즈만)
|
|
&.us .qrRollingWrap {
|
|
.innerText {
|
|
h3 {
|
|
font-size: 27px;
|
|
}
|
|
p {
|
|
font-size: 18px;
|
|
}
|
|
}
|
|
}
|
|
|
|
&.ru .qrRollingWrap {
|
|
.innerText {
|
|
h3 {
|
|
font-size: 22px;
|
|
}
|
|
p {
|
|
font-size: 15px;
|
|
}
|
|
}
|
|
}
|
|
|
|
&.de .qrRollingWrap {
|
|
.innerText {
|
|
h3 {
|
|
font-size: 26px;
|
|
}
|
|
p {
|
|
font-size: 17px;
|
|
}
|
|
}
|
|
}
|
|
|
|
&.gb .qrRollingWrap {
|
|
.innerText {
|
|
h3 {
|
|
font-size: 23px;
|
|
}
|
|
p {
|
|
font-size: 16px;
|
|
}
|
|
}
|
|
}
|
|
}
|