<div class="theme-input">
  <form action="../controllers/post-inner.php" enctype="multipart/form-data" method="POST">
    <textarea class="title" name="title" placeholder="Название либо краткое содержание темы. 200 символов." maxlength="200" required onkeyup="updateCounter()"></textarea>
    <div class="title-counter"></div>
    <textarea name="body" placeholder="Здесь можно дополнить тему основным содержанием... до 3000 символов." maxlength="3000" required onkeyup="updateCounter()"></textarea>
    <div class="body-counter"></div>
    <button type="reset">Очистить  <i class="fa fa-trash-o"></i></button>
    <button type="submit">Публиковать  <i class="fa fa-check-square-o"></i></button>        
    <input class="file-input" type="file" name="filename" multiple accept="image/*,image/jpeg"><br>
  </form> 
</div>

function updateCounter() {
  var title = document.querySelector('.title').value;
  var titleCounter = title.length;
  var titleRemaining = 200 - titleCounter;
  document.querySelector('.title-counter').innerHTML = titleRemaining;
  if (titleRemaining < 0) {
    document.querySelector('.title').value = title.substring(0, 200);
  }
  
  var body = document.querySelector('[name="body"]').value;
  var bodyCounter = body.length;
  var bodyRemaining = 3000 - bodyCounter;
  document.querySelector('.body-counter').innerHTML = bodyRemaining;
  if (bodyRemaining < 0) {
    document.querySelector('[name="body"]').value = body.substring(0, 3000);
  }
}