0.8.7 updates

.github/workflows/docker-image.yml

@@ -0,0 +1,55 @@
+name: Docker Image CI
+
+on:
+  push:
+    branches: [ 0.8.7-updates ]
+
+env:
+  REGISTRY: ghcr.io
+  IMAGE_NAME: ${{ github.repository }}
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      packages: write
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v2
+
+      - name: Build Frontend
+        uses: actions/setup-node@v2
+
+      - run: npm install
+      - run: npm run build
+
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v1
+
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v1
+
+      - name: Log in to the Container registry
+        uses: docker/login-action@v1
+        with:
+          registry: ${{ env.REGISTRY }}
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Extract metadata (tags, labels) for Docker
+        id: meta
+        uses: docker/metadata-action@v3
+        with:
+          images: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}
+
+      - name: Build and push Docker image
+        uses: docker/build-push-action@v2
+        with:
+          context: .
+          push: true
+          file: DockerfileArch
+          platforms: linux/amd64,linux/arm64,linux/arm/v7
+          tags: ${{ steps.meta.outputs.tags }}
+          labels: ${{ steps.meta.outputs.labels }}
+

.gitignore

@@ -16,11 +16,12 @@ static/gifs/*
 *.gif
 static/backgrounds/*
 node_modules/*
-package-lock.json
 DCIDMap.xml
 .python-version
 static/data2.json
 *.map
 static/fonts/*
 static/*.js*
 config/*
+venv/*
+static/fonts/*

Dockerfile

@@ -1,17 +1,20 @@
-FROM python:3
+# syntax=docker/dockerfile:1
+FROM node:17-alpine AS micboard_frontend
+WORKDIR /home/node/app
+COPY . .
+RUN npm install
+RUN npm run build
 
-MAINTAINER Karl Swanson <karlcswanson@gmail.com>
+FROM python:3-alpine as micboard_server
 
-WORKDIR /usr/src/app
+LABEL org.opencontainers.image.authors="karl@micboard.io"
 
-RUN curl -sL https://deb.nodesource.com/setup_10.x | bash -
-RUN apt-get install nodejs
+WORKDIR /usr/src/app
 
 COPY . .
+COPY --from=micboard_frontend /home/node/app/static /usr/src/app/static/
 
 RUN pip3 install -r py/requirements.txt
-RUN npm install --only=prod
-RUN npm run build
 
 EXPOSE 8058
 

DockerfileArch

@@ -0,0 +1,13 @@
+FROM python:3-alpine
+
+LABEL org.opencontainers.image.authors="karl@micboard.io"
+
+WORKDIR /usr/src/app
+
+COPY . .
+
+RUN pip3 install -r py/requirements.txt
+
+EXPOSE 8058
+
+CMD ["python3", "py/micboard.py"]

DockerfileArch.dockerignore

@@ -0,0 +1,12 @@
+build
+css
+docs
+js
+node_modules
+Dockerfile
+DockerfileArch
+DockerfileArch.dockerignore
+docker-compose.yaml
+micboard.service
+package-lock.json
+webpack.config.js

css/style.scss

@@ -15,6 +15,7 @@ html,body {
 .col-sm {
   color: var(--color-white);
   border: 0px;
+  position: relative;
   // flex-grow: unset;
   // background-color: var(--color-black);
 }
@@ -143,6 +144,16 @@ canvas.slotgraph {
 }
 
 
+.powerlock{
+  display: none;
+  position: absolute;
+  bottom: 15px;
+  left: 5px;
+  // color: #587B7F;
+  color: #DA8F4A;
+  // color: var(--color-yellow-dark);
+}
+
 .quality {
   position: absolute;
   bottom: 80px;
@@ -237,7 +248,7 @@ canvas.slotgraph {
   font-weight: 300;
 }
 
-.editzone .form-row {
+.editzone .row {
   margin-left: 5px;
   margin-right: 5px;
 }
@@ -250,8 +261,8 @@ canvas.slotgraph {
   display: block;
 }
 
-#save-box .form-row,
-#paste-box .form-row {
+#save-box .row,
+#paste-box .row {
   padding-top: 15px;
 }
 
@@ -455,6 +466,11 @@ canvas.slotgraph {
     left: 5px;
   }
 
+  .powerlock {
+    bottom: 3px;
+    left: 1px;
+  }
+
   .quality {
     bottom: 25px;
     left: 5px;
@@ -639,12 +655,12 @@ canvas.slotgraph {
   padding-top: 4em;
 }
 
-.message-board{
+.message-board {
   display: none;
   background-color: var(--color-blue);
   color: var(--color-white);
-  margin-left: -15px;
-  margin-right: -15px;
+  padding-left: 50px !important;
+  padding-top: 75px !important;
   padding: 3em;
 }
 
@@ -666,8 +682,8 @@ canvas.slotgraph {
   background-color: var(--color-black);
   padding: .75rem 1.25rem;
   border: 1px solid var(--color-gray);
-  margin-left: -5px;
-  margin-right: -5px;
+  // margin-left: -5px;
+  // margin-right: -5px;
   border-radius: 12px 12px 0 0;
 }
 
@@ -680,8 +696,8 @@ canvas.slotgraph {
   background-color: var(--color-black);
   padding: .75rem 1.25rem;
   border: 1px solid var(--color-gray);
-  margin-left: -5px;
-  margin-right: -5px;
+  // margin-left: -5px;
+  // margin-right: -5px;
   border-radius: 0 0 12px 12px;
 }
 
@@ -807,7 +823,7 @@ a:link, a:visited, a:hover, a:active {
 
 #eslotlist {
   height: 400px;
-  overflow: scroll;
+  // overflow-y: scroll;
 }
 
 #eslotlist .col-sm {
@@ -851,7 +867,7 @@ a:link, a:visited, a:hover, a:active {
 }
 
 #hud {
-  display: none;
+  // display: none;
   position: absolute;
   right: 25px;
   bottom: 25px;