From 6821ddb55dabe3fa78db7de7946acd63d0149f82 Mon Sep 17 00:00:00 2001 From: Mario Sarcher Date: Wed, 28 Oct 2020 11:35:13 +0100 Subject: [PATCH] Add Intro Videos section --- docs/css/extra.css | 80 +++++++++++++++++++++++++++++++- docs/get-started/intro-videos.md | 36 ++++++++++++++ docs/img/play.svg | 1 + mkdocs.yml | 2 + 4 files changed, 118 insertions(+), 1 deletion(-) create mode 100644 docs/get-started/intro-videos.md create mode 100644 docs/img/play.svg diff --git a/docs/css/extra.css b/docs/css/extra.css index 140069e3ff..b4a95f8af7 100644 --- a/docs/css/extra.css +++ b/docs/css/extra.css @@ -17,4 +17,82 @@ and https://github.com/readthedocs/sphinx_rtd_theme/issues/295 .wy-table-responsive { overflow: visible !important; -} \ No newline at end of file +} + + +ul.video-list { + counter-reset: section; + list-style: none; + padding-left: 0; + position:relative +} + +ul.video-list .video:not(:last-of-type) a { + border-bottom:2px solid #e6e6e6 +} + +ul.video-list a { + position: relative; + padding: 2rem 2rem 2rem 4.2rem; + display: block; + box-sizing:border-box +} + +ul.video-list a .info { + padding-top:0.25rem +} + +ul.video-list a .info::before { + counter-increment: section; + content: counter(section); + position: absolute; + left: 1.5rem; + color:black +} + +ul.video-list a .info > p, ul.video-list a .info > span { + color:black +} + +ul.video-list a .info .title { + margin-top: 0; + margin-bottom:0.7rem +} + +ul.video-list a .info .description { + margin-bottom: 1rem; + +} + +ul.video-list a .info .duration, ul.video-list a .info .duration span { + color: #6e6e6e; + +} + +ul.video-list a:hover, ul.video-list a:focus { + text-decoration:none +} + +ul.video-list a:hover { + background:#f2f2f2 +} + +ul.video-list a:hover::after { + content: ''; + display: block; + width: 6rem; + height: 6rem; + position: absolute; + background: url("/img/play.svg"); + background-size: 6rem; + top: 3rem; + left:8.6rem +} + +ul.video-list .thumb { + max-height: 8.2rem; + padding-right: 2rem; + position: relative; + float:left +} + diff --git a/docs/get-started/intro-videos.md b/docs/get-started/intro-videos.md new file mode 100644 index 0000000000..86fce6f8c9 --- /dev/null +++ b/docs/get-started/intro-videos.md @@ -0,0 +1,36 @@ +# Introductory Videos + +Start your journey using Lens with this set of introductory videos! These videos are designed to give you an overview of Lens various features and quickly get you familiar with them. + + diff --git a/docs/img/play.svg b/docs/img/play.svg new file mode 100644 index 0000000000..a94d6e88ab --- /dev/null +++ b/docs/img/play.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/mkdocs.yml b/mkdocs.yml index f9d5eaf2c9..4116ed961e 100644 --- a/mkdocs.yml +++ b/mkdocs.yml @@ -15,6 +15,8 @@ nav: - macOS: setup/macos.md - Windows: setup/windows.md - Network: setup/network.md + - Get Started: + - Intro Videos: get-started/intro-videos.md - Extensions: - Overview: extensions/overview.md - Get Started: