Skip to content

Commit

Permalink
small changes to layout & styling. swap positions of some hard videos
Browse files Browse the repository at this point in the history
  • Loading branch information
BuildingAtom committed Feb 14, 2024
1 parent a4533b9 commit 3b3934a
Show file tree
Hide file tree
Showing 2 changed files with 23 additions and 9 deletions.
18 changes: 16 additions & 2 deletions css/stylesheet.scss
Original file line number Diff line number Diff line change
Expand Up @@ -60,18 +60,28 @@ $data-fonts: ({%- for font in site.data.fonts.fonts -%}{{ font.class }}: {{- fon
padding: 0;
margin: 0;
.video-item {
min-width: 240px;
min-width: 320px;
max-width: 100%;
flex-shrink: 2;
flex-basis: 30%;
flex-grow: 1;
@include media-query(mobile) {
min-width: 100%;
}
video {
width: 100%;
height: auto;
display: block;
}
&.tighter {
min-width: 120px;
flex-basis: 20%;
flex-basis: 30%;
@include media-query(mobile) {
flex-basis: 120px;
flex-grow: 1;
flex-shrink: 1;
min-width: 0;
}
}
p {
text-align: center;
Expand All @@ -84,3 +94,7 @@ $data-fonts: ({%- for font in site.data.fonts.fonts -%}{{ font.class }}: {{- fon
h2 {
margin-top: 0.4em !important;
}

.content > .wrapper > .authors > .box > .single:last-child {

}
14 changes: 7 additions & 7 deletions index.markdown
Original file line number Diff line number Diff line change
Expand Up @@ -69,14 +69,14 @@ links:
<source src="assets/sparrows_single_arm_demo.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
<p> SPARROWS performing single arm planning </p>
<p>SPARROWS performing single arm planning </p>
</div>
<div class="video-item" style="min-width:0;">
<video autoplay preload="auto" controls disablepictureinpicture playsinline muted loop style="display:block; width:100%; height:auto;">
<source src="assets/sparrows_two_arm_demo.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
<p> SPARROWS performing two arm planning </p>
<p>SPARROWS performing two arm planning </p>
</div>
</div> <!-- END OVERVIEW VIDEOS -->

Expand Down Expand Up @@ -149,21 +149,21 @@ On the other hand, MPOT and TRAJOPT both stop due to colliding with the environm
<source src="assets/combined_10_obstacles.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
<p> 10 obstacles</p>
<p>10 obstacles</p>
</div>
<div class="video-item">
<video class="autoplay-in-frame" disableremoteplayback disablepictureinpicture playsinline muted loop onclick="this.paused ? this.play() : this.pause();">
<source src="assets/combined_20_obstacles.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
<p> 20 obstacles</p>
<p>20 obstacles</p>
</div>
<div class="video-item">
<video class="autoplay-in-frame" disableremoteplayback disablepictureinpicture playsinline muted loop onclick="this.paused ? this.play() : this.pause();">
<source src="assets/combined_40_obstacles.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
<p> 40 obstacles</p>
<p>40 obstacles</p>
</div>
</div><!-- END RANDOM VIDEOS -->

Expand All @@ -188,13 +188,13 @@ SPARROWS' performance on a handful of these scenarios is demonstrated below.
</div>
<div class="video-item tighter">
<video class="autoplay-in-frame" disableremoteplayback disablepictureinpicture playsinline muted loop onclick="this.paused ? this.play() : this.pause();">
<source src="assets/sparrows_hard_scenarios_4.mp4" type="video/mp4">
<source src="assets/sparrows_hard_scenarios_8.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
</div>
<div class="video-item tighter">
<video class="autoplay-in-frame" disableremoteplayback disablepictureinpicture playsinline muted loop onclick="this.paused ? this.play() : this.pause();">
<source src="assets/sparrows_hard_scenarios_8.mp4" type="video/mp4">
<source src="assets/sparrows_hard_scenarios_4.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
</div>
Expand Down

0 comments on commit 3b3934a

Please sign in to comment.