fix: 비일관적인 breakpoint 정정

- md가 아니라 lg를 기준으로 잡아야 함
- lg의 기준 breakpoint를 940으로 변경
- is100pxMode의 기준 역시 lg breakpoint와 일치
This commit is contained in:
2023-06-30 16:30:44 +00:00
parent f8ebcf91b1
commit de17d87f47
44 changed files with 238 additions and 238 deletions
+11 -11
View File
@@ -32,10 +32,10 @@
<div class="closeDate f_tnum">{{ cutDateTime(auction.closeDate) }}</div>
</div>
<div v-if="selectedBuyRiceAuction !== undefined" class="row gx-1">
<div class="offset-1 col-4 offset-md-3 col-md-2 align-self-center f_tnum text-end">
<div class="offset-1 col-4 offset-lg-3 col-lg-2 align-self-center f_tnum text-end">
{{ selectedBuyRiceAuction.id }} {{ selectedBuyRiceAuction.amount }} 경매에
</div>
<div class="col-3 col-md-2">
<div class="col-3 col-lg-2">
<NumberInputWithInfo
v-model="bidAmountBuyRiceAuction"
:int="true"
@@ -44,7 +44,7 @@
:step="10"
></NumberInputWithInfo>
</div>
<div class="col-2 col-md-1 d-grid"><BButton @click="bidBuyRiceAuction">입찰</BButton></div>
<div class="col-2 col-lg-1 d-grid"><BButton @click="bidBuyRiceAuction">입찰</BButton></div>
</div>
<div style="background-color: skyblue"> 판매</div>
@@ -78,10 +78,10 @@
<div class="closeDate f_tnum">{{ cutDateTime(auction.closeDate) }}</div>
</div>
<div v-if="selectedSellRiceAuction !== undefined" class="row gx-1">
<div class="offset-1 col-4 offset-md-3 col-md-2 align-self-center f_tnum text-end">
<div class="offset-1 col-4 offset-lg-3 col-lg-2 align-self-center f_tnum text-end">
{{ selectedSellRiceAuction.id }} {{ selectedSellRiceAuction.amount }} 경매에
</div>
<div class="col-3 col-md-2">
<div class="col-3 col-lg-2">
<NumberInputWithInfo
v-model="bidAmountSellRiceAuction"
:int="true"
@@ -90,12 +90,12 @@
:step="10"
></NumberInputWithInfo>
</div>
<div class="col-2 col-md-1 d-grid"><BButton @click="bidSellRiceAuction">입찰</BButton></div>
<div class="col-2 col-lg-1 d-grid"><BButton @click="bidSellRiceAuction">입찰</BButton></div>
</div>
<div>경매 등록</div>
<div class="row gx-1">
<div class="col-2 offset-md-2 col-md-1">
<div class="col-2 offset-lg-2 col-lg-1">
매물<br />
<BButtonGroup>
<BButton :pressed="openAuctionInfo.type == 'buyRice'" @click="openAuctionInfo.type = 'buyRice'"> </BButton>
@@ -105,7 +105,7 @@
</BButtonGroup>
</div>
<div class="col col-md-2">
<div class="col col-lg-2">
수량 ({{ openAuctionInfo.type == "buyRice" ? "쌀" : "금" }})<br />
<NumberInputWithInfo
v-model="openAuctionInfo.amount"
@@ -115,7 +115,7 @@
:step="10"
></NumberInputWithInfo>
</div>
<div class="col-2 col-md-1">
<div class="col-2 col-lg-1">
기간()
<NumberInputWithInfo
v-model="openAuctionInfo.closeTurnCnt"
@@ -125,7 +125,7 @@
:step="1"
></NumberInputWithInfo>
</div>
<div class="col col-md-2">
<div class="col col-lg-2">
시작가 ({{ openAuctionInfo.type == "buyRice" ? "금" : "쌀" }})
<NumberInputWithInfo
v-model="openAuctionInfo.startBidAmount"
@@ -135,7 +135,7 @@
:step="10"
></NumberInputWithInfo>
</div>
<div class="col col-md-2">
<div class="col col-lg-2">
마감가 ({{ openAuctionInfo.type == "buyRice" ? "금" : "쌀" }})
<NumberInputWithInfo
v-model="openAuctionInfo.finishBidAmount"
+19 -19
View File
@@ -6,48 +6,48 @@
<template v-if="currentAuction !== undefined">
<div class="bg2">경매 {{ currentAuction.auction.id }} 상세</div>
<div class="row gx-0 text-center">
<div class="col-2 col-md-1 bg1">경매명</div>
<div v-b-tooltip.hover="getItemTooltipText(currentAuction.auction.target)" class="col-4 col-md-2">
<div class="col-2 col-lg-1 bg1">경매명</div>
<div v-b-tooltip.hover="getItemTooltipText(currentAuction.auction.target)" class="col-4 col-lg-2">
{{ currentAuction.auction.title }}
</div>
<div class="col-2 col-md-1 bg1">주최자(익명)</div>
<div :class="['col-4 col-md-2', currentAuction.auction.isCallerHost ? 'isMe' : '']">
<div class="col-2 col-lg-1 bg1">주최자(익명)</div>
<div :class="['col-4 col-lg-2', currentAuction.auction.isCallerHost ? 'isMe' : '']">
{{ currentAuction.auction.hostName }}
</div>
<div class="col-2 col-md-1 bg1">종료일시</div>
<div class="col-4 col-md-2 f_tnum">{{ cutDateTime(currentAuction.auction.closeDate, true) }}</div>
<div class="col-2 col-lg-1 bg1">종료일시</div>
<div class="col-4 col-lg-2 f_tnum">{{ cutDateTime(currentAuction.auction.closeDate, true) }}</div>
<div class="col-2 col-md-1 bg1">최대지연</div>
<div class="col-4 col-md-2 f_tnum">
<div class="col-2 col-lg-1 bg1">최대지연</div>
<div class="col-4 col-lg-2 f_tnum">
{{ cutDateTime(currentAuction.auction.availableLatestBidCloseDate, true) }}
</div>
</div>
<div class="bg1">입찰자 목록</div>
<div
class="row gx-0 px-md-5 text-center"
class="row gx-0 px-lg-5 text-center"
:style="{
borderBottom: 'solid 1px white',
}"
>
<div class="col-4 offset-md-2 col-md-3">입찰자</div>
<div class="col-4 col-md-2 text-end px-5">입찰포인트</div>
<div class="col-4 col-md-3">시각</div>
<div class="col-4 offset-lg-2 col-lg-3">입찰자</div>
<div class="col-4 col-lg-2 text-end px-5">입찰포인트</div>
<div class="col-4 col-lg-3">시각</div>
</div>
<div v-for="bidder of currentAuction.bidList" :key="bidder.amount" class="row gx-0 px-md-5 text-center">
<div :class="['col-4 offset-md-2 col-md-3', bidder.isCallerHighestBidder ? 'isMe' : '']">
<div v-for="bidder of currentAuction.bidList" :key="bidder.amount" class="row gx-0 px-lg-5 text-center">
<div :class="['col-4 offset-lg-2 col-lg-3', bidder.isCallerHighestBidder ? 'isMe' : '']">
{{ bidder.generalName }}
</div>
<div class="col-4 col-md-2 text-end px-5 f_tnum">{{ bidder.amount.toLocaleString() }}</div>
<div class="col-4 col-md-3 f_tnum">{{ cutDateTime(bidder.date) }}</div>
<div class="col-4 col-lg-2 text-end px-5 f_tnum">{{ bidder.amount.toLocaleString() }}</div>
<div class="col-4 col-lg-3 f_tnum">{{ cutDateTime(bidder.date) }}</div>
</div>
<div class="bg1">입찰하기</div>
<div class="row">
<label class="col-5 offset-md-3 col-md-3 col-form-label text-center"
<label class="col-5 offset-lg-3 col-lg-3 col-form-label text-center"
>유산포인트 (잔여: {{ currentAuction.remainPoint.toLocaleString() }}포인트)</label
>
<div class="col-4 col-md-2">
<div class="col-4 col-lg-2">
<NumberInputWithInfo
v-model="bidAmount"
:int="true"
@@ -57,7 +57,7 @@
:step="1"
></NumberInputWithInfo>
</div>
<div class="col-3 col-md-1 d-grid"><BButton @click="bidAuction">입찰</BButton></div>
<div class="col-3 col-lg-1 d-grid"><BButton @click="bidAuction">입찰</BButton></div>
</div>
</template>
+6 -6
View File
@@ -11,7 +11,7 @@
</div>
<div class="row bettingCandidates gx-1 gy-1">
<div v-for="(candidate, idx) in info.candidates" :key="idx" class="col-4 col-md-2" @click="toggleCandidate(parseInt(idx))">
<div v-for="(candidate, idx) in info.candidates" :key="idx" class="col-4 col-lg-2" @click="toggleCandidate(parseInt(idx))">
<div
:class="[
'bettingCandidate',
@@ -30,18 +30,18 @@
</div>
</div>
<div v-if="!info.finished && (yearMonth ?? 0) <= info.closeYearMonth" class="row gx-0">
<div class="col-6 col-md-3 align-self-center">
<div class="col-6 col-lg-3 align-self-center">
잔여 {{ info.reqInheritancePoint ? "포인트" : "금" }} : {{ bettingDetailInfo.remainPoint.toLocaleString() }}
</div>
<div class="col-6 col-md-3 align-self-center">
<div class="col-6 col-lg-3 align-self-center">
사용 포인트: {{ sum(Array.from(myBettings.values())).toLocaleString() }}
</div>
<div class="col-6 col-md-3 align-self-center">대상: {{ getTypeStr(pickedBetTypeKey) }}</div>
<div class="col-4 col-md-2 d-grid">
<div class="col-6 col-lg-3 align-self-center">대상: {{ getTypeStr(pickedBetTypeKey) }}</div>
<div class="col-4 col-lg-2 d-grid">
<!-- eslint-disable-next-line vue/max-attributes-per-line -->
<b-form-input v-model.number="betPoint" class="d-grid" type="number" :min="10" :max="1000" :step="10" />
</div>
<div class="col-2 col-md-1 d-grid">
<div class="col-2 col-lg-1 d-grid">
<b-button class="d-grid" @click="submitBet"> 베팅 </b-button>
</div>
</div>
+3 -3
View File
@@ -7,12 +7,12 @@
<div class="col articleTitle center">
{{ article.title }}
</div>
<div class="col-2 col-md-1 date center">
<div class="col-2 col-lg-1 date center">
{{ article.date.slice(5, 16) }}
</div>
</div>
<div class="row gx-0 s-border-b">
<div class="col-2 col-md-1 authorIcon center">
<div class="col-2 col-lg-1 authorIcon center">
<img class="generalIcon" width="64" height="64" :src="article.author_icon" />
</div>
<div class="col text">
@@ -36,7 +36,7 @@
@keyup.enter="submitComment"
/>
</div>
<div class="col-2 col-md-1 d-grid">
<div class="col-2 col-lg-1 d-grid">
<b-button class="submitComment" size="sm" @click="submitComment"> 등록 </b-button>
</div>
</div>
+1 -1
View File
@@ -8,7 +8,7 @@
<div class="col text">
{{ comment.text }}
</div>
<div class="col-2 col-md-1 date center d-grid">
<div class="col-2 col-lg-1 date center d-grid">
<div class="align-self-center">
{{ comment.date.slice(5, 16) }}
</div>
+11 -11
View File
@@ -12,7 +12,7 @@
</div>
</div>
<div :class="['row', 'controlPad', props.targetIsMe ? 'targetIsMe' : 'targetIsNotMe']">
<div class="col-3 col-md-12 order-md-last">
<div class="col-3 col-lg-12 order-lg-last">
<div class="d-grid mb-1 py-1 only500px bg1 center">
<div
:style="{
@@ -25,26 +25,26 @@
<div>{{ officer.officerLevelText }}</div>
</div>
<div class="row gx-1 gy-1 py-1">
<div class="col-md-4 mx-0 mb-0 mt-1 d-grid">
<div class="col-lg-4 mx-0 mb-0 mt-1 d-grid">
<div class="alert alert-primary mb-0 center" style="padding: 0.5rem 0">
<SimpleClock :serverTime="parseTime(props.date)" />
</div>
</div>
<div class="col-md-4 d-grid">
<div class="col-lg-4 d-grid">
<BButton variant="secondary" @click="isEditMode = !isEditMode">
{{ isEditMode ? "일반 모드" : "고급 모드" }}
</BButton>
</div>
<BDropdown class="col-md-4" text="반복">
<BDropdown class="col-lg-4" text="반복">
<BDropdownItem v-for="turnIdx in maxPushTurn" :key="turnIdx" @click="repeatNationCommand(turnIdx)">
{{ turnIdx }}
</BDropdownItem>
</BDropdown>
<template v-if="isEditMode">
<BDropdown class="col-md-4" left text="범위">
<BDropdown class="col-lg-4" left text="범위">
<BDropdownItem @click="queryActionHelper.selectTurn()"> 해제 </BDropdownItem>
<BDropdownItem @click="queryActionHelper.selectAll()"> 모든턴 </BDropdownItem>
<BDropdownItem @click="queryActionHelper.selectStep(0, 2)"> 홀수턴 </BDropdownItem>
@@ -67,7 +67,7 @@
</BDropdownText>
</BDropdown>
<BDropdown class="col-md-4" left text="보관함">
<BDropdown class="col-lg-4" left text="보관함">
<BDropdownItem
v-for="[actionKey, actions] of storedActions"
:key="actionKey"
@@ -78,7 +78,7 @@
</BDropdownItem>
</BDropdown>
<div class="col-md-4 d-grid">
<div class="col-lg-4 d-grid">
<BDropdown right text="최근">
<BDropdownItem
v-for="(action, idx) in Array.from(recentActions.values()).reverse()"
@@ -91,12 +91,12 @@
</div>
</template>
<BDropdown class="col-md-6" split text="당기기" @click="pullNationCommandSingle">
<BDropdown class="col-lg-6" split text="당기기" @click="pullNationCommandSingle">
<BDropdownItem v-for="turnIdx in maxPushTurn" :key="turnIdx" @click="pushNationCommand(-turnIdx)">
{{ turnIdx }}
</BDropdownItem>
</BDropdown>
<BDropdown class="col-md-6" split text="미루기" @click="pushNationCommandSingle">
<BDropdown class="col-lg-6" split text="미루기" @click="pushNationCommandSingle">
<BDropdownItem v-for="turnIdx in maxPushTurn" :key="turnIdx" @click="pushNationCommand(turnIdx)">
{{ turnIdx }}
</BDropdownItem>
@@ -217,7 +217,7 @@
</div>
<div v-if="isEditMode" class="row gx-0">
<div class="col-5 col-md-6 d-grid">
<div class="col-5 col-lg-6 d-grid">
<BDropdown left variant="light" :style="{ color: 'black' }" text="선택한 턴을">
<BDropdownItem @click="clipboardCut"> <i class="bi bi-scissors" />&nbsp;잘라내기 </BDropdownItem>
<BDropdownItem @click="clipboardCopy"> <i class="bi bi-files" />&nbsp;복사하기 </BDropdownItem>
@@ -245,7 +245,7 @@
</BDropdown>
</div>
<div class="col-7 col-md-6 d-grid">
<div class="col-7 col-lg-6 d-grid">
<BButton variant="info" @click="toggleForm($event)"> 명령 선택 </BButton>
</div>
</div>
+1 -1
View File
@@ -1,5 +1,5 @@
<template>
<nav class="gameBottomBar navbar-expand navbar-dark bg-dark d-sm-block d-md-none p-0">
<nav class="gameBottomBar navbar-expand navbar-dark bg-dark d-sm-block d-lg-none p-0">
<div class="collapse navbar-collapse">
<ul class="navbar-nav me-auto mx-auto">
<li class="nav-item dropup">
+13 -13
View File
@@ -4,39 +4,39 @@
<span class="avoid-wrap" style="color: cyan">{{ frontInfo?.global.scenarioText }}</span>
</h3>
<div v-if="frontInfo" class="gameInfo row gx-0">
<div class="s-border-t col py-2 col-8 col-md-4 subScenarioName" style="color: cyan">
<div class="s-border-t col py-2 col-8 col-lg-4 subScenarioName" style="color: cyan">
{{ globalInfo.scenarioText }}
</div>
<div class="s-border-t col py-2 col-4 col-md-2 subNPCType" style="color: cyan">
<div class="s-border-t col py-2 col-4 col-lg-2 subNPCType" style="color: cyan">
NPC , 상성:
{{ globalInfo.extendedGeneral ? "확장" : "표준" }}
{{ globalInfo.isFiction ? "가상" : "사실" }}
</div>
<div class="s-border-t col py-2 col-4 col-md-2 subNPCMode" style="color: cyan">
<div class="s-border-t col py-2 col-4 col-lg-2 subNPCMode" style="color: cyan">
NPC선택: {{ ["불가능", "가능", "선택 생성"][globalInfo.npcMode] }}
</div>
<div class="s-border-t col py-2 col-4 col-md-2 subTournamentMode" style="color: cyan">
<div class="s-border-t col py-2 col-4 col-lg-2 subTournamentMode" style="color: cyan">
토너먼트: 경기당 {{ calcTournamentTerm(globalInfo.turnterm) }}
</div>
<div class="s-border-t col py-2 col-4 col-md-2 subOtherSetting" style="color: cyan">
<div class="s-border-t col py-2 col-4 col-lg-2 subOtherSetting" style="color: cyan">
기타 설정:
<AutorunInfo :autorunMode="globalInfo.autorunUser" />
</div>
<div class="s-border-t col py-2 col-8 col-md-4 subYearMonth">
<div class="s-border-t col py-2 col-8 col-lg-4 subYearMonth">
현재: {{ globalInfo.year }} {{ globalInfo.month }} ({{ globalInfo.turnterm }} 서버)
</div>
<div class="s-border-t col py-2 col-4 col-md-2 subOnlineUserCnt">
<div class="s-border-t col py-2 col-4 col-lg-2 subOnlineUserCnt">
전체 접속자 : {{ (globalInfo.onlineUserCnt ?? 0).toLocaleString() }}
</div>
<div class="s-border-t col py-2 col-4 col-md-2 subAPILimit">
<div class="s-border-t col py-2 col-4 col-lg-2 subAPILimit">
턴당 갱신횟수: {{ globalInfo.apiLimit.toLocaleString() }}
</div>
<div class="s-border-t col py-2 col-8 col-md-4 subGeneralCnt">
<div class="s-border-t col py-2 col-8 col-lg-4 subGeneralCnt">
등록 장수: 유저
{{ createdUserCnt.toLocaleString() }} / {{ globalInfo.generalCntLimit.toLocaleString() }} +
<span style="color: cyan">NPC {{ createdNPCCnt.toLocaleString() }} </span>
</div>
<div class="s-border-t py-2 col col-6 col-md-4 subTournamentState">
<div class="s-border-t py-2 col col-6 col-lg-4 subTournamentState">
<span v-if="frontInfo.global.isTournamentActive">
<a v-if="tournamentStep.availableJoin" href="b_tournament.php" target="_blank">
<span style="color: cyan"
@@ -56,18 +56,18 @@
<span v-else style="color: magenta"> 현재 토너먼트 경기 없음 </span>
</div>
<div
class="s-border-t py-2 col col-6 col-md-2 subLastExecuted"
class="s-border-t py-2 col col-6 col-lg-2 subLastExecuted"
:style="{ color: serverLocked ? 'magenta' : 'cyan' }"
>
동작 시각: {{ formatTime(lastExecuted).substring(5) }}
</div>
<div class="s-border-t py-2 col col-6 col-md-2 subAuctionState">
<div class="s-border-t py-2 col col-6 col-lg-2 subAuctionState">
<a v-if="globalInfo.auctionCount" href="v_auction.php" target="_blank" style="color: cyan">
{{ globalInfo.auctionCount.toLocaleString() }} 거래 진행중
</a>
<span v-else style="color: magenta">진행중인 거래 없음</span>
</div>
<div class="s-border-t py-2 col col-6 col-md-4 subVoteState">
<div class="s-border-t py-2 col col-6 col-lg-4 subVoteState">
<a v-if="globalInfo.lastVote" href="v_vote.php" target="_blank">
<span style="color: cyan">설문 진행 : </span><span>{{ globalInfo.lastVote.title }}</span>
</a>
+3 -3
View File
@@ -1,7 +1,7 @@
<template>
<div class="MessagePanel">
<div class="MessageInputForm bg0 row gx-0">
<div id="mailbox_list-col" class="col-6 col-md-2 d-grid">
<div id="mailbox_list-col" class="col-6 col-lg-2 d-grid">
<BFormSelect v-model="targetMailbox" class="bg-dark text-white">
<optgroup
v-for="group of mailboxList"
@@ -26,10 +26,10 @@
</optgroup>
</BFormSelect>
</div>
<div id="msg_input-col" class="col-12 col-md-8 d-grid">
<div id="msg_input-col" class="col-12 col-lg-8 d-grid">
<input v-model="newMessageText" type="text" maxlength="99" class="form-control" @keydown.enter="sendMessage" />
</div>
<div id="msg_submit-col" class="col-6 col-md-2 d-grid">
<div id="msg_submit-col" class="col-6 col-lg-2 d-grid">
<BButton variant="primary" @click="sendMessage">서신전달&amp;갱신</BButton>
</div>
</div>
+7 -7
View File
@@ -63,24 +63,24 @@
Math.floor(nation.tech).toLocaleString()
}}</span>
</div>
<div class="strategicCmd-head tb-head bg1">전략</div>
<div v-if="!nation.id" class="strategicCmd-body tb-body">해당 없음</div>
<div class="strategicClg-head tb-head bg1">전략</div>
<div v-if="!nation.id" class="strategicClg-body tb-body">해당 없음</div>
<div
v-else-if="impossibleStrategicCommandText"
v-b-tooltip.hover="impossibleStrategicCommandText"
class="strategicCmd-body tb-body"
class="strategicClg-body tb-body"
style="text-decoration: underline dashed red"
>
<span v-if="nation.strategicCmdLimit" style="color: red">{{ nation.strategicCmdLimit.toLocaleString() }}</span>
<span v-else style="color: yellow">가능</span>
</div>
<div v-else class="strategicCmd-body tb-body">
<div v-else class="strategicClg-body tb-body">
<span v-if="nation.strategicCmdLimit" style="color: red">{{ nation.strategicCmdLimit.toLocaleString() }}</span>
<span v-else style="color: limegreen">가능</span>
</div>
<div class="diplomaticCmd-head tb-head bg1">외교</div>
<div v-if="!nation.id" class="diplomaticCmd-body tb-body">해당 없음</div>
<div v-else class="diplomaticCmd-body tb-body">
<div class="diplomaticClg-head tb-head bg1">외교</div>
<div v-if="!nation.id" class="diplomaticClg-body tb-body">해당 없음</div>
<div v-else class="diplomaticClg-body tb-body">
<span v-if="nation.diplomaticLimit" style="color: red">{{ nation.diplomaticLimit.toLocaleString() }}</span>
<span v-else style="color: limegreen">가능</span>
</div>