notifications - avoid column-reverse for toasts

src/vs/workbench/browser/parts/notifications/media/notificationsToasts.css

@@ -18,7 +18,7 @@
 
 .monaco-workbench > .notifications-toasts.visible {
 	display: flex;
-	flex-direction: column-reverse;
+	flex-direction: column;
 }
 
 .monaco-workbench > .notifications-toasts .notification-toast-container {

src/vs/workbench/browser/parts/notifications/notificationsToasts.ts

@@ -108,7 +108,14 @@ export class NotificationsToasts extends Themable {
 		// Container
 		const notificationToastContainer = document.createElement('div');
 		addClass(notificationToastContainer, 'notification-toast-container');
-		this.notificationsToastsContainer.appendChild(notificationToastContainer);
+
+		const firstToast = this.notificationsToastsContainer.firstChild;
+		if (firstToast) {
+			this.notificationsToastsContainer.insertBefore(notificationToastContainer, firstToast); // always first
+		} else {
+			this.notificationsToastsContainer.appendChild(notificationToastContainer);
+		}
+
 		itemDisposeables.push(toDisposable(() => this.notificationsToastsContainer.removeChild(notificationToastContainer)));
 
 		// Toast