diff --git a/src/components/Article.vue b/src/components/Article.vue index e21757d1f0ea73e429c4c03529370582691cfd51..75dc33ae809ec689a0f1647b69d7629bb6cf54db 100644 --- a/src/components/Article.vue +++ b/src/components/Article.vue @@ -57,6 +57,7 @@ export default { <!-- Add "scoped" attribute to limit CSS to this component only --> <style> article { + position: relative; padding: 10px; margin: 10px; border-radius: 10px; diff --git a/src/components/Header.vue b/src/components/Header.vue index a469e5187100d2d052f2f8d521158b658c4a7e0a..fa397095d9c9c18f55eacbc78c20a11d145304b8 100644 --- a/src/components/Header.vue +++ b/src/components/Header.vue @@ -16,6 +16,7 @@ </div> </div> </details> + <span class="dict-label">{{dict_label}}</span> </div> </template> @@ -42,6 +43,12 @@ export default { article_id: Number }, computed: { + dict_label: function() { + return { + 'bob': 'BOKMÃ…L', + 'nob': 'NYNORSK' + }[this.dictionary] + }, group_list: function() { return helpers.group_list(this.lemmas) }, @@ -89,18 +96,27 @@ export default { </script> -<style > +<style scoped> summary { width: 30em; } +h1 { + padding-top: 7px; +} + .word-classification { text-decoration: underline dashed; } -h1.article_header { - display: inline; +.dict-label { + color: #560027; + font-weigth: bold; + padding-left: 5px; + position: absolute; + top: 0px; + font-variant-caps: all-small-caps; } details > summary {