Files
hoppscotch/components/ui/deletable-chip.vue
Liyas Thomas 2972ac6328 Support multipart/form-data content-type (#1485)
* Initial UI refactor - move raw and key-value body to components and tabs

* Delete package-lock.json

* deps

* Add multipart/form-data as a content type

* fix: add default contentType value

* Allow http body param request body with multipart/form-data

* Add form data to vuex

* move raw body components to 'Raw Request Body' tab

* Add files addition logic

* Set Dockerfile to run nuxt in dev mode

* Set Dockerfile to run nuxt in dev mode

* Draft version of file upload

* refactor: clean up

* Add file chip to denote file input

* Remove console.log

* refactor(ui): matching styles

* refactor(ui): matching styles

* fix(ui): mobile responsiveness

* fix(ui): mobile responsiveness

* refactor: minor cleanup

* Remove file from any form of persistence

* Add warning that form data files will not be saved to local storage

* Add remove file functionality

* Prevent file from being saved to collections

* Remove console.log

* fix active toggle on multipart/form-data + cleanup

* auto import components

Co-authored-by: nelsontky <nelson@ccb.wtf>
2021-02-19 22:31:31 +05:30

33 lines
622 B
Vue

<template>
<span class="chip">
<span><slot></slot></span>
<button class="p-2 icon" @click="$emit('chip-delete')">
<i class="material-icons close-button"> close </i>
</button>
</span>
</template>
<style scoped lang="scss">
.chip {
@apply inline-flex;
@apply items-center;
@apply justify-center;
@apply rounded-lg;
@apply m-1;
@apply pl-4;
@apply bg-bgDarkColor;
@apply text-fgColor;
@apply font-mono;
@apply font-normal;
@apply transition;
@apply ease-in-out;
@apply duration-150;
@apply border;
@apply border-brdColor;
}
.close-button {
@apply text-base;
}
</style>