mirrors/vue-select
2
0
Fork 0
mirror of https://github.com/tenrok/vue-select.git synced 2026-06-22 10:30:34 +03:00
Code Activity

Merge pull request #274 from adi518/master

Browse Source 
Add RTL support
This commit is contained in:
Jeff
2017-10-01 16:03:24 -07:00
committed by GitHub
parent 50f9bcc782 d1e6fdd38e
commit 2960029375
2 changed files with 29 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dev.html
+1
View File
@@ -32,6 +32,7 @@
<body> <body>
<div id="app"> <div id="app">
<v-select placeholder="default" :options="options"></v-select> <v-select placeholder="default" :options="options"></v-select>
<v-select placeholder="default, RTL" :options="options" :rtl="true" dir="rtl"></v-select>
<v-select placeholder="multiple" multiple :options="options"></v-select> <v-select placeholder="multiple" multiple :options="options"></v-select>
<v-select placeholder="multiple, taggable" multiple taggable :options="options" no-drop></v-select> <v-select placeholder="multiple, taggable" multiple taggable :options="options" no-drop></v-select>
<v-select placeholder="multiple, taggable, push-tags" multiple push-tags taggable :options="[{label: 'Foo', value: 'foo'}]"></v-select> <v-select placeholder="multiple, taggable, push-tags" multiple push-tags taggable :options="[{label: 'Foo', value: 'foo'}]"></v-select>
src/components/Select.vue
+28 -6
View File
@@ -15,7 +15,19 @@
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
box-sizing: border-box; box-sizing: border-box;
} }
/* Rtl support */
.v-select.rtl .open-indicator {
left: 10px;
right: auto;
}
.v-select.rtl .selected-tag {
float: right;
margin-right: 3px;
margin-left: 1px;
}
.v-select.rtl .dropdown-menu {
text-align: right;
}
/* Open Indicator */ /* Open Indicator */
.v-select .open-indicator { .v-select .open-indicator {
position: absolute; position: absolute;
@@ -183,9 +195,9 @@
clear: none; clear: none;
} }
/* Search Input States */ /* Search Input States */
.v-select.unsearchable input[type="search"] { /* .v-select.unsearchable input[type="search"] {
max-width: 1px; max-width: 1px;
} } */
/* List Items */ /* List Items */
.v-select li { .v-select li {
line-height: 1.42857143; /* Normalize line height */ line-height: 1.42857143; /* Normalize line height */
@@ -536,7 +548,16 @@
*/ */
inputId: { inputId: {
type: String type: String
} },
/**
* Sets Rtl support.
* @type {Boolean}
*/
rtl: {
type: Boolean,
default: false
},
}, },
data() { data() {
@@ -817,7 +838,8 @@
searching: this.searching, searching: this.searching,
searchable: this.searchable, searchable: this.searchable,
unsearchable: !this.searchable, unsearchable: !this.searchable,
loading: this.mutableLoading loading: this.mutableLoading,
rtl: this.rtl
} }
}, },
@@ -827,7 +849,7 @@
*/ */
clearSearchOnBlur() { clearSearchOnBlur() {
return this.clearSearchOnSelect && !this.multiple return this.clearSearchOnSelect && !this.multiple
}, },
/** /**
* Return the current state of the * Return the current state of the