daisyUI warning alert

daisyui-warning-alert.markdown

daisyUI warning alert

A Pen by Thaddeus Jiang on CodePen.

License.

index.html

  <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/full.css" rel="stylesheet" type="text/css" />
  <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/tailwind.min.css" rel="stylesheet" type="text/css" />


<div class="py-2 px-4">
  
  <div class="grid justify-items-end">
    <div class="flex justify-items-end"> 
        <div class="alert alert-warning p-2 ">
        <div class="">
          <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="w-6 h-6 mx-2 stroke-current"> 
            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"></path>                         
          </svg> 
          <label>あなたは現在のステップの責任者ではないので、代わりの責任者に実行しますか？</label>
        </div>
      </div>
    </div>
    <div class="mt-2">
      <button class="btn btn-primary">差し戻す</button>
      <button class="btn">一次保存</button>
      <button class="btn btn-primary">確定</button>
    </div>
    
    <ul class=" steps">
      <li class="step step-primary"></li> 
      <li class="step step-primary"></li> 
      <li class="step"></li>
    </ul>
  </div>  
</div>