noVNC: svg to png

weizhouapache · weizhouapache · commit 4c4351d3ca2e · 2023-02-23T09:55:50.000+01:00
diff --git a/systemvm/agent/noVNC/app/styles/base.css b/systemvm/agent/noVNC/app/styles/base.css
@@ -287,15 +287,15 @@ html {
   cursor: pointer;
   border-radius: 5px;
   background-color: rgb(83, 99, 122);
-  background-image: url("../images/handle_bg.svg");
+  background-image: url("../images/handle_bg.png");
   background-repeat: no-repeat;
   background-position: right;
   box-shadow: 3px 3px 0px rgba(0, 0, 0, 0.5);
 }
 #noVNC_control_bar_handle:after {
   content: "";
   transition: transform 0.5s ease-in-out;
-  background: url("../images/handle.svg");
+  background: url("../images/handle.png");
   position: absolute;
   top: 22px; /* (50px-6px)/2 */
   right: 5px;
@@ -514,7 +514,7 @@ html {
   cursor: pointer;
 }
 .noVNC_expander::before {
-  content: url("../images/expander.svg");
+  content: url("../images/expander.png");
   display: inline-block;
   margin-right: 5px;
   transition: 0.2s ease-in-out;
@@ -689,25 +689,25 @@ html {
   background: rgba(128,128,128,0.9);
 }
 #noVNC_status.noVNC_status_normal::before {
-  content: url("../images/info.svg") " ";
+  content: url("../images/info.png") " ";
 }
 #noVNC_status.noVNC_status_error {
   background: rgba(200,55,55,0.9);
 }
 #noVNC_status.noVNC_status_error::before {
-  content: url("../images/error.svg") " ";
+  content: url("../images/error.png") " ";
 }
 #noVNC_status.noVNC_status_warn {
   background: rgba(180,180,30,0.9);
 }
 #noVNC_status.noVNC_status_warn::before {
-  content: url("../images/warning.svg") " ";
+  content: url("../images/warning.png") " ";
 }
 #noVNC_status.noVNC_status_tls_success {
   background: rgba(6, 199, 38, 0.9);
 }
 #noVNC_status.noVNC_status_tls_success::before {
-  content: url("../images/connect.svg") " ";
+  content: url("../images/connect.png") " ";
 }
 
 /* ----------------------------------------
diff --git a/systemvm/agent/noVNC/vnc.html b/systemvm/agent/noVNC/vnc.html
@@ -40,9 +40,9 @@
     <link rel="stylesheet" href="app/styles/input.css">
 
     <!-- Images that will later appear via CSS -->
-    <link rel="preload" as="image" href="app/images/info.svg">
-    <link rel="preload" as="image" href="app/images/error.svg">
-    <link rel="preload" as="image" href="app/images/warning.svg">
+    <link rel="preload" as="image" href="app/images/info.png">
+    <link rel="preload" as="image" href="app/images/error.png">
+    <link rel="preload" as="image" href="app/images/warning.png">
 
     <script type="module" crossorigin="anonymous" src="app/error-handler.js"></script>
     <script type="module" crossorigin="anonymous" src="app/ui.js"></script>
@@ -160,7 +160,7 @@ <h1 class="noVNC_logo" translate="no" style="display: none;"><span>no</span><br>
                 <div class="noVNC_vcenter">
                 <div id="noVNC_settings" class="noVNC_panel">
                     <div class="noVNC_heading">
-                        <img alt="" src="app/images/settings.svg"> Settings
+                        <img alt="" src="app/images/settings.png"> Settings
                     </div>
                     <ul>
                         <li>
@@ -282,7 +282,7 @@ <h1 class="noVNC_logo" translate="no" style="display: none;"><span>no</span><br>
             <p class="noVNC_logo" translate="no"><span>no</span>VNC</p>
             <div>
                 <button id="noVNC_connect_button">
-                    <img alt="" src="app/images/connect.svg"> Connect
+                    <img alt="" src="app/images/connect.png"> Connect
                 </button>
             </div>
         </div>

Original file line number	Diff line number	Diff line change
`@@ -287,15 +287,15 @@ html {`
`287`	`287`	`cursor: pointer;`
`288`	`288`	`border-radius: 5px;`
`289`	`289`	`background-color: rgb(83, 99, 122);`
`290`		`- background-image: url("../images/handle_bg.svg");`
	`290`	`+ background-image: url("../images/handle_bg.png");`
`291`	`291`	`background-repeat: no-repeat;`
`292`	`292`	`background-position: right;`
`293`	`293`	`box-shadow: 3px 3px 0px rgba(0, 0, 0, 0.5);`
`294`	`294`	`}`
`295`	`295`	`#noVNC_control_bar_handle:after {`
`296`	`296`	`content: "";`
`297`	`297`	`transition: transform 0.5s ease-in-out;`
`298`		`- background: url("../images/handle.svg");`
	`298`	`+ background: url("../images/handle.png");`
`299`	`299`	`position: absolute;`
`300`	`300`	`top: 22px; /* (50px-6px)/2 */`
`301`	`301`	`right: 5px;`
`@@ -514,7 +514,7 @@ html {`
`514`	`514`	`cursor: pointer;`
`515`	`515`	`}`
`516`	`516`	`.noVNC_expander::before {`
`517`		`- content: url("../images/expander.svg");`
	`517`	`+ content: url("../images/expander.png");`
`518`	`518`	`display: inline-block;`
`519`	`519`	`margin-right: 5px;`
`520`	`520`	`transition: 0.2s ease-in-out;`
`@@ -689,25 +689,25 @@ html {`
`689`	`689`	`background: rgba(128,128,128,0.9);`
`690`	`690`	`}`
`691`	`691`	`#noVNC_status.noVNC_status_normal::before {`
`692`		`- content: url("../images/info.svg") " ";`
	`692`	`+ content: url("../images/info.png") " ";`
`693`	`693`	`}`
`694`	`694`	`#noVNC_status.noVNC_status_error {`
`695`	`695`	`background: rgba(200,55,55,0.9);`
`696`	`696`	`}`
`697`	`697`	`#noVNC_status.noVNC_status_error::before {`
`698`		`- content: url("../images/error.svg") " ";`
	`698`	`+ content: url("../images/error.png") " ";`
`699`	`699`	`}`
`700`	`700`	`#noVNC_status.noVNC_status_warn {`
`701`	`701`	`background: rgba(180,180,30,0.9);`
`702`	`702`	`}`
`703`	`703`	`#noVNC_status.noVNC_status_warn::before {`
`704`		`- content: url("../images/warning.svg") " ";`
	`704`	`+ content: url("../images/warning.png") " ";`
`705`	`705`	`}`
`706`	`706`	`#noVNC_status.noVNC_status_tls_success {`
`707`	`707`	`background: rgba(6, 199, 38, 0.9);`
`708`	`708`	`}`
`709`	`709`	`#noVNC_status.noVNC_status_tls_success::before {`
`710`		`- content: url("../images/connect.svg") " ";`
	`710`	`+ content: url("../images/connect.png") " ";`
`711`	`711`	`}`
`712`	`712`
`713`	`713`	`/* ----------------------------------------`