kadet/czydojade
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

add proper style for primary button

Browse Source
This commit is contained in:
Kacper Donat 2020-10-19 23:11:37 +02:00
parent 2a96c5a863
commit 4647bb2cc1
6 changed files with 31 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
resources/components/favourites/save.html
View File

@ -5,9 +5,6 @@
<input class="form-control form-control-sm" placeholder="np. Z pracy" <input class="form-control form-control-sm" placeholder="np. Z pracy"
:class="{ 'is-invalid': errors.name.length > 0 }" id="favourite_add_name" :class="{ 'is-invalid': errors.name.length > 0 }" id="favourite_add_name"
v-model="name" v-autofocus/> v-model="name" v-autofocus/>
<button class="btn btn-sm btn-dark" type="submit">
<ui-icon icon="add" />
</button>
<div v-if="errors.name.length > 0" class="invalid-feedback"> <div v-if="errors.name.length > 0" class="invalid-feedback">
<p v-for="error in errors.name">{{ error }}</p> <p v-for="error in errors.name">{{ error }}</p>
</div> </div>
@ -18,4 +15,10 @@
<stop :stop="stop"/> <stop :stop="stop"/>
</li> </li>
</ul> </ul>
<div class="favourite-add-form__actions">
<button class="btn btn-sm btn-primary" type="submit">
<ui-icon icon="add" />
zapisz
</button>
</div>
</form> </form>

12
resources/components/ui/dialog.html
View File

@ -1,9 +1,9 @@
<div class="ui-backdrop" @click="handleBackdropClick" v-if="currentBehaviour === 'modal'"> <div class="ui-backdrop" @click="handleBackdropClick" v-if="currentBehaviour === 'modal'" role="dialog">
<div class="ui-modal" v-bind="attrs" v-on="$listeners"> <div class="ui-modal" v-bind="attrs" v-on="$listeners">
<div class="ui-modal__top-bar"> <div class="ui-modal__top-bar">
<div class="ui-modal__header"> <div class="ui-modal__header">
<slot name="header"> <slot name="header">
<div class="ui-modal__title"><slot name="title">{{ title }}</slot></div> <div class="ui-modal__title" role="heading"><slot name="title">{{ title }}</slot></div>
</slot> </slot>
</div> </div>
<button class="btn btn-action ui-modal__close" @click.prevent="handleCloseClick"> <button class="btn btn-action ui-modal__close" @click.prevent="handleCloseClick">
@ -16,10 +16,12 @@
</div> </div>
</div> </div>
</div> </div>
<div :class="[ 'ui-popup', arrow && 'ui-popup--arrow' ]" v-bind="attrs" :style="{ zIndex: zIndex }" v-on="$listeners" v-else> <div :class="[ 'ui-popup', arrow && 'ui-popup--arrow' ]" v-bind="attrs" :style="{ zIndex: zIndex }" v-on="$listeners" role="dialog" v-else>
<div class="ui-popup__arrow" ref="arrow" v-if="arrow"></div> <div class="ui-popup__arrow" ref="arrow" v-if="arrow"></div>
<div class="ui-popup__header" v-if="hasHeader"> <div class="ui-popup__header" v-if="hasHeader || title">
<slot name="header" /> <slot name="header">
<div class="ui-popup__heading" role="heading"><slot name="title">{{ title }}</slot></div>
</slot>
</div> </div>
<slot /> <slot />
<div class="ui-popup__footer" v-if="hasFooter"> <div class="ui-popup__footer" v-if="hasFooter">

11
resources/styles/_controls.scss
View File

@ -13,9 +13,20 @@
} }
} }
border-radius: 1.5px;
display: inline-block; display: inline-block;
&.btn-outline-action { &.btn-outline-action {
@extend .btn-outline-dark; @extend .btn-outline-dark;
} }
&.btn-primary {
background: $primary-gradient;
border-color: transparent;
&:hover {
border: 1px $primary solid;
}
}
} }

3
resources/styles/main.scss
View File

@ -1,4 +1,4 @@
$border-radius: 0; $border-radius: 0;
$border-radius-lg: $border-radius; $border-radius-lg: $border-radius;
$border-radius-sm: $border-radius; $border-radius-sm: $border-radius;
@ -7,6 +7,7 @@ $border-radius-sm: $border-radius;
@import "~bootstrap/scss/variables"; @import "~bootstrap/scss/variables";
$primary: #005ea8; $primary: #005ea8;
$primary-gradient: linear-gradient(120deg, #0083c5 10%, #005ea8 90%);
$custom-control-indicator-checked-bg: $dark; $custom-control-indicator-checked-bg: $dark;
$custom-control-indicator-active-bg: $dark; $custom-control-indicator-active-bg: $dark;

4
resources/styles/ui/_popup.scss
View File

@ -84,6 +84,10 @@
padding: 0; padding: 0;
} }
*.ui-popup__header {
margin-bottom: 0.5rem;
}
.ui-popup__heading { .ui-popup__heading {
font-size: $font-size-sm; font-size: $font-size-sm;
font-weight: bold; font-weight: bold;

2
templates/app.html.twig
View File

@ -105,7 +105,7 @@
</button> </button>
</div> </div>
<ui-dialog reference="save" v-if="visibility.save" arrow placement="bottom-end" @leave="visibility.save = false"> <ui-dialog reference="save" v-if="visibility.save" arrow placement="bottom-end" @leave="visibility.save = false" title="Dodaj do ulubionych">
<favourites-adder @saved="visibility.save = false"/> <favourites-adder @saved="visibility.save = false"/>
</ui-dialog> </ui-dialog>
</section> </section>