mitchell/react-starter
1
0
Fork 0
mirror of https://github.com/mgerb/react-starter synced 2026-01-09 16:42:48 +00:00
Code Issues Releases Wiki Activity

updates

Browse Source
This commit is contained in:
mgerb42
2018-01-03 22:36:25 +01:00
parent ff21d15083
commit f4b5cd04a5
12 changed files with 787 additions and 541 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
app/components/Navbar/Navbar.scss
View File

@@ -2,9 +2,9 @@
.Navbar__nav {
height: 40px;
border-bottom: 1px solid $light3;
border-bottom: 1px solid $light1;
display: flex;
background-color: $light1;
background-color: $gray--lighter;
}
.Navbar__header {
@@ -14,7 +14,7 @@
justify-content: space-between;
padding-left: 10px;
padding-right: 10px;
background-color: $dark2;
background-color: $background;
}
.Navbar__item {
@@ -27,15 +27,15 @@
&:hover {
color: $fontSecondary;
border-bottom: 2px solid $primaryBlue;
border-bottom: 2px solid $blue;
}
& + .Navbar__item {
border-left: 1px solid $light3;
border-left: 1px solid $gray;
}
}
.Navbar__item--active {
color: $fontSecondary;
border-bottom: 2px solid $primaryBlue;
border-bottom: 2px solid $blue;
}

2
app/pages/NotFound/NotFound.tsx
View File

@@ -12,7 +12,7 @@ export default class NotFound extends React.Component<Props, State> {
super(props);
}
render() {
public render(): any {
return <div className="NotFound">404 Not Found</div>;
}
}

4
app/scss/style.scss
View File

@@ -4,7 +4,7 @@ html {
body {
color: $fontPrimary;
background-color: $light2;
background-color: $white;
}
.fa {
@@ -18,6 +18,6 @@ a {
transition: all 0.1s linear;
&:hover {
color: $primaryBlue;
color: $blue;
}
}

32
app/scss/variables.scss
View File

@@ -1,21 +1,15 @@
// colors
$primaryBlue: #42adf4;
$white: darken(white, 10%);
$dark-blue: #1d2938;
$gray: #293341;
$gray--lighter: #3A4553;
$blue: #258de5;
$blue--lighter: saturate(lighten($blue, 10%), 100%);
$green: #39ce83;
$red: #e95779;
$white: #fff;
$light1: #e9eef2;
$gray1: #2e3136;
$gray2: #2a2d32;
$gray3: #23262a;
$gray4: #2e3136;
$gray5: #282b30;
$gray6: #1e2124;
$background: $dark-blue;
$foreground: #53718a;
$light1: #fff;
$light2: #f4f4f4;
$light3: #e3e3e3;
$dark2: #3a3f41;
$dark1: lighten($dark2, 5%);
$dark3: darken($dark2, 5%);
$fontPrimary: darken($light3, 10%);
$fontSecondary: darken($light3, 20%);
$fontPrimary: lighten($gray, 50%);
$fontSecondary: lighten($gray, 60%);