Implement ads in desktop app (#2318)

* Implement ads in desktop app

* Finish ads

* use git dep instead

* attempt to fix linux build (temp)

* bump version + lint

* comment more

* fix build

* try to fix linux build

* Fix crashing on windows

* Fix icons not showing

* Remove useless env vars

* Actual linux build fix

* Run fmt

* Fix scrolling

* fix clippy

* bump version + fix localhost

* rev linux build patch

* update version num

* update csp

* update csp

* update csp

* Switch to mousewheel event

apps/app-frontend/src/pages/project/Index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="root-container">
-    <div v-if="data" class="project-sidebar">
+    <div v-if="data" class="project-sidebar" @scroll="$refs.promo.scroll()">
       <Card v-if="instance" class="small-instance">
         <router-link class="instance" :to="`/instance/${encodeURIComponent(instance.path)}`">
           <Avatar
@@ -20,7 +20,7 @@
         </router-link>
       </Card>
       <Card class="sidebar-card" @contextmenu.prevent.stop="handleRightClick">
-        <Avatar size="lg" :src="data.icon_url" />
+        <Avatar size="md" :src="data.icon_url" />
         <div class="instance-info">
           <h2 class="name">{{ data.title }}</h2>
           {{ data.description }}
@@ -61,7 +61,9 @@
             Site
           </a>
         </div>
-        <hr class="card-divider" />
+      </Card>
+      <PromotionWrapper ref="promo" />
+      <Card class="sidebar-card">
         <div class="stats">
           <div class="stat">
             <DownloadIcon aria-hidden="true" />
@@ -163,7 +165,6 @@
       </Card>
     </div>
     <div v-if="data" class="content-container">
-      <PromotionWrapper />
       <Card class="tabs">
         <NavRow
           v-if="data.gallery.length > 0"
@@ -309,11 +310,13 @@ async function fetchProjectData() {
 
 await fetchProjectData()
 
+const promo = ref(null)
 watch(
   () => route.params.id,
   async () => {
     if (route.params.id && route.path.startsWith('/project')) {
       await fetchProjectData()
+      promo.value.scroll()
     }
   },
 )
@@ -377,7 +380,7 @@ const handleOptionsClick = (args) => {
 
 .project-sidebar {
   position: fixed;
-  width: 20rem;
+  width: calc(300px + 1.5rem);
   min-height: calc(100vh - 3.25rem);
   height: fit-content;
   max-height: calc(100vh - 3.25rem);
@@ -403,7 +406,7 @@ const handleOptionsClick = (args) => {
   flex-direction: column;
   width: 100%;
   padding: 1rem;
-  margin-left: 19.5rem;
+  margin-left: calc(300px + 1rem);
 }
 
 .button-group {