Oblikovanje glave, poskrolaj na pojem ce gres na link zanj

nuxt/components/Glava.vue

@@ -34,10 +34,20 @@ const naManifestu = computed(() => route.path.indexOf('/pojmi') === 0)
 
 h1 {
   font-family: Trailers;
-  font-size: 5rem;
+  font-size: 16rem;
   z-index: 50;
 }
 
+@media screen and (max-width: 1090px) {
+  h1 { font-size: 10rem; }
+}
+@media screen and (max-width: 768px) {
+  h1 { font-size: 8rem; }
+}
+@media screen and (max-width: 560px) {
+  h1 { font-size: 5rem; }
+}
+
 img {
   position: absolute;
   top: 0;

nuxt/components/Pojem.vue

@@ -3,8 +3,8 @@
 import { stripHtml } from 'string-strip-html'
 
 const { etherFetch } = useEtherpadApi()
-
 const store = usePojmiStore()
+const route = useRoute()
 
 const props = defineProps({
   naslov: String
@@ -12,10 +12,12 @@ const props = defineProps({
 
 const pojem = computed(() => store.pojmi[props.naslov])
 const revisionId = computed(() => pojem.value.id)
+const pojemId = computed(() => 'pojem-' + revisionId.value)
 
 await store.naloziPojme()
 
 const urejanje = ref(false)
+const container = ref(null)
 
 const urediPojem = async () => {
   // Ustvari pad s tekstom pojma, ce se ne obstaja
@@ -27,10 +29,19 @@ const urediPojem = async () => {
   urejanje.value = true
 }
 
+onMounted(() => {
+  // Link na pojem direktno? Poskrolaj nanj + odpri editiranje
+  if (route.params.guid === revisionId.value) {
+    urejanje.value = true
+    window.container = container
+    setTimeout(() => container.value.scrollIntoView(), 50)
+  }
+})
+
 </script>
 
 <template>
-  <section class="pojem">
+  <section class="pojem" :key="pojemId" ref="container">
     <div>
       <h2>{{ pojem.naslov }}</h2>
       <div class="tekst" v-html="pojem.tekst" />

nuxt/components/PojemForm.vue

@@ -28,7 +28,8 @@ const oddajPredlog = async data => {
 }
 
 const etherNalozen = ev => {
-  window.location.hash = props.revisionId
+  navigateTo('/pojmi/' + props.revisionId)
+  //window.location.hash = props.revisionId
 }
 
 </script>

nuxt/nuxt.config.js

@@ -28,7 +28,6 @@ export default defineNuxtConfig({
       changeOrigin: true,
       pathFilter:
         process.env.FILE_PATH
-
     }
   },
   runtimeConfig: {
@@ -38,5 +37,14 @@ export default defineNuxtConfig({
       etherpadUrl: process.env.ETHERPAD_URL,
       etherpadPrefix: process.env.ETHERPAD_PREFIX
     }
+  },
+  hooks: {
+    'pages:extend' (pages) {
+      pages.push({
+        name: 'pojem',
+        path: '/pojmi/:guid',
+        file: '~/pages/pojmi.vue'
+      })
+    }
   }
 })