mirror of
https://github.com/clearml/clearml-docs
synced 2025-05-03 04:22:14 +00:00
Modify video player design (#573)
This commit is contained in:
parent
e77448ff88
commit
2cd4ea40d5
@ -2,7 +2,7 @@
|
||||
title: Overview
|
||||
---
|
||||
|
||||
<div style={{position: 'relative', overflow: 'hidden', width: '100%', paddingTop: '56.25%' }} >
|
||||
<div class="vid" >
|
||||
<iframe style={{position: 'absolute', top: '0', left: '0', bottom: '0', right: '0', width: '100%', height: '100%'}}
|
||||
src="https://www.youtube.com/embed/j4XVMAaUt3E"
|
||||
title="YouTube video player"
|
||||
|
@ -12,7 +12,7 @@ while ClearML ensures your work is reproducible and scalable.
|
||||
|
||||
## Getting Started
|
||||
|
||||
<div style={{position: 'relative', overflow: 'hidden', width: '100%', paddingTop: '56.25%', marginBottom: '32px' }} >
|
||||
<div class="vid">
|
||||
<iframe style={{position: 'absolute', top: '0', left: '0', bottom: '0', right: '0', width: '100%', height: '100%'}}
|
||||
src="https://www.youtube.com/embed/s3k9ntmQmD4"
|
||||
title="YouTube video player"
|
||||
|
@ -7,7 +7,7 @@ keywords: [mlops, components, ClearML agent]
|
||||
|
||||
## Video Tutorial
|
||||
|
||||
<div style={{position: 'relative', overflow: 'hidden', width: '100%', paddingTop: '56.25%' }} >
|
||||
<div class="vid" >
|
||||
<iframe style={{position: 'absolute', top: '0', left: '0', bottom: '0', right: '0', width: '100%', height: '100%'}}
|
||||
src="https://www.youtube.com/embed/MX3BrXnaULs?rel=0"
|
||||
title="YouTube video player"
|
||||
|
@ -7,7 +7,7 @@ keywords: [mlops, components, ClearML data]
|
||||
|
||||
## Video Tutorial
|
||||
|
||||
<div style={{position: 'relative', overflow: 'hidden', width: '100%', paddingTop: '56.25%' }} >
|
||||
<div class="vid" >
|
||||
<iframe style={{position: 'absolute', top: '0', left: '0', bottom: '0', right: '0', width: '100%', height: '100%'}}
|
||||
src="https://www.youtube.com/embed/S2pz9jn26uI?rel=0"
|
||||
title="YouTube video player"
|
||||
|
@ -6,7 +6,7 @@ keywords: [mlops, components]
|
||||
|
||||
## Video Tutorial
|
||||
|
||||
<div style={{position: 'relative', overflow: 'hidden', width: '100%', paddingTop: '56.25%' }} >
|
||||
<div class="vid" >
|
||||
<iframe style={{position: 'absolute', top: '0', left: '0', bottom: '0', right: '0', width: '100%', height: '100%'}}
|
||||
src="https://www.youtube.com/embed/s3k9ntmQmD4?rel=0"
|
||||
title="YouTube video player"
|
||||
|
@ -7,7 +7,7 @@ keywords: [mlops, components, Experiment Manager]
|
||||
|
||||
## Video Tutorial
|
||||
|
||||
<div style={{position: 'relative', overflow: 'hidden', width: '100%', paddingTop: '56.25%' }} >
|
||||
<div class="vid" >
|
||||
<iframe style={{position: 'absolute', top: '0', left: '0', bottom: '0', right: '0', width: '100%', height: '100%'}}
|
||||
src="https://www.youtube.com/embed/kyOfwVg05EM?rel=0"
|
||||
title="YouTube video player"
|
||||
|
@ -7,7 +7,7 @@ keywords: [mlops, components, Experiment Manager]
|
||||
|
||||
## Video Tutorial
|
||||
|
||||
<div style={{position: 'relative', overflow: 'hidden', width: '100%', paddingTop: '56.25%' }} >
|
||||
<div class="vid" >
|
||||
<iframe style={{position: 'absolute', top: '0', left: '0', bottom: '0', right: '0', width: '100%', height: '100%'}}
|
||||
src="https://www.youtube.com/embed/bjWwZAzDxTY?rel=0"
|
||||
title="YouTube video player"
|
||||
|
@ -7,7 +7,7 @@ keywords: [mlops, components, machine learning, data scientist]
|
||||
|
||||
## Video Tutorial
|
||||
|
||||
<div style={{position: 'relative', overflow: 'hidden', width: '100%', paddingTop: '56.25%' }} >
|
||||
<div class="vid" >
|
||||
<iframe style={{position: 'absolute', top: '0', left: '0', bottom: '0', right: '0', width: '100%', height: '100%'}}
|
||||
src="https://www.youtube.com/embed/quSGXvuK1IM?rel=0"
|
||||
title="YouTube video player"
|
||||
|
@ -7,7 +7,7 @@ keywords: [mlops, components, machine learning, mlops engineer]
|
||||
|
||||
## Video Tutorial
|
||||
|
||||
<div style={{position: 'relative', overflow: 'hidden', width: '100%', paddingTop: '56.25%' }} >
|
||||
<div class="vid" >
|
||||
<iframe style={{position: 'absolute', top: '0', left: '0', bottom: '0', right: '0', width: '100%', height: '100%'}}
|
||||
src="https://www.youtube.com/embed/7aKZGp1YOlo?rel=0"
|
||||
title="YouTube video player"
|
||||
|
@ -7,7 +7,7 @@ keywords: [mlops, components, GitHub Actions, CI/CD]
|
||||
|
||||
## Video Tutorial
|
||||
|
||||
<div style={{position: 'relative', overflow: 'hidden', width: '100%', paddingTop: '56.25%' }} >
|
||||
<div class="vid" >
|
||||
<iframe style={{position: 'absolute', top: '0', left: '0', bottom: '0', right: '0', width: '100%', height: '100%'}}
|
||||
src="https://www.youtube.com/embed/k5e-E5oEFUw?rel=0"
|
||||
title="YouTube video player"
|
||||
|
@ -7,7 +7,7 @@ keywords: [mlops, components, hyperdatasets]
|
||||
|
||||
## Video Tutorial
|
||||
|
||||
<div style={{position: 'relative', overflow: 'hidden', width: '100%', paddingTop: '56.25%' }} >
|
||||
<div class="vid" >
|
||||
<iframe style={{position: 'absolute', top: '0', left: '0', bottom: '0', right: '0', width: '100%', height: '100%'}}
|
||||
src="https://www.youtube.com/embed/1VliYRexeLU?rel=0"
|
||||
title="YouTube video player"
|
||||
|
@ -7,7 +7,7 @@ keywords: [mlops, components, hyperparameter optimization, hyperparameter]
|
||||
|
||||
## Video Tutorial
|
||||
|
||||
<div style={{position: 'relative', overflow: 'hidden', width: '100%', paddingTop: '56.25%' }} >
|
||||
<div class="vid" >
|
||||
<iframe style={{position: 'absolute', top: '0', left: '0', bottom: '0', right: '0', width: '100%', height: '100%'}}
|
||||
src="https://www.youtube.com/embed/dLkP7y4USFg?rel=0"
|
||||
title="YouTube video player"
|
||||
|
@ -7,7 +7,7 @@ keywords: [mlops, components, automation, orchestration, pipeline]
|
||||
|
||||
## Video Tutorial
|
||||
|
||||
<div style={{position: 'relative', overflow: 'hidden', width: '100%', paddingTop: '56.25%' }} >
|
||||
<div class="vid" >
|
||||
<iframe style={{position: 'absolute', top: '0', left: '0', bottom: '0', right: '0', width: '100%', height: '100%'}}
|
||||
src="https://www.youtube.com/embed/UVBk337xzZo?rel=0"
|
||||
title="YouTube video player"
|
||||
|
@ -7,7 +7,7 @@ keywords: [mlops, components, automation, orchestration, pipeline]
|
||||
|
||||
## Video Tutorial
|
||||
|
||||
<div style={{position: 'relative', overflow: 'hidden', width: '100%', paddingTop: '56.25%' }} >
|
||||
<div class="vid" >
|
||||
<iframe style={{position: 'absolute', top: '0', left: '0', bottom: '0', right: '0', width: '100%', height: '100%'}}
|
||||
src="https://www.youtube.com/embed/prZ_eiv_y3c?rel=0"
|
||||
title="YouTube video player"
|
||||
|
@ -7,7 +7,7 @@ keywords: [mlops, components, features, ClearML]
|
||||
|
||||
## Video Tutorial
|
||||
|
||||
<div style={{position: 'relative', overflow: 'hidden', width: '100%', paddingTop: '56.25%' }} >
|
||||
<div class="vid" >
|
||||
<iframe style={{position: 'absolute', top: '0', left: '0', bottom: '0', right: '0', width: '100%', height: '100%'}}
|
||||
src="https://www.youtube.com/embed/-9vqxF2UfFU?rel=0"
|
||||
title="YouTube video player"
|
||||
|
@ -7,7 +7,7 @@ keywords: [mlops, components, Autoscaler]
|
||||
|
||||
## Video Tutorial
|
||||
|
||||
<div style={{position: 'relative', overflow: 'hidden', width: '100%', paddingTop: '56.25%' }} >
|
||||
<div class="vid" >
|
||||
<iframe style={{position: 'absolute', top: '0', left: '0', bottom: '0', right: '0', width: '100%', height: '100%'}}
|
||||
src="https://www.youtube.com/embed/j4XVMAaUt3E?rel=0"
|
||||
title="YouTube video player"
|
||||
|
@ -3,7 +3,7 @@ title: Model Registry
|
||||
---
|
||||
|
||||
|
||||
<div style={{position: 'relative', overflow: 'hidden', width: '100%', paddingTop: '56.25%' }} >
|
||||
<div class="vid" >
|
||||
<iframe style={{position: 'absolute', top: '0', left: '0', bottom: '0', right: '0', width: '100%', height: '100%'}}
|
||||
src="https://www.youtube.com/embed/lAiw2HqHlWo?rel=0"
|
||||
title="YouTube video player"
|
||||
|
@ -2,7 +2,7 @@
|
||||
title: Reports
|
||||
---
|
||||
|
||||
<div style={{position: 'relative', overflow: 'hidden', width: '100%', paddingTop: '56.25%' }} >
|
||||
<div class="vid" >
|
||||
<iframe style={{position: 'absolute', top: '0', left: '0', bottom: '0', right: '0', width: '100%', height: '100%'}}
|
||||
src="https://www.youtube.com/embed/D6fCvpmV8eo"
|
||||
title="YouTube video player"
|
||||
|
@ -991,4 +991,18 @@ html[data-theme=dark] .cml-card i {
|
||||
html[data-theme=dark] .cml-card i {
|
||||
background-color: var(--ifm-background-color);
|
||||
border-color: var(--ifm-color-gray-800);
|
||||
}
|
||||
|
||||
.vid {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
padding-top: 56.25%;
|
||||
background-color: rgba(0,0,0,0.1);
|
||||
border: 12px solid rgba(0,0,0,0.1);
|
||||
border-radius: calc(var(--ifm-card-border-radius) * 1.5);
|
||||
}
|
||||
html[data-theme=dark] .vid {
|
||||
border-color: rgba(0,0,0,0.3);
|
||||
background-color: rgba(0,0,0,0.3);
|
||||
}
|
Loading…
Reference in New Issue
Block a user