{"action":"opened","issue":{"url":"https://api.github.com/repos/rstoenescu/quasar-framework/issues/83","repository_url":"https://api.github.com/repos/rstoenescu/quasar-framework","labels_url":"https://api.github.com/repos/rstoenescu/quasar-framework/issues/83/labels{/name}","comments_url":"https://api.github.com/repos/rstoenescu/quasar-framework/issues/83/comments","events_url":"https://api.github.com/repos/rstoenescu/quasar-framework/issues/83/events","html_url":"https://github.com/rstoenescu/quasar-framework/issues/83","id":175384891,"number":83,"title":"rendered lists push quasar-tabs up beneath header","user":{"login":"wishinghand","id":4001750,"avatar_url":"https://avatars.githubusercontent.com/u/4001750?v=3","gravatar_id":"","url":"https://api.github.com/users/wishinghand","html_url":"https://github.com/wishinghand","followers_url":"https://api.github.com/users/wishinghand/followers","following_url":"https://api.github.com/users/wishinghand/following{/other_user}","gists_url":"https://api.github.com/users/wishinghand/gists{/gist_id}","starred_url":"https://api.github.com/users/wishinghand/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/wishinghand/subscriptions","organizations_url":"https://api.github.com/users/wishinghand/orgs","repos_url":"https://api.github.com/users/wishinghand/repos","events_url":"https://api.github.com/users/wishinghand/events{/privacy}","received_events_url":"https://api.github.com/users/wishinghand/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2016-09-07T00:32:03Z","updated_at":"2016-09-07T00:32:03Z","closed_at":null,"body":"The following markup is the only component in my index.vue. Whenever I tap on a quasar-tab, if the list is longer than the screen is tall (using an iPhone 6+), it pushes the <quasar-tabs> component up underneath the <quasar-toolbar-title>. The problem doesn't seem to manifest on the Android phone (Motorola Moto X/Android 5.1).\r\n\r\nYou can see the rest of our code at github.com/wishinghand/nth\r\n\r\n`<template>\r\n  <!-- Tabs -->\r\n  <quasar-tabs slot=\"navigation\" class=\"inverted primary\">\r\n    <quasar-tab v-for=\"list in wordlists\" :target='\"#\" + list.name'>\r\n      {{ list.title }}\r\n    </quasar-tab>\r\n  </quasar-tabs>\r\n\r\n  <!-- Targets -->\r\n  <span v-for=\"list in wordlists\" id=\"{{list.name}}\">\r\n    <ul>\r\n      <li v-for=\"word in list.words\">\r\n        {{ word.word }}\r\n      </li>\r\n    </ul>\r\n  </span>\r\n\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n  data () {\r\n    return {\r\n      // wordlists for each tab\r\n      // name: use NATO-phonetic name as identifier for quasar-tabs and targets\r\n      // title: title to use on tab\r\n      wordlists: [{\r\n        name: 'juliet',\r\n        title: 'J',\r\n        filename: 'jWords.json',\r\n        words: ''\r\n      }, {\r\n        name: 'quebec',\r\n        title: 'Q',\r\n        filename: 'qWords.json',\r\n        words: ''\r\n      }, {\r\n        name: 'noQuebec',\r\n        title: 'Q no U',\r\n        filename: 'qNoUWords.json',\r\n        words: ''\r\n      }, {\r\n        name: 'xray',\r\n        title: 'X',\r\n        filename: 'xrayWords.json',\r\n        words: ''\r\n      }, {\r\n        name: 'zebra',\r\n        title: 'Z',\r\n        filename: 'zebraWords.json',\r\n        words: ''\r\n      }, {\r\n        name: 'twoLetter',\r\n        title: '2 Letter',\r\n        filename: 'twoLetterWords.json',\r\n        words: ''\r\n      }, {\r\n        name: 'threeLetters',\r\n        title: '3 Letter',\r\n        filename: 'threeLetterWords.json',\r\n        words: ''\r\n      }, {\r\n        name: 'noVowels',\r\n        title: 'No Vowels',\r\n        filename: 'noVowels.json',\r\n        words: ''\r\n      }]\r\n    }\r\n  },\r\n  ready () {\r\n    // load wordlist file for each tab\r\n    for (var i = 0; i < this.wordlists.length; i++) {\r\n      this.$set('wordlists[' + i + '].words', require('assets/' + this.wordlists[i].filename))\r\n    }\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\">\r\n  .quasar-tabs{\r\n    // position: absolute;\r\n    // width: 100%;\r\n  }\r\n</style>\r\n`"}}
{"actor":{"display_login":"wishinghand"}}