solid/docs/popovers.html at 9f5ccfd6192dbf2ee35a5666d1a9bca2e3ba3a6f · buzzfeed/solid · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
---
layout: default
title: Popovers
---

<section class="xs-mb6">

  <a name="pagination"></a>
  <h2 class="bold xs-mb2">Popovers</h2>
  <p class="xs-mb2">Popovers are useful for uncovering helpful information or hints when using a product. Use the <span class="nowrap">.<code class="js-highlight">.popover .popover--right</code></span> classes to incorporate a popover into your project.</p>


  <div class="flex xs-flex-column">
    <div class="popover-right card xs-mb3">
      <p>Cassoulet is a rich, slow-cooked casserole originating in the south of France, containing meat, pork skin and white beans. </p>
    </div>
    <div class="popover-right popover-right--gray card xs-mb3">
      <p>Cassoulet is a rich, slow-cooked casserole originating in the south of France, containing meat, pork skin and white beans. </p>
    </div>
    <div class="popover-left card xs-mb3">
      <p>Cassoulet is a rich, slow-cooked casserole originating in the south of France, containing meat, pork skin and white beans. </p>
    </div>
    <div class="popover-left popover-left--gray card xs-mb3">
      <p>Cassoulet is a rich, slow-cooked casserole originating in the south of France, containing meat, pork skin and white beans. </p>
    </div>
    <div class="popover-top card xs-mb3">
      <p>Cassoulet is a rich, slow-cooked casserole originating in the south of France, containing meat, pork skin and white beans. </p>
    </div>
    <div class="popover-top popover-top--gray card xs-mb3">
      <p>Cassoulet is a rich, slow-cooked casserole originating in the south of France, containing meat, pork skin and white beans. </p>
    </div>
    <div class="popover-bottom card xs-mb3">
      <p>Cassoulet is a rich, slow-cooked casserole originating in the south of France, containing meat, pork skin and white beans. </p>
    </div>
    <div class="popover-bottom popover-bottom--gray card xs-mb3">
      <p>Cassoulet is a rich, slow-cooked casserole originating in the south of France, containing meat, pork skin and white beans. </p>
    </div>
  </div>

<div class="xs-mt2">
{% highlight html %}

{% endhighlight %}
</div>

</section>