<style> tag placement

ui/src/App.vue

@@ -1,5 +1,5 @@
 <template>
-  <section class="hero is-small is-primary">
+  <section class="hero is-small is-primary" style="overflow-x: auto">
     <div class="hero-body">
       <h1 class="title is-uppercase">Adventskalender</h1>
       <h2 class="subtitle">Der Gelöt</h2>
@@ -63,9 +63,3 @@ body {
   min-height: 100vh;
 }
 </style>
-
-<style scoped>
-section.hero {
-  overflow-x: auto;
-}
-</style>

ui/src/components/admin/AdminView.vue

@@ -20,5 +20,3 @@ import DoorMapEditor from "./DoorMapEditor.vue";
 })
 export default class extends Vue {}
 </script>
-
-<style scoped></style>

ui/src/components/admin/DoorMapEditor.vue

@@ -1,6 +1,6 @@
 <template>
   <BulmaDrawer header="Türchen bearbeiten" @open="on_open">
-    <nav class="level is-mobile mb-0">
+    <nav class="level is-mobile mb-0" style="overflow-x: auto">
       <BulmaButton
         :disabled="current_step === 0"
         class="level-item is-link"
@@ -178,9 +178,3 @@ export default class extends Vue {
   }
 }
 </script>
-
-<style scoped>
-nav.level {
-  overflow-x: auto;
-}
-</style>

ui/src/components/bulma/Drawer.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="card">
-    <header class="card-header is-unselectable">
+    <header class="card-header is-unselectable" style="cursor: pointer">
       <p class="card-header-title" @click="toggle">{{ header }}</p>
 
       <p v-if="refreshable" class="card-header-icon px-0">
@@ -98,13 +98,8 @@ export default class extends Vue {
 }
 </script>
 
-<style lang="scss" scoped>
-div.card {
-  &:not(:last-child) {
-    margin-bottom: 1.5rem;
-  }
-  > .card-header {
-    cursor: pointer;
-  }
+<style scoped>
+div.card:not(:last-child) {
+  margin-bottom: 1.5rem;
 }
 </style>

ui/src/components/calendar/SVGRect.vue

@@ -10,6 +10,7 @@
       v-if="variant !== undefined"
       xmlns="http://www.w3.org/1999/xhtml"
       class="px-4 is-flex is-align-items-center is-justify-content-center is-size-1 has-text-weight-bold"
+      style="height: inherit"
     >
       <slot name="default" />
     </div>
@@ -93,10 +94,6 @@ export default class extends Vue {
 <style lang="scss" scoped>
 @import "@/bulma-vars";
 
-foreignObject > div {
-  height: inherit;
-}
-
 rect {
   fill: transparent;
   fill-opacity: 0.3;