Commit Graph

5 Commits

Author SHA1 Message Date
Jaco Greeff
9c89026e6e
Copyright project authors (#95)
* Copyright project authors

* Add contributors
2018-06-13 22:32:49 +02:00
Luke Schoen
5296c4fee1 fix: Fixes #88 buttonbar style cornering on Accounts and Addresses pages (#90)
* fix: Fixes #88 buttonbar style cornering on Accounts and Addresses pages

- Add right corners to Forget
- Add left corners to Reset

* refactor: Move overrides for buttonbar corner styles into shared resource

* fix: Add newline to end of file

* refactor: Refactor using PostCSS variables, nesting, and import

* refactor: Move variables into partials subfolder. Apply CSS when preceding sibling is spacer

* fix: Remove unnecessary comma to pass CI linting

* fix: Add initial divider with no padding to apply corners conditionally

There is no CSS selector combinator that allows conditional styling of an element conditional upon "subsequent" sibling elements existing. This is a work-around whereby a dummy divider with no padding is added to the start of the button group such that the custom corner overrides only apply to button groups that contain a 1st and 3rd element that are dividers. Only options for conditional styling dependent on "preceding" sibling elements currently exist that are compatible across browsers (i.e. 'Adjacent sibling combinator' by use of `+` and 'General sibling combinator' by use of `~`, see below reference for details).

Another alternative solution that was considered by not deemed generic enough was to conditionally apply the custom cornering only to button groups that are contained within a classname that contains the text "--Editor", on the assumption that the Forget, Reset, Save button group would only be used within a nesting containing such a wildcard value (as is currently the case)
```
div [class*="--Editor"] {
  .ui--Button-Group {
    .ui.buttons {
      .button:nth-child(1) {
        border-top-right-radius: $small-corner;
        border-bottom-right-radius: $small-corner;
      }
      .ui.button.compact.mini.basic + .button:nth-child(3) {
        border-top-left-radius: $small-corner;
        border-bottom-left-radius: $small-corner;
      }
    }
  }
}
```

Reference: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors

* fix: Resolve linting CI errors

* fix: Add missing dependencies to package.json to pass CI

* refactor: Move widthless divider into base Group component

* refactor: Move button group custom cornering styles
2018-06-13 16:42:03 +02:00
Jaco Greeff
5f884c4b65
Add utility/toolbox app (#51)
* Upgrades

* Add & use Output component

* Render app in content

* Use update @polkadot/dev-react

* Add app-toolbox

* DRY className concat

* Hashing in place

* Verify signature operational

* Entry updates

* Verification operational

* Final cleanups before PR

* Bump version
2018-05-15 16:58:32 +02:00
Jaco Greeff
62279af6b9
Pass through Button.Or className (#48) 2018-05-12 20:38:19 +02:00
Jaco Greeff
ea50c4f1fe
Pull in ui-app components only (#46)
* Pull in ui-app components only

* Undefined check

* Small overall layout updates (buttons)

* Password hide/unhide icons

* Automatically assign name to inputs
2018-05-12 15:05:41 +02:00