ARCHBLOX
/
website
1
0
Fork 0
Code Issues Pull Requests 4 Packages Projects Releases Wiki Activity

2018 theme now has toggle for navbar

This commit is contained in:
Thomas G 2022-08-08 08:34:40 +10:00
parent 88d9456c1d
commit b4007a886a
2 changed files with 123 additions and 83 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

102
public/css/2018.css
View File

@ -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 { html {
background: none; background: none;
} }
@ -180,29 +201,30 @@ body {
padding: 0; padding: 0;
top: 0; top: 0;
position: fixed; position: fixed;
right: 0; align-items: center;
left: 0; right: 0;
z-index: 1030; left: 0;
-webkit-transform: translateZ(0); z-index: 1030;
transform: translateZ(0); -webkit-transform: translateZ(0);
transform: translateZ(0);
} }
.smallnav { .smallnav {
-webkit-transform: translateZ(0); -webkit-transform: translateZ(0);
transform: translateZ(0); transform: translateZ(0);
-ms-transform: none; -ms-transform: none;
position: fixed; position: fixed;
background: #fff; background: #fff;
box-shadow: 0 0 3px rgb(25 25 25 / 30%); box-shadow: 0 0 3px rgb(25 25 25 / 30%);
width: 0; width: 175px;
display: block;
visibility: visible;
height: calc(100% - 40px); height: calc(100% - 40px);
font-size: 16px; font-size: 16px;
left: 0; left: 0;
overflow: hidden; overflow: hidden;
top: 82px; top: 82px;
z-index: 1001; z-index: 1001;
display: none;
visibility: hidden;
padding: 0; padding: 0;
} }
.smallnavbarbuttoncontainer { .smallnavbarbuttoncontainer {
@ -257,28 +279,39 @@ body {
box-shadow: 0 1px 4px 0 rgb(25 25 25 / 30%); box-shadow: 0 1px 4px 0 rgb(25 25 25 / 30%);
} }
#logo_small, #logo_full { #logo_small, #logo_full, #smallnav_open {
max-width: 76px; max-width: 76px;
width: auto; width: auto;
margin: 0 12px; margin: 0 12px;
padding: 0; padding: 0;
float: left;
} }
#logo_small img { #logo_small img, #smallnav_open img {
padding: 5px 0; padding: 5px 0;
padding-top: 7px;
width: 30px; width: 30px;
height: 30px; height: 30px;
} }
#logo_full img { #logo_full img {
padding: 5px 0; padding: 5px 0;
padding-top: 10px;
max-width: 120px; max-width: 120px;
height: 30px; 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 { .navbarbuttoncontainer {
width: 25%;
display: flex; display: flex;
padding: 0;
} }
.navbarbutton { .navbarbutton {
color: #fff; color: #fff;
@ -325,6 +358,10 @@ body {
font-weight: 300; font-weight: 300;
} }
.invisible_navbar {
display: none;
}
#footer_signup { #footer_signup {
/*Remove this for now as i don't know a fix for the broken footer.*/ /*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*/ /*Tersis, if you're seeing this, find a way to get the signup footer to work properly*/
@ -499,18 +536,3 @@ iframe {
top: 0px; 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;
}
}

104
resources/views/layouts/app.blade.php
View File

@ -17,36 +17,50 @@
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}"> <link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}">
@auth @auth
@switch (Auth::user()->settings->theme) @switch (Auth::user()->settings->theme)
@case(5) @case(5)
<link href="{{ asset('css/app.css?id=' . Str::random(8)) }}" rel="stylesheet"> <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/appdark.css?id=' . Str::random(8)) }}" rel="stylesheet">
<link href="{{ asset('css/classicappdark.css?id=' . Str::random(8)) }}" rel="stylesheet"> <link href="{{ asset('css/classicappdark.css?id=' . Str::random(8)) }}" rel="stylesheet">
@break @break
@case(4) @case(4)
<link href="{{ asset('css/app.css?id=' . Str::random(8)) }}" rel="stylesheet"> <link href="{{ asset('css/app.css?id=' . Str::random(8)) }}" rel="stylesheet">
<link href="{{ asset('css/classicapp.css?id=' . Str::random(8)) }}" rel="stylesheet"> <link href="{{ asset('css/classicapp.css?id=' . Str::random(8)) }}" rel="stylesheet">
@break @break
@case(3) @case(3)
<link href="{{ asset('css/app.css?id=' . Str::random(8)) }}" rel="stylesheet"> <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/appdark.css?id=' . Str::random(8)) }}" rel="stylesheet">
@break @break
@case(2) @case(2)
<link href="{{ asset('css/app.css?id=' . Str::random(8)) }}" rel="stylesheet"> <link href="{{ asset('css/app.css?id=' . Str::random(8)) }}" rel="stylesheet">
<link href="{{ asset('css/2018.css?id=' . Str::random(8)) }}" rel="stylesheet"> <link href="{{ asset('css/2018.css?id=' . Str::random(8)) }}" rel="stylesheet">
@break @break
@default @default
<link href="{{ asset('css/app.css?id=' . Str::random(8)) }}" rel="stylesheet"> <link href="{{ asset('css/app.css?id=' . Str::random(8)) }}" rel="stylesheet">
@endswitch @endswitch
@else @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 @endauth
@yield('extras') @yield('extras')
</head> </head>
<body> <body>
<div class="navbar"> <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') }}" <a id="logo_full" href="{{ route('home') }}"><img alt="ARCHBLOX Logo" src="{{ asset('img/MORBLOXlogo.png') }}"
width="200" height="40" /></a> width="200" height="40" /></a>
<a id="logo_small" href="{{ route('home') }}"><img alt="ARCHBLOX Logo" <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="smallbtn5" href="{{ route('incomplete') }}">Games</a>
<a class="navbarbutton" id="smallbtn4" href="{{ route('catalog') }}">Catalog</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="smallbtn0" href="{{ route('incomplete') }}">Build</a>
<a class="navbarbutton" id="smallbtn2" <a class="navbarbutton" id="smallbtn2" href="@guest {{ route('login') }}
href="@guest {{ route('login') }}
@else @else
{{ route('profile', Auth::id()) }} @endguest">Profile</a> {{ route('profile', Auth::id()) }} @endguest">Profile</a>
<a class="navbarbutton" id="smallbtn3" href="{{ route('settings') }}">Settings</a> <a class="navbarbutton" id="smallbtn3" href="{{ route('settings') }}">Settings</a>
</div> </div>
@guest @guest
<div id="navbarlogincontainer"> <div id="navbarlogincontainer">
<p><a href="{{ route('register') }}">Sign Up</a> or <a href="{{ route('login') }}">Log In</a></p> <p><a href="{{ route('register') }}">Sign Up</a> or <a href="{{ route('login') }}">Log In</a></p>
</div> </div>
@else @else
<div class="arkotcontainer"><img class="arkoticon_navbar" src="{{ asset('img/arkot.png') }}"><p> {{ Auth::user()->morbux }}</p></div> <div class="arkotcontainer"><img class="arkoticon_navbar" src="{{ asset('img/arkot.png') }}">
<div id="navbarsignedincontainer"> <p> {{ Auth::user()->morbux }}</p>
<p class="nonbolded" id="navbarusername"><a href="@guest {{ route('login') }} @else {{ route('profile', Auth::id()) }} @endguest">{{ Auth::user()->name }}</a> | <a href="{{ route('logout') }}" </div>
onclick="event.preventDefault(); <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 document.getElementById('logout-form').submit();">Log
out...</a></p> out...</a></p>
</div> </div>
<form id="logout-form" action="{{ route('logout') }}" method="POST" style="display:none"> <form id="logout-form" action="{{ route('logout') }}" method="POST" style="display:none">
@csrf @csrf
</form> </form>
@endguest @endguest
</div> </div>
<div class="smallnav"> <div class="smallnav">
<div class="smallnavbarbuttoncontainer"> <div class="smallnavbarbuttoncontainer">
<a class="smallnavbarbutton" href="{{ route('friends') }}">Friends @if (!Auth::guest() && count(Auth::user()->getFriendRequests())) <a class="smallnavbarbutton" href="{{ route('friends') }}">Friends @if (!Auth::guest() &&
<span class="warningtext">({{ count(Auth::user()->getFriendRequests()) }})</span> count(Auth::user()->getFriendRequests()))
<span class="warningtext">({{ count(Auth::user()->getFriendRequests()) }})</span>
@endif @endif
</a> </a>
<a class="smallnavbarbutton" href="{{ route('incomplete') }}">Avatar</a> <a class="smallnavbarbutton" href="{{ route('incomplete') }}">Avatar</a>
<a class="smallnavbarbutton" href="{{ route('users') }}">Users</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()) <a class="smallnavbarbutton" href="{{ route('inbox') }}">Messages @if (!Auth::guest() &&
<span App\Models\Message::where(['sendto_id' => Auth::id(), 'read' => false])->count())
class="warningtext">({{ App\Models\Message::where(['sendto_id' => Auth::id(), 'read' => false])->count() }})</span> <span
class="warningtext">({{ App\Models\Message::where(['sendto_id' => Auth::id(), 'read' => false])->count() }})</span>
@endif @endif
</a> </a>
<a class="smallnavbarbutton" href="{{ route('blog') }}">Blog</a> <a class="smallnavbarbutton" href="{{ route('blog') }}">Blog</a>
@if (!Auth::guest() && Auth::user()->isAdmin()) @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 @endif
</div> </div>
</div> </div>
@ -114,4 +132,4 @@
</div> </div>
</body> </body>
</html> </html>