michielbdejong/solid-ui

View on GitHub
src/style.js

Summary

Maintainability
A
0 mins
Test Coverage
// Common readable consistent stylesheet
// to avoid using style sheets which are document-global
// and make programmable style toggling with selection, drag over, etc easier

// These must all end with semicolon so they can be appended to.

module.exports = {
  textInputStyle:
    'background-color: #eef; padding: 0.5em;  border: .05em solid #88c;  border-radius:0.2em; font-size: 100%; margin:0.2em; ',
  buttonStyle:
      'background-color: #fff; padding: 0.7em;  border: .01em solid white;  border-radius:0.2em; font-size: 100%;', // 'background-color: #eef;
  textButtonStyle:
        'background-color: #fff; padding: 0.7em;  border: .01em solid grey; border-radius:0.2em; font-size: 100%;', // 'background-color: #eef;
  // The width of the text field must bot be 100% or it switches to overlapping

  iconStyle: 'width: 3em; height: 3em; margin: 0.1em; border-radius: 1em;',
  classIconStyle: 'width: 3em; height: 3em; margin: 0.1em; border-radius: 0; border: 0.1em solid green; padding: 0.2em; background-color: #efe;', // combine with buttonStyle

  messageBodyStyle:
    'white-space: pre-wrap; width: 99%; font-size:100%; border: 0.07em solid #eee; border-radius:0.2em; padding: .3em 0.5em; margin: 0.1em;',
  pendingeditModifier: 'color: #bbb;',
  highlightColor: '#7C4DFF', // Solid lavendar https://design.inrupt.com/atomic-core/?cat=Core

  // Login buttons

  signInButtonStyle: 'padding: 1em; border-radius:0.2em; margin: 2em; font-size: 100%;', // was 0.5em radius
  // Forms

  formBorderColor: '#888888', // originall was brown now grey
  formHeadingColor: '#888888', // originall was brown now grey
  formTextInput: 'font-size: 100%; margin: 0.1em; padding: 0.1em;', // originally used this

  multilineTextInputStyle: 'font-size:100%; white-space: pre-wrap; background-color: #eef;' +
  ' border: 0.07em solid gray; padding: 1em 0.5em; margin: 1em 1em;'
}