Improve banner CSS (#8092)

* Improve banner CSS

 * On standalone pages the banner will sit in page and be hidden.
 * On package page (and landing page) the banner will float over
   content with position absolute, as these pages have sufficient
   margin to allow for this.

In both cases content will not jump when the banner is dismissed,
or when the banner is loaded.

* Fix tests

* Fix tests

* Inline the banner at all times

Author: jonasfj

app/test/frontend/static_files_test.dart

@@ -212,14 +212,14 @@ void main() {
     test('script.dart.js and parts size check', () {
       final file = cache.getFile('/static/js/script.dart.js');
       expect(file, isNotNull);
-      expect((file!.bytes.length / 1024).round(), closeTo(333, 2));
+      expect((file!.bytes.length / 1024).round(), closeTo(336, 20));
 
       final parts = cache.paths
           .where((path) =>
               path.startsWith('/static/js/script.dart.js') &&
               path.endsWith('part.js'))
           .toList();
-      expect(parts.length, closeTo(17, 3));
+      expect(parts.length, closeTo(15, 5));
       final partsSize = parts
           .map((p) => cache.getFile(p)!.bytes.length)
           .reduce((a, b) => a + b);

pkg/web_app/lib/src/widget/widget.dart

@@ -10,7 +10,7 @@ import 'package:web/web.dart';
 
 import '../web_util.dart';
 import 'completion/widget.dart' deferred as completion;
-import 'switch/widget.dart' deferred as switch_;
+import 'switch/widget.dart' as switch_;
 
 /// Function to create an instance of the widget given an element and options.
 ///
@@ -32,7 +32,7 @@ typedef _WidgetLoaderFn = FutureOr<_WidgetFn> Function();
 /// Map from widget name to widget loader
 final _widgets = <String, _WidgetLoaderFn>{
   'completion': () => completion.loadLibrary().then((_) => completion.create),
-  'switch': () => switch_.loadLibrary().then((_) => switch_.create),
+  'switch': () => switch_.create,
 };
 
 Future<_WidgetFn> _noSuchWidget() async =>

pkg/web_app/test/deferred_import_test.dart

@@ -36,8 +36,6 @@ void main() {
         'lib/src/deferred/markdown.dart',
       ],
       'completion/': [],
-      'dismiss/': [],
-      'switch/': [],
     };
 
     for (final file in files) {

pkg/web_css/lib/src/_base.scss

@@ -393,31 +393,20 @@ pre {
   text-align: center;
 
   .dismisser {
-    float: right;
+    position: absolute;
+    display: inline-block;
+    right: 0px;
     padding: 5px 15px;
     margin-top: -5px;
     cursor: pointer;
     user-select: none;
   }
 
   &.dismissed {
-    visibility: hidden;
-  }
-
-  z-index: 0;
-  animation-duration: 200ms;
-  animation-name: slide-down;
-  animation-timing-function: ease;
-}
-
-@keyframes slide-down {
-  from {
-    translate: 0 -100%;
+    display: none;
   }
 
-  to {
-    translate: 0 0;
-  }
+  z-index: 1000;
 }
 
 a.-x-ago {