Fix style of the dynamic Android demo + fix offering check time

Author: mdhsl

demos/dynamic-android/src/components/VideoCard.vue

@@ -55,13 +55,14 @@ export default {
 
 .video, .v-card, .no-dialog {
  width: inherit;
- height: 175px;
+ height: calc(100% - 10px);
  background-color: #000000 !important;
 }
 
 .v-card {
- height: 100%;
- width: 320px;
+ height: inherit;
+ width: inherit;
+ min-width: 320px;
 }
 
 .video-h264 > canvas {

demos/dynamic-android/src/components/VideoContainer.vue

@@ -29,7 +29,8 @@ export default {
  justify-content: center;
  align-items: center;
  position: absolute;
- height: 245px;
+ max-height: 245px;
+ height: calc(100% - 15px);
  background: rgba(0,0,0,0.5) !important;
  bottom: 0px;
  left: 50%;

demos/dynamic-android/src/workers/check.offering.worker.js

@@ -18,7 +18,7 @@ function successFn(event) {
  let items = event.Capabilities.contents.offering.map(offering => {
  let starTime = 'now';
  let endTime = '2055-01-01T00:00:00.00Z';
- if (!isDefined(offering.phenomenonTime.beginPosition.indeterminatePosition)) {
+ if (!isDefined(offering.phenomenonTime.endPosition.indeterminatePosition)) {
  starTime = offering.phenomenonTime.beginPosition;
  endTime = offering.phenomenonTime.endPosition;
  }

source/osh-vue/components/Control.vue

@@ -301,15 +301,11 @@ export default {
 }
 
 .control .buttons {
- padding: 12px 8px 8px 8px;
  color: lightgray;
- display: flex;
- justify-content: space-between;
- align-items: center;
 }
 
 .control-btn {
- padding: 0px 5px 0px 5px;
+ padding: 0px 0px 0px 5px;
 }
 
 .control-btn:hover {

source/osh-vue/components/video/VideoWithControl.vue

@@ -172,14 +172,13 @@
  position: relative;
  display: flex;
  align-items: center;
- padding: 5px 0px 0 0px;
+ padding: 0px 0px 0 0px;
  }
 
  .video-control {
  position: absolute;
  left: calc(100% - 55px);
- bottom: auto;
- margin-top: 2px;
+ flex: auto;
  }
 
  .main-video {
@@ -190,7 +189,7 @@
 <style>
 .v-dialog {
  background: rgba(0,0,0,0.85);
- height: calc(100% - 52px) !important;
+ height: calc(100% - 30px) !important;
  width: 90% !important;
  overflow: hidden;
 }