Commit e03ae32b authored by Pedram Ashofteh Ardakani's avatar Pedram Ashofteh Ardakani 👾
Browse files

Fix `Git` button and the `hamburger` menu label

* The `hamburger` label is not showing properly in different browsers.
  Maybe that specific html unicode is not supported in all browsers. I
  used a trick to fix this issue using the pipe character `|` ;-)
  You could read about that here too:
  https://stackoverflow.com/a/61645811/6474744
* The `down-arrow` unicode also did not work as expected through some
  browsers. It was decided to remove this label totally. Maybe later
  we can adopt using `standard` unicode html characters that are
  `known` to be widely used across various browsers in different
  platforms.
parent f9aa40e0
......@@ -55,7 +55,7 @@
<div id="nav-hamburger-items" class="button">
<a href="index.html">Home</a>
<a href="about.html">About</a>
<a href="http://git.maneage.org/project.git/">&#10515; Git</a>
<a href="http://git.maneage.org/project.git/">Git</a>
<a href="tutorial.html">Tutorial</a>
</div>
</nav>
......
......@@ -146,6 +146,12 @@ li > code {
#nav-hamburger-wrapper label,
#nav-hamburger-input {
display: none;
transform: rotate(90deg);
transition-duration: 0.3s;
}
#nav-hamburger-wrapper input:checked + label {
transform: rotate(0);
}
/* Horizontal hamburger menu items. Keep the tabs in one line and don't
......@@ -284,7 +290,6 @@ section {
color: #fff;
font-style: normal;
font-size: 1.2em;
transition-duration: 0.2s;
}
/* Break down menu items into vertical */
......
......@@ -51,12 +51,12 @@
<header role="banner">
<!-- global navigation -->
<nav role="navigation" id="nav-hamburger-wrapper">
<label for="nav-hamburger-input">&#9776;</label>
<input type="checkbox" id="nav-hamburger-input"/>
<label for="nav-hamburger-input">|||</label>
<div id="nav-hamburger-items" class="button">
<a href="index.html">Home</a>
<a href="about.html">About</a>
<a href="http://git.maneage.org/project.git/">&#10515; Git</a>
<a href="http://git.maneage.org/project.git/">Git</a>
<a href="tutorial.html">Tutorial</a>
</div>
</nav>
......
......@@ -55,7 +55,7 @@
<div id="nav-hamburger-items" class="button">
<a href="index.html">Home</a>
<a href="about.html">About</a>
<a href="http://git.maneage.org/project.git/">&#10515; Git</a>
<a href="http://git.maneage.org/project.git/">Git</a>
<a href="tutorial.html">Tutorial</a>
</div>
</nav>
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment