Ncurses style dialog

This is some CSS to make a ncurses style dialog

by Carson Evans

HTML

<div class="nc-panel">
  <form action="#" onsubmit="return false;">
    <fieldset>
      <p>This is an example ncurses style dialog.</p>
      <p>Do you want to continue?</p>
      
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      
      <div class="center-buttons">
        <button class="btn-yes">Yes</button>
        <button class="btn-no">No</button>
      </div>
    </fieldset>
  </form>
</div>

CSS

body {
  background-color: #3465A4;
  font-family: Helvetica;
}

.nc-panel {
  padding: 8px 1px;
  margin: 6em;
  background-color: #D3D7CF;
  box-shadow: 15px 15px 0px 0px rgba(46,52,54,1);
}

.nc-panel label,
.nc-panel select {
  display: block;
}

.nc-panel button {
  background-color: transparent;
  border: none;
  padding: 0;
  margin: 0 30px
}

.nc-panel button:before {
  content: "<"
}

.nc-panel button:after {
  content: ">"
}

.nc-panel button:hover,
.nc-panel button:active,
.nc-panel button:focus {
  background-color: #CC0000;
  color: #D2D4AC;
}

.center-buttons {
  text-align: center;
}