regular.php - master - sytnic/doctormed

regular.php
159 строк6 KB
sytnic
Price page
17 окт 2025, 15:35
17 окт 2025, 15:35ea50907
<?php include('layouts/head.php');  ?>

<?php include('svg/svg_bootstrap.html');  ?>
<?php include('svg/svg_darkmode.html');  ?>

<?php include('layouts/toggle_dark.html');  ?>  

<?php include('layouts/navigation_top.php');  ?>  

  <main>

  <!-- HEADER -->
  <div class="container text-center mt-3">      
    <h1> <i class="bi bi-bootstrap-fill"></i> Regular Page</h1>
  </div>

  <!-- CARDS -->    
  <div class="album py-1 bg-body-tertiary">
    <div class="container mt-3 mb-3"> 
    
      <!-- Card Group-->  
      <div class="row mt-3"> 
          <h2>Card title 1</h2> 
          
        <div class="card-group">
          
          <div class="me-1 mb-1">
            <div class="card h-100" style="width: 225px;">
              <img src="https://dummyimage.com/220x300/868e96/dee2e6.jpg" class="card-img-top" alt="...">
              <div class="card-body">
              <h5 class="card-title">Card title</h5>
              <p class="card-text">This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
              </div>               
              <ul class="list-group list-group-flush">
              <li class="list-group-item">An item - 1800</li>
              <li class="list-group-item">A second item - 2000</li>
              </ul> 
              <div class="card-footer"> 
              <a href="#" class="card-link">Card link</a>
              <a href="#" class="card-link">Another link</a>
              </div>
            </div> <!-- /card -->
          </div>    
          
          <div class="me-1 mb-1">
            <div class="card h-100" style="width: 225px;">
              
              <img src="https://dummyimage.com/220x300/868e96/dee2e6.jpg" class="card-img-top" alt="...">
              <div class="card-body">
              <h5 class="card-title">Card title</h5>
              <p class="card-text">This is a short card.</p>
              </div>
              <ul class="list-group list-group-flush">
              <li class="list-group-item">An item - 1800</li>
              <li class="list-group-item">A second item - 2000</li>
              </ul>
              <div class="card-footer">
              <a href="#" class="card-link">Card link</a>
              <a href="#" class="card-link">Another link</a>
              </div>
              
            </div> <!-- /card -->
          </div>
          
          <div class="mb-1">
            <div class="card h-100" style="width: 225px;">
              <img src="https://dummyimage.com/220x300/868e96/dee2e6.jpg" class="card-img-top" alt="...">
              <div class="card-body">
              <h5 class="card-title">David Longrid Caroline</h5>
              <p class="card-text">This is a longer card with supporting text below as a natural lead-in to additional content.</p>
              </div>
              <ul class="list-group list-group-flush">
              <li class="list-group-item">Pervichnyi priem - 1800 r.</li>
              <li class="list-group-item">Vtorichnyi priem - 2000 r.</li>
              </ul>
              <div class="card-footer">
              <a href="#" class="card-link">Card link</a>
              <a href="#" class="card-link">Another link</a>
              </div>
              
            </div> <!-- /card -->
          </div>
      
        </div> <!-- /group -->            
      </div> <!-- /row -->

    </div> <!-- /container for all cards -->
  </div> <!-- /album bg-body- -->

  <!-- TEXT -->
  <div class="container py-1 bg-body-tertiary">
      <h2>How it works</h2>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>

      <img src="https://dummyimage.com/450x300/aaa/fff.jpg" class="img-fluid mb-2" alt="..." width="450" height="300">
      <h2>What is this</h2>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
      <p>What kind of</p>
      <ul>
        <li>Number One</li>
        <li>Number Two</li>
        <li>Number Three</li>
        <li>Number Four</li>
        <li>Number Five</li>
        <li>Number Six</li>
      </ul>

      <img src="https://dummyimage.com/450x300/aaa/fff.jpg" class="img-fluid mb-2" alt="..." width="450" height="300">
      <h2>What it does</h2>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  </div> <!-- /container -->

  <!-- TABLE -->
  <div class="container py-1 bg-body-tertiary">
    <h2>How much it cost</h2>

    <table class="table table-striped">
      <thead>
        <tr>
          <th scope="col">#</th>
          <th scope="col">First</th>
          <th scope="col">Last</th>
          <th scope="col">Handle</th>
          <th scope="col">Handling</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <th scope="row">1</th>
          <td>Mark Otto</td>
          <td>Description @mdo</td>
          <td>1600</td>
          <td>1800</td>
        </tr>
        <tr>
          <th scope="row">2</th>
          <td>Jacob Thornton</td>
          <td>Description @fat</td>
          <td>1400</td>
          <td>1600</td>
        </tr>
        <tr>
          <th scope="row">3</th>
          <td>John Doe</td>
          <td>Description @social</td>
          <td>1800</td>
          <td>2000</td>
        </tr>
      </tbody>
    </table>
  </div> <!-- table /container -->

<?php include('layouts/footer_dark.php');  ?>

  </main>
    
<?php include('layouts/footer_js.php');  ?>

</html>