title: how to place an icon badge on ionic?
body: <p>how to design a card with notification badge without number with ionic and scss</p>
  <p><a href="https://i.stack.imgur.com/chhno.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/chhno.png" alt="enter image description here" /></a></p>
  <p>make it as follows Badge without number</p>
  <p><a href="https://i.stack.imgur.com/ivJBt.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ivJBt.png" alt="enter image description here" /></a></p>
  <p>I have the following scss but it is not responsive</p>
  <pre><code>&lt;ion-card class=&quot;ion-margin-top&quot;&gt;
       &lt;ion-badge color=&quot;danger&quot;&gt;1&lt;/ion-badge&gt;
       &lt;ion-icon name=&quot;settings-outline&quot;&gt;&lt;/ion-icon&gt;
       &lt;ion-card-content&gt;
         &lt;span class=&quot;contentText&quot;&gt;Configuration&lt;/span&gt;
       &lt;/ion-card-content&gt;
  &lt;/ion-card&gt;
  
  ion-card {
     background: #fff;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     margin: 0;
   
     ion-icon {
       width: 75%;
       margin-top: 16px;
       font-size: 5em;
     }
     ion-badge {
         position: absolute;
         top: 20px;
         right: 50px;
         }
  }
  </code></pre>