Skip to content

Commit e2a3aef

Browse files
naffiqnaffiq
authored
Merge pull request #7 from Margaret0106/frontend
fix: front template fixed
2 parents 01a4888 + e08ac68 commit e2a3aef

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

66 files changed

+21506
-371
lines changed

‎.babelrc

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,14 @@
11
{
22
"presets": [
33
"es2015"
4-
]
4+
],
5+
"plugins": [
6+
"transform-class-properties",
7+
["transform-object-rest-spread",
8+
{
9+
"useBuiltIns": true
10+
}
11+
]
12+
]
13+
514
}

‎.eslintrc

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
{
2+
"env": {
3+
"node": true,
4+
"browser": true,
5+
"es6": true,
6+
"jquery": true
7+
},
8+
"parserOptions": {
9+
"ecmaVersion": 6,
10+
"sourceType": "module",
11+
"ecmaFeatures": {
12+
"jsx": true
13+
}
14+
},
15+
"rules": {
16+
"quotes": [ 1, "single" ],
17+
"comma-dangle": [ 2, "never" ],
18+
"no-extra-semi": [ 2 ],
19+
"no-multi-spaces": [ 1 ]
20+
}
21+
}

‎.rsync-filter

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
- /assets
2+
- js
3+
- .htaccess
4+
- *.php

‎.stylelintrc

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"rules": {
3+
"block-no-empty": true,
4+
"color-no-invalid-hex": true,
5+
"comment-empty-line-before": [ "always", {
6+
"ignore": ["stylelint-commands", "between-comments"]
7+
} ],
8+
"declaration-colon-space-after": "always",
9+
"max-empty-lines": 2,
10+
"rule-non-nested-empty-line-before": "always"
11+
}
12+
}

‎frontend/images/logo.png

-2.27 KB
Binary file not shown.

‎frontend/images/logo.svg

Lines changed: 0 additions & 41 deletions
This file was deleted.

‎frontend/styles/_fonts.scss

Lines changed: 3 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -9,21 +9,9 @@
99
}
1010

1111
@font-face {
12-
font-family: 'PTSans-Regular';
13-
src: url('../fonts/PTSans-Regular.eot?#iefix') format('embedded-opentype'),
14-
url('../fonts/PTSans-Regular.woff') format('woff'),
15-
url('../fonts/PTSans-Regular.ttf') format('truetype'),
16-
url('../fonts/PTSans-Regular.svg#PTSans-Regular') format('svg');
17-
font-weight: normal;
18-
font-style: normal;
19-
}
20-
21-
@font-face {
22-
font-family: 'PTSans-Bold';
23-
src: url('../fonts/PTSans-Bold.eot?#iefix') format('embedded-opentype'),
24-
url('../fonts/PTSans-Bold.woff') format('woff'),
25-
url('../fonts/PTSans-Bold.ttf') format('truetype'),
26-
url('../fonts/PTSans-Bold.svg#PTSans-Bold') format('svg');
12+
font-family: 'Montserrat';
13+
src: url('../fonts/montserrat-regular-webfont.woff2') format('woff2'),
14+
url('../fonts/montserrat-regular-webfont.woff') format('woff');
2715
font-weight: normal;
2816
font-style: normal;
2917
}

‎frontend/styles/_layout.scss

Lines changed: 7 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,15 @@
1-
21
html,
32
body {
43
height: 100%;
4+
55
}
66

77
body {
8-
font-family: $font-primary-regular;
9-
}
10-
11-
.container {
12-
width: 1000px !important;
13-
}
14-
15-
.header {
16-
border: 1px solid $color-gray;
17-
}
18-
19-
.main {
20-
margin: 30px 0;
21-
border: 1px solid green;
8+
font-family: $font-primary-regular;
9+
-webkit-font-smoothing: antialiased;
10+
-moz-osx-font-smoothing: grayscale;
2211
}
2312

24-
.footer {
25-
border: 1px solid $color-gray;
26-
}
13+
.main {
14+
margin: 30px 0;
15+
}

‎frontend/styles/_mixins.scss

Lines changed: 91 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
@mixin size($width: 100%, $height: $width) {
2+
width: $width;
3+
height: $height;
4+
}
5+
6+
@mixin block($width: 100%, $height: $width) {
7+
display: block;
8+
@include size($width, $height);
9+
}
10+
11+
@mixin inline-block($width: 100%, $height: $width) {
12+
display: inline-block;
13+
@include size($width, $height);
14+
}
15+
16+
17+
@mixin pos($top: auto, $right: auto, $bottom: auto, $left: auto) {
18+
top: $top;
19+
right: $right;
20+
bottom: $bottom;
21+
left: $left;
22+
}
23+
24+
@mixin rel($top: auto, $right: auto, $bottom: auto, $left: auto) {
25+
position: relative;
26+
@include pos($top, $right, $bottom, $left);
27+
}
28+
29+
@mixin rel-point($top: auto, $left: auto) {
30+
@include rel($top, auto, auto, $left);
31+
}
32+
33+
@mixin abs($top: auto, $right: auto, $bottom: auto, $left: auto) {
34+
position: absolute;
35+
@include pos($top, $right, $bottom, $left);
36+
}
37+
38+
@mixin abs-point($top: auto, $left: auto) {
39+
@include abs($top, auto, auto, $left);
40+
}
41+
42+
@mixin fixed($top: auto, $right: auto, $bottom: auto, $left: auto) {
43+
position: fixed;
44+
@include pos($top, $right, $bottom, $left);
45+
}
46+
47+
@mixin fixed-point($top: auto, $left: auto) {
48+
@include fixed($top, auto, auto, $left);
49+
}
50+
51+
52+
@mixin bg($url, $position: 50% 0, $repeat: no-repeat) {
53+
background: url($imgBase + $url) $position $repeat;
54+
}
55+
56+
@mixin bg-size($url, $size: 100%, $position: 50% 0, $repeat: no-repeat) {
57+
background: url($imgBase + $url) $position $repeat;
58+
background-size: $size;
59+
}
60+
61+
62+
@mixin trans($params...) {
63+
backface-visibility: hidden;
64+
transition: $params;
65+
}
66+
67+
@mixin hover-link($color, $hover: $color) {
68+
color: $color;
69+
@include trans(color, $transition-primary);
70+
&:hover, &:active, &:focus {
71+
color: $hover;
72+
text-decoration: none;
73+
}
74+
}
75+
76+
@mixin placeholder-color($color, $size: 100%) {
77+
&::-webkit-input-placeholder {
78+
color: $color;
79+
font-size: $size;
80+
}
81+
82+
&::-moz-placeholder {
83+
color: $color;
84+
//font-weight: 300;
85+
}
86+
87+
&:-ms-input-placeholder {
88+
color: $color;
89+
//font-weight: 300;
90+
}
91+
}

‎frontend/styles/_variables.scss

Lines changed: 15 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,26 @@
11

22
// fonts
3-
$font-primary-regular: 'PTSans-Regular', Helvetica, Arial, sans-serif;
4-
$font-primary-bold: 'PTSans-Bold', Helvetica, Arial, sans-serif;
5-
6-
$font-secondary-regular: Helvetica, Arial, sans-serif;
3+
$font-primary-regular: 'Montserrat', Arial, sans-serif;
74

85
$font-icons: 'websymbolsligaregular';
96

107
$font-numbers: 'Helvetica Neue', Arial, sans-serif;
118

129
// colors
13-
$color-primary: #000;
14-
$color-secondary: #000;
15-
$color-gray: #e6e6e6;
10+
$color-primary: #333333;
11+
$color-secondary: #4D526B;
12+
$color-red: #E66958;
13+
$color-grey: #CFCAC6;
1614

1715
// transitions
1816
$transition-primary: .3s;
17+
18+
$imgBase: '../images/';
19+
20+
$small: 560px;
21+
$middle: 760px;
22+
$tablet: 1000px;
23+
$laptop: 1170px;
24+
$desktop: 1300px;
25+
$wide: 1400px;
26+
$large: 1800px;

‎frontend/styles/main.scss

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,17 +4,24 @@ $icon-font-path: '../fonts/';
44

55
@import "variables";
66
@import "fonts";
7+
@import "mixins";
78

89
@import "modules/browsehappies";
910
@import "modules/buttons";
10-
@import "modules/forms";
1111
@import "modules/icons";
1212
@import "modules/links";
1313
@import "modules/logos";
1414
@import "modules/modals";
1515
@import "modules/navs";
1616
@import "modules/titles";
17+
@import "modules/header";
18+
@import "modules/footer";
19+
@import "modules/rf-link";
20+
@import "modules/forms";
1721

1822
@import "layout";
1923
@import "hacks";
2024
@import "media";
25+
26+
27+

‎frontend/styles/modules/_buttons.scss

Lines changed: 3 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,49 +1,19 @@
1-
21
.btn {
32
font-family: $font-primary-regular;
43
font-weight: normal;
54
font-style: normal;
65
outline: none !important;
7-
transition: $transition-primary;
6+
transition: color $transition-primary;
87
-webkit-font-smoothing: antialiased;
98
-moz-osx-font-smoothing: grayscale;
9+
1010
&:active {
1111
box-shadow: none;
1212
}
13+
1314
&:hover,
1415
&:active {
1516
transition: none;
1617
}
1718
}
1819

19-
.btn--primary {
20-
padding: 8px 25px 9px;
21-
font-size: 16px;
22-
font-weight: 500;
23-
color: #fff;
24-
background-color: $color-primary;
25-
&:focus {
26-
color: #fff;
27-
}
28-
&:hover,
29-
&:active {
30-
color: $color-primary;
31-
background-color: rgba($color-primary, .7);
32-
}
33-
34-
&.btn--success {
35-
// background-color: $color-green;
36-
box-shadow: 8px 8px 16px 0 rgba(#07021E, .1);
37-
&:focus {
38-
color: #fff;
39-
}
40-
&:hover,
41-
&:active {
42-
color: #fff;
43-
background-color: #4DBE73;
44-
}
45-
&:active {
46-
box-shadow: inset -1px 1px 12px rgba(#07021E, .15), 5px 5px 16px 0 rgba(#07021E, .08);
47-
}
48-
}
49-
}

‎frontend/styles/modules/_footer.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
.footer {
2+
padding: 20px 0;
3+
border-top: 1px solid rgb(184, 183, 183);
4+
}

0 commit comments

Comments
 (0)