Skip to content

Instantly share code, notes, and snippets.

:atom:
coding things

Stuart Robson sturobson

:atom:
coding things
View GitHub Profile
View button.variables.scss
// This file has been dynamically generated from design tokens
// Please do NOT edit directly.
// Source: ../design-tokens/components/button.yml
:root {
--base-button-background-color: #9e9e9e;
--base-button-border-color: #424242;
--base-button-background-color--hover: #eeeeee;
--primary-button-background-color: #2196f3;
--primary-button-background-color--hover: #90caf9;
--primary-button-border-color: #1565c0;
View button.variables.scss
$base-button-background-color: #9e9e9e !default;
--base-button-background-color: #9e9e9e; // This property can be customised
$base-button-border-color: #424242 !default;
--base-button-border-color: #424242; // This property can be customised
$base-button-background-color--hover: #eeeeee !default;
--base-button-background-color--hover: #eeeeee; // This property can be customised
/* Primary Colours */
View example.css
[class*='ary'].vf-card--bordered {
--vf-card-theme-color--background: white;
}
/*
* We have 4 'themes' that only add colour
* We have (potentially several) design variants
* One of those is where we only have a border of colour rather than a block of color with text on it.
* This updates the background colour for any card that has the 'normal' design variant
* with any of the four colour palettes - primary, secondary, etc, etc.
View init.coffee
# Your init script
#
# Atom will evaluate this file each time a new window is opened. It is run
# after packages are loaded/activated and after the previous editor state
# has been restored.
#
# An example hack to log to the console when each text editor is saved.
#
# atom.workspace.observeTextEditors (editor) ->
# editor.onDidSave ->
View vf-hero--excerpt.SCSS
.vf-hero {
--vf-hero-content-position: 0;
--vf-hero-content-box-shadow:
2px 0 3px rgba(0, 0, 0, var(--vf-hero-content-shadow-alpha, 0)),
-2px 0 3px rgba(0, 0, 0, var(--vf-hero-content-shadow-alpha, 0)),
0 2px 3px rgba(0, 0, 0, var(--vf-hero-content-shadow-alpha, 0));
--vf-hero-content-shadow-alpha: .1;
--vf-hero-heading-bg-color: 1;
--vf-hero-heading-text-color: 0;
@sturobson
sturobson / PD2017-full.md
Last active Nov 13, 2018
all the notes from Patterns Day 2017
View PD2017-full.md

Patterns Day 30th June 2017

Laura Elizabeth - @laurium

Selling Design Systems

Why design systems don't always stay updated?

  • it was never intended to be living
  • maintaining it was too much work
  • nobody in the team uses it
@sturobson
sturobson / PD2017-4.md
Last active Jun 30, 2017
the unedited notes fro the last two talks from Patterns Day 2017
View PD2017-4.md

Paul Robert Lloyd - @paulrobertlloyd

Fantasises of the Future

Where would you start, if you were asked to design a city? Would you start with the roads, what shape would make it? A bird

Designing an inland capital for Brazil in 5 years, instead of 50.

A model utopia of egalitarianism.

@sturobson
sturobson / PD2017-3.md
Created Jun 30, 2017
unedited notes from the two post-lunch talks at Patterns Day 2017
View PD2017-3.md

Alice Bartlett

Can't you make it more like Bootstrap?

Origami

4 person team who develop front end tools for services at FT

  1. reduce time spent repeated work
  2. unify design across FT
@sturobson
sturobson / PD2017-2.md
Last active Jun 30, 2017
unedited notes from the second two morning talks, before lunch at Patterns Day 2017
View PD2017-2.md

Sareh Heidari - @sareh88

Scaffolding CSS for Scale

76.4 million weekly visitors to BBC News - 64% comes from outside UK

BBC Worldwide 29 Site 58.8 million users

@sturobson
sturobson / PD2017-1.md
Last active Jun 30, 2017
unedited notes from the first two morning talks at Patterns Day 2017
View PD2017-1.md

Patterns Day 30th June 2016

Laura Elizabeth - @laurium

Selling Design Systems

Why design systems don't always stay updated?

  • it was never intended to be living
  • maintaining it was too much work
You can’t perform that action at this time.