1
0
mirror of https://github.com/Kovah/LinkAce.git synced 2025-01-17 21:28:30 +01:00

Update navbar styling, optimize SVG logo in navbar

This commit is contained in:
Kovah 2019-01-16 01:12:38 +01:00
parent f6c087d6f9
commit 8745f81ab1
No known key found for this signature in database
GPG Key ID: AAAA031BA9830D7B
6 changed files with 57 additions and 18 deletions

View File

@ -82,3 +82,26 @@ function getShareLinks(\App\Models\Link $link)
return $links;
}
/**
* Get an SVG from a path and return it as a string
*
* @param $path
* @param null $width
* @param null $height
* @return mixed|string|string[]|null
*/
function displaySVG($path, $width = null, $height = null)
{
$svg = file_get_contents($path);
if ($width) {
$svg = preg_replace('/width="([\d]+)"/i', "width='$width'", $svg);
}
if ($height) {
$svg = preg_replace('/height="([\d]+)"/i', "height='$height'", $svg);
}
return $svg;
}

View File

@ -1,9 +1,10 @@
<svg width="937" height="342" xmlns="http://www.w3.org/2000/svg">
<svg class="linkace-logo svg" width="937" height="342" viewBox="0 0 937 342" xmlns="http://www.w3.org/2000/svg">
<!-- (C) 2018 Copyright by Kovah.de -->
<g fill="none" fill-rule="evenodd">
<path fill="#44679F"
d="M296.16 122v85.6h51.2V234h-80.8V122h29.6zm61.6 112v-76.8h27.2V234h-27.2zm29.12-102.72c0 5.333-1.547 9.173-4.64 11.52-3.093 2.347-6.72 3.52-10.88 3.52-2.027 0-3.973-.293-5.84-.88a14.062 14.062 0 0 1-4.96-2.72c-1.44-1.227-2.587-2.773-3.44-4.64-.853-1.867-1.28-4.133-1.28-6.8 0-2.56.427-4.8 1.28-6.72s2-3.467 3.44-4.64c1.44-1.173 3.093-2.053 4.96-2.64a19.362 19.362 0 0 1 5.84-.88c4.16 0 7.787 1.173 10.88 3.52 3.093 2.347 4.64 6.133 4.64 11.36zM425.44 166c3.2-3.413 6.8-6.133 10.8-8.16 4-2.027 8.56-3.04 13.68-3.04 5.227 0 9.787.827 13.68 2.48 3.893 1.653 7.093 3.92 9.6 6.8 2.507 2.88 4.373 6.24 5.6 10.08 1.227 3.84 1.84 7.893 1.84 12.16V234h-27.2v-44c0-4.053-1.093-7.067-3.28-9.04-2.187-1.973-4.987-2.96-8.4-2.96-3.093 0-5.76.747-8 2.24-2.24 1.493-3.947 2.987-5.12 4.48V234h-27.2v-76.8h24v8.8zM548 234l-18.88-29.12h-5.76V234h-27.2V122h27.2v62.08h6.08l16.8-26.88h30.4l-24.96 37.76L578.24 234H548zm29.92 0l44-112h32l44 112h-30.4l-6.4-17.6h-46.4l-6.4 17.6h-30.4zm45.6-41.6h28.8l-11.52-32.32a44.243 44.243 0 0 1-1.44-4.48c-.427-1.6-.907-3.893-1.44-6.88-.533 2.987-1.013 5.28-1.44 6.88a44.243 44.243 0 0 1-1.44 4.48l-11.52 32.32zm76.48 4.8c0-7.573 1.28-14.053 3.84-19.44 2.56-5.387 5.92-9.787 10.08-13.2 4.16-3.413 8.907-5.92 14.24-7.52 5.333-1.6 10.72-2.4 16.16-2.4 4.16 0 8.267.453 12.32 1.36 4.053.907 7.84 2.213 11.36 3.92v23.2c-2.667-1.493-5.733-2.747-9.2-3.76-3.467-1.013-6.907-1.52-10.32-1.52-2.667 0-5.227.32-7.68.96-2.453.64-4.64 1.653-6.56 3.04s-3.44 3.2-4.56 5.44c-1.12 2.24-1.68 5.013-1.68 8.32 0 3.093.56 5.733 1.68 7.92 1.12 2.187 2.587 4 4.4 5.44 1.813 1.44 3.947 2.507 6.4 3.2a27.52 27.52 0 0 0 7.52 1.04c4.053 0 7.867-.48 11.44-1.44 3.573-.96 6.693-2.187 9.36-3.68v23.2c-3.84 1.6-7.973 2.853-12.4 3.76-4.427.907-9.093 1.36-14 1.36-5.333 0-10.56-.773-15.68-2.32-5.12-1.547-9.653-3.92-13.6-7.12-3.947-3.2-7.12-7.253-9.52-12.16-2.4-4.907-3.6-10.773-3.6-17.6zm78.4-1.6c0-7.467 1.307-13.813 3.92-19.04 2.613-5.227 5.92-9.44 9.92-12.64 4-3.2 8.373-5.52 13.12-6.96 4.747-1.44 9.2-2.16 13.36-2.16 8.213 0 15.04 1.467 20.48 4.4 5.44 2.933 9.653 6.72 12.64 11.36s4.8 9.867 5.44 15.68c.64 5.813.267 11.653-1.12 17.52h-50.24c.747 2.133 1.92 3.947 3.52 5.44 1.6 1.493 3.493 2.72 5.68 3.68s4.587 1.653 7.2 2.08c2.613.427 5.307.64 8.08.64 4.373 0 8.347-.32 11.92-.96 3.573-.64 6.96-1.547 10.16-2.72v20.16c-3.627 1.28-7.76 2.32-12.4 3.12-4.64.8-10 1.2-16.08 1.2-6.293 0-12.213-.88-17.76-2.64-5.547-1.76-10.373-4.373-14.48-7.84-4.107-3.467-7.36-7.733-9.76-12.8-2.4-5.067-3.6-10.907-3.6-17.52zm52.96-8.16c.213-.96.213-2.16 0-3.6s-.747-2.853-1.6-4.24c-.853-1.387-2.133-2.587-3.84-3.6-1.707-1.013-3.893-1.52-6.56-1.52-3.733 0-6.96 1.147-9.68 3.44-2.72 2.293-4.08 5.467-4.08 9.52h25.76z"/>
<path d="M146.517 229.42l-.542-93.167a16.936 16.936 0 0 1 4.966-12.122 16.936 16.936 0 0 1 12.121-4.965c9.525.103 17.193 7.771 17.296 17.295l.573 111.88c.137 20.328-13.43 35.008-30.301 34.916-16.871-.09-29.193-11.238-29.238-34.495l-.885-139.319a41.527 41.527 0 0 1 12.176-29.774 41.527 41.527 0 0 1 29.774-12.175c23.4.215 42.246 19.061 42.461 42.46l.796 121.556"
stroke="#44679F" stroke-width="14" stroke-linecap="round"/>
<path class="svg-path" fill="#44679F"
d="M296.16 122v85.6h51.2V234h-80.8V122h29.6zm61.6 112v-76.8h27.2V234h-27.2zm29.12-102.72c0 5.333-1.547 9.173-4.64 11.52-3.093 2.347-6.72 3.52-10.88 3.52-2.027 0-3.973-.293-5.84-.88a14.062 14.062 0 0 1-4.96-2.72c-1.44-1.227-2.587-2.773-3.44-4.64-.853-1.867-1.28-4.133-1.28-6.8 0-2.56.427-4.8 1.28-6.72s2-3.467 3.44-4.64c1.44-1.173 3.093-2.053 4.96-2.64a19.362 19.362 0 0 1 5.84-.88c4.16 0 7.787 1.173 10.88 3.52 3.093 2.347 4.64 6.133 4.64 11.36zM425.44 166c3.2-3.413 6.8-6.133 10.8-8.16 4-2.027 8.56-3.04 13.68-3.04 5.227 0 9.787.827 13.68 2.48 3.893 1.653 7.093 3.92 9.6 6.8 2.507 2.88 4.373 6.24 5.6 10.08 1.227 3.84 1.84 7.893 1.84 12.16V234h-27.2v-44c0-4.053-1.093-7.067-3.28-9.04-2.187-1.973-4.987-2.96-8.4-2.96-3.093 0-5.76.747-8 2.24-2.24 1.493-3.947 2.987-5.12 4.48V234h-27.2v-76.8h24v8.8zM548 234l-18.88-29.12h-5.76V234h-27.2V122h27.2v62.08h6.08l16.8-26.88h30.4l-24.96 37.76L578.24 234H548zm29.92 0l44-112h32l44 112h-30.4l-6.4-17.6h-46.4l-6.4 17.6h-30.4zm45.6-41.6h28.8l-11.52-32.32a44.243 44.243 0 0 1-1.44-4.48c-.427-1.6-.907-3.893-1.44-6.88-.533 2.987-1.013 5.28-1.44 6.88a44.243 44.243 0 0 1-1.44 4.48l-11.52 32.32zm76.48 4.8c0-7.573 1.28-14.053 3.84-19.44 2.56-5.387 5.92-9.787 10.08-13.2 4.16-3.413 8.907-5.92 14.24-7.52 5.333-1.6 10.72-2.4 16.16-2.4 4.16 0 8.267.453 12.32 1.36 4.053.907 7.84 2.213 11.36 3.92v23.2c-2.667-1.493-5.733-2.747-9.2-3.76-3.467-1.013-6.907-1.52-10.32-1.52-2.667 0-5.227.32-7.68.96-2.453.64-4.64 1.653-6.56 3.04s-3.44 3.2-4.56 5.44c-1.12 2.24-1.68 5.013-1.68 8.32 0 3.093.56 5.733 1.68 7.92 1.12 2.187 2.587 4 4.4 5.44 1.813 1.44 3.947 2.507 6.4 3.2a27.52 27.52 0 0 0 7.52 1.04c4.053 0 7.867-.48 11.44-1.44 3.573-.96 6.693-2.187 9.36-3.68v23.2c-3.84 1.6-7.973 2.853-12.4 3.76-4.427.907-9.093 1.36-14 1.36-5.333 0-10.56-.773-15.68-2.32-5.12-1.547-9.653-3.92-13.6-7.12-3.947-3.2-7.12-7.253-9.52-12.16-2.4-4.907-3.6-10.773-3.6-17.6zm78.4-1.6c0-7.467 1.307-13.813 3.92-19.04 2.613-5.227 5.92-9.44 9.92-12.64 4-3.2 8.373-5.52 13.12-6.96 4.747-1.44 9.2-2.16 13.36-2.16 8.213 0 15.04 1.467 20.48 4.4 5.44 2.933 9.653 6.72 12.64 11.36s4.8 9.867 5.44 15.68c.64 5.813.267 11.653-1.12 17.52h-50.24c.747 2.133 1.92 3.947 3.52 5.44 1.6 1.493 3.493 2.72 5.68 3.68s4.587 1.653 7.2 2.08c2.613.427 5.307.64 8.08.64 4.373 0 8.347-.32 11.92-.96 3.573-.64 6.96-1.547 10.16-2.72v20.16c-3.627 1.28-7.76 2.32-12.4 3.12-4.64.8-10 1.2-16.08 1.2-6.293 0-12.213-.88-17.76-2.64-5.547-1.76-10.373-4.373-14.48-7.84-4.107-3.467-7.36-7.733-9.76-12.8-2.4-5.067-3.6-10.907-3.6-17.52zm52.96-8.16c.213-.96.213-2.16 0-3.6s-.747-2.853-1.6-4.24c-.853-1.387-2.133-2.587-3.84-3.6-1.707-1.013-3.893-1.52-6.56-1.52-3.733 0-6.96 1.147-9.68 3.44-2.72 2.293-4.08 5.467-4.08 9.52h25.76z"/>
<path class="svg-stroke"
d="M146.517 229.42l-.542-93.167a16.936 16.936 0 0 1 4.966-12.122 16.936 16.936 0 0 1 12.121-4.965c9.525.103 17.193 7.771 17.296 17.295l.573 111.88c.137 20.328-13.43 35.008-30.301 34.916-16.871-.09-29.193-11.238-29.238-34.495l-.885-139.319a41.527 41.527 0 0 1 12.176-29.774 41.527 41.527 0 0 1 29.774-12.175c23.4.215 42.246 19.061 42.461 42.46l.796 121.556"
stroke="#44679F" stroke-width="14" stroke-linecap="round"/>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 3.3 KiB

After

Width:  |  Height:  |  Size: 3.4 KiB

View File

@ -2,3 +2,20 @@
.custom-control-label {
cursor: pointer;
}
// Style fix for the navbar logo
.navbar-dark {
.svg {
max-height: 30px;
max-width: 81px;
}
.svg-path {
fill: $white;
}
.svg-stroke {
stroke: $white;
}
}

View File

@ -736,10 +736,10 @@ $navbar-toggler-padding-x: .75rem !default;
$navbar-toggler-font-size: $font-size-lg !default;
$navbar-toggler-border-radius: $btn-border-radius !default;
$navbar-dark-color: rgba($white, .5) !default;
$navbar-dark-hover-color: rgba($white, .75) !default;
$navbar-dark-color: rgba($white, .75) !default;
$navbar-dark-hover-color: rgba($white, 1) !default;
$navbar-dark-active-color: $white !default;
$navbar-dark-disabled-color: rgba($white, .25) !default;
$navbar-dark-disabled-color: rgba($white, .4) !default;
$navbar-dark-toggler-icon-bg: str-replace(url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='#{$navbar-dark-color}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"), "#", "%23") !default;
$navbar-dark-toggler-border-color: rgba($white, .1) !default;

View File

@ -1,8 +1,7 @@
<nav class="navbar navbar-expand-md navbar-light bg-white shadow-sm fixed-top">
<nav class="navbar navbar-expand-md navbar-dark bg-primary shadow-sm fixed-top">
<div class="container">
<a class="navbar-brand" href="{{ auth()->guest() ? route('front') : route('dashboard') }}">
<img src="{{ asset('assets/img/logo_linkace.svg') }}" alt="@lang('linkace.linkace')"
width="81" height="30">
{!! displaySVG(public_path('assets/img/logo_linkace.svg')) !!}
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar-content"

View File

@ -1,8 +1,7 @@
<nav class="navbar navbar-expand-md navbar-light bg-white shadow-sm fixed-top">
<nav class="navbar navbar-expand-md navbar-dark bg-primary shadow-sm fixed-top">
<div class="container">
<a class="navbar-brand" href="{{ auth()->guest() ? route('front') : route('dashboard') }}">
<img src="{{ asset('assets/img/logo_linkace.svg') }}" alt="@lang('linkace.linkace')"
width="81" height="30">
{!! displaySVG(public_path('assets/img/logo_linkace.svg')) !!}
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar-content"
@ -66,13 +65,13 @@
</li>
@else
<li class="nav-item">
<a href="{{ route('get-search') }}" class="nav-link">
@lang('search.search')
<a href="{{ route('get-search') }}" class="nav-link" title="@lang('search.search')">
<i class="fa fa-search fa-fw mx-1"></i>
</a>
</li>
<li class="nav-item">
<a href="{{ route('get-trash') }}" class="nav-link">
@lang('trash.trash')
<a href="{{ route('get-trash') }}" class="nav-link" title="@lang('trash.trash')">
<i class="fa fa-trash-alt fa-fw mx-1"></i>
</a>
</li>
<li class="nav-item dropdown">