samturrell / Vue Match Heights
Licence: mit
Vue plugin to match the height of elements
Stars: ✭ 50
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to Vue Match Heights
V Track
🕹 A manual tracking decoupling plugin based on Vue directive / 一个基于Vue指令实现的埋点解耦插件~
Stars: ✭ 277 (+454%)
Mutual labels: plugin, directive
Elasticsearch Ukrainian Lemmatizer
Ukrainian lemmatizer plugin for ElasticSearch
Stars: ✭ 44 (-12%)
Mutual labels: plugin
Mybatis Generator Plugin
Mybatis Generator 代码生成插件拓展,增加:查询单条数据插件(SelectOneByExamplePlugin)、MySQL分页插件(LimitPlugin)、数据Model链式构建插件(ModelBuilderPlugin)、Example Criteria 增强插件(ExampleEnhancedPlugin)、Example 目标包修改插件(ExampleTargetPlugin)、批量插入插件(BatchInsertPlugin)、逻辑删除插件(LogicalDeletePlugin)、数据Model属性对应Column获取插件(ModelColumnPlugin)、存在即更新(UpsertPlugin)、Selective选择插入更新增强插件(SelectiveEnhancedPlugin)、Table增加前缀插件(TableSuffixPlugin)、自定义注释插件(CommentPlugin)、增量插件(IncrementsPlugin)、查询结果选择性返回插件(SelectSelectivePlugin)、乐观锁插件(OptimisticLockerPlugin)、LombokPlugin等拓展。
Stars: ✭ 1,038 (+1976%)
Mutual labels: plugin
Ngx Infinite Scroll
Infinite Scroll Directive for Angular
Stars: ✭ 1,024 (+1948%)
Mutual labels: directive
Honeybot
🛩 A python IRC bot with simple plugins dev. Ignited in mauritius, first-timers friendly!
Stars: ✭ 48 (-4%)
Mutual labels: plugin
Pytest Mimesis
Mimesis integration with the pytest test runner. This plugin provider useful fixtures based on providers from Mimesis.
Stars: ✭ 46 (-8%)
Mutual labels: plugin
Fworldgenerator
Procedural world generator (plugin) for Unreal Engine 4
Stars: ✭ 45 (-10%)
Mutual labels: plugin
Documentation
Online documentation and tracking tools for Naninovel — writer-friendly visual novel engine
Stars: ✭ 48 (-4%)
Mutual labels: plugin
Dotenv Webpack
A secure webpack plugin that supports dotenv and other environment variables and only exposes what you choose and use.
Stars: ✭ 1,022 (+1944%)
Mutual labels: plugin
Chosen Order
Chosen Order is a plugin for Chosen which provides functions to handle the order of the selection
Stars: ✭ 48 (-4%)
Mutual labels: plugin
vue-match-heights
Quick and easy method of setting element heights to be the same. You can provide an array of selectors that will be calculated in sequence, and an array of sizes where the plugin should not run.
Using this plugin
Adding vue-match-heights to your application is as simple as any other plugin:
import Vue from 'vue';
import VueMatchHeights from 'vue-match-heights';
Vue.use(VueMatchHeights, {
disabled: [768], // Optional: default viewports widths to disabled resizing on. Can be overridden per usage
});
new Vue({
el: '#app',
});
The v-match-heights
directive is now available to your app. This directive should be used on a wrapper element around the elements you wish to set the heights of.
<div
class="row"
v-match-heights="{
el: ['h3', '.content', '.caption'], // Array of selectors to fix
disabled: [ // Array of heights where the plugin will not set the heights
767, // If a string is provided this will be used as a max bound
[920, 1200], // If an array is provided it will be used as min-max bounds in that order
]
}"
>
<div class="col-sm-6">
<div class="thumbnail">
<img src="http://lorempixel.com/600/400/?1">
<div class="caption">
<div class="title">
<h3>...</h3>
</div>
<div class="content">
...
</div>
</div>
<div class="buttons">
...
</div>
</div>
</div>
<div class="col-sm-6">
<div class="thumbnail">
<img src="http://lorempixel.com/600/400/?2">
<div class="caption">
<div class="title">
<h3>...</h3>
</div>
<div class="content">
...
</div>
</div>
<div class="buttons">
...
</div>
</div>
</div>
</div>
📜 Changelog
Details changes for each release are documented in the CHANGELOG.md.
©️ License
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].