Clamp Designer UI

From c95e8dfe17f9ebf48ece6450c7bab40d7546ee0d Mon Sep 17 00:00:00 2001 From: sebdet Date: Tue, 25 Jun 2019 11:06:06 +0200 Subject: Frontend initial draft New frontend initial draft in React with docker image in nginx Issue-ID: CLAMP-413 Change-Id: Ie5826d79aa3db23f863e8fd217189ba41534abe9 Signed-off-by: sebdet --- .gitignore | 2 + pom.xml | 36 +++++++++++++---- src/main/docker/Dockerfile | 34 ---------------- src/main/docker/assembly/clamp-files.xml | 58 --------------------------- src/main/docker/backend/Dockerfile | 57 ++++++++++++++++++++++++++ src/main/docker/backend/backend-files.xml | 43 ++++++++++++++++++++ src/main/docker/frontend/Dockerfile | 52 ++++++++++++++++++++++++ src/main/docker/frontend/frontend-files.xml | 43 ++++++++++++++++++++ src/main/docker/kibana/Dockerfile | 58 +++++++++++++++++++++++++++ src/main/docker/kibana/Dockerfile.kibana | 58 --------------------------- src/main/docker/logstash/Dockerfile | 36 +++++++++++++++++ src/main/docker/logstash/Dockerfile.logstash | 28 ------------- src/main/resources/boot-message.txt | 19 ++++----- ui-react/nginx/nginx.conf | 17 ++++++++ ui-react/package.json | 27 +++++++++++++ ui-react/public/index.html | 18 +++++++++ ui-react/public/manifest.json | 15 +++++++ ui-react/public/onap.ico | Bin 0 -> 18046 bytes ui-react/src/images/logo_onap_2017.png | Bin 0 -> 21360 bytes ui-react/src/index.css | 50 +++++++++++++++++++++++ ui-react/src/index.js | 46 +++++++++++++++++++++ 21 files changed, 503 insertions(+), 194 deletions(-) delete mode 100644 src/main/docker/Dockerfile delete mode 100644 src/main/docker/assembly/clamp-files.xml create mode 100644 src/main/docker/backend/Dockerfile create mode 100644 src/main/docker/backend/backend-files.xml create mode 100644 src/main/docker/frontend/Dockerfile create mode 100644 src/main/docker/frontend/frontend-files.xml create mode 100644 src/main/docker/kibana/Dockerfile delete mode 100644 src/main/docker/kibana/Dockerfile.kibana create mode 100644 src/main/docker/logstash/Dockerfile delete mode 100644 src/main/docker/logstash/Dockerfile.logstash create mode 100644 ui-react/nginx/nginx.conf create mode 100644 ui-react/package.json create mode 100644 ui-react/public/index.html create mode 100644 ui-react/public/manifest.json create mode 100644 ui-react/public/onap.ico create mode 100644 ui-react/src/images/logo_onap_2017.png create mode 100644 ui-react/src/index.css create mode 100644 ui-react/src/index.js diff --git a/.gitignore b/.gitignore index f70506ad0..ed38c1320 100644 --- a/.gitignore +++ b/.gitignore @@ -5,6 +5,8 @@ target .buildpath .idea *.iml +ui-react/node_modules +ui-react/build **/logs/ **/.evosuite/ **/debug-logs/ diff --git a/pom.xml b/pom.xml index ec1033b05..79cf2a982 100644 --- a/pom.xml +++ b/pom.xml @@ -1025,8 +1025,8 @@ - onap/clamp - onap-clamp + onap/clamp-backend + onap-clamp-backend true @@ -1039,10 +1039,32 @@ - Dockerfile + backend/Dockerfile - assembly/clamp-files.xml - onap-clamp + backend/backend-files.xml + onap-clamp-backend + + + + + onap/clamp-frontend + onap-clamp-frontend + + true + + + true + + latest + ${project.docker.latesttagtimestamp.version} + ${project.docker.latesttag.version} + + + frontend/Dockerfile + + frontend/frontend-files.xml + onap-clamp-frontend @@ -1059,7 +1081,7 @@ ${project.docker.latesttagtimestamp.version} ${project.docker.latesttag.version} - logstash/Dockerfile.logstash + logstash/Dockerfile @@ -1075,7 +1097,7 @@ ${project.docker.latesttagtimestamp.version} ${project.docker.latesttag.version} - kibana/Dockerfile.kibana + kibana/Dockerfile diff --git a/src/main/docker/Dockerfile b/src/main/docker/Dockerfile deleted file mode 100644 index c47d6229e..000000000 --- a/src/main/docker/Dockerfile +++ /dev/null @@ -1,34 +0,0 @@ -FROM openjdk:8u191-jdk-alpine3.9 - -MAINTAINER "The Onap Team" -LABEL Description="This immage contains alpine, openjdk 11 and clamp" - -ARG http_proxy -ARG https_proxy -ENV HTTP_PROXY=$http_proxy -ENV HTTPS_PROXY=$https_proxy -ENV http_proxy=$HTTP_PROXY -ENV https_proxy=$HTTPS_PROXY - -RUN addgroup onap && adduser -D -G onap clamp -VOLUME /opt/clamp/config -RUN mkdir /var/log/onap -RUN chmod a+rwx /var/log/onap - -COPY onap-clamp/clamp.jar /opt/clamp/app.jar -RUN chmod 700 /opt/clamp/app.jar - -RUN chown -R clamp:onap /opt/clamp - -RUN apk add fontconfig -RUN apk add ttf-dejavu - -RUN ln -s /usr/lib/libfontconfig.so.1 /usr/lib/libfontconfig.so && \ - ln -s /lib/libuuid.so.1 /usr/lib/libuuid.so.1 && \ - ln -s /lib/libc.musl-x86_64.so.1 /usr/lib/libc.musl-x86_64.so.1 - -ENV LD_LIBRARY_PATH /usr/lib - -USER clamp -WORKDIR /opt/clamp/ -ENTRYPOINT ["java","-Djava.security.egd=file:/dev/./urandom","-Xms256m", "-Xmx1g", "-jar" ,"./app.jar"] diff --git a/src/main/docker/assembly/clamp-files.xml b/src/main/docker/assembly/clamp-files.xml deleted file mode 100644 index e4e9875c5..000000000 --- a/src/main/docker/assembly/clamp-files.xml +++ /dev/null @@ -1,58 +0,0 @@ - - - - clamp-files - - - tar.gz - - false - - - - - - - ${project.build.finalName}.jar - - ${project.build.directory} - / - - - - >etc/config/** - - ${project.build.directory} - / - - - - etc/keystore/** - - ${project.build.directory} - / - - - - diff --git a/src/main/docker/backend/Dockerfile b/src/main/docker/backend/Dockerfile new file mode 100644 index 000000000..9e5c8d8b1 --- /dev/null +++ b/src/main/docker/backend/Dockerfile @@ -0,0 +1,57 @@ +### +# ============LICENSE_START======================================================= +# ONAP CLAMP +# ================================================================================ +# Copyright (C) 2018 AT&T Intellectual Property. All rights +# reserved. +# ================================================================================ +# Licensed under the Apache License, Version 2.0 (the "License"); +# you may not use this file except in compliance with the License. +# You may obtain a copy of the License at +# +# http://www.apache.org/licenses/LICENSE-2.0 +# +# Unless required by applicable law or agreed to in writing, software +# distributed under the License is distributed on an "AS IS" BASIS, +# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +# See the License for the specific language governing permissions and +# limitations under the License. +# ============LICENSE_END============================================ +# =================================================================== +# +### + +FROM openjdk:8u191-jdk-alpine3.9 + +MAINTAINER "The Onap Team" +LABEL Description="This immage contains alpine, openjdk 11 and clamp" + +ARG http_proxy +ARG https_proxy +ENV HTTP_PROXY=$http_proxy +ENV HTTPS_PROXY=$https_proxy +ENV http_proxy=$HTTP_PROXY +ENV https_proxy=$HTTPS_PROXY + +RUN addgroup onap && adduser -D -G onap clamp +VOLUME /opt/clamp/config +RUN mkdir /var/log/onap +RUN chmod a+rwx /var/log/onap + +COPY onap-clamp-backend/clamp.jar /opt/clamp/app.jar +RUN chmod 700 /opt/clamp/app.jar + +RUN chown -R clamp:onap /opt/clamp + +RUN apk add fontconfig +RUN apk add ttf-dejavu + +RUN ln -s /usr/lib/libfontconfig.so.1 /usr/lib/libfontconfig.so && \ + ln -s /lib/libuuid.so.1 /usr/lib/libuuid.so.1 && \ + ln -s /lib/libc.musl-x86_64.so.1 /usr/lib/libc.musl-x86_64.so.1 + +ENV LD_LIBRARY_PATH /usr/lib + +USER clamp +WORKDIR /opt/clamp/ +ENTRYPOINT ["java","-Djava.security.egd=file:/dev/./urandom","-Xms256m", "-Xmx1g", "-jar" ,"./app.jar"] diff --git a/src/main/docker/backend/backend-files.xml b/src/main/docker/backend/backend-files.xml new file mode 100644 index 000000000..7a9c6f530 --- /dev/null +++ b/src/main/docker/backend/backend-files.xml @@ -0,0 +1,43 @@ + + + + clamp-files + + + tar.gz + + false + + + + + + ${project.build.finalName}.jar + + ${project.build.directory} + / + + + + diff --git a/src/main/docker/frontend/Dockerfile b/src/main/docker/frontend/Dockerfile new file mode 100644 index 000000000..8c755b039 --- /dev/null +++ b/src/main/docker/frontend/Dockerfile @@ -0,0 +1,52 @@ +### +# ============LICENSE_START======================================================= +# ONAP CLAMP +# ================================================================================ +# Copyright (C) 2019 AT&T Intellectual Property. All rights +# reserved. +# ================================================================================ +# Licensed under the Apache License, Version 2.0 (the "License"); +# you may not use this file except in compliance with the License. +# You may obtain a copy of the License at +# +# http://www.apache.org/licenses/LICENSE-2.0 +# +# Unless required by applicable law or agreed to in writing, software +# distributed under the License is distributed on an "AS IS" BASIS, +# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +# See the License for the specific language governing permissions and +# limitations under the License. +# ============LICENSE_END============================================ +# =================================================================== +# +### + +# build environment +FROM node:12.4-alpine as build +WORKDIR /app +#ENV PATH /app/node_modules/.bin:$PATH +COPY onap-clamp-frontend/ /app/ +RUN npm install --silent +RUN npm run build + +FROM nginx:1.17.0-alpine + +MAINTAINER "The Onap Team" +LABEL Description="This image contains Clamp frontend" + +ARG http_proxy +ARG https_proxy +ENV HTTP_PROXY=$http_proxy +ENV HTTPS_PROXY=$https_proxy +ENV http_proxy=$HTTP_PROXY +ENV https_proxy=$HTTPS_PROXY + +RUN addgroup onap && adduser -D -G onap clamp +RUN mkdir /var/log/onap +RUN chmod a+rwx /var/log/onap + +COPY --from=build /app/build /usr/share/nginx/html +RUN rm /etc/nginx/conf.d/default.conf +COPY onap-clamp-frontend/nginx/nginx.conf /etc/nginx/conf.d +EXPOSE 80 +CMD ["nginx", "-g", "daemon off;"] \ No newline at end of file diff --git a/src/main/docker/frontend/frontend-files.xml b/src/main/docker/frontend/frontend-files.xml new file mode 100644 index 000000000..2610e828e --- /dev/null +++ b/src/main/docker/frontend/frontend-files.xml @@ -0,0 +1,43 @@ + + + + clamp-files + + + tar.gz + + false + + + + + + node_modules + + ${project.basedir}/ui-react + / + + + + diff --git a/src/main/docker/kibana/Dockerfile b/src/main/docker/kibana/Dockerfile new file mode 100644 index 000000000..9962fe31a --- /dev/null +++ b/src/main/docker/kibana/Dockerfile @@ -0,0 +1,58 @@ +### +# ============LICENSE_START======================================================= +# ONAP CLAMP +# ================================================================================ +# Copyright (C) 2018 AT&T Intellectual Property. All rights +# reserved. +# ================================================================================ +# Licensed under the Apache License, Version 2.0 (the "License"); +# you may not use this file except in compliance with the License. +# You may obtain a copy of the License at +# +# http://www.apache.org/licenses/LICENSE-2.0 +# +# Unless required by applicable law or agreed to in writing, software +# distributed under the License is distributed on an "AS IS" BASIS, +# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +# See the License for the specific language governing permissions and +# limitations under the License. +# ============LICENSE_END============================================ +# =================================================================== +# +### + +FROM docker.elastic.co/kibana/kibana-oss:6.6.2 + +MAINTAINER "The Onap Team" +LABEL Description="Kibana image with saved objects loading" +USER root +RUN yum install -y python-requests && yum clean all + +# You can share volume on this folder to restore +# a default kibana configuration. Each subfolder will +# be considered as a saved-object folder generated by, +# the backup.py script bundled with the image. +# Structure example : +# saved-objects/ +# └── default +# ├── config +# │ └── config-6.1.3.json +# ├── dashboard +# │ └── dashboard-e6a82230-c190-11e8-a550-27f2e3138fee.json +# ├── index-pattern +# │ └── index-pattern-3ecb1c70-c190-11e8-a550-27f2e3138fee.json +# ├── search +# │ └── search-abdd0440-c190-11e8-a550-27f2e3138fee.json +# └── visualization +# ├── visualization-cb896270-c190-11e8-a550-27f2e3138fee.json +# └── visualization-d837b120-c190-11e8-a550-27f2e3138fee.json + +RUN mkdir /saved-objects/ && chown kibana:kibana /saved-objects/ + +USER kibana + +ADD saved-objects /saved-objects +ADD startup.sh /usr/local/bin/startup.sh +ADD restore.py /usr/local/bin/restore.py +ADD backup.py /usr/local/bin/backup.py +CMD /usr/local/bin/startup.sh diff --git a/src/main/docker/kibana/Dockerfile.kibana b/src/main/docker/kibana/Dockerfile.kibana deleted file mode 100644 index 9962fe31a..000000000 --- a/src/main/docker/kibana/Dockerfile.kibana +++ /dev/null @@ -1,58 +0,0 @@ -### -# ============LICENSE_START======================================================= -# ONAP CLAMP -# ================================================================================ -# Copyright (C) 2018 AT&T Intellectual Property. All rights -# reserved. -# ================================================================================ -# Licensed under the Apache License, Version 2.0 (the "License"); -# you may not use this file except in compliance with the License. -# You may obtain a copy of the License at -# -# http://www.apache.org/licenses/LICENSE-2.0 -# -# Unless required by applicable law or agreed to in writing, software -# distributed under the License is distributed on an "AS IS" BASIS, -# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -# See the License for the specific language governing permissions and -# limitations under the License. -# ============LICENSE_END============================================ -# =================================================================== -# -### - -FROM docker.elastic.co/kibana/kibana-oss:6.6.2 - -MAINTAINER "The Onap Team" -LABEL Description="Kibana image with saved objects loading" -USER root -RUN yum install -y python-requests && yum clean all - -# You can share volume on this folder to restore -# a default kibana configuration. Each subfolder will -# be considered as a saved-object folder generated by, -# the backup.py script bundled with the image. -# Structure example : -# saved-objects/ -# └── default -# ├── config -# │ └── config-6.1.3.json -# ├── dashboard -# │ └── dashboard-e6a82230-c190-11e8-a550-27f2e3138fee.json -# ├── index-pattern -# │ └── index-pattern-3ecb1c70-c190-11e8-a550-27f2e3138fee.json -# ├── search -# │ └── search-abdd0440-c190-11e8-a550-27f2e3138fee.json -# └── visualization -# ├── visualization-cb896270-c190-11e8-a550-27f2e3138fee.json -# └── visualization-d837b120-c190-11e8-a550-27f2e3138fee.json - -RUN mkdir /saved-objects/ && chown kibana:kibana /saved-objects/ - -USER kibana - -ADD saved-objects /saved-objects -ADD startup.sh /usr/local/bin/startup.sh -ADD restore.py /usr/local/bin/restore.py -ADD backup.py /usr/local/bin/backup.py -CMD /usr/local/bin/startup.sh diff --git a/src/main/docker/logstash/Dockerfile b/src/main/docker/logstash/Dockerfile new file mode 100644 index 000000000..73988dc79 --- /dev/null +++ b/src/main/docker/logstash/Dockerfile @@ -0,0 +1,36 @@ +### +# ============LICENSE_START======================================================= +# ONAP CLAMP +# ================================================================================ +# Copyright (C) 2018 AT&T Intellectual Property. All rights +# reserved. +# ================================================================================ +# Licensed under the Apache License, Version 2.0 (the "License"); +# you may not use this file except in compliance with the License. +# You may obtain a copy of the License at +# +# http://www.apache.org/licenses/LICENSE-2.0 +# +# Unless required by applicable law or agreed to in writing, software +# distributed under the License is distributed on an "AS IS" BASIS, +# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +# See the License for the specific language governing permissions and +# limitations under the License. +# ============LICENSE_END============================================ +# =================================================================== +# +### +FROM docker.elastic.co/logstash/logstash-oss:6.6.2 + +MAINTAINER "The Onap Team" +LABEL Description="Logstash image with some plugins needed for the clamp dashboard" + +# Default aaf certificates +COPY certs /certs.d/ + +# remove default pipeline first +COPY pipeline/logstash.conf /usr/share/logstash/pipeline/logstash.conf + +# add plugins needed by aggregation part of the pipeline +RUN /usr/share/logstash/bin/logstash-plugin install logstash-filter-elasticsearch +RUN /usr/share/logstash/bin/logstash-plugin install logstash-filter-prune diff --git a/src/main/docker/logstash/Dockerfile.logstash b/src/main/docker/logstash/Dockerfile.logstash deleted file mode 100644 index f3075099c..000000000 --- a/src/main/docker/logstash/Dockerfile.logstash +++ /dev/null @@ -1,28 +0,0 @@ -# Copyright (c) 2018 AT&T Intellectual Property. All rights reserved. -# -# Licensed under the Apache License, Version 2.0 (the "License"); -# you may not use this file except in compliance with the License. -# You may obtain a copy of the License at -# -# http://www.apache.org/licenses/LICENSE-2.0 -# -# Unless required by applicable law or agreed to in writing, software -# distributed under the License is distributed on an "AS IS" BASIS, -# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -# See the License for the specific language governing permissions and -# limitations under the License. - -FROM docker.elastic.co/logstash/logstash-oss:6.6.2 - -MAINTAINER "The Onap Team" -LABEL Description="Logstash image with some plugins needed for the clamp dashboard" - -# Default aaf certificates -COPY certs /certs.d/ - -# remove default pipeline first -COPY pipeline/logstash.conf /usr/share/logstash/pipeline/logstash.conf - -# add plugins needed by aggregation part of the pipeline -RUN /usr/share/logstash/bin/logstash-plugin install logstash-filter-elasticsearch -RUN /usr/share/logstash/bin/logstash-plugin install logstash-filter-prune diff --git a/src/main/resources/boot-message.txt b/src/main/resources/boot-message.txt index 92e4ab029..46b0a6faa 100644 --- a/src/main/resources/boot-message.txt +++ b/src/main/resources/boot-message.txt @@ -1,14 +1,15 @@ - _____ _ _ __ ____ ____ __ __ ____ __ ____ _ _ -( _ )( \( ) /__\ ( _ \ ( _ \( )( )( _ \( ) (_ _)( \( ) - )(_)( ) ( /(__)\ )___/ )(_) ))(__)( ) _ < )(__ _)(_ ) ( -(_____)(_)\_)(__)(__)(__) (____/(______)(____/(____)(____)(_)\_) - ___ __ __ __ __ ____ - / __)( ) /__\ ( \/ )( _ \ - ( (__ )(__ /(__)\ ) ( )___/ - \___)(____)(__)(__)(_/\/\_)(__) - + ▐ ▄ ▄▄▄· ▄▄▄· ▄▄▄ .▄▄▌ ▄▄▄· ▄▄▌ ▄▄▄▄▄ +▪ •█▌▐█▐█ ▀█ ▐█ ▄█ ▀▄.▀·██• ▐█ ▀█ ██• •██ ▪ + ▄█▀▄ ▐█▐▐▌▄█▀▀█ ██▀· ▐▀▀▪▄██▪ ▄█▀▀█ ██▪ ▐█.▪ ▄█▀▄ +▐█▌.▐▌██▐█▌▐█ ▪▐▌▐█▪·• ▐█▄▄▌▐█▌▐▌ ▐█ ▪▐▌▐█▌▐▌▐█▌·▐█▌.▐▌ + ▀█▄▀▪▀▀ █▪ ▀ ▀ .▀ ▀▀▀ .▀▀▀ ▀ ▀ .▀▀▀ ▀▀▀ ▀█▄▀▪ + ▄▄· ▄▄▌ ▄▄▄· • ▌ ▄ ·. ▄▄▄· + ▐█ ▌▪██• ▐█ ▀█ ·██ ▐███▪▐█ ▄█ + ██ ▄▄██▪ ▄█▀▀█ ▐█ ▌▐▌▐█· ██▀· + ▐███▌▐█▌▐▌▐█ ▪▐▌██ ██▌▐█▌▐█▪·• + ·▀▀▀ .▀▀▀ ▀ ▀ ▀▀ █▪▀▀▀.▀ :: Starting :: \ No newline at end of file diff --git a/ui-react/nginx/nginx.conf b/ui-react/nginx/nginx.conf new file mode 100644 index 000000000..758a646e5 --- /dev/null +++ b/ui-react/nginx/nginx.conf @@ -0,0 +1,17 @@ +server { + + listen 80; + + location / { + root /usr/share/nginx/html; + index index.html index.htm; + try_files $uri $uri/ /index.html; + } + + error_page 500 502 503 504 /50x.html; + + location = /50x.html { + root /usr/share/nginx/html; + } + +} \ No newline at end of file diff --git a/ui-react/package.json b/ui-react/package.json new file mode 100644 index 000000000..c8197d1e6 --- /dev/null +++ b/ui-react/package.json @@ -0,0 +1,27 @@ +{ + "name": "clamp-ui", + "version": "0.0.1", + "description": "ONAP Clamp Designer UI", + "main": "index.js", + "scripts": { + "start": "react-scripts start", + "build": "react-scripts build", + "test": "react-scripts test --env=jsdom", + "eject": "react-scripts eject" + }, + "author": "ONAP Clamp Team", + "license": "Apache-2.0", + "dependencies": { + "json-editor": "^0.7.28", + "react": "~16.8.0", + "react-dom": "~16.8.0", + "react-scripts": "~3.0.1", + "onap-ui-react":"0.1.1" + }, + "browserslist": [ + ">0.2%", + "not dead", + "not ie <= 11", + "not op_mini all" + ] +} diff --git a/ui-react/public/index.html b/ui-react/public/index.html new file mode 100644 index 000000000..85267426d --- /dev/null +++ b/ui-react/public/index.html @@ -0,0 +1,18 @@ + + + + + + + + + + +Clamp Designer UI + + + +

+ + diff --git a/ui-react/public/manifest.json b/ui-react/public/manifest.json new file mode 100644 index 000000000..8210c4ee5 --- /dev/null +++ b/ui-react/public/manifest.json @@ -0,0 +1,15 @@ +{ + "short_name": "Clamp Designer UI", + "name": "Clamp Designer UI", + "icons": [ + { + "src": "onap.ico", + "sizes": "64x64 32x32 24x24 16x16", + "type": "image/x-icon" + } + ], + "start_url": "./index.html", + "display": "standalone", + "theme_color": "#000000", + "background_color": "#ffffff" +} diff --git a/ui-react/public/onap.ico b/ui-react/public/onap.ico new file mode 100644 index 000000000..85e168ae2 Binary files /dev/null and b/ui-react/public/onap.ico differ diff --git a/ui-react/src/images/logo_onap_2017.png b/ui-react/src/images/logo_onap_2017.png new file mode 100644 index 000000000..c6f6857a5 Binary files /dev/null and b/ui-react/src/images/logo_onap_2017.png differ diff --git a/ui-react/src/index.css b/ui-react/src/index.css new file mode 100644 index 000000000..86e0f9e4b --- /dev/null +++ b/ui-react/src/index.css @@ -0,0 +1,50 @@ +.nav { + margin-left: 2px; + margin-right: 2px; +} +.navbar-brand { + float: left; + height: 50px; + padding: 15px 15px; + font-size: 18px; + line-height: 20px; +} +.rowC { + display: flex; + flex-direction:row; +} +.logo { + font-family: 'Trebuchet MS', cursive; + font-size: 20px; + font-weight: 500; + text-align: center; +} +.image_style { + display: inline-block; + float: left; +} +.dummy { + float: right; + padding-right: 50px; +} +.user_name { + display: block; + float: left; + font-family: 'Trebuchet MS', cursive; + font-size: 15px; + font-weight: 500; + height: 50px; + text-align: right; +} + +.ClampHeader { + margin-left: 2px; + margin-right: 2px; +} + +.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 { + float: left; + } + .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 { + float: left; + } \ No newline at end of file diff --git a/ui-react/src/index.js b/ui-react/src/index.js new file mode 100644 index 000000000..fed8c0f41 --- /dev/null +++ b/ui-react/src/index.js @@ -0,0 +1,46 @@ +import React from 'react'; +import ReactDOM from 'react-dom'; +import './index.css'; + +class UserBar extends React.Component { + render () { + const user = this.props.user; + return ( +

Hello:{user} +

+ ); + } +} + +class ClampLogo extends React.Component { + render() { + return ( +

+ + CLAMP +

+ ); + } +} + +class ClampHeader extends React.Component { + render() { + return ( +

+ +

+ ); + } +} + +ReactDOM.render( + , + document.getElementById('root') +) -- cgit 1.2.3-korg