@oceanum/theme

Mantine theme for Oceanum.io applications.

Installation

npm install @oceanum/theme

Usage

import { MantineProvider } from "@mantine/core";
import { theme } from "@oceanum/theme";

function App() {
  return (
    <MantineProvider theme={theme}>
      {/* Your app */}
    </MantineProvider>
  );
}

Colors

The theme includes two custom color palettes:

• oceanumPrimary - Primary ocean blue colors
• oceanumSecondary - Secondary accent colors

You can also import the color values directly:

import { colors } from "@oceanum/theme";

// Use colors outside Mantine context
const myColor = colors.oceanumPrimary[500]; // "#179ec3"

Development

npm install
npm run build

Showcase

Run the showcase app to see all theme components:

cd examples/showcase
npm install
npm run dev

Version numbering

The version numbering follows the pattern MAJOR.MINOR.PATCH where:

• MAJOR is incremented when there are breaking changes
• MINOR is incremented when there are new features or improvements
• PATCH is incremented when there are bug fixes

The MAJOR version is tied to the Mantine version, so when Mantine is updated, the MAJOR version is incremented.