announcement cleanup
This commit is contained in:
@@ -1,9 +1,3 @@
|
|||||||
<!--
|
|
||||||
announcement.svelte
|
|
||||||
|
|
||||||
used to display a short announcement at the top of the site
|
|
||||||
-->
|
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { slide } from 'svelte/transition';
|
import { slide } from 'svelte/transition';
|
||||||
export let message;
|
export let message;
|
||||||
@@ -16,12 +10,13 @@
|
|||||||
|
|
||||||
{#if visible}
|
{#if visible}
|
||||||
<div transition:slide bind:this={noderef} class="announcement prevent-select" style="background-color: {color};">
|
<div transition:slide bind:this={noderef} class="announcement prevent-select" style="background-color: {color};">
|
||||||
|
|
||||||
{#if link}
|
{#if link}
|
||||||
<a href={link}>{message}</a>
|
<a href={link}>{message}</a>
|
||||||
{:else}
|
{:else}
|
||||||
{message}
|
{message}
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
<input class="close-button" type="button" value="" on:click={() => visible = false}>
|
<input class="close-button" type="button" value="" on:click={() => visible = false}>
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
@@ -31,22 +26,27 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
||||||
gap: 5px;
|
gap: 5px;
|
||||||
height: 36px;
|
height: 36px;
|
||||||
|
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
|
|
||||||
color: white;
|
color: white;
|
||||||
}
|
}
|
||||||
|
|
||||||
.close-button {
|
.close-button {
|
||||||
|
height: 25px;
|
||||||
|
width: 25px;
|
||||||
|
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
background-color: white;
|
background-color: white;
|
||||||
|
|
||||||
object-fit: contain;
|
object-fit: contain;
|
||||||
-webkit-mask-image: url('$lib/images/icons/ui/cross.svg');
|
-webkit-mask-image: url('$lib/images/icons/ui/cross.svg');
|
||||||
mask-image: url('$lib/images/icons/ui/cross.svg');
|
mask-image: url('$lib/images/icons/ui/cross.svg');
|
||||||
mask-repeat: no-repeat;
|
mask-repeat: no-repeat;
|
||||||
mask-size: contain;
|
mask-size: contain;
|
||||||
height: 25px;
|
|
||||||
width: 25px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
a, a:visited, a:hover, a:active {
|
a, a:visited, a:hover, a:active {
|
||||||
|
|||||||
Reference in New Issue
Block a user