Skip to content
This repository was archived by the owner on Jul 12, 2020. It is now read-only.

Refactor trigger to style text only if no add-class #112

Merged
merged 1 commit into from
Jul 14, 2019
Merged

Refactor trigger to style text only if no add-class #112

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 8 additions & 11 deletions src/trigger.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<template>
<span ref="trigger" :class="[addClass]"><slot></slot></span>
<span ref="trigger" :class="[addClass || (this.trigger === 'click' ? 'click-trigger' : 'other-trigger')]"><slot></slot></span>
Copy link
Member

@yamgent yamgent Jul 15, 2019 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

addClass by convention allows the author to append additional classes to the component, but it seems that addClass here is actually "overriding" click-trigger or other-trigger, is that intended?

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, it is overriding. Should I create another pr to revert this?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should I create another pr to revert this?

Yes please do. If that means that you can no longer remove the dash, you can also see if there's alternative ways of getting rid of dotted lines (e.g. maybe introduce a disable-dash attribute or a style attribute to turn it off).

</template>

<script>
Expand Down Expand Up @@ -31,15 +31,6 @@
}
this._triggerBy && this._triggerBy.toggle(e)
})

if (this.trigger === 'click') {
this.$refs.trigger.style['cursor'] = 'pointer'
this.$refs.trigger.style['-webkit-text-decoration'] = 'underline dashed';
this.$refs.trigger.style['text-decoration'] = 'underline dashed';
} else {
this.$refs.trigger.style['-webkit-text-decoration'] = 'underline dotted';
this.$refs.trigger.style['text-decoration'] = 'underline dotted'
}
},
methods: {
setTriggerBy (vm) {
Expand All @@ -50,5 +41,11 @@
</script>

<style>

.click-trigger {
cursor: pointer;
text-decoration: underline dashed;
}
.other-trigger {
text-decoration: underline dotted;
}
</style>