mirror/snipe-it
3
0
Fork 0
mirror of https://github.com/snipe/snipe-it.git synced 2026-02-04 15:05:42 +00:00
Code Issues Projects Releases Wiki Activity

More tweaks

Browse Source
This commit is contained in:
snipe
2025-12-02 13:29:12 +00:00
parent 2e269d2e63
commit 6a99132e76
11 changed files with 442 additions and 254 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
app/Console/Commands/ResetDemoSettings.php
View File

@ -50,8 +50,8 @@ class ResetDemoSettings extends Command
$settings->alert_email = 'service@snipe-it.io';
$settings->login_note = 'Use `admin` / `password` to login to the demo.';
$settings->header_color = '#3c8dbc';
$settings->link_dark_color = '#296282';
$settings->link_light_color = '#296282;';
$settings->link_dark_color = '#084d73';
$settings->link_light_color = '#86cbf2;';
$settings->label2_2d_type = 'QRCODE';
$settings->default_currency = 'USD';
$settings->brand = 2;
@ -81,6 +81,8 @@ class ResetDemoSettings extends Command
if ($user = User::where('username', '=', 'admin')->first()) {
$user->locale = 'en-US';
$user->enable_confetti = 1;
$user->enable_sounds = 1;
$user->save();
}

3
app/Http/Controllers/ProfileController.php
View File

@ -56,6 +56,9 @@ class ProfileController extends Controller
$user->phone = $request->input('phone');
$user->enable_sounds = $request->input('enable_sounds', false);
$user->enable_confetti = $request->input('enable_confetti', false);
$user->link_light_color = $request->input('link_light_color', '#296282');
$user->link_dark_color = $request->input('link_dark_color', '#296282');
$user->nav_link_color = $request->input('nav_link_color', '#FFFFFF');
if (! config('app.lock_passwords')) {
$user->locale = $request->input('locale');

1
app/Http/Controllers/SettingsController.php
View File

@ -402,6 +402,7 @@ class SettingsController extends Controller
$setting->header_color = $request->input('header_color');
$setting->link_light_color = $request->input('link_light_color', '#296282');
$setting->link_dark_color = $request->input('link_dark_color', '#296282');
$setting->nav_link_color = $request->input('nav_link_color', '#FFFFFF');
$setting->support_footer = $request->input('support_footer');
$setting->version_footer = $request->input('version_footer');
$setting->footer_text = $request->input('footer_text');

1
app/Http/Kernel.php
View File

@ -44,6 +44,7 @@ class Kernel extends HttpKernel
\App\Http\Middleware\CheckForTwoFactor::class,
\Laravel\Passport\Http\Middleware\CreateFreshApiToken::class,
\App\Http\Middleware\AssetCountForSidebar::class,
\App\Http\Middleware\CheckColorSettings::class,
\Illuminate\Session\Middleware\AuthenticateSession::class,
\Illuminate\Routing\Middleware\SubstituteBindings::class,
],

68
app/Http/Middleware/CheckColorSettings.php Normal file
View File

@ -0,0 +1,68 @@
<?php
namespace App\Http\Middleware;
use App\Models\Setting;
use Closure;
use Illuminate\Contracts\Auth\Guard;
use Illuminate\Support\Facades\Auth;
class CheckColorSettings
{
/**
* The Guard implementation.
*
* @var Guard
*/
protected $auth;
/**
* Create a new filter instance.
*
* @param Guard $auth
* @return void
*/
public function __construct(Guard $auth)
{
$this->auth = $auth;
}
/**
* Handle an incoming request.
*
* @param \Illuminate\Http\Request $request
* @param \Closure $next
* @return mixed
*/
public function handle($request, Closure $next)
{
if ($settings = Setting::getSettings()) {
$nav_color = $settings->nav_link_color;
$link_dark_color = $settings->link_dark_color;
$link_light_color = $settings->link_light_color;
}
// Override system settings
if ($request->user()) {
if ($request->user()->nav_color) {
$nav_color = $request->user()->nav_color;
}
if ($request->user()->link_dark_color) {
$link_dark_color = $request->user()->link_dark_color;
}
if ($request->user()->nav_color) {
$link_light_color = $request->user()->link_light_color;
}
}
view()->share('nav_link_color', $nav_color);
view()->share('link_dark_color', $link_dark_color);
view()->share('link_light_color', $link_light_color);
return $next($request);
}
}

93
database/migrations/2025_11_28_175733_add_link_colors_to_settings.php
View File

@ -12,69 +12,93 @@ return new class extends Migration
*/
public function up(): void
{
$setting = DB::table('settings')->select(['skin'])->first();
$setting = DB::table('settings')->select(['skin', 'header_color'])->first();
Schema::table('settings', function (Blueprint $table) {
$table->string('link_dark_color')->after('header_color')->nullable()->default(null);
$table->string('link_light_color')->after('header_color')->nullable()->default(null);
$table->string('nav_link_color')->after('header_color')->nullable()->default(null);
});
Schema::table('users', function (Blueprint $table) {
$table->string('link_dark_color')->after('skin')->nullable()->default(null);
$table->string('link_light_color')->after('skin')->nullable()->default(null);
$table->string('nav_link_color')->after('skin')->nullable()->default(null);
});
// Set Snipe-IT defaults
$link_dark_color = '#36aff5';
$link_light_color = '#296282';
$nav_color = '#ffffff';
$header_color = '#3c8dbc';
if ($setting) {
switch ($setting->skin) {
case 'green':
case ('green' || 'green-dark'):
$header_color = '#00a65a';
$link_dark_color = '#00a65a';
$link_light_color = '#00a65a';
case 'green-dark':
$link_dark_color = '#00a65a';
$link_light_color = '#00a65a';
case 'red':
$nav_color = '#ffffff';
case ('red' || 'red-dark'):
$header_color = '#dd4b39';
$link_dark_color = '#dd4b39';
$link_light_color = '#dd4b39';
case 'red-dark':
$link_dark_color = '#dd4b39';
$link_light_color = '#dd4b39';
case 'orange':
$nav_color = '#ffffff';
case ('orange' || 'orange-dark'):
$header_color = '#FF851B';
$link_dark_color = '#FF851B';
$link_light_color = '#FF851B';
case 'orange-dark':
$link_dark_color = '#FF8C00';
$link_light_color = '#FF8C00';
case 'black':
$nav_color = '#ffffff';
case ('black' || 'black-dark'):
$header_color = '#000000';
$link_dark_color = '#111';
$link_light_color = '#111';
case 'black-dark':
$link_dark_color = '#111';
$link_light_color = '#111';
case 'purple':
$nav_color = '#ffffff';
case ('purple' || 'purple-dark'):
$header_color = '#605ca8';
$link_dark_color = '#605ca8';
$link_light_color = '#605ca8';
case 'purple-dark':
$link_dark_color = '#605ca8';
$link_light_color = '#605ca8';
case 'yellow':
$link_dark_color = '#f39c12';
$link_light_color = '#f39c12';
case 'yellow-dark':
$nav_color = '#ffffff';
case ('yellow' || 'yellow-dark') :
$header_color = '#f39c12';
$link_dark_color = '#f39c12';
$link_light_color = '#f39c12';
$nav_color = '#ffffff';
case 'contrast':
$header_color = '#001F3F';
$link_dark_color = '#86cbf2';
$link_light_color = '#084d73';
$nav_color = '#ffffff';
break;
}
// Override the header color if the settings have one
if ($setting->header_color) {
$header_color = $setting->header_color;
\Log::debug('A header color was found, so lets use that instead: '.$setting->header_color);
}
DB::table('settings')->update(['link_light_color' => $link_light_color, 'link_dark_color' => $link_dark_color]);
DB::table('settings')->update([
'link_light_color' => $link_light_color,
'link_dark_color' => $link_dark_color,
'nav_link_color' => $nav_color,
'header_color' => $header_color]);
DB::table('users')->whereNull('skin')->update([
'link_light_color' => $link_light_color,
'link_dark_color' => $link_dark_color,
'nav_link_color' => $nav_color]);
}
}
/**
@ -85,6 +109,13 @@ return new class extends Migration
Schema::table('settings', function ($table) {
$table->dropColumn('link_dark_color');
$table->dropColumn('link_light_color');
$table->dropColumn('nav_link_color');
});
Schema::table('users', function ($table) {
$table->dropColumn('link_dark_color');
$table->dropColumn('link_light_color');
$table->dropColumn('nav_link_color');
});
}
};

4
resources/lang/en-US/admin/settings/general.php
View File

@ -81,6 +81,8 @@ return [
'header_color' => 'Primary Theme Color',
'header_color_help' => 'Selecting a new color here will let you preview the color with your logo selection (if you have a site logo uploaded) in the header, however it will not be saved until you click the Save button.',
'link_dark_color' => 'Link Color for Dark Mode',
'nav_link_color' => 'Header Nav Link Color',
'nav_link_color_help' => 'Select a color for the links in your top level navigation. This color should be high enough contrast against your header color to be easily readable.',
'link_dark_color_help' => 'Select a color that will provide enough contrast for people that use Snipe-IT in dark mode.',
'link_light_color' => 'Link Color for Light Mode',
'link_light_color_help' => 'Select a color that will provide enough contrast for people that use Snipe-IT in light mode.',
@ -494,11 +496,13 @@ return [
'general' => 'General',
'intervals' => 'Intervals & Thresholds',
'logos' => 'Logos & Display',
'display' => 'Display Preferences',
'mapping' => 'LDAP Field Mapping',
'test' => 'Test LDAP Connection',
'misc' => 'Miscellaneous',
'misc_display' => 'Miscellaneous Display Options',
'profiles' => 'User Profiles',
'your_details' => 'Your Details',
'server' => 'Server Settings',
'scoping' => 'Scoping',
'security' => 'Security Preferences',

354
resources/views/account/profile.blade.php
View File

@ -15,161 +15,206 @@
<input type="hidden" name="_token" value="{{ csrf_token() }}" />
<div class="box box-default">
<div class="box-body">
<!-- First Name -->
<div class="form-group {{ $errors->has('first_name') ? ' has-error' : '' }}">
<label for="first_name" class="col-md-3 control-label">{{ trans('general.first_name') }}
</label>
<div class="col-md-8 required">
<input class="form-control" type="text" name="first_name" id="first_name" value="{{ old('first_name', $user->first_name) }}" required />
{!! $errors->first('first_name', '<span class="alert-msg" aria-hidden="true"><i class="fas fa-times" aria-hidden="true"></i> :message</span>') !!}
</div>
</div>
<!-- Last Name -->
<div class="form-group {{ $errors->has('last_name') ? ' has-error' : '' }}">
<label for="last_name" class="col-md-3 control-label">
{{ trans('general.last_name') }}
</label>
<div class="col-md-8 required">
<input class="form-control" type="text" name="last_name" id="last_name" value="{{ old('last_name', $user->last_name) }}" />
{!! $errors->first('last_name', '<span class="alert-msg" aria-hidden="true"><i class="fas fa-times" aria-hidden="true"></i> :message</span>') !!}
</div>
</div>
<fieldset name="display-preferences">
<x-form-legend>
{{ trans('admin/settings/general.legends.display') }}
</x-form-legend>
<!-- Nav Link color -->
<div class="form-group {{ $errors->has('nav_link_color') ? 'error' : '' }}">
<label for="nav_link_color" class="col-md-3 control-label">{{ trans('admin/settings/general.nav_link_color') }}</label>
<div class="col-md-9">
<x-input.colorpicker :item="$user" placeholder="#ffffff" div_id="nav-link-color" id="nav-link-color" :value="old('nav_link_color', ($user->nav_link_color ?? '#ffffff'))" name="nav_link_color" />
{!! $errors->first('nav_link_color', '<span class="alert-msg" aria-hidden="true">:message</span>') !!}
<p class="help-block">{{ trans('admin/settings/general.nav_link_color_help') }}</p>
</div>
</div>
<!-- Light Link color -->
<div class="form-group {{ $errors->has('link_light_color') ? 'error' : '' }}">
<label for="link_light_color" class="col-md-3 control-label">{{ trans('admin/settings/general.link_light_color') }}</label>
<div class="col-md-9">
<x-input.colorpicker :item="$user" id="link_light_color" placeholder="#296282" :value="old('link_light_color', ($user->link_light_color ?? '#296282'))" name="link_light_color" />
{!! $errors->first('link_light_color', '<span class="alert-msg" aria-hidden="true">:message</span>') !!}
<p class="help-block">{{ trans('admin/settings/general.link_light_color_help') }}</p>
</div>
</div>
<!-- Dark Link color -->
<div class="form-group {{ $errors->has('link_dark_color') ? 'error' : '' }}">
<label for="link_dark_color" class="col-md-3 control-label">{{ trans('admin/settings/general.link_dark_color') }}</label>
<div class="col-md-9">
<x-input.colorpicker :item="$user" id="link_dark_color" placeholder="5fa4cc" :value="old('link_dark_color', ($user->link_dark_color ?? '#5fa4cc'))" name="link_dark_color" />
{!! $errors->first('link_dark_color', '<span class="alert-msg" aria-hidden="true">:message</span>') !!}
<p class="help-block">{{ trans('admin/settings/general.link_dark_color_help') }}</p>
</div>
</div>
@can('self.edit_location')
<!-- Location -->
@include ('partials.forms.edit.location-profile-select', ['translated_name' => trans('general.location')])
@endcan
<div class="form-group">
<div class="col-md-9 col-md-offset-3">
<label class="form-control">
<input type="checkbox" name="enable_sounds" value="1" {{ old('enable_sounds', $user->enable_sounds) ? 'checked' : '' }}>
{{ trans('account/general.enable_sounds') }}
</label>
</div>
</div>
<div class="form-group">
<div class="col-md-9 col-md-offset-3">
<label class="form-control">
<input type="checkbox" name="enable_confetti" value="1" {{ old('enable_confetti', $user->enable_confetti) ? 'checked' : '' }}>
{{ trans('account/general.enable_confetti') }}
</label>
</div>
</div>
</fieldset>
<!-- Language -->
<div class="form-group {{ $errors->has('locale') ? 'has-error' : '' }}">
<label class="col-md-3 control-label" for="locale">{{ trans('general.language') }}</label>
<div class="col-md-7">
<fieldset name="user-preferences">
<x-form-legend>
{{ trans('admin/settings/general.legends.your_details') }}
</x-form-legend>
<!-- First Name -->
<div class="form-group {{ $errors->has('first_name') ? ' has-error' : '' }}">
<label for="first_name" class="col-md-3 control-label">{{ trans('general.first_name') }}
</label>
<div class="col-md-8 required">
<input class="form-control" type="text" name="first_name" id="first_name" value="{{ old('first_name', $user->first_name) }}" required />
{!! $errors->first('first_name', '<span class="alert-msg" aria-hidden="true"><i class="fas fa-times" aria-hidden="true"></i> :message</span>') !!}
</div>
</div>
@if (!config('app.lock_passwords'))
<x-input.locale-select name="locale" :selected="old('locale', $user->locale)"/>
{!! $errors->first('locale', '<span class="alert-msg" aria-hidden="true">:message</span>') !!}
@else
<p class="help-block">{{ trans('general.feature_disabled') }}</p>
@endif
</div>
</div>
<!-- Phone -->
<div class="form-group {{ $errors->has('phone') ? 'has-error' : '' }}">
<label class="col-md-3 control-label" for="phone">{{ trans('admin/users/table.phone') }}</label>
<div class="col-md-4">
<input class="form-control" type="text" name="phone" id="phone" value="{{ old('phone', $user->phone) }}" />
{!! $errors->first('phone', '<span class="alert-msg" aria-hidden="true">:message</span>') !!}
</div>
</div>
<!-- Website URL -->
<div class="form-group {{ $errors->has('website') ? ' has-error' : '' }}">
<label for="website" class="col-md-3 control-label">{{ trans('general.website') }}</label>
<div class="col-md-8">
<input class="form-control" type="text" name="website" id="website" value="{{ old('website', $user->website) }}" />
{!! $errors->first('website', '<span class="alert-msg" aria-hidden="true"><i class="fas fa-times" aria-hidden="true"></i> :message</span>') !!}
</div>
</div>
<div class="form-group">
<div class="col-md-9 col-md-offset-3">
<label class="form-control">
<input type="checkbox" name="enable_sounds" value="1" {{ old('enable_sounds', $user->enable_sounds) ? 'checked' : '' }}>
{{ trans('account/general.enable_sounds') }}
</label>
</div>
</div>
<div class="form-group">
<div class="col-md-9 col-md-offset-3">
<label class="form-control">
<input type="checkbox" name="enable_confetti" value="1" {{ old('enable_confetti', $user->enable_confetti) ? 'checked' : '' }}>
{{ trans('account/general.enable_confetti') }}
</label>
</div>
</div>
<!-- Last Name -->
<div class="form-group {{ $errors->has('last_name') ? ' has-error' : '' }}">
<label for="last_name" class="col-md-3 control-label">
{{ trans('general.last_name') }}
</label>
<div class="col-md-8 required">
<input class="form-control" type="text" name="last_name" id="last_name" value="{{ old('last_name', $user->last_name) }}" />
{!! $errors->first('last_name', '<span class="alert-msg" aria-hidden="true"><i class="fas fa-times" aria-hidden="true"></i> :message</span>') !!}
</div>
</div>
<!-- Avatar -->
@if (($user->avatar) && ($user->avatar!=''))
<div class="form-group{{ $errors->has('image_delete') ? ' has-error' : '' }}">
<div class="col-md-9 col-md-offset-3">
@if (!$user->isAvatarExternal())
<label for="image_delete" class="form-control">
<input type="checkbox" name="image_delete" id="image_delete" value="1" @checked(old('image_delete')) aria-label="image_delete">
{{ trans('general.image_delete') }}
</label>
{!! $errors->first('image_delete', '<span class="alert-msg">:message</span>') !!}
@endif
</div>
</div>
<div class="form-group">
<div class="col-md-9 col-md-offset-3">
<img src="{{ (($user->isAvatarExternal()) ? $user->avatar : Storage::disk('public')->url(app('users_upload_path').e($user->avatar))) }}" class="img-responsive">
{!! $errors->first('image_delete', '<span class="alert-msg">:message</span>') !!}
</div>
</div>
@else
<!-- Gravatar Email -->
<div class="form-group {{ $errors->has('gravatar') ? ' has-error' : '' }}">
<label for="gravatar" class="col-md-3 control-label">{{ trans('general.gravatar_email') }}
<small>(Private)</small>
</label>
<div class="col-md-8">
<input class="form-control" type="text" name="gravatar" id="gravatar" value="{{ old('gravatar', $user->gravatar) }}" />
{!! $errors->first('gravatar', '<span class="alert-msg" aria-hidden="true"><i class="fas fa-times" aria-hidden="true"></i> :message</span>') !!}
<p style="padding-top: 3px;">
<img src="//secure.gravatar.com/avatar/{{ md5(strtolower(trim($user->gravatar))) }}" width="30" height="30" alt="{{ $user->display_name }} avatar image">
{!! trans('general.gravatar_url') !!}
</p>
</div>
</div>
@endif
@can('self.edit_location')
<!-- Location -->
@include ('partials.forms.edit.location-profile-select', ['translated_name' => trans('general.location')])
@endcan
@include ('partials.forms.edit.image-upload', ['fieldname' => 'avatar', 'image_path' => app('users_upload_path')])
<!-- Language -->
<div class="form-group {{ $errors->has('locale') ? 'has-error' : '' }}">
<label class="col-md-3 control-label" for="locale">{{ trans('general.language') }}</label>
<div class="col-md-7">
@if (!config('app.lock_passwords'))
<x-input.locale-select name="locale" :selected="old('locale', $user->locale)"/>
{!! $errors->first('locale', '<span class="alert-msg" aria-hidden="true">:message</span>') !!}
@else
<p class="help-block">{{ trans('general.feature_disabled') }}</p>
@endif
</div>
</div>
<!-- Phone -->
<div class="form-group {{ $errors->has('phone') ? 'has-error' : '' }}">
<label class="col-md-3 control-label" for="phone">{{ trans('admin/users/table.phone') }}</label>
<div class="col-md-4">
<input class="form-control" type="text" name="phone" id="phone" value="{{ old('phone', $user->phone) }}" />
{!! $errors->first('phone', '<span class="alert-msg" aria-hidden="true">:message</span>') !!}
</div>
</div>
<!-- Website URL -->
<div class="form-group {{ $errors->has('website') ? ' has-error' : '' }}">
<label for="website" class="col-md-3 control-label">{{ trans('general.website') }}</label>
<div class="col-md-8">
<input class="form-control" type="text" name="website" id="website" value="{{ old('website', $user->website) }}" />
{!! $errors->first('website', '<span class="alert-msg" aria-hidden="true"><i class="fas fa-times" aria-hidden="true"></i> :message</span>') !!}
</div>
</div>
<!-- Avatar -->
@if (($user->avatar) && ($user->avatar!=''))
<div class="form-group{{ $errors->has('image_delete') ? ' has-error' : '' }}">
<div class="col-md-9 col-md-offset-3">
@if (!$user->isAvatarExternal())
<label for="image_delete" class="form-control">
<input type="checkbox" name="image_delete" id="image_delete" value="1" @checked(old('image_delete')) aria-label="image_delete">
{{ trans('general.image_delete') }}
</label>
{!! $errors->first('image_delete', '<span class="alert-msg">:message</span>') !!}
@endif
</div>
</div>
<div class="form-group">
<div class="col-md-9 col-md-offset-3">
<img src="{{ (($user->isAvatarExternal()) ? $user->avatar : Storage::disk('public')->url(app('users_upload_path').e($user->avatar))) }}" class="img-responsive">
{!! $errors->first('image_delete', '<span class="alert-msg">:message</span>') !!}
</div>
</div>
@else
<!-- Gravatar Email -->
<div class="form-group {{ $errors->has('gravatar') ? ' has-error' : '' }}">
<label for="gravatar" class="col-md-3 control-label">{{ trans('general.gravatar_email') }}
<small>(Private)</small>
</label>
<div class="col-md-8">
<input class="form-control" type="text" name="gravatar" id="gravatar" value="{{ old('gravatar', $user->gravatar) }}" />
{!! $errors->first('gravatar', '<span class="alert-msg" aria-hidden="true"><i class="fas fa-times" aria-hidden="true"></i> :message</span>') !!}
<p style="padding-top: 3px;">
<img src="//secure.gravatar.com/avatar/{{ md5(strtolower(trim($user->gravatar))) }}" width="30" height="30" alt="{{ $user->display_name }} avatar image">
{!! trans('general.gravatar_url') !!}
</p>
</div>
</div>
@endif
@include ('partials.forms.edit.image-upload', ['fieldname' => 'avatar', 'image_path' => app('users_upload_path')])
<!-- Two factor opt in -->
@if ($snipeSettings->two_factor_enabled=='1')
<div class="form-group {{ $errors->has('two_factor_optin') ? 'has-error' : '' }}">
<div class="col-md-7 col-md-offset-3">
<label
for="two_factor_optin"
@class([
'form-control',
'form-control--disabled' => auth()->user()->cannot('self.two_factor'),
])
>
<input
type="checkbox"
name="two_factor_optin"
id="two_factor_optin"
value="1"
@checked(old('two_factor_optin', $user->two_factor_optin))
@disabled(auth()->user()->cannot('self.two_factor'))
>
{{ trans('admin/settings/general.two_factor_enabled_text') }}
</label>
@can('self.two_factor')
<p class="help-block">{{ trans('admin/settings/general.two_factor_enabled_warning') }}</p>
@else
<p class="help-block">{{ trans('admin/settings/general.two_factor_enabled_edit_not_allowed') }}</p>
@endcan
@if (config('app.lock_passwords'))
<p class="help-block">{{ trans('general.feature_disabled') }}</p>
@endif
</div>
</div>
@endif
</fieldset>
<!-- Two factor opt in -->
@if ($snipeSettings->two_factor_enabled=='1')
<div class="form-group {{ $errors->has('two_factor_optin') ? 'has-error' : '' }}">
<div class="col-md-7 col-md-offset-3">
<label
for="two_factor_optin"
@class([
'form-control',
'form-control--disabled' => auth()->user()->cannot('self.two_factor'),
])
>
<input
type="checkbox"
name="two_factor_optin"
id="two_factor_optin"
value="1"
@checked(old('two_factor_optin', $user->two_factor_optin))
@disabled(auth()->user()->cannot('self.two_factor'))
>
{{ trans('admin/settings/general.two_factor_enabled_text') }}
</label>
@can('self.two_factor')
<p class="help-block">{{ trans('admin/settings/general.two_factor_enabled_warning') }}</p>
@else
<p class="help-block">{{ trans('admin/settings/general.two_factor_enabled_edit_not_allowed') }}</p>
@endcan
@if (config('app.lock_passwords'))
<p class="help-block">{{ trans('general.feature_disabled') }}</p>
@endif
</div>
</div>
@endif
@ -184,3 +229,26 @@
</div> <!-- .row-->
@stop
@section('moar_scripts')
<!-- bootstrap color picker -->
<script nonce="{{ csrf_token() }}">
// This takes the color from the color picker to show a live preview
$(function() {
$('#nav-link-color').colorpicker().on('changeColor', function(e) {
var color = e.color.toString('rgba');
// $('.navbar-nav > li > a').css('background-color', header_color);
$('.navbar-nav > li > a:link').attr('style','color: '+ color +' !important').css('background-color', header_color);
$('.btn-theme').attr('style','color: '+ color +' !important').css('background-color', header_color);
});
});
</script>
@stop

5
resources/views/blade/input/colorpicker.blade.php
View File

@ -2,12 +2,13 @@
'item' => null,
'name' => 'color',
'id' => 'color',
'div_id' => null
'div_id' => null,
'placeholder'=> 'FF0000',
])
<!-- Colorpicker -->
<div {{ $attributes->merge(['class' => 'color input-group colorpicker-component row col-md-5']) }} id="{{ $div_id }}">
<input class="form-control" placeholder="#FF0000" aria-label="{{ $name }}" name="{{ $name }}" type="text" id="{{ $id }}" value="{{ old($name, ($item->{$name} ?? '')) }}">
<input class="form-control" placeholder="{{ $placeholder }}" aria-label="{{ $name }}" name="{{ $name }}" type="text" id="{{ $id }}" value="{{ old($name, ($item->{$name} ?? '')) }}">
<span class="input-group-addon"><i> </i></span>
</div>

106
resources/views/layouts/default.blade.php
View File

@ -42,10 +42,22 @@
<style>
:root {
color-scheme: light dark;
--main-theme-color: {{ $snipeSettings->header_color ?? '#5fa4cc' }};
--btn-theme-text-color: {{ $nav_link_color ?? 'light-dark(hsl(from var(--main-theme-color) h s calc(l + 10)),hsl(from var(--main-theme-color) h s calc(l - 10)))' }};
--btn-theme-hover-text-color: {{ $nav_link_color ?? 'light-dark(hsl(from var(--main-theme-color) h s calc(l - 10)),hsl(from var(--main-theme-color) h s calc(l - 10)))' }};
--btn-theme-hover: {{ $nav_link_color ?? 'light-dark(hsl(from var(--main-theme-color) h s calc(l - 10)),hsl(from var(--main-theme-color) h s calc(l - 10)))' }};
--sidenav-text-hover-color: #fff;
--sidenav-text-nohover-color: #b8c7ce;
--search-highlight: #e9d15b;
--color-fg: light-dark(#000000, #ffffff);
--text-danger: light-dark(#a94442,#dd4b39);
--text-success: light-dark(#039516,#4ced61);
--text-warning: light-dark(#da9113,#f3a51f);
--text-info: light-dark(#31708f,#2baae6);
--text-help: light-dark(#605e5e,#a6a4a4);
--nav-primary-text-color: {{ $nav_link_color ?? 'light-dark(hsl(from var(--main-theme-color) h s calc(l - 10)),hsl(from var(--main-theme-color) h s calc(l - 10)))' }};
--nav-hover-text-color: {{ $nav_link_color ?? 'light-dark(hsl(from var(--main-theme-color) h s calc(l - 10)),hsl(from var(--main-theme-color) h s calc(l - 10)))' }};
}
@ -59,25 +71,21 @@
--callout-bg-color: var(--box-header-bottom-border-color);
--callout-left-border: var(--box-header-top-border-color);
--color-bg: #ecf0f5;
--color-fg: #000000;
--header-color: #000000;
--link-color: {{ $snipeSettings->link_light_color ?? '#296282' }};
--link-color: {{ $link_light_color ?? '#296282' }};
--link-hover: hsl(from var(--link-color) h s calc(l - 10));
--nav-primary-font-color: #ffffff;
--tab-bottom-border: 1px solid var(--box-header-top-border-color);
--table-border-row-top: 1px solid #ecf0f5;
--table-stripe-bg-alt: rgba(211, 211, 211, 0.25);
--table-stripe-bg: #ffffff;
--text-blue: var(--text-legend-help);
--text-danger: #a94442;
--text-help: #605e5e;
--text-info: #31708f;
--text-legend-help: var(--text-help);
--text-success: #039516;
--text-warning: #da9113;
--main-theme-hover: hsl(from var(--main-theme-color) h s calc(l + 5));
--btn-theme-base: hsl(from var(--main-theme-color) h s calc(l - 5));
--btn-theme-hover: hsl(from var(--btn-theme-base) h s calc(l - 15));
--btn-theme-hover: hsl(from var(--btn-theme-base) h s calc(l + 15));
--btn-theme-border: hsl(from var(--btn-theme-base) h s calc(l + 20));
--btn-theme-hover-text-color: hsl(from var(--btn-theme-hover) h s calc(l - 20));
}
@ -91,25 +99,20 @@
--callout-bg-color: var(--box-header-top-border-color);
--callout-left-border: #323131;
--color-bg: #222222;
--color-fg: #ffffff;
--header-color: #ffffff;
--link-color: {{ $snipeSettings->link_dark_color ?? '#5fa4cc' }};
--link-color: {{ $link_dark_color ?? '#5fa4cc' }};
--link-hover: hsl(from var(--link-color) h s calc(l + 15));
--nav-primary-font-color: #ffffff;
--tab-bottom-border: 1px solid var(--box-header-top-border-color);
--table-border-row: 1px solid #656464;
--table-stripe-bg-alt: #323131;
--table-stripe-bg: #494747;
--text-blue: var(--text-legend-help);
--text-danger: #dd4b39;
--text-help: #a6a4a4;
--text-info: #2baae6;
--text-legend-help: #d6d6d6;
--text-success: #4ced61;
--text-warning: #f3a51f;
--main-theme-hover: hsl(from var(--main-theme-color) h s calc(l - 10));
--btn-theme-base: hsl(from var(--main-theme-color) h s calc(l + 5));
--btn-theme-hover: hsl(from var(--btn-theme-base) h s calc(l + 15));
--btn-theme-border: hsl(from var(--btn-theme-base) h s calc(l + 20));
--btn-theme-hover-text-color: hsl(from var(--btn-theme-hover) h s calc(l + 20));
}
@ -126,16 +129,21 @@
color: var(--link-hover) !important;
}
h2 small {
color: var(--color-fg) !important;
}
.btn-theme {
background-color: var(--btn-theme-base);
color: contrast-color(var(--btn-theme-base)) !important;
/*color: var(--btn-theme-hover-text-color) !important;*/
color: var(--nav-primary-text-color) !important;
border: 1px solid hsl(from var(--btn-theme-base) h s calc(l - 15)) !important;
}
.btn-theme:hover {
background-color: var(--btn-theme-hover);
color: contrast-color(var(--main-theme-color)) !important;
/*color: var(--btn-theme-hover-text-color) !important;*/
color: var(--nav-primary-text-color) !important;
border: 1px solid hsl(from var(--btn-theme-base) h s calc(l - 15)) !important;
}
@ -238,25 +246,6 @@
background-color: var(--color-bg);
}
.pagination > li > a,
.page-next a,
.pagination>.disabled > a
{
border-color: var(--table-stripe-bg);
background-color: var(--main-theme-color);
color: contrast-color(var(--main-theme-hover)) !important;
}
.pagination > li > .active > a:hover,
.pagination > li > .active > a
{
color: contrast-color(var(--main-theme-hover)) !important;
background-color: var(--main-theme-hover);
}
.btn-anchor {
@ -437,7 +426,7 @@
.label-default
{
background-color: var(--main-theme-color);
color: contrast-color(var(--main-theme-color)) !important;
color: var(--nav-primary-text-color) !important;
}
@ -452,8 +441,9 @@
{
background-color: var(--main-theme-color);
/*background-color: rgba(0,0,0,.15);*/
/*color: var(--nav-primary-font-color) !important;*/
color: contrast-color(var(--main-theme-color)) !important;
color: var(--nav-primary-text-color) !important;
/*color: var(--nav-primary-text-color) !important;*/
}
@ -474,25 +464,41 @@
.navbar-nav .open > a:hover,
.navbar-nav > li > a:focus,
.navbar-nav > li > a:hover,
.open > .dropdown-toggle.btn-tableButton.focus,
.open > .dropdown-toggle.btn-tableButton:focus,
.open > .dropdown-toggle.btn-tableButton:hover,
.pagination > .active > a:hover
.page-next a,
.pagination > .active > a:hover,
.page-item.active,
.pagination > li > .active > a,
.pagination > li > .active > a:hover,
.pagination > li > a:hover
{
background-color: var(--main-theme-hover);
border-color: var(--table-stripe-bg);
color: contrast-color(var(--main-theme-color)) !important;
background-color: var(--main-theme-hover) !important;
border-color: var(--btn-theme-hover) !important;
/*color: var(--btn-theme-hover-text-color) !important;*/
color: var(--nav-primary-text-color) !important;
}
.pagination > li > a
{
background-color: var(--main-theme-color) !important;
border-color: var(--btn-theme-hover) !important;
/*color: var(--btn-theme-text-color) !important;*/
color: var(--nav-primary-text-color) !important;
}
.bootstrap-table .fixed-table-toolbar li.dropdown-item-marker label
{
color: contrast-color(var(--main-theme-color)) !important;
color: var(--nav-primary-text-color) !important;
}
.bootstrap-table .fixed-table-toolbar li.dropdown-item-marker label:hover
{
background-color: var(--main-theme-hover) !important;
color: contrast-color(var(--main-theme-hover)) !important;
color: var(--nav-primary-text-color) !important;
}
@ -501,12 +507,12 @@
{
background-color: hsl(from var(--main-theme-color) h s calc(l - 5));
border-color: hsl(from var(--main-theme-color) h s calc(l - 10));
color: contrast-color(var(--main-theme-color)) !important;
color: var(--nav-primary-text-color) !important;
}
.main-header .navbar .nav>.active>a {
background-color: hsl(from var(--main-theme-color) h s calc(l - 5));
color: contrast-color(var(--main-theme-color)) !important;
color: var(--nav-primary-text-color) !important;
}
@ -521,7 +527,7 @@
.task_menu
{
background-color: hsl(from var(--main-theme-color) h s calc(l - 5));
color: contrast-color(var(--main-theme-color)) !important;
color: var(--nav-primary-text-color) !important;
margin-bottom: 0;
}

55
resources/views/settings/branding.blade.php
View File

@ -76,18 +76,27 @@
<div class="form-group {{ $errors->has('header_color') ? 'error' : '' }}">
<label for="header_color" class="col-md-3 control-label">{{ trans('admin/settings/general.header_color') }}</label>
<div class="col-md-9">
<x-input.colorpicker :item="$setting" div_id="header-color" id="header_color" :value="old('link_light_color', ($setting->header_color ?? '#3c8dbc'))" name="header_color" />
<x-input.colorpicker :item="$setting" placeholder="#3c8dbc" div_id="header-color" id="header_color" :value="old('header_color', ($setting->header_color ?? '#3c8dbc'))" name="header_color" />
<p class="help-block">{{ trans('admin/settings/general.header_color_help') }}</p>
{!! $errors->first('header_color', '<span class="alert-msg" aria-hidden="true">:message</span>') !!}
</div>
</div>
<!-- Nav Link color -->
<div class="form-group {{ $errors->has('nav_link_color') ? 'error' : '' }}">
<label for="nav_link_color" class="col-md-3 control-label">{{ trans('admin/settings/general.nav_link_color') }}</label>
<div class="col-md-9">
<x-input.colorpicker :item="$setting" placeholder="#ffffff" div_id="nav-link-color" id="nav-link-color" :value="old('nav_link_color', ($setting->nav_link_color ?? '#ffffff'))" name="nav_link_color" />
{!! $errors->first('nav_link_color', '<span class="alert-msg" aria-hidden="true">:message</span>') !!}
<p class="help-block">{{ trans('admin/settings/general.nav_link_color_help') }}</p>
</div>
</div>
<!-- Light Link color -->
<div class="form-group {{ $errors->has('link_light_color') ? 'error' : '' }}">
<label for="link_light_color" class="col-md-3 control-label">{{ trans('admin/settings/general.link_light_color') }}</label>
<div class="col-md-9">
<x-input.colorpicker :item="$setting" id="link_light_color" :value="old('link_light_color', ($setting->link_light_color ?? '#296282'))" name="link_light_color" />
<x-input.colorpicker :item="$setting" id="link_light_color" placeholder="#296282" :value="old('link_light_color', ($setting->link_light_color ?? '#296282'))" name="link_light_color" />
{!! $errors->first('link_light_color', '<span class="alert-msg" aria-hidden="true">:message</span>') !!}
<p class="help-block">{{ trans('admin/settings/general.link_light_color_help') }}</p>
</div>
@ -97,7 +106,7 @@
<div class="form-group {{ $errors->has('link_dark_color') ? 'error' : '' }}">
<label for="link_dark_color" class="col-md-3 control-label">{{ trans('admin/settings/general.link_dark_color') }}</label>
<div class="col-md-9">
<x-input.colorpicker :item="$setting" id="link_dark_color" :value="old('link_dark_color', ($setting->link_dark_color ?? '#5fa4cc'))" name="link_dark_color" />
<x-input.colorpicker :item="$setting" id="link_dark_color" placeholder="5fa4cc" :value="old('link_dark_color', ($setting->link_dark_color ?? '#5fa4cc'))" name="link_dark_color" />
{!! $errors->first('link_dark_color', '<span class="alert-msg" aria-hidden="true">:message</span>') !!}
<p class="help-block">{{ trans('admin/settings/general.link_dark_color_help') }}</p>
</div>
@ -426,36 +435,30 @@
@section('moar_scripts')
<!-- bootstrap color picker -->
<script nonce="{{ csrf_token() }}">
// This takes the color from the color picker to show a live preview
$(function() {
$('#header-color').colorpicker().on('changeColor', function(e) {
$('.main-header .navbar')[0].style.backgroundColor = e.color.toString('rgba');
$('.header-preview')[0].style.backgroundColor = e.color.toString('rgba');
$('.left-navblock')[0].style.backgroundColor = e.color.toString('rgba');
$('.navbar-custom-menu > .navbar-nav')[0].style.backgroundColor = e.color.toString('rgba');
$('.navbar-custom-menu > .navbar-nav > li > .navbar-form')[0].style.backgroundColor = e.color.toString('rgba');
$('.navbar-nav > li > a:link, .navbar-nav > li > a:visited')[0].style.backgroundColor = e.color.toString('rgba');
$('.navbar-nav > li > a:link, .navbar-nav > li > a:visited')[1].style.backgroundColor = e.color.toString('rgba');
$('.navbar-nav > li > a:link, .navbar-nav > li > a:visited')[2].style.backgroundColor = e.color.toString('rgba');
$('.navbar-nav > li > a:link, .navbar-nav > li > a:visited')[3].style.backgroundColor = e.color.toString('rgba');
$('.navbar-nav > li > a:link, .navbar-nav > li > a:visited')[4].style.backgroundColor = e.color.toString('rgba');
$('.navbar-nav > li > a:link, .navbar-nav > li > a:visited')[5].style.backgroundColor = e.color.toString('rgba');
$('.navbar-nav > li > a:link, .navbar-nav > li > a:visited')[6].style.backgroundColor = e.color.toString('rgba');
$('.navbar-nav > li > a:link, .navbar-nav > li > a:visited')[7].style.backgroundColor = e.color.toString('rgba');
$('.navbar-nav > li > a:link, .navbar-nav > li > a:visited')[8].style.backgroundColor = e.color.toString('rgba');
var color = e.color.toString('rgba');
$('.main-header .navbar, .header-preview, .left-navblock, .navbar-custom-menu > .navbar-nav, .navbar-custom-menu > .navbar-nav > li > .navbar-form, .navbar-nav > li > a:link, .navbar-nav > li > a').css('background-color', color);
$('.btn-theme').css('background-color', color);
});
$('#nav-link-color').colorpicker().on('changeColor', function(e) {
var color = e.color.toString('rgba');
var header_color = $('#header_color').val();
console.log(header_color);
// $('.navbar-nav > li > a').css('background-color', header_color);
$('.navbar-nav > li > a:link').attr('style','color: '+ color +' !important').css('background-color', header_color);
$('.btn-theme').attr('style','color: '+ color +' !important').css('background-color', header_color);
});
});
// toggle the disabled state of asset id prefix
$('#auto_increment_assets').on('ifChecked', function(){
$('#auto_increment_prefix').prop('disabled', false).focus();
}).on('ifUnchecked', function(){
$('#auto_increment_prefix').prop('disabled', true);
});
</script>
@stop