btn css 수정
This commit is contained in:
parent
0d05666532
commit
2cc0db21ac
@ -14,6 +14,12 @@
|
|||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.btn.big {
|
||||||
|
width: 70px;
|
||||||
|
height: 70px;
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
/* board end */
|
/* board end */
|
||||||
|
|
||||||
/* 에러페이지 */
|
/* 에러페이지 */
|
||||||
|
|||||||
@ -1,9 +1,9 @@
|
|||||||
<template v-if="isRecommend">
|
<template v-if="isRecommend">
|
||||||
<button class="btn btn-label-primary btn-icon" :class="{ clicked: likeClicked, big: bigBtn }" @click="handleLike">
|
<button class="btn btn-label-primary btn-icon me-1" :class="{ clicked: likeClicked, big: bigBtn }" @click="handleLike">
|
||||||
<i class="fa-regular fa-thumbs-up"></i> <span class="num">{{ likeCount }}</span>
|
<i class="fa-regular fa-thumbs-up"></i> <span class="ms-1">{{ likeCount }}</span>
|
||||||
</button>
|
</button>
|
||||||
<button class="btn btn-label-danger btn-icon" :class="{ clicked: dislikeClicked, big: bigBtn }" @click="handleDislike">
|
<button class="btn btn-label-danger btn-icon" :class="{ clicked: dislikeClicked, big: bigBtn }" @click="handleDislike">
|
||||||
<i class="fa-regular fa-thumbs-down"></i> <span class="num">{{ dislikeCount }}</span>
|
<i class="fa-regular fa-thumbs-down"></i> <span class="ms-1">{{ dislikeCount }}</span>
|
||||||
</button>
|
</button>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -74,50 +74,3 @@
|
|||||||
likeClicked.value = false;
|
likeClicked.value = false;
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
.btn + .btn {
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.num {
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.btn-label-danger.clicked {
|
|
||||||
background-color: #e6381a;
|
|
||||||
}
|
|
||||||
|
|
||||||
.btn-label-danger.clicked i,
|
|
||||||
.btn-label-danger.clicked span {
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.btn-label-primary.clicked {
|
|
||||||
background-color: #5f61e6;
|
|
||||||
}
|
|
||||||
|
|
||||||
.btn-label-primary.clicked i,
|
|
||||||
.btn-label-primary.clicked span {
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.btn {
|
|
||||||
width: 55px;
|
|
||||||
/* height: 30px; */
|
|
||||||
}
|
|
||||||
|
|
||||||
.btn.big {
|
|
||||||
width: 70px;
|
|
||||||
height: 70px;
|
|
||||||
font-size: 18px;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 450px) {
|
|
||||||
.btn {
|
|
||||||
width: 50px;
|
|
||||||
height: 20px;
|
|
||||||
font-size: 12px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|||||||
@ -65,5 +65,3 @@ emit("addVacationRequests");
|
|||||||
defineExpose({ resetHalfDay });
|
defineExpose({ resetHalfDay });
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
</style>
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user