- Jan 15, 2019
-
-
Luke Schoen authored
* Update TxDetails and SlideLeftIn
-
Luke Schoen authored
-
Luke Schoen authored
* Rename to DivWindowContent.styles.js instead of DivWindowContent.js * Move DivContent and DivWindow into from App.styles.js. Stop using css from styled-components
-
- Jan 13, 2019
-
-
Luke Schoen authored
-
Luke Schoen authored
-
Luke Schoen authored
-
Luke Schoen authored
Without this babel plugin when you try to debug in Dev Tools > Elements, it displays the components with the styled-component name shown as a hash i.e. `<div class="sc-EHOje dGUdfn">`, whereas previously with CSS/Sass it showed the class name. This babel plugin displays the style-component name that we specified instead of a meaningless hash i.e. `<div class="App__DivContent-sc-1l7hwf9-0 jhbGUD">`, where `DivContent` is the name of the styled-component that we created.
-
Luke Schoen authored
* Add styled-components dependency to start introducing it to components instead of Sass * Wrap App.js with styled-components ThemeProvider and inject `fetherTheme` prop colours so they are available to child components. * Added styled-components' GlobalStyle https://www.styled-components.com/docs/faqs boilerplate as child of ThemeProvider so global styles may be defined here * Replace assets/sass/layouts/_wrapper.scss with styled-components including: * DivContent is declared in App.js since it is only used here * DivWindow is declared in App.js since it is only used here * DivWindowContent is declared in shared folder since used by different components * Removed assets/sass/layouts/_wrapper.scss. Noting that `.connector` class is not used * Use styled-components in TxForm and TxDetails components (that were introduced in PR #307). * Add a style.js file in the same directory of the component where styled-components are used * Add styled-components theme animations folder with a SlideInLeft animation and introduce a theme to TxDetails * Add keyframes animation to TxDetails component (i.e. slide-in animation that's used in the details section that appears when you click Details/Hide button on the Send Ether/THIBCoin page) * Fix `faint` style implementation to use `rgba` with styled-components * Note that I decided not to use defaultProps feature of styled-components as it bloats the code too much * Note that currently we are using Sass _variables.scss for colour variables, and since many components still use some of the Sass variables we cannot remove them yet. * Note that the original branch where this work was done is https://github.com/paritytech/fether/compare/luke-293-show-tx-fee-styled-components?expand=1, but since multiple PRs have since been merged it was easier to just code again using it as reference * Disadvantage of styled-components appears to be when you go to debug components in Dev Tools > Elements. The classNames appear as a hash `<div class="sc-EHOje dGUdfn">` instead of the classname!!
-
- Jan 11, 2019
-
-
Thibaut Sardan authored
-
Thibaut Sardan authored
-
- Jan 10, 2019
-
-
Thibaut Sardan authored
-
- Jan 08, 2019
-
-
Thibaut Sardan authored
-
- Jan 07, 2019
-
-
Thibaut Sardan authored
-
Amaury Martiny authored
-
Amaury Martiny authored
-
Thibaut Sardan authored
-
Thibaut Sardan authored
-
Thibaut Sardan authored
-
Thibaut Sardan authored
-
Thibaut Sardan authored
-
Thibaut Sardan authored
-
Thibaut Sardan authored
-
Luke Schoen authored
-
Luke Schoen authored
-
Luke Schoen authored
-
- Jan 06, 2019
-
-
Luke Schoen authored
* Move toggle details buttons and associated methods and showDetails state into nav of TxForm component * Pass showDetails down as props to TxDetails * Remove previous attempt to display TxDetails like a popup above other fields (i.e. remove form-details-wrapper and -details-value styles)
-
- Jan 05, 2019
-
-
Luke Schoen authored
-
Luke Schoen authored
-
Luke Schoen authored
-
Luke Schoen authored
-
Luke Schoen authored
-
- Jan 04, 2019
-
-
Luke Schoen authored
* Move "Details" / "Hide" buttons into the form-nav footer section * TxDetails now appears above the footer area above other input fields without causing the screen height to increase * Background of the TxDetails darkened so it stands out from surroudings * Change "Details" arrow to point upwards since TxDetails now shown above * Change "Hide" arrow to point downward since TxDetails now shown above * Rename classnames to `_` or `-` more consistently * Note: To quickly display the 'Details' button so you can click it change TxForm.js as follows: ``` {/* {valid && this.estimatedTxFee(values) ? ( */} <TxDetails // estimatedTxFee={this.estimatedTxFee(values)} estimatedTxFee={new BigNumber('8100000')} token={token} // values={values} values={ { amount: new BigNumber('0.1'), gasPrice: new BigNumber('21000') } } /> {/* ) : null} */}
-
Luke Schoen authored
-
Luke Schoen authored
review-fix: Hide vertical overflow on body element so scrollbar not flicker on/off when TxDetails toggled
-
Luke Schoen authored
-
Luke Schoen authored
-
Luke Schoen authored
-
Luke Schoen authored
-
Luke Schoen authored
-
Luke Schoen authored
-