PkgFoundry
Catalog npm
Back to packageRELEASE DETAILS

0.5.0

npm

7.css

A design system for building faithful recreations of the Windows 7 UI.

cssguiscssui-designwindowswindows7windows-7
Published4 Sept 2021
Direct dependencies15
Transitive dependenciesNot calculated

README

Current package documentation

7.css

npm gzip size

7.css is a CSS framework that takes semantic HTML and styles them to the Windows 7 design. It is built on top of XP.css, which is an extension of 98.CSS.

It does not ship with any JavaScript, so it is compatible with your frontend framework of choice.

📦 Installation / Usage

Directly via unpkg:

<!DOCTYPE html>
<html>
  <head>
    <title>7.css example</title>
    <meta charset="UTF-8" />
    <link rel="stylesheet" href="https://unpkg.com/7.css" />
  </head>

  <body>
    <div class="window" style="margin: 32px; width: 250px">
      <div class="title-bar">
        <div class="title-bar-text">My First Program</div>
      </div>
      <div class="window-body">
        <p>Hello, world!</p>
      </div>
    </div>
  </body>
</html>

Via npm:

npm install 7.css

Then import it as below:

import "7.css/dist/7.css";

📚 Documentation / Demo

Refer to the documentation page for specific instructions on this framework's components.

🛠 Developing

Clone the repo and run npm install.

The core styles are managed in gui.

You can use npm start to start a development environment that will watch for file changes and rebuild the files, reloading your browser in the process.

You can run a build manually with npm run build. This will write to the dist/ directory.

📝 Issues, Contributing, etc.

You are so welcome to report issues, help out with contributions or whatever you could think of to improve this lovely UI framework.

⚙ Integrations

7.css has been seen adopted in the following JS framework projects by the community:

📜 Changelog

Refer to Releases.

Downloads & popularity

Awaiting observations

No metric observations yet

Download counts and popularity will appear here as the collector receives them.

Declared dependencies 15

Native requirements
15 direct targetsNot calculated transitive count
Package / targetRequirementRelationship
ejs
Environment
{
  "local_name": "ejs",
  "alias": false,
  "peer_metadata": null
}
^3.0.2development
glob
Environment
{
  "local_name": "glob",
  "alias": false,
  "peer_metadata": null
}
^7.1.6development
dedent
Environment
{
  "local_name": "dedent",
  "alias": false,
  "peer_metadata": null
}
^0.7.0development
mkdirp
Environment
{
  "local_name": "mkdirp",
  "alias": false,
  "peer_metadata": null
}
^1.0.4development
cssnano
Environment
{
  "local_name": "cssnano",
  "alias": false,
  "peer_metadata": null
}
^4.1.10development
postcss
Environment
{
  "local_name": "postcss",
  "alias": false,
  "peer_metadata": null
}
^8.3.5development
chokidar
Environment
{
  "local_name": "chokidar",
  "alias": false,
  "peer_metadata": null
}
^3.3.1development
gh-pages
Environment
{
  "local_name": "gh-pages",
  "alias": false,
  "peer_metadata": null
}
^2.2.0development
live-server
Environment
{
  "local_name": "live-server",
  "alias": false,
  "peer_metadata": null
}
^1.1.0development
highlight.js
Environment
{
  "local_name": "highlight.js",
  "alias": false,
  "peer_metadata": null
}
>=10.4.1development
postcss-calc
Environment
{
  "local_name": "postcss-calc",
  "alias": false,
  "peer_metadata": null
}
^7.0.2development
postcss-copy
Environment
{
  "local_name": "postcss-copy",
  "alias": false,
  "peer_metadata": null
}
^7.1.0development
postcss-import
Environment
{
  "local_name": "postcss-import",
  "alias": false,
  "peer_metadata": null
}
^12.0.1development
postcss-nested
Environment
{
  "local_name": "postcss-nested",
  "alias": false,
  "peer_metadata": null
}
^4.2.1development
postcss-css-variables
Environment
{
  "local_name": "postcss-css-variables",
  "alias": false,
  "peer_metadata": null
}
^0.14.0development

Distribution files

1 collected
Distribution 1

Source distribution

Source file
Checksums from source
{
  "shasum": "5e81fb10d069c7087dbb25fdbe23f33e85ef1534",
  "tarball": "https://registry.npmjs.org/7.css/-/7.css-0.5.0.tgz",
  "fileCount": 76,
  "integrity": "sha512-vFDttkSS+mZhrujoNYUjNQxhtJCS8iIps+w+PGtFwvKkF+W+5Hn1MTj3n6j0l5SGGHXPdgNeTbSwzpQJw31e4g==",
  "signatures": [
    {
      "sig": "MEYCIQD88HuGgrU4HnWQicBfrJQTR3vKgQXxU79Yq3ciFlyouQIhALSI60I2CI24i3obNSIgUTPROHWS3zfVMHuXL90MlAPW",
      "keyid": "SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"
    }
  ],
  "unpackedSize": 675788,
  "npm-signature": "-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhM4mbCRA9TVsSAnZWagAAz+YQAJ98tQnNGmtz2XxLMnD+\nf4ysiwNszb6SfAeD9uSyVBBkt3NNiKH3jlzEaMzSZxbBuxOi96QhWDhdWKJz\nN/R7RGW5MBCpu0jdENDInA4ewPAtu9NYOZcqtEePflK+fBa8PrFHsdyjbI7w\nXu+3Jzk1DKB9eu/bBaN7V3UmcFXxk/vuooSBiwrVj1Unm7umm6UOiUWDq6L5\nlv3+aZf1t74hNhGPWeN/4XQ+MKruzgW2O3DA5fdAX10NT2MDp1rSN8zbAcUM\nF8GgOY34ErAGe31WiCFAsj/jZ1o2lQ9tiRwDK64WYPDYIquF3Vhp5U/Qh8ee\nhLJY/w+hMCQG4ANw5Vguo9h+HUQWoMU9Biv24yohgoMZTg4Zd4H7/1U9zsTw\nKgFnuNv+A/WsNS2js6Qwx/yc1wHXKYGwdpZQyjpKNa/uGCfetRyaghzCI1O9\nrSIE0QjgQnEgS+a/U3bep5EX4VhStJDPZXfaGLwtIbMyhS495Vt8Phg4MHuI\n7oSI+H8nIikP9AJFm3BtPadSRC0Ti2Q+GSMcCW7Zrt0Q+LOtshSbxqFsa3Zq\nvfI/EMfNLKl/X0ZHFk/QKzHoKvk5YMYuvzgWX15QXEN6SefAmZ827J3TI1tK\nKhgK2kd5UragAu/TfQO3tNwHjuBsDIiuv5Sy8RpZMDmFlj9/9x+tvO21gXLU\nIxUC\r\n=xBqZ\r\n-----END PGP SIGNATURE-----\r\n"
}

Repository

PENDING
khang-nd/7.css

Shared repository data · GitHub

License detected in repository
Not collected

Metadata history

Meaningful changes
Current collected state Current

Observed since 20 Oct, 21:02 UTC

No superseded metadata states collected. Unchanged observations do not create new revisions.

Record identity

package_version:11b381d7256f63d359ca4dfa1fa53edb658fa1e113847e2dd9cb1ebeb1c69aec

Other collected versions

0.21.127 Jul0.21.027 Jul0.20.026 Jul0.19.06 Jul0.18.020 Mar0.17.03 AugView all collected versions →