2018 theme now has toggle for navbar
This commit is contained in:
Thomas G
parent
88d9456c1d
commit
b4007a886a
|
|
@ -10,6 +10,27 @@
|
|||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1688px) {
|
||||
#smallnav_open {
|
||||
display: none;
|
||||
}
|
||||
.smallnav {
|
||||
display: block !important;
|
||||
}
|
||||
#logo_full img, #logo_full {
|
||||
max-width: 200px;
|
||||
width: 120px;
|
||||
}
|
||||
.navbarbuttoncontainer {
|
||||
padding-left: 50px;
|
||||
}
|
||||
.content, iframe {
|
||||
padding-left: 180px;
|
||||
width: calc(100% - 250px);
|
||||
padding-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
html {
|
||||
background: none;
|
||||
}
|
||||
|
|
@ -180,29 +201,30 @@ body {
|
|||
padding: 0;
|
||||
top: 0;
|
||||
position: fixed;
|
||||
right: 0;
|
||||
left: 0;
|
||||
z-index: 1030;
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
align-items: center;
|
||||
right: 0;
|
||||
left: 0;
|
||||
z-index: 1030;
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
}
|
||||
|
||||
.smallnav {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
-ms-transform: none;
|
||||
position: fixed;
|
||||
transform: translateZ(0);
|
||||
-ms-transform: none;
|
||||
position: fixed;
|
||||
background: #fff;
|
||||
box-shadow: 0 0 3px rgb(25 25 25 / 30%);
|
||||
width: 0;
|
||||
box-shadow: 0 0 3px rgb(25 25 25 / 30%);
|
||||
width: 175px;
|
||||
display: block;
|
||||
visibility: visible;
|
||||
height: calc(100% - 40px);
|
||||
font-size: 16px;
|
||||
left: 0;
|
||||
overflow: hidden;
|
||||
top: 82px;
|
||||
z-index: 1001;
|
||||
display: none;
|
||||
visibility: hidden;
|
||||
font-size: 16px;
|
||||
left: 0;
|
||||
overflow: hidden;
|
||||
top: 82px;
|
||||
z-index: 1001;
|
||||
padding: 0;
|
||||
}
|
||||
.smallnavbarbuttoncontainer {
|
||||
|
|
@ -257,28 +279,39 @@ body {
|
|||
box-shadow: 0 1px 4px 0 rgb(25 25 25 / 30%);
|
||||
}
|
||||
|
||||
#logo_small, #logo_full {
|
||||
#logo_small, #logo_full, #smallnav_open {
|
||||
max-width: 76px;
|
||||
width: auto;
|
||||
margin: 0 12px;
|
||||
padding: 0;
|
||||
float: left;
|
||||
width: auto;
|
||||
margin: 0 12px;
|
||||
padding: 0;
|
||||
}
|
||||
#logo_small img {
|
||||
#logo_small img, #smallnav_open img {
|
||||
padding: 5px 0;
|
||||
padding-top: 7px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
}
|
||||
#logo_full img {
|
||||
padding: 5px 0;
|
||||
padding-top: 10px;
|
||||
max-width: 120px;
|
||||
height: 30px;
|
||||
}
|
||||
#smallnav_open {
|
||||
background-image: url("https://images.rbxcdn.com/f4000b6d03a0df7153556d2514045629-navigation_10022018.svg");
|
||||
background-position: 0 0px;
|
||||
background-repeat: no-repeat;
|
||||
background-size: auto auto;
|
||||
width: 30px;
|
||||
margin: 0px;
|
||||
margin-top: 1px;
|
||||
margin-left: 10px;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
|
||||
.navbarbuttoncontainer {
|
||||
width: 25%;
|
||||
display: flex;
|
||||
padding: 0;
|
||||
}
|
||||
.navbarbutton {
|
||||
color: #fff;
|
||||
|
|
@ -325,6 +358,10 @@ body {
|
|||
font-weight: 300;
|
||||
}
|
||||
|
||||
.invisible_navbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#footer_signup {
|
||||
/*Remove this for now as i don't know a fix for the broken footer.*/
|
||||
/*Tersis, if you're seeing this, find a way to get the signup footer to work properly*/
|
||||
|
|
@ -499,18 +536,3 @@ iframe {
|
|||
top: 0px;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1688px) {
|
||||
.smallnav {
|
||||
width: 175px;
|
||||
display: block;
|
||||
visibility: visible;
|
||||
}
|
||||
#logo_full {
|
||||
max-width: 200px;
|
||||
}
|
||||
.content, iframe {
|
||||
padding-left: 180px;
|
||||
width: calc(100% - 250px);
|
||||
padding-right: 10px;
|
||||
}
|
||||
}
|
||||
|
|
@ -17,36 +17,50 @@
|
|||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}">
|
||||
@auth
|
||||
@switch (Auth::user()->settings->theme)
|
||||
@case(5)
|
||||
<link href="{{ asset('css/app.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
<link href="{{ asset('css/appdark.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
<link href="{{ asset('css/classicappdark.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
@break
|
||||
@case(4)
|
||||
<link href="{{ asset('css/app.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
<link href="{{ asset('css/classicapp.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
@break
|
||||
@case(3)
|
||||
<link href="{{ asset('css/app.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
<link href="{{ asset('css/appdark.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
@break
|
||||
@case(2)
|
||||
<link href="{{ asset('css/app.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
<link href="{{ asset('css/2018.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
@break
|
||||
@switch (Auth::user()->settings->theme)
|
||||
@case(5)
|
||||
<link href="{{ asset('css/app.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
<link href="{{ asset('css/appdark.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
<link href="{{ asset('css/classicappdark.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
@break
|
||||
@case(4)
|
||||
<link href="{{ asset('css/app.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
<link href="{{ asset('css/classicapp.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
@break
|
||||
@case(3)
|
||||
<link href="{{ asset('css/app.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
<link href="{{ asset('css/appdark.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
@break
|
||||
@case(2)
|
||||
<link href="{{ asset('css/app.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
<link href="{{ asset('css/2018.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
@break
|
||||
|
||||
@default
|
||||
<link href="{{ asset('css/app.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
@endswitch
|
||||
@default
|
||||
<link href="{{ asset('css/app.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
@endswitch
|
||||
@else
|
||||
<link href="{{ asset('css/app.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
<link href="{{ asset('css/app.css?id=' . Str::random(8)) }}" rel="stylesheet">
|
||||
@endauth
|
||||
@yield('extras')
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="navbar">
|
||||
@auth
|
||||
@switch (Auth::user()->settings->theme)
|
||||
@case(2)
|
||||
<a id="smallnav_open" href="#"></a>
|
||||
<script>
|
||||
function third() {
|
||||
document.querySelector('.smallnav').classList.toggle('invisible_navbar');
|
||||
}
|
||||
document.querySelector('#smallnav_open').addEventListener('click', third);
|
||||
</script>
|
||||
@break
|
||||
@default
|
||||
@endswitch
|
||||
@endauth
|
||||
<a id="logo_full" href="{{ route('home') }}"><img alt="ARCHBLOX Logo" src="{{ asset('img/MORBLOXlogo.png') }}"
|
||||
width="200" height="40" /></a>
|
||||
<a id="logo_small" href="{{ route('home') }}"><img alt="ARCHBLOX Logo"
|
||||
|
|
@ -55,46 +69,50 @@
|
|||
<a class="navbarbutton" id="smallbtn5" href="{{ route('incomplete') }}">Games</a>
|
||||
<a class="navbarbutton" id="smallbtn4" href="{{ route('catalog') }}">Catalog</a>
|
||||
<a class="navbarbutton" id="smallbtn0" href="{{ route('incomplete') }}">Build</a>
|
||||
<a class="navbarbutton" id="smallbtn2"
|
||||
href="@guest {{ route('login') }}
|
||||
<a class="navbarbutton" id="smallbtn2" href="@guest {{ route('login') }}
|
||||
@else
|
||||
{{ route('profile', Auth::id()) }} @endguest">Profile</a>
|
||||
<a class="navbarbutton" id="smallbtn3" href="{{ route('settings') }}">Settings</a>
|
||||
</div>
|
||||
@guest
|
||||
<div id="navbarlogincontainer">
|
||||
<p><a href="{{ route('register') }}">Sign Up</a> or <a href="{{ route('login') }}">Log In</a></p>
|
||||
</div>
|
||||
<div id="navbarlogincontainer">
|
||||
<p><a href="{{ route('register') }}">Sign Up</a> or <a href="{{ route('login') }}">Log In</a></p>
|
||||
</div>
|
||||
@else
|
||||
<div class="arkotcontainer"><img class="arkoticon_navbar" src="{{ asset('img/arkot.png') }}"><p> {{ Auth::user()->morbux }}</p></div>
|
||||
<div id="navbarsignedincontainer">
|
||||
<p class="nonbolded" id="navbarusername"><a href="@guest {{ route('login') }} @else {{ route('profile', Auth::id()) }} @endguest">{{ Auth::user()->name }}</a> | <a href="{{ route('logout') }}"
|
||||
onclick="event.preventDefault();
|
||||
<div class="arkotcontainer"><img class="arkoticon_navbar" src="{{ asset('img/arkot.png') }}">
|
||||
<p> {{ Auth::user()->morbux }}</p>
|
||||
</div>
|
||||
<div id="navbarsignedincontainer">
|
||||
<p class="nonbolded" id="navbarusername"><a
|
||||
href="@guest {{ route('login') }} @else {{ route('profile', Auth::id()) }} @endguest">{{ Auth::user()->name }}</a>
|
||||
| <a href="{{ route('logout') }}" onclick="event.preventDefault();
|
||||
document.getElementById('logout-form').submit();">Log
|
||||
out...</a></p>
|
||||
</div>
|
||||
out...</a></p>
|
||||
</div>
|
||||
|
||||
<form id="logout-form" action="{{ route('logout') }}" method="POST" style="display:none">
|
||||
@csrf
|
||||
</form>
|
||||
<form id="logout-form" action="{{ route('logout') }}" method="POST" style="display:none">
|
||||
@csrf
|
||||
</form>
|
||||
@endguest
|
||||
</div>
|
||||
<div class="smallnav">
|
||||
<div class="smallnavbarbuttoncontainer">
|
||||
<a class="smallnavbarbutton" href="{{ route('friends') }}">Friends @if (!Auth::guest() && count(Auth::user()->getFriendRequests()))
|
||||
<span class="warningtext">({{ count(Auth::user()->getFriendRequests()) }})</span>
|
||||
<a class="smallnavbarbutton" href="{{ route('friends') }}">Friends @if (!Auth::guest() &&
|
||||
count(Auth::user()->getFriendRequests()))
|
||||
<span class="warningtext">({{ count(Auth::user()->getFriendRequests()) }})</span>
|
||||
@endif
|
||||
</a>
|
||||
<a class="smallnavbarbutton" href="{{ route('incomplete') }}">Avatar</a>
|
||||
<a class="smallnavbarbutton" href="{{ route('users') }}">Users</a>
|
||||
<a class="smallnavbarbutton" href="{{ route('inbox') }}">Messages @if (!Auth::guest() && App\Models\Message::where(['sendto_id' => Auth::id(), 'read' => false])->count())
|
||||
<span
|
||||
class="warningtext">({{ App\Models\Message::where(['sendto_id' => Auth::id(), 'read' => false])->count() }})</span>
|
||||
<a class="smallnavbarbutton" href="{{ route('inbox') }}">Messages @if (!Auth::guest() &&
|
||||
App\Models\Message::where(['sendto_id' => Auth::id(), 'read' => false])->count())
|
||||
<span
|
||||
class="warningtext">({{ App\Models\Message::where(['sendto_id' => Auth::id(), 'read' => false])->count() }})</span>
|
||||
@endif
|
||||
</a>
|
||||
<a class="smallnavbarbutton" href="{{ route('blog') }}">Blog</a>
|
||||
@if (!Auth::guest() && Auth::user()->isAdmin())
|
||||
<a class="smallnavbarbutton" href="{{ route('admin_index') }}">Admin</a>
|
||||
<a class="smallnavbarbutton" href="{{ route('admin_index') }}">Admin</a>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -114,4 +132,4 @@
|
|||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
</html>
|
||||
Loading…
Reference in New Issue