diff --git a/index.php b/index.php
index ac318152a84e6385ae3db95766b6b4766e588bc7..b53ce393e2943af208cad43f12a01b46bff9f492 100644
--- a/index.php
+++ b/index.php
@@ -104,6 +104,7 @@ include 'libs/load.php';
</head>
<body>
+ <!-- To change dark to light mode -->
<svg xmlns="http://www.w3.org/2000/svg" class="d-none">
<symbol id="check2" viewBox="0 0 16 16">
<path d="M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0z"/>
@@ -119,7 +120,7 @@ include 'libs/load.php';
<path d="M8 12a4 4 0 1 0 0-8 4 4 0 0 0 0 8zM8 0a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 0zm0 13a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 13zm8-5a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2a.5.5 0 0 1 .5.5zM3 8a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2A.5.5 0 0 1 3 8zm10.657-5.657a.5.5 0 0 1 0 .707l-1.414 1.415a.5.5 0 1 1-.707-.708l1.414-1.414a.5.5 0 0 1 .707 0zm-9.193 9.193a.5.5 0 0 1 0 .707L3.05 13.657a.5.5 0 0 1-.707-.707l1.414-1.414a.5.5 0 0 1 .707 0zm9.193 2.121a.5.5 0 0 1-.707 0l-1.414-1.414a.5.5 0 0 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .707zM4.464 4.465a.5.5 0 0 1-.707 0L2.343 3.05a.5.5 0 1 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .708z"/>
</symbol>
</svg>
-
+ <!-- dark or light mode toggle -->
<div class="dropdown position-fixed bottom-0 end-0 mb-3 me-3 bd-mode-toggle">
<button class="btn btn-bd-primary py-2 dropdown-toggle d-flex align-items-center"
id="bd-theme"
@@ -185,162 +186,13 @@ include 'libs/load.php';
<!-- To load Welcome card (calltoaction.php) from template folder -->
<?load_template('calltoaction');?>
- <div class="album py-5 bg-body-tertiary">
- <div class="container">
-
- <div class="row row-cols-1 row-cols-sm-2 row-cols-md-3 g-3">
- <div class="col">
- <div class="card shadow-sm">
- <svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: Thumbnail" preserveAspectRatio="xMidYMid slice" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg>
- <div class="card-body">
- <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
- <div class="d-flex justify-content-between align-items-center">
- <div class="btn-group">
- <button type="button" class="btn btn-sm btn-outline-secondary">View</button>
- <button type="button" class="btn btn-sm btn-outline-secondary">Edit</button>
- </div>
- <small class="text-body-secondary">9 mins</small>
- </div>
- </div>
- </div>
- </div>
- <div class="col">
- <div class="card shadow-sm">
- <svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: Thumbnail" preserveAspectRatio="xMidYMid slice" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg>
- <div class="card-body">
- <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
- <div class="d-flex justify-content-between align-items-center">
- <div class="btn-group">
- <button type="button" class="btn btn-sm btn-outline-secondary">View</button>
- <button type="button" class="btn btn-sm btn-outline-secondary">Edit</button>
- </div>
- <small class="text-body-secondary">9 mins</small>
- </div>
- </div>
- </div>
- </div>
- <div class="col">
- <div class="card shadow-sm">
- <svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: Thumbnail" preserveAspectRatio="xMidYMid slice" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg>
- <div class="card-body">
- <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
- <div class="d-flex justify-content-between align-items-center">
- <div class="btn-group">
- <button type="button" class="btn btn-sm btn-outline-secondary">View</button>
- <button type="button" class="btn btn-sm btn-outline-secondary">Edit</button>
- </div>
- <small class="text-body-secondary">9 mins</small>
- </div>
- </div>
- </div>
- </div>
-
- <div class="col">
- <div class="card shadow-sm">
- <svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: Thumbnail" preserveAspectRatio="xMidYMid slice" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg>
- <div class="card-body">
- <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
- <div class="d-flex justify-content-between align-items-center">
- <div class="btn-group">
- <button type="button" class="btn btn-sm btn-outline-secondary">View</button>
- <button type="button" class="btn btn-sm btn-outline-secondary">Edit</button>
- </div>
- <small class="text-body-secondary">9 mins</small>
- </div>
- </div>
- </div>
- </div>
- <div class="col">
- <div class="card shadow-sm">
- <svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: Thumbnail" preserveAspectRatio="xMidYMid slice" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg>
- <div class="card-body">
- <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
- <div class="d-flex justify-content-between align-items-center">
- <div class="btn-group">
- <button type="button" class="btn btn-sm btn-outline-secondary">View</button>
- <button type="button" class="btn btn-sm btn-outline-secondary">Edit</button>
- </div>
- <small class="text-body-secondary">9 mins</small>
- </div>
- </div>
- </div>
- </div>
- <div class="col">
- <div class="card shadow-sm">
- <svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: Thumbnail" preserveAspectRatio="xMidYMid slice" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg>
- <div class="card-body">
- <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
- <div class="d-flex justify-content-between align-items-center">
- <div class="btn-group">
- <button type="button" class="btn btn-sm btn-outline-secondary">View</button>
- <button type="button" class="btn btn-sm btn-outline-secondary">Edit</button>
- </div>
- <small class="text-body-secondary">9 mins</small>
- </div>
- </div>
- </div>
- </div>
-
- <div class="col">
- <div class="card shadow-sm">
- <svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: Thumbnail" preserveAspectRatio="xMidYMid slice" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg>
- <div class="card-body">
- <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
- <div class="d-flex justify-content-between align-items-center">
- <div class="btn-group">
- <button type="button" class="btn btn-sm btn-outline-secondary">View</button>
- <button type="button" class="btn btn-sm btn-outline-secondary">Edit</button>
- </div>
- <small class="text-body-secondary">9 mins</small>
- </div>
- </div>
- </div>
- </div>
- <div class="col">
- <div class="card shadow-sm">
- <svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: Thumbnail" preserveAspectRatio="xMidYMid slice" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg>
- <div class="card-body">
- <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
- <div class="d-flex justify-content-between align-items-center">
- <div class="btn-group">
- <button type="button" class="btn btn-sm btn-outline-secondary">View</button>
- <button type="button" class="btn btn-sm btn-outline-secondary">Edit</button>
- </div>
- <small class="text-body-secondary">9 mins</small>
- </div>
- </div>
- </div>
- </div>
- <div class="col">
- <div class="card shadow-sm">
- <svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: Thumbnail" preserveAspectRatio="xMidYMid slice" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg>
- <div class="card-body">
- <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
- <div class="d-flex justify-content-between align-items-center">
- <div class="btn-group">
- <button type="button" class="btn btn-sm btn-outline-secondary">View</button>
- <button type="button" class="btn btn-sm btn-outline-secondary">Edit</button>
- </div>
- <small class="text-body-secondary">9 mins</small>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
+<!-- To load Photo feed content (photogram.php) from template folder -->
+<?load_template('photogram');?>
</main>
-<footer class="text-body-secondary py-5">
- <div class="container">
- <p class="float-end mb-1">
- <a href="#">Back to top</a>
- </p>
- <p class="mb-1">Album example is © Bootstrap, but please download and customize it for yourself!</p>
- <p class="mb-0">New to Bootstrap? <a href="/">Visit the homepage</a> or read our <a href="../getting-started/introduction/">getting started guide</a>.</p>
- </div>
-</footer>
+<!-- To load footer (footer.php) from template folder -->
+<?load_template('footer');?>
<script src="/photogram-project-php/assets/dist/js/bootstrap.bundle.min.js"></script>
</body>
diff --git a/libs/load.php b/libs/load.php
index a77ad0dea83a9e430c6b61400526a5f8ab277be2..103993af51529966acc47450ac439a17765aa736 100644
--- a/libs/load.php
+++ b/libs/load.php
@@ -1,6 +1,6 @@
<?php
function load_template($name){
- include __DIR__. "/../_templates/$name.php";
+ include $_SERVER['DOCUMENT_ROOT']. "/photogram-project-php/_templates/$name.php";
}
?>
\ No newline at end of file
diff --git a/test.php b/test.php
new file mode 100644
index 0000000000000000000000000000000000000000..46cbc7fc347ded5758d69f257bb0ad50755a5bb1
--- /dev/null
+++ b/test.php
@@ -0,0 +1,5 @@
+<pre>
+ <?php
+ print_r($_SERVER);
+ ?>
+</pre>
\ No newline at end of file