update the dependencies

NixOS · Mar 31, 2021 · 163f519 · 163f519
1 parent 94b4ed6
commit 163f519
Show file tree

Hide file tree

Showing 4 changed files with 2,344 additions and 2,377 deletions.
diff --git a/README.md b/README.md
@@ -4,8 +4,14 @@ In this repository you will find styles that are being used on different web
 sites in NixOS project. Few examples:
 
 - [nixos.org](https://github.com/NixOS/nixos-homepage)
-- [search.nixos.org](https://github.com/NixOS/nixos-search)
-- [status.nixos.org](https://github.com/NixOS/nixos-status)
+- [summer.nixos.org](https://github.com/NixOS/nixos-summer)
+- TODO: [search.nixos.org](https://github.com/NixOS/nixos-search)
+- TODO: [status.nixos.org](https://github.com/NixOS/nixos-status)
+
+
+## Contribute
+
+
 
 
 ## License
@@ -15,3 +21,99 @@ The content of the website is licensed under the [Creative Commons Attribution S
 The software (including sample code) is licensed under the [MIT](LICENSES/MIT.txt) license.
 
 Some files might have a different license. See the files content for details.
+
+
+
+====================
+
+*Developer-centric notes*
+
+How this is laid out
+--------------------
+
+This uses the rscss structure
+
+ * https://rscss.io/
+
+With one addendum that for *qualified* layout elements like `body > header` the
+component will not be named (e.g. `page-header`); the qualified name for the
+innate structure of the document is enough.
+
+
+Units
+-----
+
+### `@unit`
+
+**Always** use `@unit` relative sizes rather than pixels, if pixels equivalents
+are desired. Otherwise, work with `em` for relative sizes according to the
+current sizes, or `rem` for root-relative sizes.
+
+Using pixel sizes is completely forbidden.
+
+This ensures the site stays entirely scalable according to the user-agent's
+configuration.
+
+> **Tip:** To make a "2 pixels" border:
+>
+> ```
+> * {
+>       border: 2 * @unit solid red;
+> }
+> ```
+
+This is not to be confused with the `unit()` function of LESS, which changes or
+removes a unit without conversion. The `unit()` function maye be found near
+uses of `@unit` to strip a unit to work around automatic unit conversions.
+
+### `@gutter`
+
+The gutter is the other unit that is being used on the site. It is defined as
+based on `@unit`, so it respects the rule of always defining sizes based on
+`@unit`.
+
+A gutter is, simply put, the spacing between two elements of the design. When
+spacing out elements, put 1 `@gutter` between them. It can be done through
+dividing the responsibility in halves (`@gutter/2`).
+
+It might be needed to space things a bit more. Using multiples of `@gutter`
+makes ad-hoc adjustments harmonize better with the site.
+
+
+Colours
+-------
+
+> TBD
+
+Always use a named colour. Using functions (e.g.: `lighten` or `darken`) is not
+recommended, as it may create unchecked variants in the palette.
+
+
+Pitfalls
+--------
+
+### Broken `::before` on element with `id=`
+
+To push anchor links inside a page, all elements with an `id=` property
+are given pseudo-element that is used to push the element into the
+visible section of the viewport.
+
+What this means is that if the element you are attempting to style
+has an `id=` property it is fighting against a generic rule.
+
+If the element does not serve for navigation, neither is it used with
+JavaScript, it should not have an ID. To target elements refer to RSCSS.
+
+> Note that even with JavaScript it is preferable to use the RSCSS
+> scheme to target elements in a generic fashion, unless you are
+> targeting a specifically identified element rather than a generic use
+> case.
+
+
+Bibliography
+------------
+
+Useful resources to wrangle specifics.
+
+ * [A Complete Guide to Flexbox](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
+
diff --git a/flake.lock b/flake.lock
diff --git a/flake.nix b/flake.nix
@@ -77,6 +77,7 @@
 
             src = self;
 
+            preferLocalBuild = true;
             enableParallelBuilding = true;
 
             buildInputs = [
@@ -95,10 +96,18 @@
 
           storyBookYarnPkg = pkgs.yarn2nix-moretea.mkYarnPackage rec {
             name = "${package.name}-yarn-${package.version}";
+
             src = null;
             dontUnpack = true;
+
+            preferLocalBuild = true;
+            enableParallelBuilding = true;
+
             packageJSON = ./package.json;
             yarnLock = ./yarn.lock;
+
+            buildInputs = with pkgs; [ lessc ];
+
             preConfigure = ''
               mkdir ${package.name}
               cd ${package.name}