ProjectSegfault/website
4
2
Fork 1
mirror of https://github.com/ProjectSegfault/website synced 2026-05-04 21:21:34 +05:30
Code Issues Projects Releases Wiki Activity

requested changes

Browse Source
This commit is contained in:
Akis
2022-08-08 08:20:03 +03:00
parent 992d671b3d
commit 610ad6d5c7
18 changed files with 330 additions and 294 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lib/Card/CardInner.svelte
+49 -49
View File
@@ -1,64 +1,64 @@
<script lang="ts">
export let title: any;
export let position: any;
export let description: any;
export let icon: any;
export let title: any;
export let position: any;
export let description: any;
export let icon: any;
</script>
<div class="card-inner">
<div class="main">
{#if icon}
<div>
<img src={icon} alt="{title} icon">
</div>
{/if}
<div>
<span>
{title}
{#if position}
- {position}
{/if}
</span>
{#if description}
<p class="description">{description}</p>
{/if}
</div>
</div>
<slot />
<div class="main">
{#if icon}
<div>
<img src={icon} alt="{title} icon" />
</div>
{/if}
<div>
<span>
{title}
{#if position}
- {position}
{/if}
</span>
{#if description}
<p class="description">{description}</p>
{/if}
</div>
</div>
<slot />
</div>
<style>
.card-inner {
background-color: var(--secondary);
.card-inner {
background-color: var(--secondary);
border-radius: 10px;
padding: 1rem;
width: 30em;
display: flex;
flex-direction: column;
}
@media screen and (max-width: 555px) {
.card-inner {
width: 18em;
}
}
.main {
flex: 1;
display: flex;
flex-direction: row;
gap: 1rem;
}
img {
height: 5rem;
border-radius: 10px;
}
@media screen and (max-width: 555px) {
.card-inner {
width: 18em;
}
}
span {
font-size: 25px;
font-weight: bold;
}
</style>
.main {
flex: 1;
display: flex;
flex-direction: row;
gap: 1rem;
}
img {
height: 5rem;
border-radius: 10px;
}
span {
font-size: 25px;
font-weight: bold;
}
</style>
src/lib/Card/CardOuter.svelte
+5 -5
View File
@@ -1,12 +1,12 @@
<div class="card-outer">
<slot />
<slot />
</div>
<style>
div {
display: flex;
div {
display: flex;
flex-direction: column;
gap: 2rem;
flex-flow: row wrap;
}
</style>
}
</style>
src/lib/Card/Link.svelte
+8 -8
View File
@@ -1,14 +1,14 @@
<script lang="ts">
export let url: any;
export let classes: string;
export let url: any;
export let classes: string;
</script>
<a href={url} class="{classes}">
<slot />
<a href={url} class={classes}>
<slot />
</a>
<style>
.web,
.web,
.email,
.picture,
.pgp {
@@ -27,7 +27,7 @@
color: #333 !important;
}
.matrixcolored {
.matrixcolored {
background-color: #333;
color: #fff !important;
font-size: 20px;
@@ -48,7 +48,7 @@
height: 23px;
}
a {
a {
border: none;
border-radius: 10px;
padding: 0.5rem;
@@ -58,4 +58,4 @@
text-decoration: none;
width: fit-content;
}
</style>
</style>
src/lib/Card/LinksOuter.svelte
+3 -3
View File
@@ -1,11 +1,11 @@
<div>
<slot />
<slot />
</div>
<style>
div {
div {
display: flex;
flex-direction: row;
gap: 0.5rem;
}
</style>
</style>