Make script delete button always visible
<template>
<div class="search-bar card card-header">
- <div class="d-flex search-container">
- <div>
- <input type="text" class="search-query form-control"
+ <div class="d-flex search-bar-container">
+ <div class="d-inline-block">
+ <div class="input-group">
+ <input type="text" class="input-search-append form-control"
placeholder="Keywords" v-model="query" @keyup.enter="search" v-focus>
+ <div class="input-group-append">
<button class="btn btn-info search-btn" @click="search">
<i class="fa fa-search mr-1"></i>
<span v-text="i18n('common.button.search')"></span>
</button>
</div>
+ </div>
+ </div>
+ <div class="processing-btn-group">
<div v-show="$route.name !== 'scriptSearch'">
<div class="btn-group">
<button class="btn btn-primary dropdown-toggle"
<i class="fa fa-upload mr-1"></i>
<span v-text="i18n('script.action.upload')"></span>
</button>
+ </div>
<button class="pointer-cursor btn btn-danger" @click="$emit('deleteFile')">
<i class="fa fa-remove mr-1"></i>
<span v-text="i18n('script.action.delete')"></span>
</button>
</div>
- <div id="svn-url" class="input-prepend d-flex ml-auto" v-show="$route.name !== 'scriptSearch'"
+ <div v-show="$route.name !== 'scriptSearch'" class="svn-url ml-auto">
+ <div class="input-prepend"
data-toggle="popover"
data-trigger="hover"
data-html="true"
</span>
</div>
</div>
+ </div>
<create-script-modal ref="createScriptModal" :currentPath="currentPath" focus="fileName"></create-script-modal>
<create-folder-modal ref="createFolderModal" :currentPath="currentPath" focus="folderName"></create-folder-modal>
<upload-file-modal ref="uploadFileModal" :currentPath="currentPath" focus="file"></upload-file-modal>
height: 30px;
}
- .search-container {
+ .search-bar-container {
margin-bottom: 8px;
.input-group-text {
height: 30px;
}
- .search-query {
+ .input-search-append {
height: 30px;
width: 200px;
- border-radius: 3px 0 0 3px;
-
- &:focus {
- outline: none;
- box-shadow: none;
- border-color: #ced4da;
- }
}
.search-btn {
}
}
+ .svn-url {
+ display: flex;
+ }
+
+ .processing-btn-group > div {
+ display: inline-block;
+ }
}
}
</style>
