kubernetes
/
website
mirror of https://github.com/kubernetes/website.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Make video section height flexible 

Signed-off-by: Dmitry Shurupov <dmitry.shurupov@palark.com>
pull/49443/head
Dmitry Shurupov 2025-01-15 15:31:09 +07:00
parent 99d7743668
commit ff7c22b4f9
No known key found for this signature in database
3 changed files with 9 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
assets/scss/_base.scss
View File

@ -32,9 +32,6 @@ $quickstart-button-padding: 0 50px;
$vendor-strip-height: 88px;
$vendor-strip-font-size: 16px;
// video
$video-section-height: 200px;
@import "size";
@import "documentation";
@ -434,9 +431,6 @@ $ocean-nodes-padding-Y: 60px;
$ocean-nodes-main-margin-bottom: 60px;
$ocean-nodes-h3-margin-bottom: 30px;
// video
$video-section-height: 200px;
// Home-specific
.td-home {
@ -514,13 +508,10 @@ section#cncf {
}
// Video thingy
#video {
height: $video-section-height;
}
#video {
width: 100%;
position: relative;
overflow: hidden;
background-position: center center;
background-size: cover;
@ -557,7 +548,7 @@ section#cncf {
padding: 2px 8px;
margin: 5px;
}
#desktopKCButton {
display: inline;
position: absolute;
@ -623,6 +614,10 @@ section#cncf {
}
}
#video:has(#desktopKCButton) {
height: 580px;
}
#videoPlayer {
@include fullScreen;
background-color: rgba(0, 0, 0, 0.9);

6
assets/scss/_desktop.scss
View File

@ -1,6 +1,5 @@
$main-max-width: 1200px;
$vendor-strip-height: 44px;
$video-section-height: 580px;
@media screen and (min-width: 1024px) {
@ -50,13 +49,12 @@ $video-section-height: 580px;
}
#video {
height: $video-section-height;
position: relative;
background-position: center center;
background-position: top center;
background-size: cover;
&>.light-text {
margin-right: 10%;
margin: 0 10% 15px 0;
}
}

7
assets/scss/_tablet.scss
View File

@ -28,9 +28,6 @@ $headline-wrapper-margin-bottom: 40px;
$quickstart-button-padding: 0 50px;
$vendor-strip-font-size: 16px;
//video
$video-section-height: 400px;
////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////
@ -134,15 +131,13 @@ $video-section-height: 400px;
}
#video {
height: $video-section-height;
display: block;
height: 550px;
& > .light-text {
display: block;
float: right;
text-align: left;
margin-right: 5%;
margin: 0 5% 15px 0;
}
}