Chill-project/chill-bundles
6
0
Fork 0
mirror of https://gitlab.com/Chill-Projet/chill-bundles.git synced 2025-06-07 18:44:08 +00:00
Code Issues Actions Projects Releases Wiki Activity

fix position of toggle button

Browse Source 
so it doesn't cover content or falls outside box
This commit is contained in:
Julie Lenaerts 2022-03-02 19:11:34 +01:00
parent 9a0883eb5f
commit abe183fd10
7 changed files with 43 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
src/Bundle/ChillMainBundle/Resources/public/module/blur/blur.scss
View File

@ -1,16 +1,39 @@
.confidential{
.confidential {
display: flex;
position: relative;
}
.toggle-far-twig {
i {
bottom: 0px;
right: -30px;
}
}
.toggle-close-twig {
i {
bottom: 0px;
right: -5px;
}
}
.toggle{
margin-left: 30px;
margin-top: 5px;
cursor: pointer;
position: absolute;
bottom: 0px;
right: 10px;
z-index: 5;
right: -30px
}
.toggle-far {
bottom: 0px;
right: 20px !important;
}
.toggle-close {
bottom: 125px;
right: 15px !important;
}
.blur {
-webkit-filter: blur(5px);
-moz-filter: blur(5px);

10
src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/Confidential.vue
View File

@ -4,7 +4,7 @@
<slot name="confidential-content"></slot>
</div>
<div>
<i class="fa fa-eye toggle" aria-hidden="true" @click="toggleBlur"></i>
<i class="fa fa-eye toggle" :class="positionBtn" aria-hidden="true" @click="toggleBlur"></i>
</div>
</div>
</template>
@ -12,6 +12,7 @@
<script>
export default {
name: "Confidential",
props: ['positionBtnFar'],
data() {
return {
isBlurred: true,
@ -19,9 +20,14 @@ export default {
},
methods : {
toggleBlur() {
console.log('toggle blur');
console.log(this.positionBtnFar);
this.isBlurred = !this.isBlurred;
},
},
computed: {
positionBtn() {
return this.positionBtnFar ? 'toggle-far' : 'toggle-close'
}
}
}
</script>

2
src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/Entity/AddressRenderBox.vue
View File

@ -5,7 +5,7 @@
<component :is="component" class="address" :class="multiline">
<div v-if="isConfidential">
<confidential>
<confidential :positionBtnFar="true">
<template v-slot:confidential-content>
<div v-if="isMultiline === true">
<p v-for="(l, i) in address.lines" :key="`line-${i}`">

6
src/Bundle/ChillMainBundle/Resources/views/Entity/address.html.twig
View File

@ -59,7 +59,7 @@
must be shown in such list
#}
{%- if render == 'list' -%}
<li class="chill-entity entity-address {% if address.confidential %}confidential{% endif %}">
<li class="chill-entity entity-address {% if address.confidential %} confidential toggle-far-twig {% endif %}">
{% if options['with_picto'] %}
<i class="fa fa-li fa-map-marker"></i>
{% endif %}
@ -68,7 +68,7 @@
{%- endif -%}
{%- if render == 'inline' -%}
<span class="chill-entity entity-address {% if address.confidential %}confidential{% endif %}">
<span class="chill-entity entity-address {% if address.confidential %} confidential toggle-far-twig {% endif %}">
{% if options['with_picto'] %}
<i class="fa fa-fw fa-map-marker"></i>
{% endif %}
@ -77,7 +77,7 @@
{%- endif -%}
{%- if render == 'bloc' -%}
<div class="chill-entity entity-address {% if address.confidential %}confidential{% endif %}">
<div class="chill-entity entity-address {% if address.confidential %} confidential toggle-close-twig {% endif %}">
{% if options['has_no_address'] == true and address.isNoAddress == true %}
{% if address.postCode is not empty %}
<div class="address{% if options['multiline'] %} multiline{% endif %}{% if options['with_delimiter'] %} delimiter{% endif %}">

4
src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Requestor.vue
View File

@ -9,7 +9,7 @@
<input type="checkbox" v-model="requestorIsAnonymous" class="me-2" />
{{ $t('requestor.is_anonymous') }}
</label>
<confidential v-if="accompanyingCourse.requestor.type === 'thirdparty'">
<confidential :positionBtn="false" v-if="accompanyingCourse.requestor.type === 'thirdparty'">
<template v-slot:confidential-content>
<third-party-render-box
:thirdparty="accompanyingCourse.requestor"
@ -33,7 +33,7 @@
</template>
</confidential>
<confidential v-else-if="accompanyingCourse.requestor.type === 'person'">
<confidential :positionBtnFar="false" v-else-if="accompanyingCourse.requestor.type === 'person'">
<template v-slot:confidential-content>
<person-render-box render="bloc"
:person="accompanyingCourse.requestor"

4
src/Bundle/ChillPersonBundle/Resources/views/AccompanyingCourse/index.html.twig
View File

@ -151,14 +151,14 @@
{% if accompanyingCourse.requestorPerson is not null %}
<h4 class="item-key">{{ 'Requestor'|trans }}</h4>
{% if accompanyingCourse.requestorAnonymous %}
<div class="confidential"><p>{{ _self.insert_onthefly('person', accompanyingCourse.requestorPerson) }}</p></div>
<div class="confidential toggle-close-twig"><p>{{ _self.insert_onthefly('person', accompanyingCourse.requestorPerson) }}</p></div>
{% else %}
{{ _self.insert_onthefly('person', accompanyingCourse.requestorPerson) }}
{% endif %}
{% elseif accompanyingCourse.requestorThirdParty is not null %}
<h4 class="item-key">{{ 'Requestor'|trans }}</h4>
{% if accompanyingCourse.requestorAnonymous %}
<div class="confidential"><p>{{ _self.insert_onthefly('thirdparty', accompanyingCourse.requestorThirdParty) }}</p></div>
<div class="confidential toggle-close-twig"><p>{{ _self.insert_onthefly('thirdparty', accompanyingCourse.requestorThirdParty) }}</p></div>
{% else %}
{{ _self.insert_onthefly('thirdparty', accompanyingCourse.requestorThirdParty) }}
{% endif %}

2
src/Bundle/ChillThirdPartyBundle/Resources/public/vuejs/_components/Entity/ThirdPartyRenderBox.vue
View File

@ -54,7 +54,7 @@
-->
</ul>
<div v-if="thirdparty.contactDataAnonymous">
<confidential>
<confidential :positionBtnFar="false">
<template v-slot:confidential-content>
<ul class="list-content fa-ul">
<li v-if="thirdparty.address">