Skip to content

Commit

Permalink
format
Browse files Browse the repository at this point in the history
  • Loading branch information
ZOI-dayo committed Jun 15, 2024
1 parent 94deab9 commit 7e557b6
Show file tree
Hide file tree
Showing 5 changed files with 29 additions and 25 deletions.
8 changes: 4 additions & 4 deletions frontend/src/assets/main.css
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
@import './base.css';

:root {
--accent-color: #FF922B;
--primary-text-color: #1111111;
--dimmed-text-color: #888888;
--dimmed-border-color: #DDDDDD;
--accent-color: #ff922b;
--primary-text-color: #1111111;
--dimmed-text-color: #888888;
--dimmed-border-color: #dddddd;
}
10 changes: 5 additions & 5 deletions frontend/src/components/Avatar.vue
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
<script setup lang="ts">
defineProps<{
name: string,
size: string
}>()
const endpoint = "https://q.trap.jp/api/v3"
name: string;
size: string;
}>();
const endpoint = 'https://q.trap.jp/api/v3';
</script>

<template>
<img class="avatar" :src="`${endpoint}/public/icon/${name}`" />
<img class="avatar" :src="`${endpoint}/public/icon/${name}`" />
</template>

<style scoped>
Expand Down
6 changes: 3 additions & 3 deletions frontend/src/components/Button.vue
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
<script setup lang="ts">
defineProps<{
disabled: boolean
}>()
disabled: boolean;
}>();
</script>

<template>
<button type="button" :disabled="disabled"><slot /></button>
<button type="button" :disabled="disabled"><slot /></button>
</template>

<style lang="scss" scoped>
Expand Down
28 changes: 16 additions & 12 deletions frontend/src/components/NewPostSection.vue
Original file line number Diff line number Diff line change
@@ -1,17 +1,16 @@
<script setup lang="ts">
import Button from "./Button.vue"
import Avatar from "./Avatar.vue"
import {ref, computed} from "vue"
import Button from './Button.vue';
import Avatar from './Avatar.vue';
import { ref, computed } from 'vue';
defineProps<{
name: string,
}>()
name: string;
}>();
const inputContent = ref('')
const inputContent = ref('');
const canPost = computed(() => {
return (inputContent.value.length != 0) && (inputContent.value.length <= 280)
})
return inputContent.value.length != 0 && inputContent.value.length <= 280;
});
</script>

<template>
Expand All @@ -20,9 +19,15 @@ const canPost = computed(() => {
<Avatar :name="name" size="48px"></Avatar>
</div>
<div class="new-post-input-section">
<textarea type="text" placeholder="投稿する内容を入力(投稿時に自動で変換されます)" v-model="inputContent"/>
<textarea
type="text"
placeholder="投稿する内容を入力(投稿時に自動で変換されます)"
v-model="inputContent"
/>
<div class="post-footer">
<span :class="!canPost ? 'post-charcount-warn' : undefined">{{ inputContent.length }}/280文字</span>
<span :class="!canPost ? 'post-charcount-warn' : undefined"
>{{ inputContent.length }}/280文字</span
>
<span class="post-button">
<Button :disabled="!canPost">投稿する</Button>
</span>
Expand Down Expand Up @@ -70,5 +75,4 @@ const canPost = computed(() => {
}
}
}
</style>
2 changes: 1 addition & 1 deletion frontend/src/features/reactions.ts
Original file line number Diff line number Diff line change
@@ -1 +1 @@
export const reactionIcons = ['❤️', '🔥', '💧', '😢', '🤔'];
export const reactionIcons = ['❤️', '🔥', '💧', '😢', '🤔'];

0 comments on commit 7e557b6

Please sign in to comment.