GUI Layout Problem

I'm programming a calculator using the Swing and AWT libraries, and I have three questions for you. The text field and the area for buttons on my calculator are positioned using a grid layout, however even though the text field is much smaller than the button area it still takes up as much space as the button area, and I don't want it to. (If you don't understand what I mean, look at the picture linked below). So how do I make it smaller?

My second question is: How do I create spaces between the buttons? I don't want them to be directly next to each other.

My third question is: Why does the text field become grey when I make it uneditable, and how do I prevent it from?

imgur: the simple image sharer

Thanks for helping me! :)

Java Code:

import java.awt.*;
import java.awt.event.*;
import javax.swing.*;

public class Calculator extends JFrame implements ActionListener{
        private JTextField text = new JTextField(20);
        
        private JButton oneButton = new JButton("1"), twoButton = new JButton("2"), threeButton = new JButton("3"), divisionButton = new JButton("/"); // First row.
        private JButton fourButton = new JButton("4"), fiveButton = new JButton("5"), sixButton = new JButton("6"), multiplicationButton = new JButton("*"); // Second row.
        private JButton sevenButton = new JButton("7"), eightButton = new JButton("8"), nineButton = new JButton("9"), subtractionButton = new JButton("-"); // Third row.
        private JButton clearButton = new JButton("C"), zeroButton = new JButton("0"), equalsButton = new JButton("="), additionButton = new JButton("+"); // Fourth row.
        private JButton squareButton = new JButton("x\u00B2"), exponentButton = new JButton("x\u207F"), rootButton = new JButton("\u221A"), eraseButton = new JButton("\u2190"); // Fifth row.
        
        private JPanel textArea = new JPanel(), buttonArea = new JPanel();
        
        public Calculator(){
                setTitle("Calculator");
                setLayout(new GridLayout(2,1));
                
                text.setEditable(false);
                textArea.add(text);
                
                buttonArea.setLayout(new GridLayout(5, 4));
                buttonArea.add(oneButton); buttonArea.add(twoButton); buttonArea.add(threeButton); buttonArea.add(divisionButton);
                buttonArea.add(fourButton); buttonArea.add(fiveButton); buttonArea.add(sixButton); buttonArea.add(multiplicationButton); 
                buttonArea.add(sevenButton); buttonArea.add(eightButton); buttonArea.add(nineButton); buttonArea.add(subtractionButton); 
                buttonArea.add(clearButton); buttonArea.add(zeroButton); buttonArea.add(equalsButton); buttonArea.add(additionButton);
                buttonArea.add(squareButton); buttonArea.add(exponentButton); buttonArea.add(rootButton); buttonArea.add(eraseButton); 
                
                add(textArea);
                add(buttonArea);
                
                setVisible(true);
                setDefaultCloseOperation(EXIT_ON_CLOSE);
                setLocationRelativeTo(null);
                setResizable(false);
                pack();
        }
        
        public void actionPerformed(ActionEvent e){
                // I haven't started with the button functions yet :P
        }
        
        public static void main(String[] args){
                Calculator run = new Calculator();
        }
}