Bootcamp/Start/Levels
(Created page with "<html> <style> body { margin: 0; padding: 0; font-family: 'Outfit', sans-serif; } .bootcamp-container { width: 100%; position: relative; margin: auto; padding: 10px; box-sizing: border-box; } .header { width: 100%; height: 70px; background: #E2F5FA; display: flex; align-items: center; justify-content: center; margin-top: 20px; }...") Tag: 2017 source edit |
No edit summary Tag: 2017 source edit |
||
| (4 intermediate revisions by 2 users not shown) | |||
| Line 15: | Line 15: | ||
.header { | .header { | ||
width: 100%; | width: 100%; | ||
height: | height: 60px; | ||
background: #E2F5FA; | background: #E2F5FA; | ||
display: flex; | display: flex; | ||
align-items: center; | align-items: center; | ||
justify-content: center; | justify-content: center; | ||
margin-top: | margin-top: 10px; | ||
} | } | ||
.header-text { | .header-text { | ||
font-family: 'Outfit', sans-serif; | font-family: 'Outfit', sans-serif; | ||
font-size: | font-size: 24px; | ||
font-weight: 600; | font-weight: 600; | ||
text-transform: uppercase; | text-transform: uppercase; | ||
| Line 35: | Line 35: | ||
display: flex; | display: flex; | ||
align-items: center; | align-items: center; | ||
margin: | margin: 15px 0; | ||
animation: fadeInUp 1s ease-in-out forwards; | animation: fadeInUp 1s ease-in-out forwards; | ||
justify-content: space-between; | |||
} | } | ||
.section { | .section { | ||
border-radius: 20px; | border-radius: 20px; | ||
padding: | padding: 20px; | ||
box-sizing: border-box; | box-sizing: border-box; | ||
cursor: pointer; | cursor: pointer; | ||
transition: transform 0.3s ease; | transition: transform 0.3s ease; | ||
flex: 1; | flex: 1; | ||
height: | min-height: 200px; | ||
display: flex; | display: flex; | ||
flex-direction: column; | flex-direction: column; | ||
| Line 74: | Line 75: | ||
} | } | ||
.section-title { | .section-title { | ||
font-size: | font-size: 20px; | ||
font-weight: 700; | font-weight: 700; | ||
margin-bottom: | margin-bottom: 8px; | ||
} | } | ||
.section-content { | .section-content { | ||
font-size: | font-size: 16px; | ||
font-weight: 400; | font-weight: 400; | ||
} | } | ||
.icon-placeholder { | .icon-placeholder { | ||
width: | width: 150px; | ||
height: auto; | height: auto; | ||
background-size: contain; | background-size: contain; | ||
background-repeat: no-repeat; | background-repeat: no-repeat; | ||
margin: 0 | margin: 0 10px; | ||
animation: fadeInScale 1s ease-in-out forwards; | animation: fadeInScale 1s ease-in-out forwards; | ||
} | } | ||
| Line 106: | Line 107: | ||
@media screen and (max-width: 768px) { | @media screen and (max-width: 768px) { | ||
.header-text { | .header-text { | ||
font-size: | font-size: 18px; | ||
} | } | ||
.section-title { | .section-title { | ||
font-size: | font-size: 18px; | ||
} | } | ||
.section-content { | .section-content { | ||
font-size: | font-size: 14px; | ||
} | } | ||
.icon-placeholder { | .icon-placeholder { | ||
| Line 127: | Line 128: | ||
margin: 10px 0; | margin: 10px 0; | ||
text-align: center; | text-align: center; | ||
} | } | ||
} | } | ||
| Line 188: | Line 183: | ||
<div class="section-container"> | <div class="section-container"> | ||
<img src="https://wiki.mdriven.net/images/6/6e/Person_beginner.png" alt="Beginner Icon" class="icon-placeholder"> | <img src="https://wiki.mdriven.net/images/6/6e/Person_beginner.png" alt="Beginner Icon" class="icon-placeholder"> | ||
<a href="/index.php/Bootcamp/Beginner" class="section beginner"> | <a href="/index.php/Training:Bootcamp/Start/Levels/Beginner" class="section beginner"> | ||
<div class="section-title">BEGINNER</div> | <div class="section-title">BEGINNER</div> | ||
<div class="section-content">You want to learn software modeling using the MDriven tools and you’ve got a lot of questions. This is the place to start - right from the basics!</div> | <div class="section-content">You want to learn software modeling using the MDriven tools and you’ve got a lot of questions. This is the place to start - right from the basics!</div> | ||
| Line 195: | Line 190: | ||
<div class="section-container"> | <div class="section-container"> | ||
<a href="/index.php/Bootcamp/Intermediate" class="section intermediate"> | <a href="/index.php/Training:Bootcamp/Start/Levels/Intermediate" class="section intermediate"> | ||
<div class="section-title">INTERMEDIATE</div> | <div class="section-title">INTERMEDIATE</div> | ||
<div class="section-content">You | <div class="section-content">You would like to understand modeling better and examine how MDriven approaches modeling. Join the trail from here!</div> | ||
</a> | </a> | ||
<img src="https://wiki.mdriven.net/images/0/00/Person_intermediate.png" alt="Intermediate Icon" class="icon-placeholder"> | <img src="https://wiki.mdriven.net/images/0/00/Person_intermediate.png" alt="Intermediate Icon" class="icon-placeholder"> | ||
| Line 204: | Line 199: | ||
<div class="section-container"> | <div class="section-container"> | ||
<img src="https://wiki.mdriven.net/images/6/66/Person_advanced.png" alt="Advanced Icon" class="icon-placeholder"> | <img src="https://wiki.mdriven.net/images/6/66/Person_advanced.png" alt="Advanced Icon" class="icon-placeholder"> | ||
<a href="/index.php/Bootcamp/ | <a href="/index.php/Training:Bootcamp/Start/Levels/Experienced" class="section advanced"> | ||
<div class="section-title">ADVANCED</div> | <div class="section-title">ADVANCED</div> | ||
<div class="section-content">You | <div class="section-content">You have some knowledge about models, but want to understand the inner workings of MDriven. Dive right in with the more complex concepts behind the MDriven tools.</div> | ||
</a> | </a> | ||
</div> | </div> | ||
Latest revision as of 05:20, 10 September 2024
Choose the right option for you
