Tesla

index.html

<button class="comein" onclick="comein()">
  Ouvrir
</button>
<button class="comeout" onclick="comeout()">
  Fermer
</button>

script.babel

const comein = () => fetch('https://maker.ifttt.com/trigger/when_come_in_event/json/with/key/nb3oo5Mx7SVAlIDsME-c0')
const comeout = () => fetch('https://maker.ifttt.com/trigger/when_come_out_event/json/with/key/nb3oo5Mx7SVAlIDsME-c0')

style.scss

body {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100vw;
  height: 100vh;
  margin: 0;
  padding: 20px;
  box-sizing: border-box;
  background-color: #2c3e50;
}

button {
  flex: 1;
  border: none;
  border-radius: 20px;
  font-size: 20vh;
  color: #ecf0f1;
  
  &:active {
    &.comein {
      background-color: #16a085;
    }
    
    &.comeout {
      background-color: #f39c12;
    }
  }
  
  &.comein {
    background-color: #1abc9c;
  }
  
  &.comeout {
    background-color: #f1c40f;
  }
}

tesla.markdown

Tesla

A Pen by Matthieu Godin on CodePen.

License.