Graphical enhancement

charlycou · Sep 8, 2021 · aefa281 · aefa281
1 parent 4e6c3d2
commit aefa281
Show file tree

Hide file tree

Showing 9 changed files with 107 additions and 25 deletions.
diff --git a/.RData b/.RData
diff --git a/R/app_server.R b/R/app_server.R
@@ -54,6 +54,7 @@ server <- function(input, output, session) {
 
   if (main.env$dev){
     shinyjs::show("dev")
+    shinyjs::show("disclaimer-wip")
     observeEvent(input$dev, {
       if (main.env$current.tab() != "fill" &&
           main.env$current.tab() != "upload")
@@ -108,7 +109,7 @@ server <- function(input, output, session) {
 
   # Disclaimer
   observe({
-    invalidateLater(60*1000)
+    invalidateLater(5*60*1000)
     devmsg(
       tag = "DEV",
       "Connected users at %s: %s",

diff --git a/R/eal_1_SelectDP.R b/R/eal_1_SelectDP.R
@@ -36,7 +36,8 @@ SelectDPUI <- function(id) {
               )
             )
           )
-        )
+        ),
+        tags$hr()
       ),
       fluidRow(
         # Load existing DP ----

diff --git a/R/fill_module.R b/R/fill_module.R
@@ -5,34 +5,65 @@ fillUI <- function(id) {
   tabsetPanel(
     id = NS(id, "tabs"),
     tabPanel(
-      "EAL",
+      tags$h4("EML Assembly Line"),
       fluidPage(
         style = "padding-top:2.5%;",
         # * Top row ----
         tags$span(
           fluidRow(
             div(
-              h4("EML Assembly Line"),
-              h3(textOutput(NS(id, "current_step"))),
+              HTML(
+                '<svg style="height: 50px;width: 100%;/*! bottom: -35px; */position: absolute;">
+                  <line y1="0" y2="0" style="stroke:rgb(149, 149, 149);stroke-width:3" x2="400" x1="-1000"></line>
+                  <line y1="0" y2="50" style="stroke:rgb(149, 149, 149);stroke-width:3" x2="450" x1="400"></line>
+                  <line y1="50" x2="2000" y2="50" style="stroke:rgb(149, 149, 149);stroke-width:3" x1="450"></line>
+                </svg>'
+              ),
+              h3(
+                textOutput(NS(id, "current_step"))
+              ),
               style = "float: left"
             ),
             div(
-              actionButton(
+              shinyWidgets::actionBttn(
                 NS(id, "help"), 
-                "Help", 
-                icon("question-circle")
+                "Help",
+                icon("question-circle"),
+                style = "simple",
+                color = "primary"
               ),
-              actionButton(
+              # actionButton(
+              #   NS(id, "help"), 
+              #   "Help", 
+              #   icon("question-circle"),
+              #   style = "background-color: #6cb5e1; color: #fff"
+              # ),
+              shinyWidgets::actionBttn(
                 NS(id, "save"),
                 "Save",
-                icon("save")
-              ), # fill-wizard-save
-              actionButton(
+                icon("save"),
+                style = "simple",
+                color = "success"
+              ),
+              # actionButton(
+              #   NS(id, "save"),
+              #   "Save",
+              #   icon("save"),
+              #   style = "background-color: #a2d98e;"
+              # ), # fill-wizard-save
+              shinyWidgets::actionBttn(
                 NS(id, "quit"), 
                 "Quit",
                 icon("times-circle"),
-                class = "danger"
-              ), # fill-wizard-quit
+                style = "simple",
+                color = "danger"
+              ),
+              # actionButton(
+              #   NS(id, "quit"), 
+              #   "Quit",
+              #   icon("times-circle"),
+              #   class = "danger"
+              # ), # fill-wizard-quit
               style = "float: right;"
             ), # fill-wizard-help
             style = "width: 100%"
@@ -49,7 +80,7 @@ fillUI <- function(id) {
       ) # end fluidPage
     ),
     tabPanel(
-      "MetaFIN",
+      tags$h4("MetaFIN"),
       MetaFINUI(
         NS(id, "metafin"),
         wip = base::get("metashark.args", envir = .GlobalEnv)$wip

diff --git a/R/fill_pages.R b/R/fill_pages.R
@@ -196,12 +196,19 @@ pagesServer <- function(id, main.env) {
 #'
 #' @noRd
 nextTabButton <- function(id, i) {
-  actionButton(
+  shinyWidgets::actionBttn(
     NS(id, paste(i, i + 1, sep = "_")),
     "Next",
-    icon = icon("arrow-right"),
-    width = "100%"
+    icon("arrow-right"),
+    # style = "pill",
+    block = TRUE
   )
+  # actionButton(
+  #   NS(id, paste(i, i + 1, sep = "_")),
+  #   "Next",
+  #   icon = icon("arrow-right"),
+  #   width = "100%"
+  # )
 }
 
 # * Previous ====
@@ -210,10 +217,17 @@ nextTabButton <- function(id, i) {
 #'
 #' @noRd
 prevTabButton <- function(id, i) {
-  actionButton(
+  shinyWidgets::actionBttn(
     NS(id, paste(i, i - 1, sep = "_")),
     "Previous",
-    icon = icon("arrow-left"),
-    width = "100%"
+    icon("arrow-left"),
+    # style = "pill",
+    block = TRUE
   )
+  # actionButton(
+  #   NS(id, paste(i, i - 1, sep = "_")),
+  #   "Previous",
+  #   icon = icon("arrow-left"),
+  #   width = "100%"
+  # )
 }
diff --git a/R/metafin.R b/R/metafin.R
@@ -3,7 +3,6 @@ MetaFINUI <- function(id, wip) {
 
   if(wip) {
     wipRow(
-      tags$h3("MetaFIN"),
       fileInput(
         ns("file"),
         "Select a valid EML file (.xml)",

diff --git a/R/welcome_module.R b/R/welcome_module.R
@@ -10,9 +10,12 @@ welcomeUI <- function(id) {
       # MetaShARK
       tags$h1("Welcome in MetaShARK"),
       fluidRow(
-        wipRow(
-          tags$p("DISCLAIMER: some features are still in development. Some parts
+        shinyjs::hidden(
+          wipRow(
+            id = "disclaimer-wip",
+            tags$p("DISCLAIMER: some features are still in development. Some parts
             with this color code are not meant to be fully functional.")
+          )
         ),
         column(
           6,
@@ -60,7 +63,7 @@ welcomeUI <- function(id) {
           tags$p(
             HTML("The application you are currently using is a front-end
             tool for any user who wants to contribute to a DataOne node
-            repository, also known as <b>metadata catalog</b> or <b>MetaCat</b>.
+            repository, also known as <b>metadata catalogue</b> or <b>MetaCat</b>.
             To contribute to a MetaCat, you need to login to the metacat
             in which you want to upload your data package. Then, it will 
             be possible for MetaShARK to gather the needed informations, as

diff --git a/inst/app/www/styles.css b/inst/app/www/styles.css
@@ -1,11 +1,44 @@
+/* Color palette */
+
+.color1 {color: #000002;}
+.color2 {color: #172a3a;}
+.color3 {color: #325975;}
+.color4 {color: #4e91b9;}
+.color5 {color: #6bd1ff;}
+.white {color: #fff}
+
 /* -- Overwrite -- */
 
+.content-wrapper {
+  background-color: #f4f4f4 !important;
+}
+
+.form-control {
+  background-color: #fff !important;
+}
+
 img {
 	display: block;
 	margin-left: auto;
 	margin-right: auto;
 }
 
+.logo {
+  background-color: #4e91b9 !important;
+}
+
+.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {
+  background-color: transparent;
+}
+
+.navbar {
+  background-color: #4e91b9 !important;
+}
+
+.main-sidebar {
+  background-color: #172a3a !important;
+}
+
 p {
   text-align: justify;
 }

diff --git a/inst/media/logo_pndb.png b/inst/media/logo_pndb.png
-Original file line number
+Diff line change
@@ Expand Up / @@ -36,7 +36,8 @@ SelectDPUI <- function(id) { @@
                   )
                 )
               )
-            )
+            ),
+            tags$hr()
           ),
           fluidRow(
             # Load existing DP ----
@@ Expand Down @@