mirror of
				https://github.com/bra1n/townsquare.git
				synced 2025-10-21 16:55:12 +00:00 
			
		
		
		
	added video background support (mp4/webm)
This commit is contained in:
		
							parent
							
								
									126dda1733
								
							
						
					
					
						commit
						ad7fddd6a5
					
				
					 1 changed files with 15 additions and 0 deletions
				
			
		
							
								
								
									
										15
									
								
								src/App.vue
									
										
									
									
									
								
							
							
						
						
									
										15
									
								
								src/App.vue
									
										
									
									
									
								
							| 
						 | 
					@ -10,6 +10,13 @@
 | 
				
			||||||
        : ''
 | 
					        : ''
 | 
				
			||||||
    }"
 | 
					    }"
 | 
				
			||||||
  >
 | 
					  >
 | 
				
			||||||
 | 
					    <video
 | 
				
			||||||
 | 
					      id="background"
 | 
				
			||||||
 | 
					      v-if="grimoire.background && grimoire.background.match(/\.(mp4|webm)$/i)"
 | 
				
			||||||
 | 
					      :src="grimoire.background"
 | 
				
			||||||
 | 
					      autoplay
 | 
				
			||||||
 | 
					      loop
 | 
				
			||||||
 | 
					    ></video>
 | 
				
			||||||
    <div class="backdrop"></div>
 | 
					    <div class="backdrop"></div>
 | 
				
			||||||
    <transition name="blur">
 | 
					    <transition name="blur">
 | 
				
			||||||
      <Intro v-if="!players.length"></Intro>
 | 
					      <Intro v-if="!players.length"></Intro>
 | 
				
			||||||
| 
						 | 
					@ -299,6 +306,14 @@ ul {
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					/* video background */
 | 
				
			||||||
 | 
					video#background {
 | 
				
			||||||
 | 
					  position: absolute;
 | 
				
			||||||
 | 
					  width: 100%;
 | 
				
			||||||
 | 
					  height: 100%;
 | 
				
			||||||
 | 
					  object-fit: cover;
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
/* Night phase backdrop */
 | 
					/* Night phase backdrop */
 | 
				
			||||||
#app > .backdrop {
 | 
					#app > .backdrop {
 | 
				
			||||||
  position: absolute;
 | 
					  position: absolute;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
	Add table
		
		Reference in a new issue