More adjustments on Ref. 87. Adds function to get repository name.

This commit is contained in:
Mateus Machado Luna 2018-07-27 14:44:05 -03:00
parent f88f7e2b4a
commit baed66b2e5
10 changed files with 110 additions and 20 deletions

View File

@ -180,6 +180,7 @@ class Admin {
'admin_url' => admin_url(), 'admin_url' => admin_url(),
'custom_header_support' => get_theme_support('custom-header'), 'custom_header_support' => get_theme_support('custom-header'),
'registered_view_modes' => \Tainacan\Theme_Helper::get_instance()->get_registered_view_modes(), 'registered_view_modes' => \Tainacan\Theme_Helper::get_instance()->get_registered_view_modes(),
'repository_name' => get_bloginfo('name')
]; ];
$maps = [ $maps = [

View File

@ -37,9 +37,9 @@
tag="a" tag="a"
to="/metadata" to="/metadata"
:class="activeRoute == 'MetadataPage' ? 'is-active':''"> :class="activeRoute == 'MetadataPage' ? 'is-active':''">
<b-icon <span class="icon">
size="is-small" <i class="mdi mdi-format-list-bulleted-type"/>
icon="format-list-bulleted-type"/> </span>
<span class="menu-text">{{ $i18n.getFrom('metadata', 'name') }}</span> <span class="menu-text">{{ $i18n.getFrom('metadata', 'name') }}</span>
</router-link> </router-link>
</li> </li>
@ -48,9 +48,9 @@
tag="a" tag="a"
to="/filters" to="/filters"
:class="activeRoute == 'FiltersPage' ? 'is-active':''"> :class="activeRoute == 'FiltersPage' ? 'is-active':''">
<b-icon <span class="icon">
size="is-small" <i class="mdi mdi-filter"/>
icon="filter"/> </span>
<span class="menu-text">{{ $i18n.getFrom('filters', 'name') }}</span> <span class="menu-text">{{ $i18n.getFrom('filters', 'name') }}</span>
</router-link> </router-link>
</li> </li>
@ -59,9 +59,7 @@
tag="a" tag="a"
to="/taxonomies" to="/taxonomies"
:class="activeRoute == 'Page' ? 'is-active':''"> :class="activeRoute == 'Page' ? 'is-active':''">
<b-icon <taxonomies-icon />
size="is-small"
icon="shape"/>
<span class="menu-text">{{ $i18n.getFrom('taxonomies', 'name') }}</span> <span class="menu-text">{{ $i18n.getFrom('taxonomies', 'name') }}</span>
</router-link> </router-link>
</li> </li>
@ -81,6 +79,8 @@
<script> <script>
import ActivitiesIcon from '../other/activities-icon.vue'; import ActivitiesIcon from '../other/activities-icon.vue';
import TaxonomiesIcon from '../other/taxonomies-icon.vue';
export default { export default {
name: 'PrimaryMenu', name: 'PrimaryMenu',
props: { props: {
@ -88,7 +88,8 @@ export default {
activeRoute: '/collections' activeRoute: '/collections'
}, },
components: { components: {
ActivitiesIcon ActivitiesIcon,
TaxonomiesIcon
}, },
} }
</script> </script>
@ -144,6 +145,18 @@ export default {
.activities-icon { .activities-icon {
fill: white; fill: white;
margin-bottom: -4px;
}
.taxonomies-icon {
fill: white;
margin-bottom: -2px;
}
.icon {
height: auto;
width: auto;
i {
font-size: 18px !important;
}
} }
} }

View File

@ -293,6 +293,7 @@ export default {
li{ li{
margin-right: 0px; margin-right: 0px;
transition: background-color 0.2s ease;
// transition: max-width 0.4s ease-in , width 0.4s ease-in ; // transition: max-width 0.4s ease-in , width 0.4s ease-in ;
// -webkit-transition: max-width 0.4s ease-in, width 0.4s ease-in ; // -webkit-transition: max-width 0.4s ease-in, width 0.4s ease-in ;
// overflow: hidden; // overflow: hidden;
@ -302,10 +303,12 @@ export default {
background-color: $turquoise4; background-color: $turquoise4;
a { a {
background-color: $turquoise4; background-color: $turquoise4;
transition: background-color 0.2s ease;
color: white; color: white;
text-decoration: none; text-decoration: none;
} }
svg.activities-icon { svg.activities-icon {
transition: fill 0.2s ease;
fill: white !important; fill: white !important;
} }
} }
@ -335,11 +338,13 @@ export default {
color: $gray4; color: $gray4;
text-align: center; text-align: center;
white-space: nowrap; white-space: nowrap;
padding: 1.0em 10px; padding: 10px;
min-width: 50px; min-width: 50px;
line-height: 22px; line-height: 22px;
border-radius: 0px; border-radius: 0px;
position: relative; position: relative;
align-items: center;
display: flex;
} }
a:focus{ a:focus{
box-shadow: none; box-shadow: none;
@ -347,12 +352,12 @@ export default {
.icon { .icon {
margin: 0; margin: 0;
padding: 0; padding: 0;
i { i {
font-size: 19px !important; font-size: 19px !important;
} }
} }
.menu-text { .menu-text {
margin-left: 8px;
font-size: 14px; font-size: 14px;
display: inline-flex; display: inline-flex;
// width: 0px; // width: 0px;

View File

@ -3,7 +3,7 @@
id="tainacan-repository-subheader" id="tainacan-repository-subheader"
class="level secondary-page" class="level secondary-page"
:class="{'is-menu-compressed': isMenuCompressed, 'is-repository-level' : isRepositoryLevel}"> :class="{'is-menu-compressed': isMenuCompressed, 'is-repository-level' : isRepositoryLevel}">
<h1 v-if="isRepositoryLevel">Nome do Site</h1> <h1 v-if="isRepositoryLevel">{{ repositoryName }}</h1>
<h1 v-else>{{ $i18n.get('collection') + '' }} <span class="has-text-weight-bold">{{ collectionName }}</span></h1> <h1 v-else>{{ $i18n.get('collection') + '' }} <span class="has-text-weight-bold">{{ collectionName }}</span></h1>
</div> </div>
</template> </template>
@ -13,6 +13,11 @@ import { mapActions, mapGetters } from 'vuex';
export default { export default {
name: 'TainacanRepositorySubheader', name: 'TainacanRepositorySubheader',
data() {
return {
repositoryName: tainacan_plugin.repository_name
}
},
props: { props: {
isMenuCompressed: false, isMenuCompressed: false,
isRepositoryLevel: true isRepositoryLevel: true

View File

@ -4,8 +4,8 @@
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
x="0px" x="0px"
y="0px" y="0px"
width="22" width="20"
height="22" height="20"
viewBox="0 0 24 24" viewBox="0 0 24 24"
class="activities-icon" class="activities-icon"
xml:space="preserve"> xml:space="preserve">
@ -25,7 +25,6 @@ export default {
<style type="text/scss"> <style type="text/scss">
svg.activities-icon { svg.activities-icon {
margin-bottom: -5px;
fill: #898d8f; fill: #898d8f;
} }

View File

@ -192,7 +192,7 @@ export default {
} }
.processes-popup{ .processes-popup{
background-color: $turquoise2; background-color: $blue2;
width: 320px; width: 320px;
max-width: 100%; max-width: 100%;
position: absolute; position: absolute;
@ -220,6 +220,7 @@ export default {
} }
.popup-footer { .popup-footer {
padding: 4px 12px 6px 10px; padding: 4px 12px 6px 10px;
min-height: 29px;
.footer-title { .footer-title {
margin-right: auto; margin-right: auto;
font-size: 0.625rem; font-size: 0.625rem;
@ -244,7 +245,7 @@ export default {
} }
li:hover { li:hover {
background-color: $gray2; background-color: $gray1;
.action-icon{ .action-icon{
visibility: visible; visibility: visible;
@ -318,7 +319,7 @@ export default {
border-style: solid; border-style: solid;
} }
&:before { &:before {
border-color: transparent transparent $turquoise2 transparent; border-color: transparent transparent $blue2 transparent;
border-right-width: 8px; border-right-width: 8px;
border-bottom-width: 8px; border-bottom-width: 8px;
border-left-width: 8px; border-left-width: 8px;

View File

@ -0,0 +1,29 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
height="16"
width="16"
xml:space="preserve"
viewBox="0 0 20 20"
y="0px"
x="0px"
class="taxonomies-icon">
<path
d="M 0,0 H 9 V 9 H 0 V 0 M 15.5,0 C 18,0 20,2 20,4.5 20,7 18,9 15.5,9 13,9 11,7 11,4.5 11,2 13,0 15.5,0 M 4.5,12 9,20 H 0 L 4.5,12 M 17,15 h 3 v 2 h -3 v 3 h -2 v -3 h -3 v -2 h 3 v -3 h 2 z"
/>
</svg>
</template>
<script>
export default {
name: 'TaxonomiesIcon'
}
</script>
<style type="text/scss">
svg.taxonomies-icon {
fill: #898d8f;
}
</style>

View File

@ -28,7 +28,7 @@
label { margin-bottom: 0; } label { margin-bottom: 0; }
&.control { font-size: 13px !important; } &.control { font-size: 13px !important; }
.b-checkbox { width: 100% }; .b-checkbox { width: 100% };
&:hover { background-color: $turquoise1; } &:hover { background-color: $gray1; }
.is-small { color: $gray4; } .is-small { color: $gray4; }
&.is-active { background-color: $turquoise2; } &.is-active { background-color: $turquoise2; }
} }

View File

@ -211,3 +211,4 @@
} }
} }
} }

View File

@ -75,9 +75,11 @@ a:hover {
.is-primary, .is-primary:hover, .is-primary:focus { .is-primary, .is-primary:hover, .is-primary:focus {
background-color: $blue4 !important; background-color: $blue4 !important;
color: white !important;
} }
.is-secondary, .is-secondary:hover, .is-secondary:focus { .is-secondary, .is-secondary:hover, .is-secondary:focus {
background-color: $blue5 !important; background-color: $blue5 !important;
color: white !important;
} }
.has-text-primary, .has-text-primary:hover, .is-has-text-primary:focus { .has-text-primary, .has-text-primary:hover, .is-has-text-primary:focus {
color: $blue4 !important; color: $blue4 !important;
@ -99,6 +101,40 @@ a:hover {
background-color: $gray1 !important; background-color: $gray1 !important;
} }
} }
.tainacan-table {
tr.selected-row {
background-color: $blue1 !important;
.checkbox-cell .checkbox, .actions-cell .actions-container {
background-color: $blue2 !important;
}
}
}
.dropdown-trigger {
.button .icon {
color: $blue5;
}
}
.dropdown-menu .dropdown-content {
.dropdown-item.is-active { background-color: $blue2; }
}
.switch {
&:hover input[type="checkbox"]:checked + .check {
background-color: $blue2;
}
input[type="checkbox"]:checked + .check {
border: 2px solid $blue5;
&::before {
background-color: $blue5;
}
}
&.is-small {
input[type="checkbox"]:checked + .check {
border: 1.5px solid $blue5;
}
}
}
} }
// Generic page container // Generic page container
.page-container { .page-container {