Island Legacy

Displays an island.

Island in HTML/CSS

Example

<div>
  <div class="ring-island">
    <div class="ring-island__content">Content</div>
  </div>
</div>

import '@jetbrains/ring-ui/components/island-legacy/island-legacy.scss';

Island with a header

Example

<div>
  <div class="ring-island">
    <div class="ring-island__header">
      <span class="ring-island__title">Title</span>
    </div>
    <div class="ring-island__content">Content</div>
  </div>
</div>

import '@jetbrains/ring-ui/components/island-legacy/island-legacy.scss';

Island with a header and buttons

Example

<div>
  <div class="ring-island">
    <div class="ring-island__header">
      <span class="ring-island__title">Title</span>
      <span class="ring-island__header-button">Button1</span>
      <span class="ring-island__header-button">Button2</span>
    </div>
    <div class="ring-island__content">Content</div>
  </div>
</div>

import '@jetbrains/ring-ui/components/island-legacy/island-legacy.scss';