uiwjs / react-md-editor

A simple markdown editor with preview, implemented with React.js and TypeScript.
https://uiwjs.github.io/react-md-editor
MIT License
2.17k stars 156 forks source link

[Bug] MDEditor height not responding correctly to window.innerHeight #82

Closed ItzaMi closed 3 years ago

ItzaMi commented 3 years ago

Hello πŸ‘‹

First time using react-md-editor. I'm trying to have MDEditor occupy the entire height of my window but I think I'm facing a bug now since, for example, a window.innerHeight of 900 gets me a MDEditor with an height of 871.

Here's the code that I have right now. I'm also using tailwind but if I create a div with the height of window.innerHeight it works perfectly fine

import { useState, useRef } from 'react';
import './App.css';
import MDEditor from '@uiw/react-md-editor';

const App = () => {
  const [data, setData] = useState([{ text: 'Test note' }]);
  const [note, setNote] = useState('');

  const heightHere = window.innerHeight;

  return (
    <div className="relative bg-gray-100 h-screen">
      <div>
        <MDEditor
          className="py-2 px-5 w-10/12"
          id="noteinput"
          type="text"
          placeholder="Enter a new note"
          value={note}
          onChange={setNote}
          preview="edit"
          hideToolbar
          height={heightHere}
          visiableDragbar={false}
        />
      </div>
    </div>
  );
};

export default App;
jaywcjlove commented 3 years ago

@ItzaMi Don't know how to reproduce your problem.

image

jaywcjlove commented 3 years ago

85