Fix pronunciation block

src/components/DefElement.vue

@@ -18,6 +18,15 @@
 import entities from '../utils/entities.js'
 import helpers from '../utils/helpers.js'
 
+function replace_grammar_id(item, lang) {
+  let content = item.content
+  if (content.includes('$') && (item.items[0].id)){
+    let replacement_item = entities[lang][item.items[0].id]['expansion']
+    content = content.replace('$', replacement_item)}
+
+  return content
+}
+
 export default {
   name: 'DefElement',
   props: {
@@ -51,7 +60,7 @@ export default {
                                                           source: path
                                                         }
           else if (item.type_ == 'pronunciation') return {type: item.type_, html: item.string}
-          else if (item.type_ == 'pronunciation_guide') return {type: item.type_, html: item.string}
+          else if (item.type_ == 'pronunciation_guide') return {type: 'pronunciation_guide', html: replace_grammar_id(item, lang)}
           else if (item.type_ == 'superscript') return {type: item.type_, html: item.text, tag: 'sup'}
           else if (item.type_ == 'subscript') return {type: item.type_, html: item.text, 'tag': 'sub'}
           else if (item.type_ == 'quote_inset') return {type: item.type_, body: item, html: '', tag: 'DefElement', props: {body: item, tag: 'i', dictionary: lang}}
@@ -85,7 +94,7 @@ export default {
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style scoped>
-.usage, .pronunciation {
+.usage, .pronunciation_guide {
   font-style: italic;
 }