# Type-A

Type-A는 미니게임의 종류를 알려줄 때 인트로 Custom Label로 자주 사용됩니다.

### 이미지

<figure><img src="https://2461137890-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FiW553XSGeKCAPpImxXi3%2Fuploads%2FxqWR6bWD4nJQsjbDOzQ0%2FMask%20group-1.png?alt=media&#x26;token=cc9ca6c3-63b4-49fa-8653-e78306a6d7f9" alt=""><figcaption></figcaption></figure>

### 예제코드

```javascript
function showLabelTypeA(player, key, text1, text2) {
    const isMobile = player.isMobile;
    const topGap = isMobile ? 10 : -2; // gap between top and label ( mobile 60px,  pc 48px ) 60px, pc는 48px이 되도록 설정한 값
    /**
     * Size-based @labelPercentWidth
     * XL: isMobile ? 90 : 50;
     * L: isMobile ? 80 : 40;
     * M: isMobile ? 70 : 28;
     * S: isMobile ? 60 : 20
     */
    const labelPercentWidth = isMobile ? 70 : 28;
    const labelDisplayTime = 300000;

    const parentStyle = `
    display: flex; 
    flex-direction: column; 
    align-items: center; 
    text-align: center;
    `;

    const firstRowStyle = `
    font-size: ${isMobile ? "14px" : "18px"};
    font-weight: 700; 
    color: white;`;

    const secondRowStyle = `
    font-size: ${isMobile ? "16px" : "24px"};
    font-weight: 800;
    color: #FFEB3A;`;

    const customLabelOption = {
        key: key,
        borderRadius: "12px",
        fontOpacity: false,
        padding: "8px",
    };

    let htmlStr = `<span style="${parentStyle}">
        <span style="${firstRowStyle}">${text1}</span>
        <span style="${secondRowStyle}">${text2}</span>
    </span>`;

    player.showCustomLabel(htmlStr, 0xffffff, 0x27262e, topGap, labelPercentWidth, 0.64, labelDisplayTime, customLabelOption);
}
```