🌐 AI搜索 & 代理 主页
Skip to content

Commit bda2a04

Browse files
authored
chore(docs): show live examples of all positioning for tooltip and popover directives (closes #4877) (#4880)
* chore(docs): show live examples of all positioning * Update README.md * Update README.md * Update README.md * Update README.md * Update README.md
1 parent 799620a commit bda2a04

File tree

4 files changed

+54
-3
lines changed

4 files changed

+54
-3
lines changed

src/components/popover/README.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -150,6 +150,9 @@ Positioning is relative to the trigger element.
150150
<div class="clearfix"></div>
151151
</div>
152152

153+
Refer to the [Popover directive](/docs/directives/popover/#positioning) documentaion for live
154+
examples of positioning.
155+
153156
## Triggers
154157

155158
Popovers can be triggered (opened/closed) via any combination of `click`, `hover` and `focus`. The

src/components/tooltip/README.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -96,6 +96,9 @@ The default position is `top`. Positioning is relative to the trigger element.
9696
</div>
9797
</div>
9898

99+
Refer to the [Tooltip directive](/docs/directives/tooltip/#positioning) documentaion for live
100+
examples of positioning.
101+
99102
## Triggers
100103

101104
Tooltips can be triggered (opened/closed) via any combination of `click`, `hover` and `focus`. The

src/directives/popover/README.md

Lines changed: 24 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -151,18 +151,39 @@ Positioning is relative to the trigger element.
151151
<b-col md="3" class="py-3">
152152
<b-button v-b-popover.hover.top="'Popover!'" variant="primary">Top</b-button>
153153
</b-col>
154-
155154
<b-col md="3" class="py-3">
156155
<b-button v-b-popover.hover.right="'Popover!'" variant="primary">Right</b-button>
157156
</b-col>
158-
159157
<b-col md="3" class="py-3">
160158
<b-button v-b-popover.hover.left="'Popover!'" variant="primary">Left</b-button>
161159
</b-col>
162-
163160
<b-col md="3" class="py-3">
164161
<b-button v-b-popover.hover.bottom="'Popover!'" variant="primary">Bottom</b-button>
165162
</b-col>
163+
<b-col md="3" class="py-3">
164+
<b-button v-b-popover.hover.topright="'Popover!'" variant="primary">Top right</b-button>
165+
</b-col>
166+
<b-col md="3" class="py-3">
167+
<b-button v-b-popover.hover.topleft="'Popover!'" variant="primary">Top left</b-button>
168+
</b-col>
169+
<b-col md="3" class="py-3">
170+
<b-button v-b-popover.hover.bottomright="'Popover!'" variant="primary">Bottom right</b-button>
171+
</b-col>
172+
<b-col md="3" class="py-3">
173+
<b-button v-b-popover.hover.bottomleft="'Popover!'" variant="primary">Bottom left</b-button>
174+
</b-col>
175+
<b-col md="3" class="py-3">
176+
<b-button v-b-popover.hover.lefttop="'Popover!'" variant="primary">Left top</b-button>
177+
</b-col>
178+
<b-col md="3" class="py-3">
179+
<b-button v-b-popover.hover.leftbottom="'Popover!'" variant="primary">Left bottom</b-button>
180+
</b-col>
181+
<b-col md="3" class="py-3">
182+
<b-button v-b-popover.hover.righttop="'Popover!'" variant="primary">right top</b-button>
183+
</b-col>
184+
<b-col md="3" class="py-3">
185+
<b-button v-b-popover.hover.rightbottom="'Popover!'" variant="primary">right bottom</b-button>
186+
</b-col>
166187
</b-row>
167188
</b-container>
168189
</div>

src/directives/tooltip/README.md

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -104,6 +104,30 @@ The default position is `top`. Positioning is relative to the trigger element.
104104
<b-col md="3" class="py-3">
105105
<b-button v-b-tooltip.hover.bottom="'Tooltip!'" variant="primary">Bottom</b-button>
106106
</b-col>
107+
<b-col md="3" class="py-3">
108+
<b-button v-b-tooltip.hover.topright="'Tooltip!'" variant="primary">Top right</b-button>
109+
</b-col>
110+
<b-col md="3" class="py-3">
111+
<b-button v-b-tooltip.hover.topleft="'Tooltip!'" variant="primary">Top left</b-button>
112+
</b-col>
113+
<b-col md="3" class="py-3">
114+
<b-button v-b-tooltip.hover.bottomright="'Tooltip!'" variant="primary">Bottom right</b-button>
115+
</b-col>
116+
<b-col md="3" class="py-3">
117+
<b-button v-b-tooltip.hover.bottomleft="'Tooltip!'" variant="primary">Bottom left</b-button>
118+
</b-col>
119+
<b-col md="3" class="py-3">
120+
<b-button v-b-tooltip.hover.lefttop="'Tooltip!'" variant="primary">Left top</b-button>
121+
</b-col>
122+
<b-col md="3" class="py-3">
123+
<b-button v-b-tooltip.hover.leftbottom="'Tooltip!'" variant="primary">Left bottom</b-button>
124+
</b-col>
125+
<b-col md="3" class="py-3">
126+
<b-button v-b-tooltip.hover.righttop="'Tooltip!'" variant="primary">Right top</b-button>
127+
</b-col>
128+
<b-col md="3" class="py-3">
129+
<b-button v-b-tooltip.hover.rightbottom="'Tooltip!'" variant="primary">Right bottom</b-button>
130+
</b-col>
107131
</b-row>
108132
</b-container>
109133
</div>

0 commit comments

Comments
 (0)