fix(gui): improve device ID readability in black and dark themes (fixes #9757) (#9758)

gui/black/assets/css/theme.css

@@ -224,7 +224,6 @@ code.ng-binding{
 }
 
 .well, .form-control[readonly="readonly"], .popover { /* read-only fields*/
-    color: #666 !important;
     border-color: #444 !important;
     background-color: #111 !important;
 }

gui/dark/assets/css/theme.css

@@ -228,7 +228,6 @@ code.ng-binding{
 }
 
 .well, .form-control[readonly="readonly"], .popover { /* read-only fields*/
-    color: #666 !important;
     border-color: #424242 !important;
     background-color: #3B3B3B !important;
 }
@@ -289,4 +288,4 @@ code.ng-binding{
 /* Remote Devices 'connection type'-icon color set to #aaa */
 .reception {
     filter: invert(77%) sepia(0%) saturate(724%) hue-rotate(146deg) brightness(91%) contrast(85%);
-}
+}

gui/default/syncthing/device/idqrModalView.html

@@ -1,6 +1,6 @@
 <modal id="idqr" status="info" icon="fas fa-qrcode" heading="{{'Device Identification' | translate}} - {{deviceName(currentDevice)}}" large="yes" closeable="yes">
   <div class="modal-body text-center">
-    <div class="well well-sm text-monospace select-on-click">{{currentDevice.deviceID}}</div>
+    <div class="well well-sm text-monospace select-on-click"><strong>{{currentDevice.deviceID}}</strong></div>
     <div ng-if="currentDevice.deviceID">
       <img class="img-thumbnail" ng-src="qr/?text={{currentDevice.deviceID}}" height="328" width="328" alt="{{'QR code' | translate}}" />
       <div class="btn-group-vertical" style="vertical-align: top;">