<script>
    import svelteLogo from "$lib/svelteLogos/svelte-logo-cutout.svg"
</script>

<div class="container">
    <div class="flex justify-center">
      <div class="corner-border-container p-1 m-1">
        <div class="flex">
          This CV was made using html, css and <a class="grid place-content-center" href="https://kit.svelte.dev/"><img src={svelteLogo} class="w-2 h-2" alt="SvelteKit logo"/></a>
        </div>
        Sources:
        <a href="https://gitea.deprived.dev/Sveskejuice/deprived-main-website/src/branch/dev/src/routes/zhen/cv/rev2/+page.svelte">CV source code</a>
        and
        <a href="/zhen/cv/rev2?hideOnPrint=1">My Website</a>
      </div>
    </div>
</div>

<style lang="scss">
.corner-border-container {
  --length: 5px;
  --width: 1px;
  background-color: var(--left-grid-bg-color);
  background-image:
    linear-gradient(var(--left-decor-line-color), var(--left-decor-line-color)),
    linear-gradient(var(--left-decor-line-color), var(--left-decor-line-color)),
    linear-gradient(var(--left-decor-line-color), var(--left-decor-line-color)),
    linear-gradient(var(--left-decor-line-color), var(--left-decor-line-color)),
    linear-gradient(var(--left-decor-line-color), var(--left-decor-line-color)),
    linear-gradient(var(--left-decor-line-color), var(--left-decor-line-color)),
    linear-gradient(var(--left-decor-line-color), var(--left-decor-line-color)),
    linear-gradient(var(--left-decor-line-color), var(--left-decor-line-color));
  background-size:
    var(--length) var(--width),
    var(--width) var(--length),
    var(--length) var(--width),
    var(--width) var(--length),
    var(--length) var(--width),
    var(--width) var(--length),
    var(--length) var(--width),
    var(--width) var(--length);
  background-position:
    top left,
    top left,
    top right,
    top right,
    bottom right,
    bottom right,
    bottom left,
    bottom left;
  background-repeat: no-repeat;
}

    .container {
        z-index: 1;

        font-size: 0.5rem;

        //white-space: nowrap;

        color: #777777;

        * a {
            color: #3d6ddc;
            padding-left: 1mm;
            padding-right: 1mm;

            text-decoration: underline;
        }


        div:nth-child(2){
            padding-bottom: 2mm;
        }
    }
</style>
