move info area to top of the screen (#57)

* move info area to top of the screen

* fix unit tests

README.md

@@ -8,15 +8,15 @@ a _very_ minimalistic _cli_ typing test.
 
 When you run the program, you'll find the expected input displayed at the top of your terminal window. This text serves as a placeholder and represents what you should type when the test begins. Your goal is to type this text as quickly as possible. If you make a mistake, you can press the `backspace` key to delete a single character or hold down `Option`/`Ctrl` and press `backspace` to delete an entire word.
 
-In the bottom-right corner of the screen, a helpful message prompts you to start the test by pressing `'e'` (to enter the test) or exit by pressing `'q'`.
+In the top-right corner of the screen, a helpful message prompts you to start the test by pressing `'e'` (to enter the test) or exit by pressing `'q'`.
 
-While the test is running, you'll be able to monitor the time remaining in the bottom-left corner of the screen.
+While the test is running, you'll be able to monitor the time remaining in the top-left corner of the screen.
 
 To pause the test, simply press `<Esc>`. To resume, press `'e'` again.
 
 Your WPM (words per minute) score is calculated based on the number of typed characters divided by 5 (word), and normalized to a 60-second timeframe (minute).
 
-> It was successfully tested on `MacOS`, `Linux` and `Windows`
+> It has been successfully tested on `MacOS`, `Linux` and `Windows`
 
 ## Usage
 

src/runner.rs

@@ -183,15 +183,15 @@ impl Runner {
     /// Render a frame with each visual elements of the program in terminal.
     ///
     /// There are two areas being rendered,
-    /// input area - where user input and expected input is displayed,
-    /// and info area - where help message and time remaining is rendered.
+    /// info area - where help message and time remaining is rendered.
+    /// and input area - where user input and expected input are displayed,
     pub fn render(&mut self, frame: &mut impl FrameWrapperInterface, time_elapsed: u64) {
         let areas = Layout::default()
             .direction(Direction::Vertical)
-            .constraints([Constraint::Min(1), Constraint::Length(1)].as_ref())
+            .constraints([Constraint::Length(1), Constraint::Min(1)].as_ref())
             .split(frame.size());
-        let input_area = areas[0];
-        let info_area = areas[1];
+        let info_area = areas[0];
+        let input_area = areas[1];
 
         let frame_width: usize = frame.size().width as usize;
         let input_chars_count: usize = self.input.chars().count();
@@ -577,6 +577,11 @@ mod test {
                 height: 3,
             },
             vec![
+                vec![
+                    ("30 seconds left", Color::Yellow),
+                    ("      ", Color::Reset),
+                    ("press 'Esc' to pause the test", Color::Yellow),
+                ],
                 vec![
                     ("foobar", Color::Green),
                     ("bazquxaboba foobarbazquxaboba foobarbazquxab", Color::Gray),
@@ -585,11 +590,6 @@ mod test {
                     "oba foobarbazquxaboba foobarbazquxaboba foobarbazq",
                     Color::DarkGray,
                 )],
-                vec![
-                    ("30 seconds left", Color::Yellow),
-                    ("      ", Color::Reset),
-                    ("press 'Esc' to pause the test", Color::Yellow),
-                ],
             ],
         );