<link rel="stylesheet" href="/buildmydist-2/style/sp.css" media="screen and (max-width: 799px)">
<link rel="stylesheet" href="/buildmydist-2/style/pc.css" media="screen and (min-width: 800px)">
+<!-- ページ設定をJSに渡す -->
+<script>
+ var distro = "<?php echo "${distro}";?>";
+ var title = "<?php echo "${title}";?>";
+</script>
+
<title><?php echo "${_GET["title"]}" ?> | オリジナルLinuxディストリを自作しよう2</title>
<p>
<ul id="bar-container">
- <li class="bar-item-left"><a href="/buildmydist-2/">トップ</a></li>
- <li class="bar-item-left"><a href="/buildmydist-2/pages/ubuntu1804/">Ubuntu 18.04</a></li>
- <li class="bar-item-left"><a href="/buildmydist-2/pages/ubuntu2004/">Ubuntu 20.04</a></li>
- <li class="bar-item-left"><a href="/buildmydist-2/pages/fedora33/">Fedora 33</a></li>
- <li class="bar-item-left"><a href="/buildmydist-2/pages/archiso/">Arch Linux</a></li>
- <li class="bar-item-left"><a href="/buildmydist-2/pages/alteriso3/">Alter Linux</a></li>
- <li class="bar-item-left"><a href="/buildmydist-2/pages/misc/">その他の雑学</a></li>
+ <li class="bar-item-left" data-pagename="top"><a href="/buildmydist-2/">トップ</a></li>
+ <li class="bar-item-left" data-pagename="ubuntu1804"><a href="/buildmydist-2/pages/ubuntu1804/">Ubuntu 18.04</a></li>
+ <li class="bar-item-left" data-pagename="ubuntu2004"><a href="/buildmydist-2/pages/ubuntu2004/">Ubuntu 20.04</a></li>
+ <li class="bar-item-left" data-pagename="fedora33"><a href="/buildmydist-2/pages/fedora33/">Fedora 33</a></li>
+ <li class="bar-item-left" data-pagename="archiso"><a href="/buildmydist-2/pages/archiso/">Arch Linux</a></li>
+ <li class="bar-item-left" data-pagename="alteriso3"><a href="/buildmydist-2/pages/alteriso3/">Alter Linux</a></li>
+ <li class="bar-item-left" data-pagename="misc"><a href="/buildmydist-2/pages/misc/">その他の雑学</a></li>
</ul>
</p>
// ページ設定
$_GET["title"] = "トップページ";
$commonhtml = "${_SERVER['DOCUMENT_ROOT']}/buildmydist-2/commonhtml";
+ $distro = "top";
// 共通ファイルを読み込み
$domain = $_SERVER['HTTP_HOST'];
<?php
// ページ設定
- $_GET["title"] = "Alter Linux - トップ";
+ $title = "Alter Linux - トップ";
$commonhtml = "${_SERVER['DOCUMENT_ROOT']}/buildmydist-2/commonhtml";
+ $distro = "alteriso3";
// 共通ファイルを読み込み
$domain = $_SERVER['HTTP_HOST'];
<?php
// ページ設定
- $_GET["title"] = "Arch Linux - トップ";
+ $title = "Arch Linux - トップ";
$commonhtml = "${_SERVER['DOCUMENT_ROOT']}/buildmydist-2/commonhtml";
+ $distro = "archiso";
// 共通ファイルを読み込み
$domain = $_SERVER['HTTP_HOST'];
<?php
// ページ設定
- $_GET["title"] = "Fedora 33 - トップ";
+ $title = "Fedora 33 - トップ";
$commonhtml = "${_SERVER['DOCUMENT_ROOT']}/buildmydist-2/commonhtml";
+ $distro = "fedora33";
// 共通ファイルを読み込み
$domain = $_SERVER['HTTP_HOST'];
<?php
// ページ設定
- $_GET["title"] = "その他の雑学";
+ $title = "その他の雑学";
$commonhtml = "${_SERVER['DOCUMENT_ROOT']}/buildmydist-2/commonhtml";
+ $distro = "misc";
// 共通ファイルを読み込み
$domain = $_SERVER['HTTP_HOST'];
<?php
// ページ設定
- $_GET["title"] = "OS名 - トップ";
+ $title = "OS名 - トップ";
$commonhtml = "${_SERVER['DOCUMENT_ROOT']}/buildmydist-2/commonhtml";
+ $distro = "osname";
// 共通ファイルを読み込み
$domain = $_SERVER['HTTP_HOST'];
<?php
// ページ設定
- $_GET["title"] = "Ubuntu 18.04 - トップ";
+ $title = "Ubuntu 18.04 - トップ";
$commonhtml = "${_SERVER['DOCUMENT_ROOT']}/buildmydist-2/commonhtml";
+ $distro = "ubuntu1804";
// 共通ファイルを読み込み
$domain = $_SERVER['HTTP_HOST'];
<?php
// ページ設定
- $_GET["title"] = "Ubuntu 20.04 - トップ";
+ $title = "Ubuntu 20.04 - トップ";
$commonhtml = "${_SERVER['DOCUMENT_ROOT']}/buildmydist-2/commonhtml";
+ $distro = "ubuntu2004";
// 共通ファイルを読み込み
$domain = $_SERVER['HTTP_HOST'];
+
+
+function SetCurrentPage(){
+ var distroBar = document.getElementById("bar-container");
+ //var barItemCount = distroBar.childElementCount;
+ var barItemList = distroBar.children
+ Array.from(barItemList).forEach(element => {
+ if (element.dataset.pagename == distro ){
+ element.classList.add("currentdistro");
+ }
+ });
+}
+
+window.addEventListener("load", SetCurrentPage);
\ No newline at end of file
padding-right: 5%;
margin: 0;
}
+
+/* 現在選択されているディストロ */
+.currentdistro{
+ background-color: var(--black-2);
+}
/* === ここまでメニューバー === */
*{
--red-1: #e74c3c;
--black-1: #2c3e50;
- --white-1: #ecf0f1;
+ --black-2: #576574;
+ --white-1: #ecf0f1;
}
\ No newline at end of file