A little helper file for TSA tier 2 projects

mock.css

.image-mock{
  display: block; 
  margin: 2rem auto; 
  width: 100%; 
  max-width: 1500px; 
  outline: 2px dashed orange;
  position: relative;
}
.image-mock:after{
  position: absolute;
  width: 100%;
  height: 100%;
  display: block;
  content: '';
  top: 0;
  left: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 1502 302'%3E%3Crect width='1498' height='298' x='2' y='3' stroke='%23fff' stroke-dasharray='2 2' stroke-width='2'/%3E%3Cline x1='.8' x2='1500.8' y1='301' y2='1' stroke='%23fff' stroke-dasharray='2 2' stroke-width='2'/%3E%3Cline x1='1.2' x2='1501.2' y1='1' y2='301' stroke='%23fff' stroke-dasharray='2 2' stroke-width='2'/%3E%3Cpath fill='%23fff' d='M734 136v-6.5h1v6.5h-1Zm.4-7.6-.5-.2a.6.6 0 0 1-.2-.5c0-.2 0-.4.2-.5l.5-.2c.2 0 .4 0 .5.2.2.1.2.3.2.5s0 .3-.2.5l-.5.2Zm2.4 7.6v-6.5h1v1c.2-.4.4-.6.7-.8a2 2 0 0 1 1-.3c.5 0 .9 0 1.2.3.2.2.5.4.6.8h.1c.2-.4.4-.6.8-.8.3-.2.7-.3 1.2-.3.6 0 1 .2 1.4.5.4.4.6 1 .6 1.7v4.4h-1v-4.4c0-.5-.2-.8-.4-1-.3-.2-.6-.3-1-.3s-.8.1-1 .4c-.3.3-.4.6-.4 1v4.3h-1v-4.5c0-.4-.2-.7-.4-.9-.3-.2-.6-.3-1-.3-.2 0-.4 0-.7.2-.2.1-.4.3-.5.6-.2.2-.2.5-.2.8v4.1h-1Zm12.3.2c-.4 0-.8-.1-1.1-.3a2 2 0 0 1-.8-.7 2 2 0 0 1-.3-1c0-.4 0-.7.2-1l.6-.5c.3-.2.5-.3.8-.3a10.1 10.1 0 0 1 1.9-.3l.5-.1c.2-.1.2-.2.2-.4 0-.4-.1-.8-.3-1-.3-.2-.6-.3-1-.3-.5 0-1 0-1.2.3l-.6.6-1-.3a2.3 2.3 0 0 1 1.7-1.4 3.9 3.9 0 0 1 1.7 0c.3 0 .6 0 .8.2l.7.7.2 1.3v4.3h-1v-.9l-.4.5a2 2 0 0 1-.6.4l-1 .2Zm.2-1c.4 0 .7 0 1-.2a1.6 1.6 0 0 0 .8-1.4v-.9l-.3.2h-.5a20.7 20.7 0 0 1-1.7.4c-.2 0-.4.1-.5.3l-.2.6c0 .3.1.6.4.8.2.2.6.3 1 .3Zm7.3 3.4c-.5 0-.9 0-1.3-.2a2.7 2.7 0 0 1-1.4-1.1l.8-.6.4.4.5.4 1 .2c.5 0 1-.1 1.3-.4.4-.2.5-.6.5-1.2v-1.3l-.4.4c-.1.2-.3.4-.6.5l-1 .2c-.5 0-1-.1-1.4-.4-.4-.2-.7-.6-1-1-.2-.5-.3-1.1-.3-1.8s0-1.3.3-1.8c.2-.5.6-.8 1-1.1.4-.3.9-.4 1.4-.4.5 0 .8 0 1 .2.3.1.5.3.6.5l.4.4v-1h1v6.7a2.2 2.2 0 0 1-1.4 2.2l-1.4.2Zm0-3.6a1.7 1.7 0 0 0 1.7-1l.1-1.3c0-.5 0-1-.2-1.3-.1-.3-.3-.6-.6-.8-.3-.2-.6-.3-1-.3a1.7 1.7 0 0 0-1.7 1.2c-.2.3-.2.7-.2 1.2 0 .4 0 .8.2 1.2.1.3.3.6.6.8.3.2.6.3 1 .3Zm7.4 1.1a3 3 0 0 1-1.6-.4c-.5-.3-.8-.7-1-1.2a4 4 0 0 1-.4-1.7c0-.7 0-1.3.3-1.8s.6-1 1-1.2c.5-.3 1-.4 1.6-.4l1 .1a2.5 2.5 0 0 1 1.6 1.6l.2 1.5v.5h-5v-.9h4c0-.4 0-.7-.2-1a1.7 1.7 0 0 0-1.6-1c-.4 0-.7.2-1 .4a2 2 0 0 0-.7.7c-.2.4-.2.7-.2 1v.6c0 .5 0 1 .2 1.3l.7.8 1.1.2h.7l.6-.4.4-.6 1 .3-.6.9c-.2.2-.5.4-.9.5-.3.2-.7.2-1.2.2Z'/%3E%3C/svg%3E");
  background-size: 100% 100%;
}
.image-mock img{
  width: 100%;  
}