How To contribute

Feature requests and bug reports about the Frontend Kit, can be submitted directly to the digital expert team via Jira. Please check the process with more details.

Commit guidelines

see here

Merge request guidelines

Merge request template

The project uses the next merge request template -

# Merge request

## How should this be manually tested?

## What version of the spec file did you follow in the creation process?

## Additional notes?

When spec file version references the internal number of the sketch spec file, unless stated otherwise.

Merging changes to the build process

When merging changes that affect the build process, whether refactoring for performance or changing the gatsby templating structure, the merge request should require approval from all developers working on the project, so everyone are aware of the change and could take it into consideration.

SCSS implementation in the project

BEVM pattern

We structure our classes in the BEVM (block_element--variation -modifier) model.

Implementation of background-specific design

To make sure classes of different backgrounds in the parents don't override each other, we created mixins that match classes in the order they can be nested for each use case. the important thing to know is that Secondary backgrounds come on top of Primary and Floating backgrounds, and contrast backgrounds come on top of that.

This solution does not apply to changes on Floating backgrounds, as those are in the same level of heirarchy with the Primary one, and aren't supposed to change their content. This would be questioned again if and when we reach the dark theme.

Usage

The specific styling must use the mixin to the background it applies to, but also revert the styling back to it's default property in the level after if it doesn't require it. meaning, styling for a secondary background should look like :

@include background-secondary {
*** styling here ***
}
@include background-tertiary {
*** reverting the styling here ***
}

styling for a contrast (tertiary) background should look like this:

@include background-tertiary {
*** styling here ***
}

Primary backgrounds are treated as default and therefore have no need to be included in this solution. a corresponding mixin exists for them for whatever edge case that can come in the future.

Usage of the design spec sketch files

The design specs are being passed to us in sketch files, using seafile. Therefore every change we save is automatically added to the original spec file we work on. To prevent this you should make a local copy of the Sketch file, or, less favorably, disable auto save in your Sketch preferences while developing.

Ideas and suggestions about the project

If you have new ideas about how to project should look like, technologies it should use or changes that it benefit from, add them on this page