Projects/nettsiden
Projects/nettsiden
8
2
Fork 0
Code Issues 15 Pull Requests 2 Activity

Better styling of the user menu

Browse Source
This commit is contained in:
Yorin Anne De Jong 2018-02-13 18:44:36 +01:00
parent 24b6af1799
commit 060d37c040
2 changed files with 15 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
inc/navbar.php
View File

@ -31,14 +31,9 @@ function loginBar($sp = null, $pdo = null) {
require_once(__DIR__ . '/../vendor/simplesamlphp/simplesamlphp/lib/_autoload.php');
$as = new SimpleSAML_Auth_Simple($sp);
$svgWhite = '<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64">
<circle cx="32" cy="27" r="14" stroke-width="0" fill="white" />
<ellipse cx="32" cy="66" rx="24" ry="28" stroke-width="0" fill="white" />
</svg>
';
$svgBlue = '<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64">
<circle cx="32" cy="27" r="14" stroke-width="0" fill="#024" />
<ellipse cx="32" cy="66" rx="24" ry="28" stroke-width="0" fill="#024" />
$svg = '<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64">
<circle cx="32" cy="27" r="14" stroke-width="0" />
<ellipse cx="32" cy="66" rx="24" ry="28" stroke-width="0" />
</svg>
';
@ -51,17 +46,17 @@ function loginBar($sp = null, $pdo = null) {
} else {
$isAdmin = false;
}
$result .= "\t<a id=\"login\" href=\"#usermenu\" aria-hidden=\"true\">${svgWhite}" . htmlspecialchars($uname) . "</a>\n";
$result .= "\n\t<ul id=\"usermenu\">\n";
$result .= "\n\t\t<li><a id=\"login\" href=\"#\">${svgBlue}" . htmlspecialchars($uname) . "</a></li>\n";
$result .= "\n\t\t<li><a id=\"login\" href=\"#\">${svg}" . htmlspecialchars($uname) . "</a></li>\n";
if ($isAdmin) {
$result .= "\n\t\t<li><a href=\"/admin/\">Admin</a></li>\n";
}
$result .= "\n\t\t<li><a href=\"" . htmlspecialchars($as->getLogoutURL()) . "\">Logg ut</a></li>\n";
$result .= "\n\t</ul>\n";
$result .= "\t<a id=\"login\" href=\"#usermenu\" aria-hidden=\"true\">${svg}" . htmlspecialchars($uname) . "</a>\n";
} else {
$result .= "\t<a id=\"login\" href=\"" . htmlspecialchars($as->getLoginURL()) . "\">${svgWhite}Logg inn</a>\n";
$result .= "\t<a id=\"login\" href=\"" . htmlspecialchars($as->getLoginURL()) . "\">${svg}Logg inn</a>\n";
}
$result .= "\n\t<a href=\"#menu\" id=\"menu_toggle\" aria-hidden=\"true\"><big>&#9776;&nbsp;</big>MENU</a>\n";

8
www/css/style.css
View File

@ -68,6 +68,7 @@ nav a {
display: inline-block;
margin: auto;
color: white;
fill: white; /* SVG icon */
text-decoration: none;
margin: 0 .75em;
}
@ -98,6 +99,13 @@ nav #usermenu li, nav #usermenu li a {
nav #usermenu:target {
display: block;
}
/* Style #login when #usermenu is targeted */
/* Requires #login to appear after #usermenu, directly under nav */
nav #usermenu:target ~ #login {
color: #024;
fill: #024; /* SVG icon */
background: white;
}
@media(max-width: 800px){
nav #menu, nav #menu li.active, nav #menu_toggle, nav #login {