Convert all three-digit HEX colors to RGBA colors

zotero · Jan 1, 2020 · 403a994 · 403a994
1 parent d002637
commit 403a994
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 30 deletions.
diff --git a/examples/mobile-viewer/viewer.css b/examples/mobile-viewer/viewer.css
@@ -44,7 +44,7 @@ header h1 {
 
 body {
   background: url(images/document_bg.png);
-  color: #fff;
+  color: rgba(255, 255, 255, 1);
   font-family: sans-serif;
   font-size: 10px;
   height: 100%;
@@ -112,7 +112,7 @@ footer {
   border: 0;
   background-color: rgba(0, 0, 0, 0);
   font-size: 1.2rem;
-  color: #FFF;
+  color: rgba(255, 255, 255, 1);
   background-image: url(images/div_line_left.png), url(images/div_line_right.png);
   background-repeat: no-repeat;
   background-position: left, right;
@@ -188,8 +188,8 @@ canvas {
 #loadingBar {
   position: relative;
   height: .6rem;
-  background-color: #333;
-  border-bottom: 1px solid #333;
+  background-color: rgba(51, 51, 51, 1);
+  border-bottom: 1px solid rgba(51, 51, 51, 1);
   margin-top: 5rem;
 }
 
@@ -198,7 +198,7 @@ canvas {
   left: 0;
   width: 0;
   height: 100%;
-  background-color: #ddd;
+  background-color: rgba(221, 221, 221, 1);
   overflow: hidden;
   transition: width 200ms;
 }
@@ -210,7 +210,7 @@ canvas {
 }
 
 #loadingBar .progress.indeterminate {
-  background-color: #999;
+  background-color: rgba(153, 153, 153, 1);
   transition: none;
 }
 
@@ -220,11 +220,12 @@ canvas {
   left: 0;
   height: 100%;
   width: 5rem;
-
-  background-image: linear-gradient(to right, #999 0%, #fff 50%, #999 100%);
+  background-image: linear-gradient(to right,
+                                    rgba(153, 153, 153, 1) 0%,
+                                    rgba(255, 255, 255, 1) 50%,
+                                    rgba(153, 153, 153, 1) 100%);
   background-size: 100% 100%;
   background-repeat: no-repeat;
-
   animation: progressIndeterminate 2s linear infinite;
 }
 

diff --git a/test/annotation_layer_builder_overrides.css b/test/annotation_layer_builder_overrides.css
@@ -27,8 +27,8 @@
 .annotationLayer .linkAnnotation > a,
 .annotationLayer .buttonWidgetAnnotation.pushButton > a {
   opacity: 0.2;
-  background: #ff0;
-  box-shadow: 0px 2px 10px #ff0;
+  background: rgba(255, 255, 0, 1);
+  box-shadow: 0px 2px 10px rgba(255, 255, 0, 1);
 }
 
 .annotationLayer .popupAnnotation,

diff --git a/web/annotation_layer_builder.css b/web/annotation_layer_builder.css
@@ -30,8 +30,8 @@
 .annotationLayer .linkAnnotation > a:hover,
 .annotationLayer .buttonWidgetAnnotation.pushButton > a:hover {
   opacity: 0.2;
-  background: #ff0;
-  box-shadow: 0px 2px 10px #ff0;
+  background: rgba(255, 255, 0, 1);
+  box-shadow: 0px 2px 10px rgba(255, 255, 0, 1);
 }
 
 .annotationLayer .textAnnotation img {
@@ -84,7 +84,7 @@
 .annotationLayer .choiceWidgetAnnotation select:hover,
 .annotationLayer .buttonWidgetAnnotation.checkBox input:hover,
 .annotationLayer .buttonWidgetAnnotation.radioButton input:hover {
-  border: 1px solid #000;
+  border: 1px solid rgba(0, 0, 0, 1);
 }
 
 .annotationLayer .textWidgetAnnotation input:focus,
@@ -97,7 +97,7 @@
 .annotationLayer .buttonWidgetAnnotation.checkBox input:checked:before,
 .annotationLayer .buttonWidgetAnnotation.checkBox input:checked:after,
 .annotationLayer .buttonWidgetAnnotation.radioButton input:checked:before {
-  background-color: #000;
+  background-color: rgba(0, 0, 0, 1);
   content: '';
   display: block;
   position: absolute;
@@ -158,7 +158,7 @@
   z-index: 200;
   max-width: 20em;
   background-color: #FFFF99;
-  box-shadow: 0px 2px 5px #888;
+  box-shadow: 0px 2px 5px rgba(136, 136, 136, 1);
   border-radius: 2px;
   padding: 6px;
   margin-left: 5px;
@@ -182,7 +182,7 @@
 }
 
 .annotationLayer .popup p {
-  border-top: 1px solid #333;
+  border-top: 1px solid rgba(51, 51, 51, 1);
   margin-top: 2px;
   padding-top: 2px;
 }

diff --git a/web/viewer.css b/web/viewer.css
@@ -59,13 +59,13 @@ select {
 }
 
 #viewerContainer.pdfPresentationMode:-ms-fullscreen::-ms-backdrop {
-  background-color: #000;
+  background-color: rgba(0, 0, 0, 1);
 }
 
 #viewerContainer.pdfPresentationMode:fullscreen {
   top: 0px;
   border-top: 2px solid rgba(0, 0, 0, 0);
-  background-color: #000;
+  background-color: rgba(0, 0, 0, 1);
   width: 100%;
   height: 100%;
   overflow: hidden;
@@ -101,8 +101,7 @@ select {
   width: var(--sidebar-width);
   visibility: hidden;
   z-index: 100;
-  border-top: 1px solid #333;
-
+  border-top: 1px solid rgba(51, 51, 51, 1);
   transition-duration: 200ms;
   transition-timing-function: ease;
 }
@@ -278,8 +277,8 @@ html[dir='rtl'] #toolbarContainer, .findbar, .secondaryToolbar {
   position: relative;
   width: 100%;
   height: 4px;
-  background-color: #333;
-  border-bottom: 1px solid #333;
+  background-color: rgba(51, 51, 51, 1);
+  border-bottom: 1px solid rgba(51, 51, 51, 1);
 }
 
 #loadingBar .progress {
@@ -288,7 +287,7 @@ html[dir='rtl'] #toolbarContainer, .findbar, .secondaryToolbar {
   left: 0;
   width: 0%;
   height: 100%;
-  background-color: #ddd;
+  background-color: rgba(221, 221, 221, 1);
   overflow: hidden;
   transition: width 200ms;
 }
@@ -299,7 +298,7 @@ html[dir='rtl'] #toolbarContainer, .findbar, .secondaryToolbar {
 }
 
 #loadingBar .progress.indeterminate {
-  background-color: #999;
+  background-color: rgba(153, 153, 153, 1);
   transition: none;
 }
 
@@ -309,12 +308,10 @@ html[dir='rtl'] #toolbarContainer, .findbar, .secondaryToolbar {
   left: 0;
   height: 100%;
   width: calc(100% + 150px);
-
   background: repeating-linear-gradient(135deg,
-                                        #bbb 0, #999 5px,
-                                        #999 45px, #ddd 55px,
-                                        #ddd 95px, #bbb 100px);
-
+                                        rgba(187, 187, 187, 1) 0, rgba(153, 153, 153, 1) 5px,
+                                        rgba(153, 153, 153, 1) 45px, rgba(221, 221, 221, 1) 55px,
+                                        rgba(221, 221, 221, 1) 95px, rgba(187, 187, 187, 1) 100px);
   animation: progressIndeterminate 950ms linear infinite;
 }