archiwum/old-gractwo-pl
Archived
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

move cards, enlarge cards, botcard tests

Browse Source
This commit is contained in:
Jakub Mańczak
2021-07-31 17:20:20 +02:00
parent 436be3c15a
commit b97b180f6f
3 changed files with 48 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

60
src/components/BotCard.vue
View File

@@ -1,24 +1,39 @@
<template> <template>
<div class="card"> <div v-if="status">
<h3>bot card</h3> <div class="card">
<p v-if="status"> <h3>bot card</h3>
Bot Name: <p>
{{ status.info.username + '#' + status.info.discriminator }} <br /> Bot Name:
Bot ID: {{ status.info.id }} <br /> {{ status.info.username + '#' + status.info.discriminator }} <br />
Bot Avatar: Bot ID: {{ status.info.id }} <br />
<img Bot Avatar:
:src=" <img
`https://cdn.discordapp.com/avatars/${status.info.id}/${ :src="
status.info.avatar `https://cdn.discordapp.com/avatars/${status.info.id}/${
}.png?size=64` status.info.avatar
" }.png?size=64`
alt="" "
v-if="status" alt=""
/> v-if="status"
<br /> />
Bot Status: {{ status.status }} <br /> <br />
Bot Info: {{ status.info }} Bot Status: {{ status.status }} <br />
</p> Bot Info: {{ status.info }}
</p>
</div>
<div class="card">
<div class="titleCard">
<img
:src="
`https://cdn.discordapp.com/avatars/${status.info.id}/${
status.info.avatar
}.png?size=64`
"
alt="Gractwo bot current avatar"
/>
<h3>{{ status.info.username + '#' + status.info.discriminator }}</h3>
</div>
</div>
</div> </div>
</template> </template>
@@ -58,6 +73,11 @@ export default {
margin: 1rem 0.2rem; margin: 1rem 0.2rem;
width: 100%; width: 100%;
transition-duration: var(--trandur); transition-duration: var(--trandur);
.titleCard {
display: flex;
flex-direction: row;
justify-content: baseline;
}
&:hover, &:hover,
&:focus { &:focus {
border: 1px solid transparent; border: 1px solid transparent;

2
src/components/Card.vue
View File

@@ -25,7 +25,7 @@ export default {
border-radius: 4px; border-radius: 4px;
padding: 1rem; padding: 1rem;
margin: 1rem 0.2rem; margin: 1rem 0.2rem;
width: 8rem; width: 45%;
transition-duration: var(--trandur); transition-duration: var(--trandur);
&:hover, &:hover,
&:focus { &:focus {

14
src/pages/Index.vue
View File

@@ -37,13 +37,6 @@
spotkań. Strona internetowa funkcjonuje głównie jako skracacz linków. spotkań. Strona internetowa funkcjonuje głównie jako skracacz linków.
</p> </p>
</section> </section>
<section>
<h2>Status Bota Discordowego</h2>
<p>
Sprawdź jak się ma nasz bot discordowy - in progress!
</p>
<BotCard />
</section>
<section> <section>
<h2>Spis Moderacji</h2> <h2>Spis Moderacji</h2>
<p> <p>
@@ -57,6 +50,13 @@
<Card id="franek" name="Franek Cała" /> <Card id="franek" name="Franek Cała" />
</div> </div>
</section> </section>
<section>
<h2>Status Bota Discordowego</h2>
<p>
Sprawdź jak się ma nasz bot discordowy - in progress!
</p>
<BotCard />
</section>
<section> <section>
<h3>Gractwo 2020-2021</h3> <h3>Gractwo 2020-2021</h3>
<p> <p>