Oblikovanje glave, poskrolaj na pojem ce gres na link zanj

pull/42/head
Jurij Podgoršek 2024-01-17 20:24:11 +01:00 committed by Lio Novelli
parent 9e5cd462a8
commit c79472379d
4 changed files with 35 additions and 5 deletions

View File

@ -34,10 +34,20 @@ const naManifestu = computed(() => route.path.indexOf('/pojmi') === 0)
h1 { h1 {
font-family: Trailers; font-family: Trailers;
font-size: 5rem; font-size: 16rem;
z-index: 50; 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 { img {
position: absolute; position: absolute;
top: 0; top: 0;

View File

@ -3,8 +3,8 @@
import { stripHtml } from 'string-strip-html' import { stripHtml } from 'string-strip-html'
const { etherFetch } = useEtherpadApi() const { etherFetch } = useEtherpadApi()
const store = usePojmiStore() const store = usePojmiStore()
const route = useRoute()
const props = defineProps({ const props = defineProps({
naslov: String naslov: String
@ -12,10 +12,12 @@ const props = defineProps({
const pojem = computed(() => store.pojmi[props.naslov]) const pojem = computed(() => store.pojmi[props.naslov])
const revisionId = computed(() => pojem.value.id) const revisionId = computed(() => pojem.value.id)
const pojemId = computed(() => 'pojem-' + revisionId.value)
await store.naloziPojme() await store.naloziPojme()
const urejanje = ref(false) const urejanje = ref(false)
const container = ref(null)
const urediPojem = async () => { const urediPojem = async () => {
// Ustvari pad s tekstom pojma, ce se ne obstaja // Ustvari pad s tekstom pojma, ce se ne obstaja
@ -27,10 +29,19 @@ const urediPojem = async () => {
urejanje.value = true 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> </script>
<template> <template>
<section class="pojem"> <section class="pojem" :key="pojemId" ref="container">
<div> <div>
<h2>{{ pojem.naslov }}</h2> <h2>{{ pojem.naslov }}</h2>
<div class="tekst" v-html="pojem.tekst" /> <div class="tekst" v-html="pojem.tekst" />

View File

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

View File

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