tmdinosaurcenter
/
tainacan
mirror of https://github.com/tainacan/tainacan
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

More css tweaks. Fixes to help button position after recent changes.

This commit is contained in:
mateuswetah 2018-05-09 13:01:33 -03:00
parent 6833a282bb
commit 090aacae9a
8 changed files with 66 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/admin/components/edition/collection-edition-form.vue
View File

@ -648,6 +648,9 @@ export default {
.tainacan-form>.columns>.column { .tainacan-form>.columns>.column {
overflow: auto; overflow: auto;
.field {
position: relative;
}
} }
.thumbnail-field { .thumbnail-field {
max-height: 128px; max-height: 128px;

20
src/admin/components/edition/field-edition-form.vue
View File

@ -139,10 +139,10 @@
false-value="no" false-value="no"
name="required"> name="required">
{{ $i18n.get('label_required') }} {{ $i18n.get('label_required') }}
<help-button
:title="$i18n.getHelperTitle('fields', 'required')"
:message="$i18n.getHelperMessage('fields', 'required')"/>
</b-checkbox> </b-checkbox>
<help-button
:title="$i18n.getHelperTitle('fields', 'required')"
:message="$i18n.getHelperMessage('fields', 'required')"/>
</b-field> </b-field>
<b-field <b-field
@ -156,10 +156,10 @@
false-value="no" false-value="no"
name="multiple"> name="multiple">
{{ $i18n.get('label_allow_multiple') }} {{ $i18n.get('label_allow_multiple') }}
</b-checkbox> <help-button
<help-button :title="$i18n.getHelperTitle('fields', 'multiple')"
:title="$i18n.getHelperTitle('fields', 'multiple')" :message="$i18n.getHelperMessage('fields', 'multiple')"/>
:message="$i18n.getHelperMessage('fields', 'multiple')"/> </b-checkbox>
</b-field> </b-field>
<b-field <b-field
@ -173,10 +173,10 @@
false-value="no" false-value="no"
name="collecion_key"> name="collecion_key">
{{ $i18n.get('label_unique_value') }} {{ $i18n.get('label_unique_value') }}
<help-button
:title="$i18n.getHelperTitle('fields', 'unique')"
:message="$i18n.getHelperMessage('fields', 'unique')"/>
</b-checkbox> </b-checkbox>
<help-button
:title="$i18n.getHelperTitle('fields', 'unique')"
:message="$i18n.getHelperMessage('fields', 'unique')"/>
</b-field> </b-field>
</b-field> </b-field>

58
src/admin/components/edition/item-edition-form.vue
View File

@ -9,12 +9,14 @@
<div class="column is-4"> <div class="column is-4">
<!-- Status -------------------------------- --> <!-- Status -------------------------------- -->
<label class="section-label">{{ $i18n.get('label_status') }}</label> <div class="section-label">
<span class="required-field-asterisk">*</span> <label>{{ $i18n.get('label_status') }}</label>
<help-button <span class="required-field-asterisk">*</span>
:title="$i18n.getHelperTitle('items', 'status')" <help-button
:message="$i18n.getHelperMessage('items', 'status')"/> :title="$i18n.getHelperTitle('items', 'status')"
<div class="document-box"> :message="$i18n.getHelperMessage('items', 'status')"/>
</div>
<div class="section-box">
<div class="field"> <div class="field">
<b-select <b-select
v-model="form.status" v-model="form.status"
@ -47,11 +49,13 @@
</div> </div>
<!-- Document -------------------------------- --> <!-- Document -------------------------------- -->
<label class="section-label">{{ form.document != undefined && form.document != null && form.document != '' ? $i18n.get('label_document') : $i18n.get('label_document_empty') }}</label> <div class="section-label">
<help-button <label>{{ form.document != undefined && form.document != null && form.document != '' ? $i18n.get('label_document') : $i18n.get('label_document_empty') }}</label>
:title="$i18n.getHelperTitle('items', 'document')" <help-button
:message="$i18n.getHelperMessage('items', 'document')"/> :title="$i18n.getHelperTitle('items', 'document')"
<div class="document-box"> :message="$i18n.getHelperMessage('items', 'document')"/>
</div>
<div class="section-box">
<div <div
v-if="form.document != undefined && form.document != null && v-if="form.document != undefined && form.document != null &&
form.document_type != undefined && form.document_type != null && form.document_type != undefined && form.document_type != null &&
@ -196,11 +200,14 @@
</b-modal> </b-modal>
<!-- Thumbnail -------------------------------- --> <!-- Thumbnail -------------------------------- -->
<label class="section-label">{{ $i18n.get('label_thumbnail') }}</label> <div class="section-label">
<help-button <label>{{ $i18n.get('label_thumbnail') }}</label>
:title="$i18n.getHelperTitle('items', '_thumbnail_id')" <help-button
:message="$i18n.getHelperMessage('items', '_thumbnail_id')"/> :title="$i18n.getHelperTitle('items', '_thumbnail_id')"
<div class="document-box"> :message="$i18n.getHelperMessage('items', '_thumbnail_id')"/>
</div>
<div class="section-box">
<div class="thumbnail-field"> <div class="thumbnail-field">
<a <a
class="button is-rounred is-secondary" class="button is-rounred is-secondary"
@ -230,8 +237,10 @@
</div> </div>
<!-- Attachments ------------------------------------------ --> <!-- Attachments ------------------------------------------ -->
<label class="section-label">{{ $i18n.get('label_attachments') }}</label> <div class="section-label">
<div class="document-box"> <label>{{ $i18n.get('label_attachments') }}</label>
</div>
<div class="section-box">
<button <button
class="button is-secondary" class="button is-secondary"
@click.prevent="attachmentMediaFrame.openFrame($event)"> @click.prevent="attachmentMediaFrame.openFrame($event)">
@ -643,10 +652,13 @@ export default {
} }
.section-label { .section-label {
font-size: 16px !important; position: relative;
font-weight: 500 !important; label {
color: $tertiary !important; font-size: 16px !important;
line-height: 1.2em; font-weight: 500 !important;
color: $tertiary !important;
line-height: 1.2em;
}
} }
.collapse-all { .collapse-all {
@ -654,7 +666,7 @@ export default {
.icon { vertical-align: bottom; } .icon { vertical-align: bottom; }
} }
.document-box { .section-box {
border: 1px solid $draggable-border-color; border: 1px solid $draggable-border-color;
padding: 30px; padding: 30px;
margin-top: 16px; margin-top: 16px;

3
src/admin/components/lists/fields-list.vue
View File

@ -375,6 +375,7 @@ export default {
display: block; display: block;
position: relative; position: relative;
cursor: grab; cursor: grab;
opacity: 1 !important;
.handle { .handle {
padding-right: 6em; padding-right: 6em;
@ -432,7 +433,7 @@ export default {
cursor: default; cursor: default;
.field-name { .field-name {
color: $primary; color: $secondary;
} }
.handle .label-details, .handle .icon { .handle .label-details, .handle .icon {
color: $gray !important; color: $gray !important;

2
src/admin/components/lists/filters-list.vue
View File

@ -563,7 +563,7 @@ export default {
cursor: default; cursor: default;
.field-name { .field-name {
color: $primary; color: $secondary;
} }
.handle .label-details, .handle .icon { .handle .label-details, .handle .icon {
color: $gray !important; color: $gray !important;

13
src/admin/components/other/help-button.vue
View File

@ -65,19 +65,14 @@ export default {
h5 { h5 {
font-size: 14px; font-size: 14px;
font-weight: 700; font-weight: bold;
margin-right: 25px;
}
.icon {
right: 12px;
top: 12px;
position: absolute;
} }
} }
.help-tooltip-body { .help-tooltip-body {
padding: 1.2em; padding: 0.8em 1.0em 1.0em 1.0em;
font-size: 14px; font-size: 11px;
font-weight: normal;
} }
&:before { &:before {

13
src/admin/scss/tainacan-admin.scss
View File

@ -156,7 +156,7 @@ a:hover {
} }
} }
.label { .label {
font-weight: normal; font-weight: bold;
font-size: 14px; font-size: 14px;
display: inline-block; display: inline-block;
} }
@ -180,7 +180,7 @@ a:hover {
} }
&:focus, &:active { &:focus, &:active {
box-shadow: none; box-shadow: none !important;
background-color: white; background-color: white;
border: 1px solid $tainacan-input-background; border: 1px solid $tainacan-input-background;
} }
@ -582,12 +582,13 @@ a:hover {
color: $gray-light; color: $gray-light;
} }
.mdi-chevron-left::before { .mdi-chevron-left::before {
content: "\F4AE"; content: "\F40A";
font-size: 20px; font-size: 17px;
transform: rotate(180deg);
} }
.mdi-chevron-right::before { .mdi-chevron-right::before {
content: "\F4AD"; content: "\F40A";
font-size: 20px; font-size: 17px;
} }
} }
} }

7
src/classes/field-types/tainacan-form-item.vue
View File

@ -15,10 +15,10 @@
class="required-field-asterisk" class="required-field-asterisk"
:class="fieldTypeMessage">*</span> :class="fieldTypeMessage">*</span>
<span class="field-type">({{ $i18n.get(field.field.field_type_object.component) }})</span> <span class="field-type">({{ $i18n.get(field.field.field_type_object.component) }})</span>
<help-button
:title="field.field.name"
:message="field.field.description"/>
</span> </span>
<help-button
:title="field.field.name"
:message="field.field.description"/>
<div <div
v-show="isCollapsed" v-show="isCollapsed"
v-if="isTextInputComponent( field.field.field_type_object.component )"> v-if="isTextInputComponent( field.field.field_type_object.component )">
@ -170,6 +170,7 @@
} }
.collapse-handle { .collapse-handle {
cursor: pointer; cursor: pointer;
position: relative;
} }
} }
</style> </style>