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

add descriptions and update card component

Browse Source
This commit is contained in:
Jakub Mańczak
2021-07-31 18:16:52 +02:00
parent 4d54daee15
commit 86cd0987bd
2 changed files with 51 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/Card.vue
View File

@@ -10,10 +10,13 @@
<h3>{{ name }}</h3> <h3>{{ name }}</h3>
<p>{{ nickname }}</p> <p>{{ nickname }}</p>
</div> </div>
<p style="text-align: justify"> <div class="cardInnerInfoDescription">
<p style="text-align: left">
{{ description }} {{ description }}
</p> </p>
</div> </div>
<div class="cardInnerInfoMeta"></div>
</div>
</div> </div>
</div> </div>
</template> </template>
@@ -43,7 +46,7 @@ export default {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
.cardInnerPhoto { .cardInnerPhoto {
width: 8rem; min-width: 8rem;
height: 8rem; height: 8rem;
background-color: black; background-color: black;
border-top-left-radius: 3px; border-top-left-radius: 3px;
@@ -62,12 +65,21 @@ export default {
color: var(--graytext); color: var(--graytext);
} }
} }
.cardInnerInfoDescription {
// font-size: 0.8rem;
}
.cardInnerInfoMeta {
display: flex;
flex-direction: row;
}
} }
} }
&:hover, &:hover,
&:focus { &:focus {
// background-color: var(--gray);
border: 1px solid transparent; border: 1px solid transparent;
box-shadow: 0 0 10px black; box-shadow: 0 0 10px black;
outline: none;
} }
} }
</style> </style>

40
src/pages/Index.vue
View File

@@ -38,20 +38,50 @@
</p> </p>
</section> </section>
<section> <section>
<h2>Spis Moderacji + Bot</h2> <h2>Spis Moderacji</h2>
<p> <p>
Ludzie stojący za Gractwem - in progress! Ludzie stojący za Gractwem - in progress!
</p> </p>
<div class="cards"> <div class="cards">
<Card id="jamesen" name="Jakub Mańczak" nickname="j4mesen" photo="-" /> <Card
<Card id="kuolek" name="Olek Kulka" nickname="KuOlek" photo="-" /> id="jamesen"
<Card id="adam" name="Adam Cała" nickname="Be Elephant" photo="-" /> tabindex="0"
<Card id="mollin" name="Jakub Mollin" nickname="Mollin" photo="-" /> name="Jakub Mańczak"
nickname="j4mesen"
photo="-"
description="Odpowiedzialny za software podtrzymujący Gractwo."
/>
<Card
id="kuolek"
tabindex="0"
name="Olek Kulka"
nickname="KuOlek"
photo="-"
description="Reprezentant medialny."
/>
<Card
id="adam"
tabindex="0"
name="Adam Cała"
nickname="Be Elephant"
photo="-"
description=""
/>
<Card
id="mollin"
tabindex="0"
name="Jakub Mollin"
nickname="Mollin"
photo="-"
description=""
/>
<Card <Card
id="franek" id="franek"
tabindex="0"
name="Franek Cała" name="Franek Cała"
nickname="Bavil Gravlax" nickname="Bavil Gravlax"
photo="-" photo="-"
description="Pełnoprawny członek tajemnego społeczeństwa kocyków."
/> />
<Card name="... ?" /> <Card name="... ?" />
</div> </div>