Skip to content
This repository was archived by the owner on May 2, 2023. It is now read-only.

Commit ca15d56

Browse files
committed
frontend v0.1
1 parent 40245f4 commit ca15d56

27 files changed

+3603
-33
lines changed

config/packages/jms_serializer.yaml

+4
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,10 @@ jms_serializer:
22
visitors:
33
xml:
44
format_output: '%kernel.debug%'
5+
6+
handlers:
7+
datetime:
8+
default_format: "Y-m-d\\TH:i" # ATOM
59
# metadata:
610
# auto_detection: false
711
# directories:

config/packages/sonata_admin.yaml

+4-1
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,14 @@
11
sonata_admin:
2-
title: 'Sonata Admin'
2+
title: 'Admin Area'
33
dashboard:
44
blocks:
55
- { type: sonata.admin.block.admin_list, position: left }
66
security:
77
handler: sonata.admin.security.handler.role
88

9+
templates:
10+
dashboard: 'dashboard.html.twig'
11+
912
sonata_notification:
1013
admin:
1114
enabled: false

frontend/todo/package.json

+31
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
{
2+
"name": "todo",
3+
"version": "0.1.0",
4+
"private": true,
5+
"dependencies": {
6+
"ajv": "^6.4.0",
7+
"axios": "^0.18.0",
8+
"font-awesome": "^4.7.0",
9+
"moment": "^2.22.0",
10+
"react": "^16.3.1",
11+
"react-big-calendar": "^0.19.0",
12+
"react-contextmenu": "^2.9.2",
13+
"react-dom": "^16.3.1",
14+
"react-scripts": "1.1.4",
15+
"simple-react-modal": "^0.5.1"
16+
},
17+
"scripts": {
18+
"start": "react-scripts start",
19+
"build": "react-scripts build && npm run build-rename",
20+
"test": "react-scripts test --env=jsdom",
21+
"eject": "react-scripts eject",
22+
"build-rename": "npm run build-rename-js && npm run build-rename-css && npm run build-move-js && npm run build-move-css",
23+
"build-rename-js": "renamer --regex --find 'main\\.[^\\.]+\\.js' --replace 'main-react.js' build/static/js/*.js",
24+
"build-rename-css": "renamer --regex --find 'main\\.[^\\.]+\\.css' --replace 'main-react.css' build/static/css/*.css",
25+
"build-move-css": "cp build/static/css/main-react.css ../../public/css",
26+
"build-move-js": "cp build/static/js/main-react.js ../../public/js"
27+
},
28+
"devDependencies": {
29+
"renamer": "^0.6.1"
30+
}
31+
}

frontend/todo/public/index.html

+40
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
6+
<meta name="theme-color" content="#000000">
7+
<!--
8+
manifest.json provides metadata used when your web app is added to the
9+
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
10+
-->
11+
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
12+
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
13+
<!--
14+
Notice the use of %PUBLIC_URL% in the tags above.
15+
It will be replaced with the URL of the `public` folder during the build.
16+
Only files inside the `public` folder can be referenced from the HTML.
17+
18+
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
19+
work correctly both with client-side routing and a non-root public URL.
20+
Learn how to configure a non-root public URL by running `npm run build`.
21+
-->
22+
<title>React App</title>
23+
</head>
24+
<body>
25+
<noscript>
26+
You need to enable JavaScript to run this app.
27+
</noscript>
28+
<div id="root"></div>
29+
<!--
30+
This HTML file is a template.
31+
If you open it directly in the browser, you will see an empty page.
32+
33+
You can add webfonts, meta tags, or analytics to this file.
34+
The build step will place the bundled scripts into the <body> tag.
35+
36+
To begin the development, run `npm start` or `yarn start`.
37+
To create a production bundle, use `npm run build` or `yarn build`.
38+
-->
39+
</body>
40+
</html>

frontend/todo/public/manifest.json

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
{
2+
"short_name": "React App",
3+
"name": "Create React App Sample",
4+
"icons": [
5+
{
6+
"src": "favicon.ico",
7+
"sizes": "64x64 32x32 24x24 16x16",
8+
"type": "image/x-icon"
9+
}
10+
],
11+
"start_url": "./index.html",
12+
"display": "standalone",
13+
"theme_color": "#000000",
14+
"background_color": "#ffffff"
15+
}

frontend/todo/src/App.css

+161
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,161 @@
1+
.App {
2+
text-align: center;
3+
}
4+
5+
.App-logo {
6+
animation: App-logo-spin infinite 20s linear;
7+
height: 80px;
8+
}
9+
10+
.App-header {
11+
background-color: #222;
12+
height: 150px;
13+
padding: 20px;
14+
color: white;
15+
}
16+
17+
.App-title {
18+
font-size: 1.5em;
19+
}
20+
21+
.App-intro {
22+
font-size: large;
23+
}
24+
25+
@keyframes App-logo-spin {
26+
from { transform: rotate(0deg); }
27+
to { transform: rotate(360deg); }
28+
}
29+
30+
.react-modal {
31+
position: absolute;
32+
top: 50%;
33+
left: 50%;
34+
transform: translate(-50%, -50%);
35+
z-index: 999999; /* Sit on top */
36+
width: 100%; /* Full width */
37+
height: 100%; /* Full height */
38+
overflow: auto; /* Enable scroll if needed */
39+
background-color: rgb(0,0,0); /* Fallback color */
40+
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
41+
}
42+
43+
/* Modal Content/Box */
44+
.react-modal-content {
45+
background-color: #fefefe;
46+
margin: 15% auto; /* 15% from the top and centered */
47+
padding: 20px;
48+
border: 1px solid #888;
49+
top: 50%;
50+
left: 50%;
51+
width: 80%; /* Could be more or less, depending on screen size */
52+
}
53+
54+
.close:hover,
55+
.close:focus {
56+
color: black;
57+
text-decoration: none;
58+
cursor: pointer;
59+
}
60+
61+
.close {
62+
background: #606061;
63+
color: #FFFFFF;
64+
line-height: 25px;
65+
position: relative;
66+
left:100%;
67+
text-align: center;
68+
top: -50px;
69+
width: 24px;
70+
text-decoration: none;
71+
font-weight: bold;
72+
-webkit-border-radius: 12px;
73+
-moz-border-radius: 12px;
74+
border-radius: 12px;
75+
-moz-box-shadow: 1px 1px 3px #000;
76+
-webkit-box-shadow: 1px 1px 3px #000;
77+
box-shadow: 1px 1px 3px #000;
78+
cursor: pointer;
79+
}
80+
.close:hover {
81+
background: #00d9ff;
82+
}
83+
84+
.react-contextmenu {
85+
background-color: #fff;
86+
background-clip: padding-box;
87+
border: 1px solid rgba(0,0,0,.15);
88+
border-radius: .25rem;
89+
color: #373a3c;
90+
font-size: 16px;
91+
margin: 2px 0 0;
92+
min-width: 160px;
93+
outline: none;
94+
opacity: 0;
95+
padding: 5px 0;
96+
pointer-events: none;
97+
text-align: left;
98+
transition: opacity 250ms ease !important;
99+
}
100+
101+
.react-contextmenu.react-contextmenu--visible {
102+
opacity: 1;
103+
pointer-events: auto;
104+
z-index: 9999999;
105+
}
106+
107+
.react-contextmenu-item {
108+
background: 0 0;
109+
border: 0;
110+
color: #373a3c;
111+
cursor: pointer;
112+
font-weight: 400;
113+
line-height: 1.5;
114+
padding: 3px 20px;
115+
text-align: inherit;
116+
white-space: nowrap;
117+
}
118+
119+
.react-contextmenu-item.react-contextmenu-item--active,
120+
.react-contextmenu-item.react-contextmenu-item--selected {
121+
color: #fff;
122+
background-color: #20a0ff;
123+
border-color: #20a0ff;
124+
text-decoration: none;
125+
}
126+
127+
.react-contextmenu-item.react-contextmenu-item--disabled,
128+
.react-contextmenu-item.react-contextmenu-item--disabled:hover {
129+
background-color: transparent;
130+
border-color: rgba(0,0,0,.15);
131+
color: #878a8c;
132+
}
133+
134+
.react-contextmenu-item--divider {
135+
border-bottom: 1px solid rgba(0,0,0,.15);
136+
cursor: inherit;
137+
margin-bottom: 3px;
138+
padding: 2px 0;
139+
}
140+
.react-contextmenu-item--divider:hover {
141+
background-color: transparent;
142+
border-color: rgba(0,0,0,.15);
143+
}
144+
145+
.react-contextmenu-item.react-contextmenu-submenu {
146+
padding: 0;
147+
}
148+
149+
.react-contextmenu-item.react-contextmenu-submenu > .react-contextmenu-item {
150+
}
151+
152+
.react-contextmenu-item.react-contextmenu-submenu > .react-contextmenu-item:after {
153+
content: "▶";
154+
display: inline-block;
155+
position: absolute;
156+
right: 7px;
157+
}
158+
159+
.react-contextmenu-wrapper {
160+
height:100%;
161+
}

0 commit comments

Comments
 (0)