Skip to Content

Changes for page Academy

Last modified by Erik Bakker on 2024/09/24 16:12
From version 23.1
edited by Erik Bakker
on 2022/04/21 15:20
Change comment: Added object
To version 26.1
edited by Erik Bakker
on 2022/04/21 15:41
Change comment: Added object

Summary

Details

XWiki.GadgetClass[1]
content
... ... @@ -1,61 +1,48 @@
1 -{{html clean="false"}}
2 -<div class="container">
3 - <div class="card">
4 - <div class="card__header">
5 - <img src="https://source.unsplash.com/600x400/?computer" alt="card__image" class="card__image" width="600">
6 - </div>
7 - <div class="card__body">
8 - <span class="tag tag-blue">Technology</span>
9 - <h4>What's new in 2022 Tech</h4>
10 - <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Sequi perferendis molestiae non nemo doloribus. Doloremque, nihil! At ea atque quidem!</p>
11 - </div>
12 - <div class="card__footer">
13 - <div class="user">
14 - <img src="https://i.pravatar.cc/40?img=1" alt="user__image" class="user__image">
15 - <div class="user__info">
16 - <h5>Jane Doe</h5>
17 - <small>2h ago</small>
1 +{{html}}
2 +<section class="info">
3 + <img src="https://codetheweb.blog/assets/img/icon2.png">
4 + <h1>Learn HTML &mdash; <a href="https://codetheweb.blog/" target="_blank">Code The Web</a></h1>
5 +</section>
6 +<section class="cards-wrapper">
7 + <div class="card-grid-space">
8 + <div class="num">01</div>
9 + <a class="card" href="https://codetheweb.blog/2017/10/06/html-syntax/" style="--bg-img: url(https://images1-focus-opensocial.googleusercontent.com/gadgets/proxy?container=focus&resize_w=1500&url=https://codetheweb.blog/assets/img/posts/html-syntax/cover.jpg)">
10 + <div>
11 + <h1>HTML Syntax</h1>
12 + <p>The syntax of a language is how it works. How to actually write it. Learn HTML syntax…</p>
13 + <div class="date">6 Oct 2017</div>
14 + <div class="tags">
15 + <div class="tag">HTML</div>
18 18   </div>
19 19   </div>
20 - </div>
18 + </a>
21 21   </div>
22 - <div class="card">
23 - <div class="card__header">
24 - <img src="https://source.unsplash.com/600x400/?food" alt="card__image" class="card__image" width="600">
25 - </div>
26 - <div class="card__body">
27 - <span class="tag tag-brown">Food</span>
28 - <h4>Delicious Food</h4>
29 - <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Sequi perferendis molestiae non nemo doloribus. Doloremque, nihil! At ea atque quidem!</p>
30 - </div>
31 - <div class="card__footer">
32 - <div class="user">
33 - <img src="https://i.pravatar.cc/40?img=2" alt="user__image" class="user__image">
34 - <div class="user__info">
35 - <h5>Jony Doe</h5>
36 - <small>Yesterday</small>
20 + <div class="card-grid-space">
21 + <div class="num">02</div>
22 + <a class="card" href="https://codetheweb.blog/2017/10/09/basic-types-of-html-tags/" style="--bg-img: url('https://images1-focus-opensocial.googleusercontent.com/gadgets/proxy?container=focus&resize_w=1500&url=https://codetheweb.blog/assets/img/posts/basic-types-of-html-tags/cover.jpg')">
23 + <div>
24 + <h1>Basic types of HTML tags</h1>
25 + <p>Learn about some of the most common HTML tags…</p>
26 + <div class="date">9 Oct 2017</div>
27 + <div class="tags">
28 + <div class="tag">HTML</div>
37 37   </div>
38 38   </div>
39 - </div>
31 + </a>
40 40   </div>
41 - <div class="card">
42 - <div class="card__header">
43 - <img src="https://source.unsplash.com/600x400/?car,automobile" alt="card__image" class="card__image" width="600">
44 - </div>
45 - <div class="card__body">
46 - <span class="tag tag-red">Automobile</span>
47 - <h4>Race to your heart content</h4>
48 - <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Sequi perferendis molestiae non nemo doloribus. Doloremque, nihil! At ea atque quidem!</p>
49 - </div>
50 - <div class="card__footer">
51 - <div class="user">
52 - <img src="https://i.pravatar.cc/40?img=3" alt="user__image" class="user__image">
53 - <div class="user__info">
54 - <h5>John Doe</h5>
55 - <small>2d ago</small>
33 + <div class="card-grid-space">
34 + <div class="num">03</div>
35 + <a class="card" href="https://codetheweb.blog/2017/10/14/links-images-about-file-paths/" style="--bg-img: url('https://images1-focus-opensocial.googleusercontent.com/gadgets/proxy?container=focus&resize_w=1500&url=https://codetheweb.blog/assets/img/posts/links-images-about-file-paths/cover.jpg')">
36 + <div>
37 + <h1>Links, images and about file paths</h1>
38 + <p>Learn how to use links and images along with file paths…</p>
39 + <div class="date">14 Oct 2017</div>
40 + <div class="tags">
41 + <div class="tag">HTML</div>
56 56   </div>
57 57   </div>
58 - </div>
44 + </a>
59 59   </div>
60 -</div>
46 + <!-- https://images.unsplash.com/photo-1520839090488-4a6c211e2f94?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=38951b8650067840307cba514b554ba5&auto=format&fit=crop&w=1350&q=80 -->
47 +</section>
61 61  {{/html}}