FIX: Column/Row width/height UI issues

This commit is contained in:
Nicolás Hatcher
2024-10-26 22:39:40 +02:00
committed by Nicolás Hatcher Andrés
parent 04d8c658ab
commit 0c69889832
5 changed files with 13 additions and 11 deletions

View File

@@ -2,8 +2,8 @@
/// COLUMN_WIDTH and ROW_HEIGHT are pixel values /// COLUMN_WIDTH and ROW_HEIGHT are pixel values
/// A column width of Excel value `w` will result in `w * COLUMN_WIDTH_FACTOR` pixels /// A column width of Excel value `w` will result in `w * COLUMN_WIDTH_FACTOR` pixels
/// Note that these constants are inlined /// Note that these constants are inlined
pub(crate) const DEFAULT_COLUMN_WIDTH: f64 = 100.0; pub(crate) const DEFAULT_COLUMN_WIDTH: f64 = 125.0;
pub(crate) const DEFAULT_ROW_HEIGHT: f64 = 22.0; pub(crate) const DEFAULT_ROW_HEIGHT: f64 = 28.0;
pub(crate) const COLUMN_WIDTH_FACTOR: f64 = 12.0; pub(crate) const COLUMN_WIDTH_FACTOR: f64 = 12.0;
pub(crate) const ROW_HEIGHT_FACTOR: f64 = 2.0; pub(crate) const ROW_HEIGHT_FACTOR: f64 = 2.0;
pub(crate) const DEFAULT_WINDOW_HEIGH: i64 = 600; pub(crate) const DEFAULT_WINDOW_HEIGH: i64 = 600;

View File

@@ -7,7 +7,7 @@ use csv_sniffer::Sniffer;
use serde::{Deserialize, Serialize}; use serde::{Deserialize, Serialize};
use crate::{ use crate::{
constants, constants::{self, DEFAULT_ROW_HEIGHT},
expressions::{ expressions::{
types::{Area, CellReferenceIndex}, types::{Area, CellReferenceIndex},
utils::{is_valid_column_number, is_valid_row}, utils::{is_valid_column_number, is_valid_row},
@@ -374,7 +374,7 @@ impl UserModel {
let line_count = value.split("\n").count(); let line_count = value.split("\n").count();
let row_height = self.model.get_row_height(sheet, row)?; let row_height = self.model.get_row_height(sheet, row)?;
let cell_height = (line_count * 22) as f64; let cell_height = (line_count as f64) * DEFAULT_ROW_HEIGHT;
if cell_height > row_height { if cell_height > row_height {
diff_list.push(Diff::SetRowHeight { diff_list.push(Diff::SetRowHeight {
sheet, sheet,

View File

@@ -2,6 +2,8 @@ import test from 'node:test';
import assert from 'node:assert' import assert from 'node:assert'
import { Model } from "../pkg/wasm.js"; import { Model } from "../pkg/wasm.js";
const DEFAULT_ROW_HEIGHT = 28;
test('Frozen rows and columns', () => { test('Frozen rows and columns', () => {
let model = new Model('Workbook1', 'en', 'UTC'); let model = new Model('Workbook1', 'en', 'UTC');
assert.strictEqual(model.getFrozenRowsCount(0), 0); assert.strictEqual(model.getFrozenRowsCount(0), 0);
@@ -16,13 +18,13 @@ test('Frozen rows and columns', () => {
test('Row height', () => { test('Row height', () => {
let model = new Model('Workbook1', 'en', 'UTC'); let model = new Model('Workbook1', 'en', 'UTC');
assert.strictEqual(model.getRowHeight(0, 3), 22); assert.strictEqual(model.getRowHeight(0, 3), DEFAULT_ROW_HEIGHT);
model.setRowHeight(0, 3, 32); model.setRowHeight(0, 3, 32);
assert.strictEqual(model.getRowHeight(0, 3), 32); assert.strictEqual(model.getRowHeight(0, 3), 32);
model.undo(); model.undo();
assert.strictEqual(model.getRowHeight(0, 3), 22); assert.strictEqual(model.getRowHeight(0, 3), DEFAULT_ROW_HEIGHT);
model.redo(); model.redo();
assert.strictEqual(model.getRowHeight(0, 3), 32); assert.strictEqual(model.getRowHeight(0, 3), 32);

View File

@@ -17,5 +17,5 @@ export const outlineBackgroundColor = "#F2994A1A";
export const LAST_COLUMN = 16_384; export const LAST_COLUMN = 16_384;
export const LAST_ROW = 1_048_576; export const LAST_ROW = 1_048_576;
export const ROW_HEIGH_SCALE = 1.25; export const ROW_HEIGH_SCALE = 1;
export const COLUMN_WIDTH_SCALE = 1.25; export const COLUMN_WIDTH_SCALE = 1;

View File

@@ -458,7 +458,7 @@ const StyledPopover = styled(Popover)`
padding: 0px; padding: 0px;
} }
font-family: ${({ theme }) => theme.typography.fontFamily}; font-family: ${({ theme }) => theme.typography.fontFamily};
font-size: 13px; font-size: 12px;
`; `;
const BorderPickerDialog = styled("div")` const BorderPickerDialog = styled("div")`
@@ -483,7 +483,7 @@ const Button = styled("button")<TypeButtonProperties>(
justifyContent: "center", justifyContent: "center",
// fontSize: "26px", // fontSize: "26px",
border: "0px solid #fff", border: "0px solid #fff",
borderRadius: "2px", borderRadius: "4px",
marginRight: "5px", marginRight: "5px",
transition: "all 0.2s", transition: "all 0.2s",
cursor: "pointer", cursor: "pointer",
@@ -501,7 +501,7 @@ const Button = styled("button")<TypeButtonProperties>(
borderTop: $underlinedColor ? "3px solid #FFF" : "none", borderTop: $underlinedColor ? "3px solid #FFF" : "none",
borderBottom: $underlinedColor ? `3px solid ${$underlinedColor}` : "none", borderBottom: $underlinedColor ? `3px solid ${$underlinedColor}` : "none",
color: "#21243A", color: "#21243A",
backgroundColor: $pressed ? theme.palette.grey["600"] : "inherit", backgroundColor: $pressed ? theme.palette.grey["200"] : "inherit",
"&:hover": { "&:hover": {
backgroundColor: "#F1F2F8", backgroundColor: "#F1F2F8",
borderTopColor: "#F1F2F8", borderTopColor: "#F1F2F8",