메인 페이지 검색 영역 적용
현성필
|
Before Width: | Height: | Size: 270 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
Before Width: | Height: | Size: 83 KiB |
|
Before Width: | Height: | Size: 63 KiB |
|
Before Width: | Height: | Size: 14 KiB |
|
After Width: | Height: | Size: 859 KiB |
|
After Width: | Height: | Size: 259 KiB |
|
After Width: | Height: | Size: 38 KiB |
|
Before Width: | Height: | Size: 500 KiB |
|
Before Width: | Height: | Size: 82 KiB |
|
Before Width: | Height: | Size: 7.1 KiB |
|
Before Width: | Height: | Size: 21 KiB |
|
Before Width: | Height: | Size: 32 KiB |
|
Before Width: | Height: | Size: 111 KiB |
|
Before Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 22 KiB |
|
Before Width: | Height: | Size: 34 KiB |
|
Before Width: | Height: | Size: 35 KiB |
|
Before Width: | Height: | Size: 1.1 KiB |
|
Before Width: | Height: | Size: 1.4 KiB |
|
Before Width: | Height: | Size: 1.3 KiB |
|
Before Width: | Height: | Size: 1.7 KiB |
|
Before Width: | Height: | Size: 886 B |
|
Before Width: | Height: | Size: 1.2 KiB |
|
Before Width: | Height: | Size: 1.2 KiB |
|
Before Width: | Height: | Size: 1.7 KiB |
|
Before Width: | Height: | Size: 920 B |
|
Before Width: | Height: | Size: 1.2 KiB |
|
Before Width: | Height: | Size: 952 B |
|
Before Width: | Height: | Size: 1.4 KiB |
|
Before Width: | Height: | Size: 1.1 KiB |
|
Before Width: | Height: | Size: 1.5 KiB |
|
Before Width: | Height: | Size: 1.4 KiB |
|
Before Width: | Height: | Size: 1.8 KiB |
|
Before Width: | Height: | Size: 1.5 KiB |
|
Before Width: | Height: | Size: 2.0 KiB |
|
Before Width: | Height: | Size: 940 B |
|
Before Width: | Height: | Size: 1.3 KiB |
|
Before Width: | Height: | Size: 1.3 KiB |
|
Before Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 1.2 KiB |
|
Before Width: | Height: | Size: 1.5 KiB |
|
After Width: | Height: | Size: 24 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 58 KiB |
|
After Width: | Height: | Size: 202 KiB |
|
Before Width: | Height: | Size: 2.5 KiB |
|
Before Width: | Height: | Size: 3.3 KiB |
|
Before Width: | Height: | Size: 33 KiB |
|
Before Width: | Height: | Size: 177 KiB |
|
Before Width: | Height: | Size: 31 KiB |
|
Before Width: | Height: | Size: 157 KiB |
|
Before Width: | Height: | Size: 163 KiB |
|
Before Width: | Height: | Size: 140 KiB |
|
Before Width: | Height: | Size: 18 KiB |
|
Before Width: | Height: | Size: 133 KiB |
|
Before Width: | Height: | Size: 1.7 KiB |
|
Before Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 45 KiB |
|
Before Width: | Height: | Size: 93 KiB |
|
Before Width: | Height: | Size: 474 KiB |
@@ -82,7 +82,7 @@
|
||||
color: $text-dark;
|
||||
margin-bottom: $spacing-lg;
|
||||
padding-bottom: $spacing-md;
|
||||
border-bottom: 2px solid $border-gray;
|
||||
//border-bottom: 2px solid $border-gray;
|
||||
}
|
||||
|
||||
// Detail Grid
|
||||
|
||||
@@ -39,270 +39,259 @@
|
||||
|
||||
<!-- API 검색 섹션 -->
|
||||
<section class="api-search-section">
|
||||
<div class="container">
|
||||
<div class="search-container">
|
||||
<form th:action="@{/apis}" method="get" class="search-form">
|
||||
<div class="search-wrapper">
|
||||
<input type="text" class="search-input" placeholder="원하는 API를 검색해보세요" id="apiSearchInput" name="keyword">
|
||||
<button class="search-button" type="submit">
|
||||
<i class="fas fa-search"></i>
|
||||
<span>검색하기</span>
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
<div class="hashtag-suggestions" th:if="${hashtags != null and not #lists.isEmpty(hashtags)}">
|
||||
<span class="hashtag-label">추천 검색어:</span>
|
||||
<a href="#" class="hashtag" th:each="tag : ${hashtags}"
|
||||
th:data-search="${tag}"
|
||||
th:text="${'#' + tag}">
|
||||
</a>
|
||||
</div>
|
||||
<!-- Fallback hashtags if no hashtags from controller -->
|
||||
<div class="hashtag-suggestions" th:unless="${hashtags != null and not #lists.isEmpty(hashtags)}">
|
||||
<span class="hashtag-label">추천 검색어:</span>
|
||||
<a href="#" class="hashtag" data-search="계좌조회">#계좌조회</a>
|
||||
<a href="#" class="hashtag" data-search="송금API">#송금API</a>
|
||||
<a href="#" class="hashtag" data-search="실시간결제">#실시간결제</a>
|
||||
<a href="#" class="hashtag" data-search="오픈뱅킹">#오픈뱅킹</a>
|
||||
</div>
|
||||
<div class="curved-background"></div>
|
||||
<div class="search-content-wrapper">
|
||||
<div class="search-character">
|
||||
<img th:src="@{/img/img_search_character.png}" alt="검색">
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="api-showcase">
|
||||
<div class="container">
|
||||
<div class="section-header">
|
||||
<h2 class="section-title">
|
||||
<span class="title-highlight">인기 API</span>로 바로 시작하세요
|
||||
<div class="search-text-content">
|
||||
<h2 class="search-title">
|
||||
원하는 API를<br>
|
||||
지금 검색해 보세요.
|
||||
</h2>
|
||||
<p class="section-subtitle">가장 많이 사용되는 API를 확인하고 바로 테스트해보세요</p>
|
||||
</div>
|
||||
<div class="api-grid">
|
||||
<!-- Dynamic API Cards from Controller (max 4) -->
|
||||
<div th:each="api, iterStat : ${apis}"
|
||||
th:if="${iterStat.index < 4}"
|
||||
class="api-card"
|
||||
th:classappend="${iterStat.index == 0} ? 'api-card-popular' : (${iterStat.index == 3} ? 'api-card-new' : '')">
|
||||
|
||||
<!-- Show badge for first (인기) and last (NEW) items -->
|
||||
<div th:if="${iterStat.index == 0}" class="api-badge">인기</div>
|
||||
<div th:if="${iterStat.index == 3}" class="api-badge new">NEW</div>
|
||||
|
||||
<!-- API Icon - using different icons based on index or API type -->
|
||||
<div class="api-icon">
|
||||
<!-- Icon selection based on API name or service type -->
|
||||
<i th:if="${api.apiName != null}"
|
||||
th:class="${#strings.containsIgnoreCase(api.apiName, '계좌') or #strings.containsIgnoreCase(api.apiName, '조회')} ? 'fas fa-wallet' :
|
||||
(${#strings.containsIgnoreCase(api.apiName, '송금') or #strings.containsIgnoreCase(api.apiName, '이체')} ? 'fas fa-exchange-alt' :
|
||||
(${#strings.containsIgnoreCase(api.apiName, '카드') or #strings.containsIgnoreCase(api.apiName, '결제')} ? 'fas fa-credit-card' :
|
||||
(${#strings.containsIgnoreCase(api.apiName, 'AI') or #strings.containsIgnoreCase(api.apiName, '분석')} ? 'fas fa-chart-line' :
|
||||
(${iterStat.index == 0} ? 'fas fa-wallet' :
|
||||
(${iterStat.index == 1} ? 'fas fa-exchange-alt' :
|
||||
(${iterStat.index == 2} ? 'fas fa-credit-card' : 'fas fa-chart-line'))))))"></i>
|
||||
</div>
|
||||
|
||||
<!-- API Name -->
|
||||
<h3 class="api-name" th:text="${api.apiName}">API 이름</h3>
|
||||
|
||||
<!-- API Description -->
|
||||
<p class="api-description" th:text="${api.apiSimpleDescription != null ? api.apiSimpleDescription : api.description}">API 설명</p>
|
||||
|
||||
<!-- API Features/Method Info -->
|
||||
<div class="api-features">
|
||||
<span class="feature-tag" th:if="${api.apiMethod != null}" th:text="${api.apiMethod}">GET</span>
|
||||
<span class="feature-tag" th:if="${api.service != null}" th:text="${api.service}">서비스</span>
|
||||
</div>
|
||||
|
||||
<!-- Test Link -->
|
||||
<a th:href="@{/apis/detail(id=${api.apiId})}" class="api-link">
|
||||
테스트하기 <i class="fas fa-arrow-right"></i>
|
||||
</div>
|
||||
<div class="search-input-wrapper">
|
||||
<form th:action="@{/apis}" method="get" class="search-form">
|
||||
<div class="search-box">
|
||||
<input type="text" class="search-input" placeholder="어떤 API를 칮고 계신가요?" id="apiSearchInput" name="keyword">
|
||||
<button class="search-icon-button" type="submit">
|
||||
<svg width="33" height="34" viewBox="0 0 33 34" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M15.1738 0C23.5534 0.000258465 30.3465 6.79327 30.3467 15.1729C30.3467 18.6141 29.2001 21.7875 27.2695 24.333C27.2733 24.3367 27.2775 24.34 27.2812 24.3438L32.1348 29.1973C33.1223 30.1849 33.1223 31.7859 32.1348 32.7734C31.1472 33.7609 29.5461 33.7609 28.5586 32.7734L23.7051 27.9199C23.6653 27.8802 23.6293 27.8376 23.5928 27.7959C21.1837 29.406 18.2889 30.3466 15.1738 30.3467C6.79392 30.3467 0 23.5528 0 15.1729C0.000201956 6.79311 6.79404 0 15.1738 0ZM15.1738 5.05762C9.58735 5.05762 5.05782 9.58642 5.05762 15.1729C5.05762 20.7595 9.58722 25.2891 15.1738 25.2891C20.7602 25.2888 25.2891 20.7593 25.2891 15.1729C25.2889 9.58658 20.7601 5.05788 15.1738 5.05762Z" fill="#0049B4"/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="hashtag-section">
|
||||
<span class="hashtag-label">자주찾는 API</span>
|
||||
<div class="hashtag-list" th:if="${hashtags != null and not #lists.isEmpty(hashtags)}">
|
||||
<th:block th:each="hashtag, iterStat : ${hashtags}">
|
||||
<a href="#" class="hashtag-link" th:data-search="${hashtag}" th:text="${'#' + hashtag}">
|
||||
</a>
|
||||
<span class="hashtag-separator" th:unless="${iterStat.last}">|</span>
|
||||
</th:block>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 추천 API 섹션 - Figma Design -->
|
||||
<section class="api-showcase">
|
||||
<div class="showcase-wrapper">
|
||||
<div class="section-header">
|
||||
<h2 class="section-title">추천 API</h2>
|
||||
<p class="section-subtitle">다양한 금융 API상품을 소개합니다.</p>
|
||||
<a th:href="@{/apis}" class="btn-all-apis">
|
||||
API 전체보기
|
||||
<svg width="7" height="15" viewBox="0 0 7 15" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1 1L6 7.5L1 14" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="api-cards-container">
|
||||
<!-- 1원 이체 인증 -->
|
||||
<div class="api-card">
|
||||
<h3 class="card-title">1원 이체 인증</h3>
|
||||
<p class="card-description">
|
||||
고객이 기존에 가지고 있는 계좌로 이체를 통해서 간편하게 비대면 실명확인을 도와드리는 서비스입니다.
|
||||
</p>
|
||||
<div class="card-illustration">
|
||||
<img th:src="@{/img/api_icon_1won.png}" alt="1원 이체 인증">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Fallback: Show static cards if no APIs from controller -->
|
||||
<div th:if="${apis == null or #lists.isEmpty(apis)}" class="api-card api-card-popular">
|
||||
<div class="api-badge">인기</div>
|
||||
<div class="api-icon">
|
||||
<i class="fas fa-wallet"></i>
|
||||
<!-- 수신 -->
|
||||
<div class="api-card">
|
||||
<h3 class="card-title">수신</h3>
|
||||
<p class="card-description">
|
||||
광주은행 수신 계좌들을 조회하는 서비스입니다.
|
||||
</p>
|
||||
<div class="card-illustration">
|
||||
<img th:src="@{/img/api_icon_deposit.png}" alt="수신">
|
||||
</div>
|
||||
<h3 class="api-name">계좌 조회 API</h3>
|
||||
<p class="api-description">실시간 잔액 조회와 거래내역을 안전하게 확인</p>
|
||||
<div class="api-features">
|
||||
<span class="feature-tag">실시간</span>
|
||||
<span class="feature-tag">OAuth 2.0</span>
|
||||
</div>
|
||||
<a href="#" class="api-link">
|
||||
테스트하기 <i class="fas fa-arrow-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div th:if="${apis == null or #lists.isEmpty(apis)}" class="api-card">
|
||||
<div class="api-icon">
|
||||
<i class="fas fa-exchange-alt"></i>
|
||||
|
||||
<!-- 여신 -->
|
||||
<div class="api-card">
|
||||
<h3 class="card-title">여신</h3>
|
||||
<p class="card-description">
|
||||
대출관련 한도, 금리와 대출 계좌들을 조회하는 서비스입니다.
|
||||
</p>
|
||||
<div class="card-illustration">
|
||||
<img th:src="@{/img/api_icon_loan.png}" alt="여신">
|
||||
</div>
|
||||
<h3 class="api-name">송금 API</h3>
|
||||
<p class="api-description">간편하고 안전한 송금 서비스 구현</p>
|
||||
<div class="api-features">
|
||||
<span class="feature-tag">간편송금</span>
|
||||
<span class="feature-tag">실명확인</span>
|
||||
</div>
|
||||
<a href="#" class="api-link">
|
||||
테스트하기 <i class="fas fa-arrow-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div th:if="${apis == null or #lists.isEmpty(apis)}" class="api-card">
|
||||
<div class="api-icon">
|
||||
<i class="fas fa-credit-card"></i>
|
||||
|
||||
<!-- 간편결제 -->
|
||||
<div class="api-card">
|
||||
<h3 class="card-title">간편결제</h3>
|
||||
<p class="card-description">
|
||||
광주은행 간편결제 승인/취소와 제휴 대사자료 생성/전송 요청하는 서비스입니다.
|
||||
</p>
|
||||
<div class="card-illustration">
|
||||
<img th:src="@{/img/api_icon_payment.png}" alt="간편결제">
|
||||
</div>
|
||||
<h3 class="api-name">카드 결제 API</h3>
|
||||
<p class="api-description">온/오프라인 결제 솔루션 통합</p>
|
||||
<div class="api-features">
|
||||
<span class="feature-tag">PG연동</span>
|
||||
<span class="feature-tag">간편결제</span>
|
||||
</div>
|
||||
<a href="#" class="api-link">
|
||||
테스트하기 <i class="fas fa-arrow-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div th:if="${apis == null or #lists.isEmpty(apis)}" class="api-card api-card-new">
|
||||
<div class="api-badge new">NEW</div>
|
||||
<div class="api-icon">
|
||||
<i class="fas fa-chart-line"></i>
|
||||
</div>
|
||||
<h3 class="api-name">AI 신용평가 API</h3>
|
||||
<p class="api-description">머신러닝 기반 실시간 신용 분석</p>
|
||||
<div class="api-features">
|
||||
<span class="feature-tag">AI/ML</span>
|
||||
<span class="feature-tag">실시간</span>
|
||||
</div>
|
||||
<a href="#" class="api-link">
|
||||
테스트하기 <i class="fas fa-arrow-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 정보 섹션 -->
|
||||
<!-- 정보 섹션 - Figma Design -->
|
||||
<section class="info-section">
|
||||
<div class="info-background"></div>
|
||||
<!-- <div class="info-point-image"></div>-->
|
||||
<div class="container">
|
||||
<div class="info-wrapper">
|
||||
<div class="image-container">
|
||||
<div class="image-placeholder">
|
||||
<i class="fas fa-chart-line"></i>
|
||||
<span>금융 혁신</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="info-content">
|
||||
<p class="highlight-text">
|
||||
광주은행 <span class="text-accent">API Portal</span>은 기업이 금융서비스를 편리하게 개발할 수 있도록<br>
|
||||
차별화된 API와 테스트환경을 제공합니다.
|
||||
<h2 class="info-title">
|
||||
차별화된 API 서비스,<br>
|
||||
<span class="title-highlight">광주은행 API Portal</span>
|
||||
</h2>
|
||||
<p class="info-description">
|
||||
광주은행 API Portal은 기업이 금융 서비스를 편리하게 개발할 수<br>
|
||||
있도록 차별화된 API와 테스트환경을 제공합니다.
|
||||
</p>
|
||||
|
||||
<div class="action-buttons">
|
||||
<a href="#" class="action-btn">
|
||||
<span class="btn-number">1</span>
|
||||
<span class="btn-text">처음 만나는 광주뱅크 API</span>
|
||||
<i class="fas fa-arrow-right"></i>
|
||||
<a href="#" class="action-btn action-btn-primary">
|
||||
처음 만나는 광주은행 API
|
||||
</a>
|
||||
<a href="#" class="action-btn">
|
||||
<span class="btn-number">2</span>
|
||||
<span class="btn-text">사업 제휴 문의</span>
|
||||
<i class="fas fa-arrow-right"></i>
|
||||
<a href="#" class="action-btn action-btn-secondary">
|
||||
사업 제휴 문의
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="info-image">
|
||||
<img th:src="@{/img/img_api_intro.png}" alt="광주은행 API">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 지원 센터 섹션 -->
|
||||
<!-- 지원 센터 섹션 - Figma Design -->
|
||||
<section class="support-center">
|
||||
<div class="support-background-pattern"></div>
|
||||
<div class="container">
|
||||
<div class="section-header">
|
||||
<h2 class="section-title">
|
||||
도움이 <span class="title-highlight">필요하신가요?</span>
|
||||
<span class="title-regular">비지니스의 시작,</span><br>
|
||||
<span class="title-bold">광주은행 오픈 API가 함께 하겠습니다.</span>
|
||||
</h2>
|
||||
<p class="section-subtitle">다양한 방법으로 필요한 정보를 찾아보세요</p>
|
||||
</div>
|
||||
<div class="support-grid">
|
||||
<a th:href="@{/portalnotice}" class="support-card">
|
||||
<!-- 공지사항 - 큰 카드 -->
|
||||
<a th:href="@{/portalnotice}" class="support-card support-card-large">
|
||||
<div class="card-icon">
|
||||
<i class="fas fa-bullhorn"></i>
|
||||
<img th:src="@{/img/icon_notice.png}" alt="공지사항">
|
||||
</div>
|
||||
<h3>공지사항</h3>
|
||||
<p>최신 업데이트와 중요한 소식을 확인하세요</p>
|
||||
<div class="card-arrow">
|
||||
<i class="fas fa-arrow-right"></i>
|
||||
</div>
|
||||
</a>
|
||||
<a th:href="@{/faq_list}" class="support-card">
|
||||
<div class="card-icon">
|
||||
<i class="fas fa-question-circle"></i>
|
||||
</div>
|
||||
<h3>자주 묻는 질문</h3>
|
||||
<p>자주 묻는 질문과 답변을 빠르게 찾아보세요</p>
|
||||
<div class="card-arrow">
|
||||
<i class="fas fa-arrow-right"></i>
|
||||
</div>
|
||||
</a>
|
||||
<a th:href="@{/inquiry}" class="support-card">
|
||||
<div class="card-icon">
|
||||
<i class="fas fa-comments"></i>
|
||||
</div>
|
||||
<h3>문의하기</h3>
|
||||
<p>추가 도움이 필요하시면 직접 문의해주세요</p>
|
||||
<div class="card-arrow">
|
||||
<i class="fas fa-arrow-right"></i>
|
||||
</div>
|
||||
<p>광주은행 API의 새로운 소식을 확인해보세요.</p>
|
||||
</a>
|
||||
|
||||
<!-- 오른쪽 작은 카드들 -->
|
||||
<div class="support-cards-small">
|
||||
<a th:href="@{/faq_list}" class="support-card support-card-small">
|
||||
<div class="card-icon">
|
||||
<img th:src="@{/img/icon_faq.png}" alt="FAQ">
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<h3>FAQ</h3>
|
||||
<p>자주 묻는 질문</p>
|
||||
</div>
|
||||
</a>
|
||||
<a th:href="@{/inquiry}" class="support-card support-card-small">
|
||||
<div class="card-icon">
|
||||
<img th:src="@{/img/icon_qna.png}" alt="Q&A">
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<h3>Q&A</h3>
|
||||
<p>문의하기</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- API 활용 현황 섹션 -->
|
||||
<!-- API 활용 현황 섹션 - Figma Design -->
|
||||
<section class="api-stats-section">
|
||||
<div class="stats-background"></div>
|
||||
<div class="container">
|
||||
<div class="section-header">
|
||||
<h2 class="section-title">
|
||||
우리곁의 수많은 서비스들이<br>
|
||||
<span class="title-highlight">광주은행 API</span>와 함께하고 있습니다
|
||||
<span class="title-top">우리곁의 수많은 서비스들이</span>
|
||||
<span class="title-highlight">광주은행 오픈 API</span>와 함께하고 있습니다.
|
||||
</h2>
|
||||
</div>
|
||||
<div class="stats-cards">
|
||||
<div class="stat-card">
|
||||
<p class="stat-label">서비스 이용 수</p>
|
||||
<div class="stat-icon">
|
||||
<i class="fas fa-store"></i>
|
||||
</div>
|
||||
<div class="stat-content">
|
||||
<div class="stat-number" th:attr="data-target=${serviceCount != null ? serviceCount : 0}" th:text="${serviceCount != null ? serviceCount : 0}">0</div>
|
||||
<div class="stat-label">서비스 이용 수</div>
|
||||
<div class="stat-description">다양한 분야의 서비스가 활용중</div>
|
||||
<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<rect width="100" height="100" fill="url(#pattern0_2007_122)"/>
|
||||
<defs>
|
||||
<pattern id="pattern0_2007_122" patternContentUnits="objectBoundingBox" width="1" height="1">
|
||||
<use xlink:href="#image0_2007_122" transform="translate(0 -0.00684932) scale(0.00684932)"/>
|
||||
</pattern>
|
||||
<image id="image0_2007_122" width="146" height="148" preserveAspectRatio="none" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJIAAACUCAYAAAB4InCTAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MjE2MEY5MTNCMUQwMTFGMEI4MkNBREYwOTFGQThDQ0YiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MjE2MEY5MTRCMUQwMTFGMEI4MkNBREYwOTFGQThDQ0YiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoyMTYwRjkxMUIxRDAxMUYwQjgyQ0FERjA5MUZBOENDRiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoyMTYwRjkxMkIxRDAxMUYwQjgyQ0FERjA5MUZBOENDRiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PtyO1z0AAAQbSURBVHja7N3BaxxlGMDhmWYT1myQNKlFFBHBg7fSCgUp8RAQLyIVevImnvwD9F/w4FXwJN48CYpIIVRz6KUgaOnNg9CDGMSULUqyW5qk4zt2rGabxOzOZmaSfR54mZKS3fm++ZHdaUOSZlmWQFmnbAFCojnyl7aT/vIW62vHfBizllVnrXjO9kT0c9JDirW1Yr7L6pM/d+ukhzQJL21vxyzX+PzLxTl4j3TMveEchDQOZ52DkBASQoIhtSZ9A7a2tpLNzc1Sj9HpdJLp6WkhTbKdnZ2k3++Xeox2uz3xIXlpQ0gICSGBkBASQkJIICSEhJAQEggJISEkEBJCQkgICYSEkBASQgIhISSEhJBASAgJIYGQGKND/XykLMteisPTFZxP/gO/f07T9FeX5sDr8WwcXoxJK3i63+J6/FQqpDjh83H4LOZcxRv1dRzejQXckc2ufTkTh09j3qz4eW/F4Z24HjeHfmmLT34+DqtVR1TIN2rlJP/E/BEuZr4XK1VHVMgbWC2aGPo90gcx8zXu3YWYKxJ65EqxJ3WZL5oYOqRLDdi8Jf00ai8ujRLSfANOvKOfRu3FvNt/jpSQEBLNMfLtda/XSzY2Nko9+cLCQtJqucMfh+3t7aTb7ZZ6jLm5uWR2drbakPLfGpj/1Pwy/Ibv8an7enhpw3skhISQQEgICSEhJBASQkJICAmEhJAQEggJISEkhARCQkgICSGBkBASQkJIICSEhJBASAgJISEkEBJCQkgICYSEkBASQgIhISSEBEJCSAgJIYGQEBJCQkggJISEkBASCAkhIST4r9aonzg1NZXMzMyUq/hU/R3n52Ad/17TykNqt9t/z3GXb/7i4uKxX0ceQZ3r8NKGkBASExTSegPO748xPEa3AevoNmQvylofJaTVBpz4t2N4jGsNWMe1huxFWfs2kWZZ9vAPabrrL+LjT8Xhh5jnatz81+O8sjIPEut4Ig43Ys7VtI5bMa/EOvol15FfoJWY12paxy8xL8c61gfO6+CvSMUnLMV8E/OgwhPON/zjmMtlIyrWkT/ecsznMfcrXMf94jmXy0ZUrCPfi8vF3vQrXMeDooGlwYgO9RVpoLon47BQ0YmvxbkcyQWPdczG4WxF6/g91tE7onXk//L4TFXv72Idfx5wLocPCf4vJLf/HPntPwgJISEkhARCQkgICYTEWD32PdtZlp2Ow6sxp20Pe7gbcz1N07v7hhQRvReHj2I69osDbEYr70dMn/zzgUf/aZs8/BaFL+0RQ3gr5qvBkH6MOW9vGMLNmAuDIe14882Q8m96mxq8a7tnXxjSvb1u/6/aF4Z0da832y/EfB9zxv5wCHdiLsbc3vUVKW7lbhd/8UVMzz6xj17RyMWimce+IsHI3KUhJJrjLwEGAL+X+MkwwRFJAAAAAElFTkSuQmCC"/>
|
||||
</defs>
|
||||
</svg>
|
||||
</div>
|
||||
<p class="stat-number" th:attr="data-target=${serviceCount != null ? serviceCount : 9999}" th:text="${serviceCount != null ? serviceCount : '9,999'}">9,999</p>
|
||||
</div>
|
||||
|
||||
<div class="stats-divider"></div>
|
||||
|
||||
<div class="stat-card">
|
||||
<p class="stat-label">API 이용 건수</p>
|
||||
<div class="stat-icon">
|
||||
<i class="fas fa-exchange-alt"></i>
|
||||
</div>
|
||||
<div class="stat-content">
|
||||
<div class="stat-number" th:attr="data-target=${totalApiCount != null ? totalApiCount : 0}" th:text="${totalApiCount != null ? totalApiCount : 0}">0</div>
|
||||
<div class="stat-label">API 이용 건수</div>
|
||||
<div class="stat-description">일일 평균 API 호출 수</div>
|
||||
<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<rect width="100" height="100" fill="url(#pattern0_2007_127)"/>
|
||||
<defs>
|
||||
<pattern id="pattern0_2007_127" patternContentUnits="objectBoundingBox" width="1" height="1">
|
||||
<use xlink:href="#image0_2007_127" transform="translate(0 -0.00684932) scale(0.00684932)"/>
|
||||
</pattern>
|
||||
<image id="image0_2007_127" width="146" height="148" preserveAspectRatio="none" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJIAAACUCAYAAAB4InCTAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDM4MERCNkFCMUQwMTFGMDhFRkQ5RTJDMzIxRTM5RTEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDM4MERCNkJCMUQwMTFGMDhFRkQ5RTJDMzIxRTM5RTEiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo0MzgwREI2OEIxRDAxMUYwOEVGRDlFMkMzMjFFMzlFMSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo0MzgwREI2OUIxRDAxMUYwOEVGRDlFMkMzMjFFMzlFMSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PlF4bcgAAAgiSURBVHja7J0LiBVV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"/>
|
||||
</defs>
|
||||
</svg>
|
||||
</div>
|
||||
<p class="stat-number" th:attr="data-target=${totalApiCount != null ? totalApiCount : 9999}" th:text="${totalApiCount != null ? totalApiCount : '9,999'}">9,999</p>
|
||||
</div>
|
||||
|
||||
<div class="stats-divider"></div>
|
||||
|
||||
<div class="stat-card">
|
||||
<p class="stat-label">API 활용 기업</p>
|
||||
<div class="stat-icon">
|
||||
<i class="fas fa-building"></i>
|
||||
</div>
|
||||
<div class="stat-content">
|
||||
<div class="stat-number" th:attr="data-target=${approvedOrgCount != null ? approvedOrgCount : 0}" th:text="${approvedOrgCount != null ? approvedOrgCount : 0}">0</div>
|
||||
<div class="stat-label">API 활용 기업</div>
|
||||
<div class="stat-description">혁신적인 파트너사와 함께</div>
|
||||
<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<rect width="100" height="100" fill="url(#pattern0_2007_161)"/>
|
||||
<defs>
|
||||
<pattern id="pattern0_2007_161" patternContentUnits="objectBoundingBox" width="1" height="1">
|
||||
<use xlink:href="#image0_2007_161" transform="translate(0 -0.00684932) scale(0.00684932)"/>
|
||||
</pattern>
|
||||
<image id="image0_2007_161" width="146" height="148" preserveAspectRatio="none" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJIAAACUCAYAAAB4InCTAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NkU5Mzk4MDhCMUQwMTFGMDlFMzFEOEYxRTE4RTBGOUIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NkU5Mzk4MDlCMUQwMTFGMDlFMzFEOEYxRTE4RTBGOUIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo2RTkzOTgwNkIxRDAxMUYwOUUzMUQ4RjFFMThFMEY5QiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo2RTkzOTgwN0IxRDAxMUYwOUUzMUQ4RjFFMThFMEY5QiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PvePPbQAAAbISURBVHja7J1biFVV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"/>
|
||||
</defs>
|
||||
</svg>
|
||||
</div>
|
||||
<p class="stat-number" th:attr="data-target=${approvedOrgCount != null ? approvedOrgCount : 9999}" th:text="${approvedOrgCount != null ? approvedOrgCount : '9,999'}">9,999</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 지금 바로 회원가입 CTA 섹션 - Figma Design -->
|
||||
<section class="signup-cta-section">
|
||||
<div class="cta-background"></div>
|
||||
<div class="container">
|
||||
<div class="cta-content">
|
||||
<h2 class="cta-title">광주은행 API를 지금 바로 만나보세요.</h2>
|
||||
<a th:href="@{/signup}" class="btn-signup-cta">회원가입하기</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cta-divider"></div>
|
||||
</section>
|
||||
</th:block>
|
||||
</body>
|
||||
<th:block layout:fragment="contentScript">
|
||||
|
||||