Bootcamp
(Created page with "<!DOCTYPE html> <nowiki><html lang="en"></nowiki> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Styled Div</title>     <style>         body {             font-family: Outfit, sans-serif;             margin: 0;             padding: 0;             display: flex;             justify-content: center;             align-items: center;      ...")
 
No edit summary
Tag: 2017 source edit
 
(58 intermediate revisions by the same user not shown)
Line 1: Line 1:
<!DOCTYPE html>
<html>
<style>
#mw-content-text.mw-body-content.mw-content-ltr {
    background-image: url('https://wiki.mdriven.net/images/background_desktop.webp');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 2em;
}


<nowiki><html lang="en"></nowiki>
.top-box {
    border-radius: 35px;
    background: rgba(255, 255, 255, 0.50);
    padding: 20px;
    max-width: 80%;
    width: 100%;
    text-align: left;
    font-size: 1.2em;
    color: #000;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    margin-bottom: 4em;
    opacity: 0;
    animation: fadeIn 1.5s ease-out forwards;
}


<head>
.top-box-title {
    font-weight: bold;
    font-size: 1.5em;
}


    <meta charset="UTF-8">
.top-box-subtitle {
    font-weight: bold;
    font-size: 1.8em;
    margin-top: 10px;
}


    <meta name="viewport" content="width=device-width, initial-scale=1.0">
.top-box-description {
    font-size: 1.2em;
    margin-top: 10px;
}


    <title>Styled Div</title>
.video-container {
    text-align: left;
    margin-bottom: 60px;
    opacity: 0;
    animation: fadeIn 1.5s ease-out 0.5s forwards;
}


    <style>
.video-container iframe {
    width: 100%;
    max-width: 800px;
    height: 450px;
    border: none;
    border-radius: 15px;
}


        body {
.next-step-button {
    display: inline-block;
    margin-top: 20px;
    padding: 10px 20px;
    border-radius: 25px;
    background: #E2F5FA;
    color: #000;
    font-size: 1.1em;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    opacity: 0;
    animation: fadeIn 1.5s ease-out 1s forwards;
}


            font-family: Outfit, sans-serif;
.video-container iframe {
    width: 100%;
    max-width: 640px;
    height: 360px;
    border: none;
    border-radius: 15px;
}


            margin: 0;
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}


            padding: 0;
@media (max-width: 767px) {
    #mw-content-text.mw-body-content.mw-content-ltr {
        background-image: url('https://wiki.mdriven.net/images/bootcamp_background_mobile.webp');
        padding: 1em;
    }
}
</style>
    <div class="top-box">
        <span class="top-box-title">MDriven <span style="color:#F67A07;"> Learn </span> presents:</span><br>
        <span class="top-box-subtitle">BOOTCAMP</span><br>
        <span class="top-box-description">Learn how to model, prototype and build anything.</span>
    </div>


            display: flex;
<div class="video-container">
 
        <iframe src="https://www.youtube.com/embed/xdbXkwVMz8c?si=rZuxuJbCBLlEwnrr" allowfullscreen></iframe>
            justify-content: center;
        <a href="/index.php/Training:Bootcamp/Start" class="next-step-button">NEXT STEP - BOOTCAMP: BEFORE STARTING GUIDE</a>
 
    </div>
            align-items: center;
</html>
 
            background-color: #fff;
 
        }
 
        .container {
 
            width: 600px;
 
            text-align: center;
 
        }
 
        .title {
 
            font-size: 96px;
 
            font-weight: 700;
 
            margin: 20px 0;
 
        }
 
        .subtitle {
 
            background: rgba(255, 218, 187, 0.45);
 
            font-size: 48px;
 
            font-weight: 700;
 
            margin: 0 auto;
 
            padding: 10px;
 
        }
 
        .section {
 
            display: flex;
 
            align-items: center;
 
            margin: 20px 0;
 
            padding: 20px;
 
        }
 
        .section-icon {
 
            flex: 1;
 
        }
 
        .section-text {
 
            flex: 3;
 
            font-size: 40px;
 
            font-weight: 700;
 
        }
 
        .section-arrow {
 
            flex: 1;
 
            font-size: 40px;
 
        }
 
        .start-button {
 
            background: rgba(255, 218, 187, 0.45);
 
            font-size: 24px;
 
            font-weight: 700;
 
            padding: 15px;
 
            border: none;
 
            cursor: pointer;
 
        }
 
    </style>
 
</head>
 
<body>
 
    <nowiki><div class="container"></nowiki>
 
        <nowiki><div class="title">BOOTCAMP</div></nowiki>
 
        <nowiki><div class="subtitle">BEFORE STARTING GUIDE</div></nowiki>
 
       
 
        <nowiki><div class="section"></nowiki>
 
            <nowiki><div class="section-icon"></nowiki>
 
                <img src="https://via.placeholder.com/80" alt="Icon" />
 
            <nowiki></div></nowiki>
 
            <nowiki><div class="section-text">EXPECTATIONS</div></nowiki>
 
            <nowiki><div class="section-arrow">></div></nowiki>
 
        <nowiki></div></nowiki>
 
<nowiki><div class="section"></nowiki>
 
            <nowiki><div class="section-icon"></nowiki>
 
                <img src="https://via.placeholder.com/80" alt="Icon" />
 
            <nowiki></div></nowiki>
 
            <nowiki><div class="section-text">INSTALLATION</div></nowiki>
 
            <nowiki><div class="section-arrow">></div></nowiki>
 
        <nowiki></div></nowiki>
 
<nowiki><div class="section"></nowiki>
 
            <nowiki><div class="section-icon"></nowiki>
 
                <img src="https://via.placeholder.com/80" alt="Icon" />
 
            <nowiki></div></nowiki>
 
            <nowiki><div class="section-text">MATERIALS</div></nowiki>
 
            <nowiki><div class="section-arrow">></div></nowiki>
 
        <nowiki></div></nowiki>
 
<nowiki><div class="section"></nowiki>
 
            <nowiki><div class="section-icon"></nowiki>
 
                <img src="https://via.placeholder.com/80" alt="Icon" />
 
            <nowiki></div></nowiki>
 
            <nowiki><div class="section-text">TROUBLESHOOTING</div></nowiki>
 
            <nowiki><div class="section-arrow">></div></nowiki>
 
        <nowiki></div></nowiki>
 
<nowiki><div class="section"></nowiki>
 
            <nowiki><div class="section-icon"></nowiki>
 
                <img src="https://via.placeholder.com/80" alt="Icon" />
 
            <nowiki></div></nowiki>
 
            <nowiki><div class="section-text">COMMUNICATION</div></nowiki>
 
            <nowiki><div class="section-arrow">></div></nowiki>
 
        <nowiki></div></nowiki>
 
<button class="start-button">Click here to START BOOTCAMP</button>
 
    <nowiki></div></nowiki>
 
</body>
 
<nowiki></html></nowiki>

Latest revision as of 00:54, 21 August 2024

MDriven Learn presents:
BOOTCAMP
Learn how to model, prototype and build anything.
NEXT STEP - BOOTCAMP: BEFORE STARTING GUIDE

Retrieved from "https://newwikicopy.mdriven.net/index.php?title=Training:Bootcamp&oldid=19368"

© MDRIVEN . All Rights Reserved

Glossary API Docs
MDriven World | Portal | Blog | YouTube | StackOverflow | Facebook

© MDRIVEN . All Rights Reserved