Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commitcf19e86

Browse files
committed
Setup App layout and css variables
1 parent0d415ff commitcf19e86

27 files changed

+4929
-112
lines changed

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,6 @@
1414
"homepage":"https://github.com/modularcode/modular-admin-html",
1515
"dependencies": {
1616
"bootstrap":"4.0.0-alpha.6",
17-
"cpx":"^1.5.0",
1817
"cross-env":"^5.0.1",
1918
"font-awesome":"^4.7.0",
2019
"opencollective":"^1.0.3"
@@ -23,6 +22,7 @@
2322
"babel-core":"^6.24.1",
2423
"babel-loader":"^7.0.0",
2524
"babel-preset-env":"^1.5.2",
25+
"cpx":"^1.5.0",
2626
"css-loader":"^0.28.4",
2727
"dotenv":"^4.0.0",
2828
"extract-text-webpack-plugin":"^2.1.2",

‎src/client/App/App.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
importCommonfrom'./_common';
2+
13
exportdefault()=>{
24

35
alert('hello!');

‎src/client/App/App.layout.hbs

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,9 @@ layout: main.layout
1111
</div>
1212

1313
<divclass="ContentContainer{{pagename}}">
14-
{{{body}}}
14+
<divclass="Content">
15+
{{{body}}}
16+
</div>
1517
</div>
1618

1719
<divclass="FooterContainer" >

‎src/client/App/App.scss

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,15 @@
11
.App {
22

3+
background-color:$AppColorBg;
4+
35
.HeaderContainer {
46
position:absolute;
7+
top:0;
58
left:$SidebarWidth;
69
right:0;
7-
top:0;
810
height:$HeaderHeight;
9-
background-color:red;
11+
display:flex;
12+
align-items:'stretch';
1013
}
1114

1215
.SidebarContainer {
@@ -15,15 +18,17 @@
1518
top:0;
1619
bottom:0;
1720
width:$SidebarWidth;
18-
background-color:orange;
21+
display:flex;
22+
align-items:'stretch';
1923
}
2024

2125
.ContentContainer {
26+
display:flex;
2227
padding-top:$HeaderHeight;
2328
padding-bottom:$FooterHeight;
2429
margin-left:$SidebarWidth;
25-
background-color:#efefef;
2630
min-height:100vh;
31+
align-items:'stretch';
2732
}
2833

2934
.FooterContainer {
@@ -32,7 +37,8 @@
3237
bottom:0;
3338
right:0;
3439
height:$FooterHeight;
35-
background-color:purple;
40+
display:flex;
41+
align-items:'stretch';
3642
}
3743

3844
&.-header-fixed {
Lines changed: 3 additions & 69 deletions
Original file line numberDiff line numberDiff line change
@@ -1,72 +1,6 @@
11
---
22
layout:App/App.layout
33
---
4-
This Is Dashboard Page!
5-
<br>
6-
<br>
7-
<br>
8-
<br>
9-
<br>
10-
<br>
11-
<br>
12-
<br>
13-
<br>
14-
<br>
15-
<br>
16-
<br>
17-
<br>
18-
<br>
19-
<br>
20-
<br>
21-
<br>
22-
<br>
23-
<br>
24-
<br>
25-
<br>
26-
<br>
27-
<br>
28-
<br>
29-
<br>
30-
<br>
31-
<br>
32-
<br>
33-
<br>
34-
<br>
35-
<br>
36-
<br>
37-
<br>
38-
<br>
39-
<br>
40-
<br>
41-
<br>
42-
<br>
43-
<br>
44-
<br>
45-
<br>
46-
<br>
47-
<br>
48-
<br>
49-
<br>
50-
<br>
51-
<br>
52-
<br>
53-
<br>
54-
<br>
55-
<br>
56-
<br>
57-
<br>
58-
<br>
59-
<br>
60-
<br>
61-
<br>
62-
<br>
63-
<br>
64-
<br>
65-
<br>
66-
<br>
67-
<br>
68-
<br>
69-
<br>
70-
<br>
71-
<br>
72-
<br>
4+
<articleclass="Page">
5+
This Is Dashboard Page!
6+
</article>
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.Content {
2+
width:100%;
3+
}
Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
import'./Content.scss';
Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,3 @@
1-
This Is Footer
1+
<divclass="Footer">
2+
This Is Footer
3+
</div>
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
.Footer {
2+
width:100%;
3+
background-color:$FooterColorBg;
4+
align-items:center;
5+
justify-content:space-between;
6+
}
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
import'./Footer.scss';
2+
3+
4+
exportdefault{};
Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,3 @@
1-
THis Is Header
1+
<headerclass="Header">
2+
THis Is Header
3+
</header>
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
.Header {
2+
width:100%;
3+
background-color:$HeaderColorBg;
4+
}
Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
import'./Header.scss';

‎src/client/App/_common/Page/Page.scss

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.Page {
2+
padding:$PagePaddingVertical-lg$PagePaddingHorizontal-lg;
3+
}

‎src/client/App/_common/Page/index.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
import'./Page.scss';
Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,7 @@
11
.Sidebar {
2-
position:absolute;
32
width:100%;
4-
height:100%;
5-
left:0;
6-
top:0;
7-
background-color:#fff;
8-
box-shadow:1px0px20pxrgba(0,0,0,0.08);
3+
box-shadow:0px0px30pxfade-out($SidebarColorBg,0.5);
4+
5+
color:$SidebarColorText;
6+
background-color:$SidebarColorBg;
97
}

‎src/client/App/_common/index.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,9 @@
1+
import'./Header';
12
import'./Sidebar';
3+
import'./Content';
4+
import'./Footer';
5+
6+
import'./Page';
27

38

49
exportdefault{};

‎src/client/App/index.js

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
11
import'./App.scss';
22
importAppfrom'./App';
33

4-
importCommonfrom'./_common';
5-
64
exportdefaultApp;

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp