Upgrade to Bootstrap 4.0, FontAwesome 5.0, and jQuery 3.3.1

master
Skylar Ittner 6 years ago
parent ce8e0fb4e3
commit 121a49e9e0

@ -29,9 +29,13 @@ if (!is_empty($_GET['page'])) {
<title><?php echo SITE_TITLE; ?></title> <title><?php echo SITE_TITLE; ?></title>
<link href="static/css/bootstrap.min.css" rel="stylesheet"> <link href="static/css/bootstrap.min.css" rel="stylesheet">
<link href="static/css/font-awesome.min.css" rel="stylesheet">
<link href="static/css/material-color/material-color.min.css" rel="stylesheet"> <link href="static/css/material-color/material-color.min.css" rel="stylesheet">
<link href="static/css/app.css" rel="stylesheet"> <link href="static/css/app.css" rel="stylesheet">
<link href="static/css/fa-svg-with-js.css" rel="stylesheet">
<script nonce="<?php echo $SECURE_NONCE; ?>">
FontAwesomeConfig = {autoAddCss: false}
</script>
<script src="static/js/fontawesome-all.min.js"></script>
<?php <?php
// custom page styles // custom page styles
if (isset(PAGES[$pageid]['styles'])) { if (isset(PAGES[$pageid]['styles'])) {
@ -42,151 +46,111 @@ if (!is_empty($_GET['page'])) {
?> ?>
</head> </head>
<body> <body>
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4 col-sm-offset-3 col-md-offset-4 col-lg-offset-4">
<?php
if ((SHOW_ICON == "both" || SHOW_ICON == "app") && ICON_POSITION != "menu") {
if (MENU_BAR_STYLE != "fixed") {
?>
<img class="img-responsive banner-image" src="static/img/logo.png" />
<?php <?php
// Alert messages
if (!is_empty($_GET['msg']) && array_key_exists($_GET['msg'], MESSAGES)) {
// optional string generation argument
if (is_empty($_GET['arg'])) {
$alertmsg = lang(MESSAGES[$_GET['msg']]['string'], false);
} else {
$alertmsg = lang2(MESSAGES[$_GET['msg']]['string'], ["arg" => strip_tags($_GET['arg'])], false);
} }
$alerttype = MESSAGES[$_GET['msg']]['type'];
$alerticon = "square-o";
switch (MESSAGES[$_GET['msg']]['type']) {
case "danger":
$alerticon = "times";
break;
case "warning":
$alerticon = "exclamation-triangle";
break;
case "info":
$alerticon = "info-circle";
break;
case "success":
$alerticon = "check";
break;
} }
?> echo <<<END
<div class="row justify-content-center" id="msg-alert-box">
<div class="col-11 col-xs-6 col-md-6 col-lg-6 col-xl-4">
<div class="alert alert-dismissible alert-$alerttype">
<button type="button" class="close">&times;</button>
<i class="fas fa-$alerticon"></i> $alertmsg
</div>
</div> </div>
</div> </div>
<nav class="navbar navbar-inverse navbar-<?php echo MENU_BAR_STYLE; ?>-top"> END;
<div class="container-fluid"> }
<div class="navbar-header"> ?>
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse">
<span class="sr-only">Toggle navigation</span> <?php
<span class="icon-bar"></span> // Adjust as needed
<span class="icon-bar"></span> $navbar_breakpoint = "sm";
<span class="icon-bar"></span> ?>
<nav class="navbar navbar-expand-<?php echo $navbar_breakpoint; ?> navbar-dark bg-dark fixed-top">
<button class="navbar-toggler my-0 py-0" type="button" data-toggle="collapse" data-target="#collapse" aria-controls="collapse" aria-expanded="false" aria-label="Toggle navigation">
<i class="fas fa-bars"></i>
</button> </button>
<a class="navbar-brand py-0 mr-auto" href="app.php">
<?php <?php
if (SHOW_ICON == "both" || SHOW_ICON == "app") {
if (MENU_BAR_STYLE == "fixed" || ICON_POSITION == "menu") {
$src = "static/img/logo.png"; $src = "static/img/logo.png";
if ($pageid != "home") { if ($pageid != "home") {
$src = "static/img/up-arrow-white.png"; $src = "static/img/up-arrow-white.png";
} }
?> ?>
<a class="navbar-brand" href="app.php"> <img src="<?php echo $src; ?>" alt="" class="d-inline brand-img py-0" />
<img src="<?php echo $src; ?>" /> <?php echo SITE_TITLE; ?>
</a> </a>
<?php
}
}
?>
<a class="navbar-brand" href="app.php">
<?php
echo SITE_TITLE;
?>
</a>
</div>
<div class="collapse navbar-collapse" id="navbar-collapse"> <div class="collapse navbar-collapse py-0" id="collapse">
<ul class="nav navbar-nav"> <div class="navbar-nav mr-auto py-0">
<?php <?php
$counter = 0;
$more = "";
$curpagefound = false; $curpagefound = false;
foreach (PAGES as $id => $pg) { foreach (PAGES as $id => $pg) {
if ($pg['navbar'] === TRUE) { if ($pg['navbar'] === TRUE) {
$counter++;
if ($counter > ($curpagefound ? 4 : 3) && $pageid != $id) {
$item = '<a href="app.php?page=' . $id . '">';
if (isset($pg['icon'])) {
$item .= '<i class="fa fa-' . $pg['icon'] . ' fa-fw"></i>';
}
$item .= lang($pg['title'], false) . '</a>';
echo '<li class="hidden-sm hidden-md">' . $item . "</li>";
$more .= '<li>' . $item . "</li>";
} else {
if ($pageid == $id) { if ($pageid == $id) {
$curpagefound = true; $curpagefound = true;
?> ?>
<li class="active"> <span class="nav-item py-<?php echo $navbar_breakpoint; ?>-0 active">
<?php <?php
} else { } else {
?> ?>
<li> <span class="nav-item py-<?php echo $navbar_breakpoint; ?>-0">
<?php } ?>
<a href="app.php?page=<?php echo $id; ?>">
<?php <?php
if (isset($pg['icon'])) {
?>
<i class="fa fa-<?php echo $pg['icon']; ?> fa-fw"></i>
<?php } ?>
<?php lang($pg['title']) ?>
</a>
</li>
<?php
}
}
} }
if ($counter > 4) {
?>
<li class="dropdown hidden-lg hidden-xs">
<a href="" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-ellipsis-v fa-fw"></i> <?php lang("more"); ?></a>
<ul class="dropdown-menu"><?php echo $more; ?></ul>
</li>
<?php } ?>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="<?php echo PORTAL_URL; ?>"><i class="fa fa-user fa-fw"></i> <span class="hidden-sm hidden-md"><?php echo $_SESSION['realname'] ?></span></a></li>
<li><a href="action.php?action=signout"><i class="fa fa-sign-out fa-fw"></i> <span class="hidden-sm hidden-md"><?php lang("sign out") ?></span></a></li>
</ul>
</div>
</div>
</nav>
<?php
if (MENU_BAR_STYLE == "fixed") {
?> ?>
<div class="pad-75px"></div> <a class="nav-link py-<?php echo $navbar_breakpoint; ?>-0" href="app.php?page=<?php echo $id; ?>">
<?php <?php
if (isset($pg['icon'])) {
?><i class="<?php echo $pg['icon']; ?> fa-fw"></i> <?php
} }
lang($pg['title']);
?> ?>
</a>
</span>
<?php <?php
// Alert messages
if (!is_empty($_GET['msg']) && array_key_exists($_GET['msg'], MESSAGES)) {
// optional string generation argument
if (is_empty($_GET['arg'])) {
$alertmsg = lang(MESSAGES[$_GET['msg']]['string'], false);
} else {
$alertmsg = lang2(MESSAGES[$_GET['msg']]['string'], ["arg" => strip_tags($_GET['arg'])], false);
} }
$alerttype = MESSAGES[$_GET['msg']]['type'];
$alerticon = "square-o";
switch (MESSAGES[$_GET['msg']]['type']) {
case "danger":
$alerticon = "times";
break;
case "warning":
$alerticon = "exclamation-triangle";
break;
case "info":
$alerticon = "info-circle";
break;
case "success":
$alerticon = "check";
break;
} }
echo <<<END ?>
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4 col-sm-offset-3 col-md-offset-4 col-lg-offset-4">
<div class="alert alert-dismissible alert-$alerttype">
<button type="button" class="close">&times;</button>
<i class="fa fa-$alerticon"></i> $alertmsg
</div> </div>
<div class="navbar-nav ml-auto py-0">
<span class="nav-item py-<?php echo $navbar_breakpoint; ?>-0">
<a class="nav-link py-<?php echo $navbar_breakpoint; ?>-0" href="<?php echo PORTAL_URL; ?>">
<i class="fas fa-user fa-fw"></i><span>&nbsp;<?php echo $_SESSION['realname'] ?></span>
</a>
</span>
<span class="nav-item mr-auto py-<?php echo $navbar_breakpoint; ?>-0">
<a class="nav-link py-<?php echo $navbar_breakpoint; ?>-0" href="action.php?action=signout">
<i class="fas fa-sign-out-alt fa-fw"></i><span>&nbsp;<?php lang("sign out") ?></span>
</a>
</span>
</div> </div>
</div> </div>
END; </nav>
}
?> <div class="container" id="main-content">
<div> <div>
<?php <?php
include_once __DIR__ . '/pages/' . $pageid . ".php"; include_once __DIR__ . '/pages/' . $pageid . ".php";
@ -197,11 +161,11 @@ END;
Copyright &copy; <?php echo date('Y'); ?> <?php echo COPYRIGHT_NAME; ?> Copyright &copy; <?php echo date('Y'); ?> <?php echo COPYRIGHT_NAME; ?>
</div> </div>
</div> </div>
<script src="static/js/jquery-3.2.1.min.js"></script> <script src="static/js/jquery-3.3.1.min.js"></script>
<script src="static/js/bootstrap.min.js"></script> <script src="static/js/bootstrap.min.js"></script>
<script src="static/js/app.js"></script> <script src="static/js/app.js"></script>
<?php <?php
// custom page scripts // custom page scripts
if (isset(PAGES[$pageid]['scripts'])) { if (isset(PAGES[$pageid]['scripts'])) {
foreach (PAGES[$pageid]['scripts'] as $script) { foreach (PAGES[$pageid]['scripts'] as $script) {
echo "<script src=\"$script\"></script>\n"; echo "<script src=\"$script\"></script>\n";

@ -83,29 +83,22 @@ if (checkLoginServer()) {
<title><?php echo SITE_TITLE; ?></title> <title><?php echo SITE_TITLE; ?></title>
<link href="static/css/bootstrap.min.css" rel="stylesheet"> <link href="static/css/bootstrap.min.css" rel="stylesheet">
<link href="static/css/font-awesome.min.css" rel="stylesheet">
<link href="static/css/material-color/material-color.min.css" rel="stylesheet"> <link href="static/css/material-color/material-color.min.css" rel="stylesheet">
<link href="static/css/app.css" rel="stylesheet"> <link href="static/css/index.css" rel="stylesheet">
<?php if (RECAPTCHA_ENABLED) { ?> <?php if (RECAPTCHA_ENABLED) { ?>
<script src='https://www.google.com/recaptcha/api.js'></script> <script src='https://www.google.com/recaptcha/api.js'></script>
<?php } ?> <?php } ?>
</head> </head>
<body> <body>
<div class="container"> <div class="row justify-content-center">
<div class="row"> <div class="col-auto">
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4 col-sm-offset-3 col-md-offset-4 col-lg-offset-4"> <img class="banner-image" src="static/img/logo.png" />
<div>
<?php
if (SHOW_ICON == "both" || SHOW_ICON == "index") {
?>
<img class="img-responsive banner-image" src="static/img/logo.png" />
<?php } ?>
</div> </div>
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title"><?php lang("sign in"); ?></h3>
</div> </div>
<div class="panel-body"> <div class="row justify-content-center">
<div class="card col-11 col-xs-11 col-sm-8 col-md-6 col-lg-4">
<div class="card-body">
<h5 class="card-title"><?php lang("sign in"); ?></h5>
<form action="" method="POST"> <form action="" method="POST">
<?php <?php
if (!is_empty($alert)) { if (!is_empty($alert)) {
@ -144,13 +137,12 @@ if (checkLoginServer()) {
</div> </div>
</div> </div>
</div> </div>
</div>
<div class="footer"> <div class="footer">
<?php echo FOOTER_TEXT; ?><br /> <?php echo FOOTER_TEXT; ?><br />
Copyright &copy; <?php echo date('Y'); ?> <?php echo COPYRIGHT_NAME; ?> Copyright &copy; <?php echo date('Y'); ?> <?php echo COPYRIGHT_NAME; ?>
</div> </div>
</div> </div>
<script src="static/js/jquery-3.2.1.min.js"></script> <script src="static/js/jquery-3.3.1.min.js"></script>
<script src="static/js/bootstrap.min.js"></script> <script src="static/js/bootstrap.min.js"></script>
</body> </body>
</html> </html>

@ -5,7 +5,7 @@ define("PAGES", [
"home" => [ "home" => [
"title" => "home", "title" => "home",
"navbar" => true, "navbar" => true,
"icon" => "home" "icon" => "fas fa-home"
], ],
"404" => [ "404" => [
"title" => "404 error" "title" => "404 error"

@ -1,5 +1,5 @@
<div class="row"> <div class="row justify-content-center">
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4 col-sm-offset-3 col-md-offset-4 col-lg-offset-4"> <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
<div class="alert alert-warning"><b><?php lang("404 error");?></b><br /> <?php lang("page not found"); ?></div> <div class="alert alert-warning"><b><?php lang("404 error");?></b><br /> <?php lang("page not found"); ?></div>
</div> </div>
</div> </div>

@ -1,22 +1,37 @@
.banner-image { body {
max-height: 100px; padding-top: 4rem;
margin: 2em auto; }
.brand-img {
border: 1px solid grey; border: 1px solid grey;
border-radius: 12px; border-radius: 12%;
margin-top: -2px;
margin-right: 5px;
margin-bottom: 3px;
height: 25px;
}
.navbar-toggler {
border: none;
padding-right: 1.5rem;
} }
.navbar-brand { .navbar-brand {
font-size: 110%; font-size: 120%;
padding-right: 1rem;
margin-top: 0.2rem;
} }
.navbar-brand img { #main-content {
height: 35px; padding-top: 3rem;
padding-bottom: 12px;
padding-left: 5px;
} }
.pad-75px { #msg-alert-box {
height: 75px; position: fixed;
left: 0;
right: 0;
z-index: 999999;
padding: 0px 5px;
} }
.mgn-btm-10px { .mgn-btm-10px {
@ -35,61 +50,3 @@
margin-top: 10em; margin-top: 10em;
text-align: center; text-align: center;
} }
/*
==============================
THEMING
==============================
Changing the .navbar-inverse background should be enough on modern browsers.
If this app is to be used on IE < 9 (not supported), also set a background-color
to replace the rgba()s.
To use a material-color.css navbar theme, remove all the theming styles in this
file and add a .navbar-[color] class to the navbar in app.php.
*/
/* navbar background */
.navbar-inverse {
/* background-color: green; */
}
/* Selected page background */
.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus {
background: rgba(0,0,0,.2);
}
.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {
border-color: rgba(0,0,0,.2);
}
.navbar-inverse .navbar-toggle .icon-bar {
background-color: white;
}
.navbar-inverse .navbar-brand {
color: white;
}
.navbar-inverse .navbar-nav > li > a {
color: white;
}
.navbar-inverse .navbar-link {
color: white;
}
@media screen and (max-width: 767px) {
button.navbar-toggle[data-toggle="collapse"] {
float: left;
margin-left: 15px;
}
.navbar-header .navbar-brand {
margin-left: -20px;
}
.navbar-header .navbar-brand img {
display: none;
}
}

File diff suppressed because one or more lines are too long

@ -0,0 +1,343 @@
/*!
* Font Awesome Free 5.0.6 by @fontawesome - http://fontawesome.com
* License - http://fontawesome.com/license (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
*/
svg:not(:root).svg-inline--fa {
overflow: visible; }
.svg-inline--fa {
display: inline-block;
font-size: inherit;
height: 1em;
overflow: visible;
vertical-align: -.125em; }
.svg-inline--fa.fa-lg {
vertical-align: -.225em; }
.svg-inline--fa.fa-w-1 {
width: 0.0625em; }
.svg-inline--fa.fa-w-2 {
width: 0.125em; }
.svg-inline--fa.fa-w-3 {
width: 0.1875em; }
.svg-inline--fa.fa-w-4 {
width: 0.25em; }
.svg-inline--fa.fa-w-5 {
width: 0.3125em; }
.svg-inline--fa.fa-w-6 {
width: 0.375em; }
.svg-inline--fa.fa-w-7 {
width: 0.4375em; }
.svg-inline--fa.fa-w-8 {
width: 0.5em; }
.svg-inline--fa.fa-w-9 {
width: 0.5625em; }
.svg-inline--fa.fa-w-10 {
width: 0.625em; }
.svg-inline--fa.fa-w-11 {
width: 0.6875em; }
.svg-inline--fa.fa-w-12 {
width: 0.75em; }
.svg-inline--fa.fa-w-13 {
width: 0.8125em; }
.svg-inline--fa.fa-w-14 {
width: 0.875em; }
.svg-inline--fa.fa-w-15 {
width: 0.9375em; }
.svg-inline--fa.fa-w-16 {
width: 1em; }
.svg-inline--fa.fa-w-17 {
width: 1.0625em; }
.svg-inline--fa.fa-w-18 {
width: 1.125em; }
.svg-inline--fa.fa-w-19 {
width: 1.1875em; }
.svg-inline--fa.fa-w-20 {
width: 1.25em; }
.svg-inline--fa.fa-pull-left {
margin-right: .3em;
width: auto; }
.svg-inline--fa.fa-pull-right {
margin-left: .3em;
width: auto; }
.svg-inline--fa.fa-border {
height: 1.5em; }
.svg-inline--fa.fa-li {
width: 2em; }
.svg-inline--fa.fa-fw {
width: 1.25em; }
.fa-layers svg.svg-inline--fa {
bottom: 0;
left: 0;
margin: auto;
position: absolute;
right: 0;
top: 0; }
.fa-layers {
display: inline-block;
height: 1em;
position: relative;
text-align: center;
vertical-align: -.125em;
width: 1em; }
.fa-layers svg.svg-inline--fa {
-webkit-transform-origin: center center;
transform-origin: center center; }
.fa-layers-text, .fa-layers-counter {
display: inline-block;
position: absolute;
text-align: center; }
.fa-layers-text {
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
-webkit-transform-origin: center center;
transform-origin: center center; }
.fa-layers-counter {
background-color: #ff253a;
border-radius: 1em;
color: #fff;
height: 1.5em;
line-height: 1;
max-width: 5em;
min-width: 1.5em;
overflow: hidden;
padding: .25em;
right: 0;
text-overflow: ellipsis;
top: 0;
-webkit-transform: scale(0.25);
transform: scale(0.25);
-webkit-transform-origin: top right;
transform-origin: top right; }
.fa-layers-bottom-right {
bottom: 0;
right: 0;
top: auto;
-webkit-transform: scale(0.25);
transform: scale(0.25);
-webkit-transform-origin: bottom right;
transform-origin: bottom right; }
.fa-layers-bottom-left {
bottom: 0;
left: 0;
right: auto;
top: auto;
-webkit-transform: scale(0.25);
transform: scale(0.25);
-webkit-transform-origin: bottom left;
transform-origin: bottom left; }
.fa-layers-top-right {
right: 0;
top: 0;
-webkit-transform: scale(0.25);
transform: scale(0.25);
-webkit-transform-origin: top right;
transform-origin: top right; }
.fa-layers-top-left {
left: 0;
right: auto;
top: 0;
-webkit-transform: scale(0.25);
transform: scale(0.25);
-webkit-transform-origin: top left;
transform-origin: top left; }
.fa-lg {
font-size: 1.33333em;
line-height: 0.75em;
vertical-align: -.0667em; }
.fa-xs {
font-size: .75em; }
.fa-sm {
font-size: .875em; }
.fa-1x {
font-size: 1em; }
.fa-2x {
font-size: 2em; }
.fa-3x {
font-size: 3em; }
.fa-4x {
font-size: 4em; }
.fa-5x {
font-size: 5em; }
.fa-6x {
font-size: 6em; }
.fa-7x {
font-size: 7em; }
.fa-8x {
font-size: 8em; }
.fa-9x {
font-size: 9em; }
.fa-10x {
font-size: 10em; }
.fa-fw {
text-align: center;
width: 1.25em; }
.fa-ul {
list-style-type: none;
margin-left: 2.5em;
padding-left: 0; }
.fa-ul > li {
position: relative; }
.fa-li {
left: -2em;
position: absolute;
text-align: center;
width: 2em;
line-height: inherit; }
.fa-border {
border: solid 0.08em #eee;
border-radius: .1em;
padding: .2em .25em .15em; }
.fa-pull-left {
float: left; }
.fa-pull-right {
float: right; }
.fa.fa-pull-left,
.fas.fa-pull-left,
.far.fa-pull-left,
.fal.fa-pull-left,
.fab.fa-pull-left {
margin-right: .3em; }
.fa.fa-pull-right,
.fas.fa-pull-right,
.far.fa-pull-right,
.fal.fa-pull-right,
.fab.fa-pull-right {
margin-left: .3em; }
.fa-spin {
-webkit-animation: fa-spin 2s infinite linear;
animation: fa-spin 2s infinite linear; }
.fa-pulse {
-webkit-animation: fa-spin 1s infinite steps(8);
animation: fa-spin 1s infinite steps(8); }
@-webkit-keyframes fa-spin {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg); }
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg); } }
@keyframes fa-spin {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg); }
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg); } }
.fa-rotate-90 {
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
-webkit-transform: rotate(90deg);
transform: rotate(90deg); }
.fa-rotate-180 {
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";
-webkit-transform: rotate(180deg);
transform: rotate(180deg); }
.fa-rotate-270 {
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
-webkit-transform: rotate(270deg);
transform: rotate(270deg); }
.fa-flip-horizontal {
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";
-webkit-transform: scale(-1, 1);
transform: scale(-1, 1); }
.fa-flip-vertical {
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";
-webkit-transform: scale(1, -1);
transform: scale(1, -1); }
.fa-flip-horizontal.fa-flip-vertical {
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";
-webkit-transform: scale(-1, -1);
transform: scale(-1, -1); }
:root .fa-rotate-90,
:root .fa-rotate-180,
:root .fa-rotate-270,
:root .fa-flip-horizontal,
:root .fa-flip-vertical {
-webkit-filter: none;
filter: none; }
.fa-stack {
display: inline-block;
height: 2em;
position: relative;
width: 2em; }
.fa-stack-1x,
.fa-stack-2x {
bottom: 0;
left: 0;
margin: auto;
position: absolute;
right: 0;
top: 0; }
.svg-inline--fa.fa-stack-1x {
height: 1em;
width: 1em; }
.svg-inline--fa.fa-stack-2x {
height: 2em;
width: 2em; }
.fa-inverse {
color: #fff; }
.sr-only {
border: 0;
clip: rect(0, 0, 0, 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px; }
.sr-only-focusable:active, .sr-only-focusable:focus {
clip: auto;
height: auto;
margin: 0;
overflow: visible;
position: static;
width: auto; }

File diff suppressed because one or more lines are too long

@ -0,0 +1,11 @@
.banner-image {
max-height: 100px;
margin: 2em auto;
border: 1px solid grey;
border-radius: 15%;
}
.footer {
margin-top: 10em;
text-align: center;
}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long
Loading…
Cancel
Save