mirror of
https://github.com/BookStackApp/BookStack.git
synced 2025-07-28 17:02:04 +03:00
Converted primary color use to css variable
- Removed all existing SCSS usage of primary color. - Cut down custom styles injection to just be css vars. - Reduced button styles so default button is primary. - Updated button styles to lighten/brighten on hover & active states even when a custom color is set. - Removed unused scss color vars. - Updated default BookStack blue to achieve better accessibility.
This commit is contained in:
@ -16,7 +16,7 @@
|
||||
</div>
|
||||
|
||||
<div class="text-right">
|
||||
<button class="button primary">{{ trans('auth.user_invite_page_confirm_button') }}</button>
|
||||
<button class="button">{{ trans('auth.user_invite_page_confirm_button') }}</button>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
|
@ -28,7 +28,7 @@
|
||||
</div>
|
||||
|
||||
<div class="text-right">
|
||||
<button class="button primary" tabindex="1">{{ title_case(trans('auth.log_in')) }}</button>
|
||||
<button class="button" tabindex="1">{{ title_case(trans('auth.log_in')) }}</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@ -16,7 +16,7 @@
|
||||
</div>
|
||||
|
||||
<div class="from-group text-right mt-m">
|
||||
<button class="button primary">{{ trans('auth.reset_password_send_button') }}</button>
|
||||
<button class="button">{{ trans('auth.reset_password_send_button') }}</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
@ -26,7 +26,7 @@
|
||||
</div>
|
||||
|
||||
<div class="from-group text-right mt-m">
|
||||
<button class="button primary">{{ trans('auth.reset_password') }}</button>
|
||||
<button class="button">{{ trans('auth.reset_password') }}</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
@ -31,7 +31,7 @@
|
||||
<a href="{{ url('/login') }}">{{ trans('auth.already_have_account') }}</a>
|
||||
</div>
|
||||
<div class="from-group text-right">
|
||||
<button class="button primary">{{ trans('auth.create_account') }}</button>
|
||||
<button class="button">{{ trans('auth.create_account') }}</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@ -24,7 +24,7 @@
|
||||
@endif
|
||||
</div>
|
||||
<div class="form-group text-right mt-m">
|
||||
<button type="submit" class="button primary">{{ trans('auth.email_not_confirmed_resend_button') }}</button>
|
||||
<button type="submit" class="button">{{ trans('auth.email_not_confirmed_resend_button') }}</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
@ -23,7 +23,7 @@
|
||||
{!! csrf_field() !!}
|
||||
<input type="hidden" name="_method" value="DELETE">
|
||||
<a href="{{$book->getUrl()}}" class="button outline">{{ trans('common.cancel') }}</a>
|
||||
<button type="submit" class="button primary">{{ trans('common.confirm') }}</button>
|
||||
<button type="submit" class="button">{{ trans('common.confirm') }}</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
@ -37,5 +37,5 @@
|
||||
|
||||
<div class="form-group text-right">
|
||||
<a href="{{ isset($book) ? $book->getUrl() : url('/books') }}" class="button outline">{{ trans('common.cancel') }}</a>
|
||||
<button type="submit" class="button primary">{{ trans('entities.books_save') }}</button>
|
||||
<button type="submit" class="button">{{ trans('entities.books_save') }}</button>
|
||||
</div>
|
@ -28,7 +28,7 @@
|
||||
<input book-sort-input type="hidden" name="sort-tree">
|
||||
<div class="list text-right">
|
||||
<a href="{{ $book->getUrl() }}" class="button outline">{{ trans('common.cancel') }}</a>
|
||||
<button class="button primary" type="submit">{{ trans('entities.books_sort_save') }}</button>
|
||||
<button class="button" type="submit">{{ trans('entities.books_sort_save') }}</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
@ -27,7 +27,7 @@
|
||||
|
||||
<div class="text-right">
|
||||
<a href="{{ $chapter->getUrl() }}" class="button outline">{{ trans('common.cancel') }}</a>
|
||||
<button type="submit" class="button primary">{{ trans('common.confirm') }}</button>
|
||||
<button type="submit" class="button">{{ trans('common.confirm') }}</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
@ -22,5 +22,5 @@
|
||||
|
||||
<div class="form-group text-right">
|
||||
<a href="{{ isset($chapter) ? $chapter->getUrl() : $book->getUrl() }}" class="button outline">{{ trans('common.cancel') }}</a>
|
||||
<button type="submit" class="button primary">{{ trans('entities.chapters_save') }}</button>
|
||||
<button type="submit" class="button">{{ trans('entities.chapters_save') }}</button>
|
||||
</div>
|
||||
|
@ -27,7 +27,7 @@
|
||||
|
||||
<div class="form-group text-right">
|
||||
<a href="{{ $chapter->getUrl() }}" class="button outline">{{ trans('common.cancel') }}</a>
|
||||
<button type="submit" class="button primary">{{ trans('entities.chapters_move') }}</button>
|
||||
<button type="submit" class="button">{{ trans('entities.chapters_move') }}</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
@ -61,7 +61,7 @@
|
||||
</div>
|
||||
<div class="form-group text-right">
|
||||
<button type="button" class="button outline" action="closeUpdateForm">{{ trans('common.cancel') }}</button>
|
||||
<button type="submit" class="button primary">{{ trans('entities.comment_save') }}</button>
|
||||
<button type="submit" class="button">{{ trans('entities.comment_save') }}</button>
|
||||
</div>
|
||||
<div class="form-group loading" style="display: none;">
|
||||
@include('partials.loading-icon', ['text' => trans('entities.comment_saving')])
|
||||
|
@ -19,7 +19,7 @@
|
||||
<div class="form-group text-right">
|
||||
<button type="button" class="button outline"
|
||||
action="hideForm">{{ trans('common.cancel') }}</button>
|
||||
<button type="submit" class="button primary">{{ trans('entities.comment_save') }}</button>
|
||||
<button type="submit" class="button">{{ trans('entities.comment_save') }}</button>
|
||||
</div>
|
||||
<div class="form-group loading" style="display: none;">
|
||||
@include('partials.loading-icon', ['text' => trans('entities.comment_saving')])
|
||||
|
@ -43,7 +43,7 @@
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<button type="button" class="button primary" @click="save()">{{ trans('components.code_save') }}</button>
|
||||
<button type="button" class="button" @click="save()">{{ trans('components.code_save') }}</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
@ -7,7 +7,7 @@
|
||||
</div>
|
||||
@include('components.entity-selector', ['name' => 'entity-selector'])
|
||||
<div class="popup-footer">
|
||||
<button type="button" disabled="true" class="button entity-link-selector-confirm primary corner-button">{{ trans('common.select') }}</button>
|
||||
<button type="button" disabled="true" class="button entity-link-selector-confirm corner-button">{{ trans('common.select') }}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -72,7 +72,7 @@
|
||||
<button type="button" class="button icon outline" @click="deleteImage">@icon('delete')</button>
|
||||
|
||||
</div>
|
||||
<button class="button primary anim fadeIn float right" v-show="selectedImage" @click="callbackAndHide(selectedImage)">
|
||||
<button class="button anim fadeIn float right" v-show="selectedImage" @click="callbackAndHide(selectedImage)">
|
||||
{{ trans('components.image_select_image') }}
|
||||
</button>
|
||||
<div class="clearfix"></div>
|
||||
|
@ -37,6 +37,6 @@
|
||||
|
||||
<div class="text-right">
|
||||
<a href="{{ $model->getUrl() }}" class="button outline">{{ trans('common.cancel') }}</a>
|
||||
<button type="submit" class="button primary">{{ trans('entities.permissions_save') }}</button>
|
||||
<button type="submit" class="button">{{ trans('entities.permissions_save') }}</button>
|
||||
</div>
|
||||
</form>
|
@ -57,7 +57,7 @@
|
||||
<input type="text" placeholder="{{ trans('entities.attachments_link_url_hint') }}" v-model="file.link">
|
||||
<p class="small text-neg" v-for="error in errors.link.link" v-text="error"></p>
|
||||
</div>
|
||||
<button @click.prevent="attachNewLink(file)" class="button primary">{{ trans('entities.attach') }}</button>
|
||||
<button @click.prevent="attachNewLink(file)" class="button">{{ trans('entities.attach') }}</button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
@ -92,7 +92,7 @@
|
||||
</div>
|
||||
|
||||
<button type="button" class="button outline" @click="cancelEdit">{{ trans('common.back') }}</button>
|
||||
<button @click.enter.prevent="updateFile(fileToEdit)" class="button primary">{{ trans('common.save') }}</button>
|
||||
<button @click.enter.prevent="updateFile(fileToEdit)" class="button">{{ trans('common.save') }}</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
@ -39,7 +39,7 @@
|
||||
|
||||
<div class="form-group text-right">
|
||||
<a href="{{ $page->getUrl() }}" class="button outline">{{ trans('common.cancel') }}</a>
|
||||
<button type="submit" class="button primary">{{ trans('entities.pages_copy') }}</button>
|
||||
<button type="submit" class="button">{{ trans('entities.pages_copy') }}</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
@ -34,7 +34,7 @@
|
||||
<input type="hidden" name="_method" value="DELETE">
|
||||
<div class="form-group text-right">
|
||||
<a href="{{ $page->getUrl() }}" class="button outline">{{ trans('common.cancel') }}</a>
|
||||
<button type="submit" class="button primary">{{ trans('common.confirm') }}</button>
|
||||
<button type="submit" class="button">{{ trans('common.confirm') }}</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
@ -27,7 +27,7 @@
|
||||
|
||||
<div class="form-group text-right">
|
||||
<a href="{{ $parent->getUrl() }}" class="button outline">{{ trans('common.cancel') }}</a>
|
||||
<button type="submit" class="button primary">{{ trans('common.continue') }}</button>
|
||||
<button type="submit" class="button">{{ trans('common.continue') }}</button>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
|
@ -27,7 +27,7 @@
|
||||
|
||||
<div class="form-group text-right">
|
||||
<a href="{{ $page->getUrl() }}" class="button outline">{{ trans('common.cancel') }}</a>
|
||||
<button type="submit" class="button primary">{{ trans('entities.pages_move') }}</button>
|
||||
<button type="submit" class="button">{{ trans('entities.pages_move') }}</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
@ -1,24 +1,6 @@
|
||||
<style id="custom-styles" data-color="{{ setting('app-color') }}" data-color-light="{{ setting('app-color-light') }}">
|
||||
.primary-background {
|
||||
background-color: {{ setting('app-color') }} !important;
|
||||
}
|
||||
.primary-background-light {
|
||||
background-color: {{ setting('app-color-light') }};
|
||||
}
|
||||
.button.primary, .button.primary:hover, .button.primary:active, .button.primary:focus {
|
||||
background-color: {{ setting('app-color') }};
|
||||
border-color: {{ setting('app-color') }};
|
||||
}
|
||||
.nav-tabs a.selected, .nav-tabs .tab-item.selected {
|
||||
border-bottom-color: {{ setting('app-color') }};
|
||||
}
|
||||
.text-primary, .text-primary-hover:hover, .text-primary:hover {
|
||||
color: {{ setting('app-color') }} !important;
|
||||
fill: {{ setting('app-color') }} !important;
|
||||
}
|
||||
|
||||
a, a:hover, a:focus, .text-button, .text-button:hover, .text-button:focus {
|
||||
color: {{ setting('app-color') }};
|
||||
fill: {{ setting('app-color') }};
|
||||
:root {
|
||||
--color-primary: {{ setting('app-color') }};
|
||||
--color-primary-light: {{ setting('app-color-light') }};
|
||||
}
|
||||
</style>
|
||||
|
@ -182,7 +182,7 @@
|
||||
</table>
|
||||
|
||||
|
||||
<button type="submit" class="button primary">{{ trans('entities.search_update') }}</button>
|
||||
<button type="submit" class="button">{{ trans('entities.search_update') }}</button>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
|
@ -72,7 +72,7 @@
|
||||
</div>
|
||||
|
||||
<div class="form-group text-right">
|
||||
<button type="submit" class="button primary">{{ trans('settings.settings_save') }}</button>
|
||||
<button type="submit" class="button">{{ trans('settings.settings_save') }}</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
@ -135,7 +135,7 @@
|
||||
<p class="small">{!! trans('settings.app_primary_color_desc') !!}</p>
|
||||
</div>
|
||||
<div setting-app-color-picker class="text-m-right">
|
||||
<input type="color" value="{{ setting('app-color') }}" name="setting-app-color" id="setting-app-color" placeholder="#0288D1">
|
||||
<input type="color" value="{{ setting('app-color') }}" name="setting-app-color" id="setting-app-color" placeholder="#1d75b6">
|
||||
<input type="hidden" value="{{ setting('app-color-light') }}" name="setting-app-color-light" id="setting-app-color-light">
|
||||
<br>
|
||||
<button type="button" class="text-button text-muted mt-s mx-s" setting-app-color-picker-reset>{{ trans('common.reset') }}</button>
|
||||
@ -173,7 +173,7 @@
|
||||
</div>
|
||||
|
||||
<div class="form-group text-right">
|
||||
<button type="submit" class="button primary">{{ trans('settings.settings_save') }}</button>
|
||||
<button type="submit" class="button">{{ trans('settings.settings_save') }}</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
@ -236,7 +236,7 @@
|
||||
</div>
|
||||
|
||||
<div class="form-group text-right">
|
||||
<button type="submit" class="button primary">{{ trans('settings.settings_save') }}</button>
|
||||
<button type="submit" class="button">{{ trans('settings.settings_save') }}</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
@ -32,7 +32,7 @@
|
||||
<div>
|
||||
<div class="form-group text-right">
|
||||
<a href="{{ url("/settings/roles/{$role->id}") }}" class="button outline">{{ trans('common.cancel') }}</a>
|
||||
<button type="submit" class="button primary">{{ trans('common.confirm') }}</button>
|
||||
<button type="submit" class="button">{{ trans('common.confirm') }}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -224,7 +224,7 @@
|
||||
@if (isset($role) && $role->id)
|
||||
<a href="{{ url("/settings/roles/delete/{$role->id}") }}" class="button outline">{{ trans('settings.role_delete') }}</a>
|
||||
@endif
|
||||
<button type="submit" class="button primary">{{ trans('settings.role_save') }}</button>
|
||||
<button type="submit" class="button">{{ trans('settings.role_save') }}</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
@ -66,5 +66,5 @@
|
||||
|
||||
<div class="form-group text-right">
|
||||
<a href="{{ isset($shelf) ? $shelf->getUrl() : url('/shelves') }}" class="button outline">{{ trans('common.cancel') }}</a>
|
||||
<button type="submit" class="button primary">{{ trans('entities.shelves_save') }}</button>
|
||||
<button type="submit" class="button">{{ trans('entities.shelves_save') }}</button>
|
||||
</div>
|
@ -20,7 +20,7 @@
|
||||
|
||||
<div class="form-group text-right">
|
||||
<a href="{{ url($currentUser->can('users-manage') ? "/settings/users" : "/") }}" class="button outline">{{ trans('common.cancel') }}</a>
|
||||
<button class="button primary" type="submit">{{ trans('common.save') }}</button>
|
||||
<button class="button" type="submit">{{ trans('common.save') }}</button>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
|
@ -20,7 +20,7 @@
|
||||
|
||||
<input type="hidden" name="_method" value="DELETE">
|
||||
<a href="{{ url("/settings/users/{$user->id}") }}" class="button outline">{{ trans('common.cancel') }}</a>
|
||||
<button type="submit" class="button primary">{{ trans('common.confirm') }}</button>
|
||||
<button type="submit" class="button">{{ trans('common.confirm') }}</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -58,7 +58,7 @@
|
||||
@if($authMethod !== 'system')
|
||||
<a href="{{ url("/settings/users/{$user->id}/delete") }}" class="button outline">{{ trans('settings.users_delete') }}</a>
|
||||
@endif
|
||||
<button class="button primary" type="submit">{{ trans('common.save') }}</button>
|
||||
<button class="button" type="submit">{{ trans('common.save') }}</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
Reference in New Issue
Block a user