Social Icons

Sunday, January 17, 2021

Base Template Django
<!-- templates/base.html -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <!-- Bootstrap 5 -->
   <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
   <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
   <style>
   .header {
    color: white;
    background-color: #0975C3;
    text-align: center;
    font-size: 36px;
    padding-left: 25px;
    padding-right: 25px;
    padding-bottom: 25px;
    padding-top: 25px;
}
   </style>
   
   <title>Document</title>
</head>
<body>
  <!--  Header -->
<div class="container-fluid p-0 ">
    <div class="header">
        Django Blog ! 
    </div> 
</div>
             <!-- End Header -->  

 <!--  Navbar -->
<!-- https://getbootstrap.com/docs/5.0/components/navbar/  -->   
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
    <div class="container-fluid">
       <a class="navbar-brand" href="#"></a>
       <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
         <span class="navbar-toggler-icon"></span>
       </button>
       <div class="collapse navbar-collapse" id="navbarSupportedContent">
         <ul class="navbar-nav me-auto mb-2 mb-lg-0">
           <li class="nav-item">
             <a class="nav-link active" aria-current="page" href="#">Home</a>
           </li>
           <li class="nav-item">
             <a class="nav-link" href="#">About Us</a>
           </li>
           
                   <li class="nav-item">
             <a class="nav-link" href="#">Archives</a>
           </li>
                   <li class="nav-item">
             <a class="nav-link" href="#">Courses</a>
           </li>
                   <li class="nav-item">
             <a class="nav-link" href="#">Projects</a>
           </li>
                           <li class="nav-item">
             <a class="nav-link" href="#">News</a>
           </li>
           
           <li class="nav-item dropdown">
             <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
               Formations
             </a>
             <ul class="dropdown-menu" aria-labelledby="navbarDropdown">
               <li><a class="dropdown-item" href="#">Web Developpement</a></li>
               <li><a class="dropdown-item" href="#">Mobile Developpement</a></li>
               <li><hr class="dropdown-divider"></li>
               <li><a class="dropdown-item" href="#">Desktop Developpement</a></li>
               <li><a class="dropdown-item" href="#">Data Sciences</a></li>
               
             </ul>
           </li>
                       <li class="nav-item">
             <a class="nav-link" href="#">Contact Us</a>
           </li>
         </ul>
         <form class="d-flex">
           <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
           <button class="btn btn-outline-success" type="submit">Search</button>
         </form>
       </div>
     </div> 
   </nav>
                                              <!-- End Navbar -->
   



<div class = "container" >
<div class ="row" style = "margin-top: 20px;">

                  <!-- 4.1)  Sidenav avec 3 colonnes -->
<div class="col-4">
<!-- Mettez ici le contenu de votre sidenav: des liens, des boutons de commandes...  -->
<div class="card text-white bg-primary mb-3" style="max-width: 18rem;">
    <div class="card-header">Main Menu</div>
    <div class="card-body" style="background-color: white; color:black;">
      
      <p class="card-text">
          Your Sidebar <br />
		  content here<br />
		  ............<br />
		  Your Sidebar <br />
		  content here<br />
		  .............<br />
		  Your Sidebar <br />
		  content here<br />
        <br /><br /><br /><br /><br /><br /><br />
        </p>
    </div>
  </div>


</div>
                            <!-- End Sidenav-->


                     <!-- BODY avec 7 colonnes-->
<div class="col-8">
<div class="card">
<div class="card-header bg-primary" style="color:white; font-size: 18px; font-weight:bold; width:100%;">
    Title here
  </div>
  <div class="card-body">
    <p class="card-text">
        {% block content %}

        {% endblock %}
    </p>
          <a href="#" class="btn btn-primary">Read More !</a>
  </div>
</div>
</div>
                                     <!-- End Body-->
                                    </div></div>
<br />
  <!-- FOOTER START -->

  <footer class="bg-dark text-center text-white">
    <!-- Grid container -->
    <div class="container p-4 pb-0">
      <!-- Section: Form -->
      <section class="">
        <form action="">
          <!--Grid row-->
          <div class="row d-flex justify-content-center">
            <!--Grid column-->
            <div class="col-auto">
              <p class="pt-2">
                <strong>Sign up for our newsletter</strong>
              </p>
            </div>
            <!--Grid column-->
  
            <!--Grid column-->
            <div class="col-md-5 col-12">
              <!-- Email input -->
              <div class="form-outline form-white mb-4">
                <input type="email" id="form5Example29" class="form-control" />
                <label class="form-label" for="form5Example29">Email address</label>
              </div>
            </div>
            <!--Grid column-->
  
            <!--Grid column-->
            <div class="col-auto">
              <!-- Submit button -->
              <button type="submit" class="btn btn-outline-light mb-4">
                Subscribe
              </button>
            </div>
            <!--Grid column-->
          </div>
          <!--Grid row-->
        </form>
      </section>
      <!-- Section: Form -->
    </div>
    <!-- Grid container -->
  
    <!-- Copyright -->
    <div class="text-center p-3" style="background-color: rgba(0, 0, 0, 0.2);">
      © 2020 Copyright:
      <a class="text-white" href="https://mdbootstrap.com/">MDBootstrap.com</a>
    </div>
    <!-- Copyright -->
 </footer>
  <!-- END OF FOOTER -->                       


</body>
</html>


Younes Derfoufi
my-courses.net

No comments:

Post a Comment

Learn Python For Beginners

Category Of Mobile Courses

Actualités (644) Adsense (1) Affiliation (1) Algebraic Topology (2) Algorithmic (1) all-news (30) Android (5) Android App (8) Android app without code (4) Android Apps (256) Android Development (4) Android download (2) Android OS (3) AngularJS (1) Automata theory and formal language (5) Bootstrap CSS (1) C programming (5) Category and Functor (8) CMS (3) Computer Glossary (18) Create Mobile App With Ionic Framework (2) CSS (2) CSS-Cascading-Style-Sheets (4) Developpement Java (13) Differential Geometry (1) Django-Python-Framework (15) dropshiping (26) Earn Money by Internet (4) Emplois (23) Framework php (2) Fraud (2) Github (2) HTML (7) IT News (3) Java For Beginners (10) Javascript (12) Kotlin Programming Language (8) Kotlin For Mobile Android (1) Linux Download (2) Marketing (5) Mobile (3) Mobile Courses (4) Mobile Marketing (4) MoneyGram (1) News (721) Node.js (5) Open Source (1) Photoshop (1) Protect Computer (1) Python (36) Python BeautifulSoup (1) Python For Data Science (2) Python PyQt (13) Python Reference (1) Python Source Code (3) Python-Books (6) Python-DVD-Training (1) Python-Exercises (297) Python-Framework (1) Python-IDE (1) Python-Kivy-Framework (2) Python-Modules (1) Python-pdf (2) Python-pyQt (1) python-temp (3) Référencement (2) Script PHP (2) Security (6) SEO (1) Snipping Tool: Faq (1) Social Networks (1) Source Code (4) Statistics With SPSS (2) Surveillance Software (1) Travail à domicile (6) Tutoriels php en vidéos (2) Tutoriels-MySql (6) tutoriels-php (19) Utilitaires (1) VPS (1) Web Hosting (1) Webcam (1) Webmarketing (11) Western Union (1) Windows 10 (1) Windows 7 (4) Windows 7 Faq (2) Windows 8 (1) Windows Accessories (1) Windows Download (8) Windows Drivers (1) Windows Fonts (1) Windows Power Shell (2) Windows Registry (2) Windows Security (18) Windows Software (2) Windows Spyware (2) Windows utilities (3) Windows Virus (2) Windows Vista (3) Windows Wireless (1) Windows xp (1) Wordpress (1)
 

Sample text

Sample Text

 
Blogger Templates