Rename PostCSS files to .pcss (#22769)

* Rename PostCSS files to `.pcss` * Make Stylelint happy * Make Stylelint happy v2 * Update CompatibilityView.tsx * Update res/css/structures/ErrorView.pcss Co-authored-by: Michael Weimann <mail@michael-weimann.eu> * Merge branch 'develop' of github.com:matrix-org/matrix-react-sdk into t3chguy/pcss Conflicts: package.json res/css/_components.scss res/css/structures/_NotificationPanel.pcss res/css/views/dialogs/_SpotlightDialog.pcss res/css/views/rooms/_EventTile.pcss res/css/views/rooms/_ReadReceiptGroup.pcss yarn.lock * Only use CI_PACKAGE mode on develop, it skips minification which can find some errors * Keep name to not break existing PRs Co-authored-by: Michael Weimann <mail@michael-weimann.eu>
2022-07-15 14:53:21 +01:00 · 2022-07-15 14:53:21 +01:00 · 64ed6ebdad
commit 64ed6ebdad
parent ecda0a1073
12 changed files with 144 additions and 440 deletions
--- a/res/css/structures/ErrorView.pcss
+++ b/res/css/structures/ErrorView.pcss
@ -0,0 +1,113 @@
+/*
+Copyright 2020 New Vector Ltd
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+// import font-size variables manually,
+// ideally this file would get loaded by the theme which has all variables in context
+@import "../../../node_modules/matrix-react-sdk/res/css/_font-sizes.pcss";
+
+.mx_ErrorView {
+    background: #c5e0f7;
+    background: -moz-linear-gradient(top, #c5e0f7 0%, #ffffff 100%);
+    background: -webkit-linear-gradient(top, #c5e0f7 0%, #ffffff 100%);
+    background: linear-gradient(to bottom, #c5e0f7 0%, #ffffff 100%);
+    /* stylelint-disable-next-line function-no-unknown */
+    filter: progid:dximagetransform.microsoft.gradient(startColorstr='#c5e0f7', endColorstr='#ffffff', GradientType=0);
+    font-family:
+        -apple-system,
+        BlinkMacSystemFont,
+        "Segoe UI",
+        Roboto,
+        Helvetica,
+        Arial,
+        sans-serif,
+        "Apple Color Emoji",
+        "Segoe UI Emoji",
+        "Segoe UI Symbol";
+    width: 100%;
+    min-height: 100%;
+    height: auto;
+    color: #000;
+
+    .mx_ErrorView_container {
+        max-width: 680px;
+        margin: auto;
+    }
+
+    .mx_Button {
+        border: 0;
+        border-radius: 4px;
+        font-size: $font-18px;
+        margin-left: 4px;
+        margin-right: 4px;
+        min-width: 80px;
+        background-color: #03b381;
+        color: #fff;
+        cursor: pointer;
+        padding: 12px 22px;
+        word-break: break-word;
+        text-decoration: none;
+    }
+
+    .mx_Center {
+        justify-content: center;
+    }
+
+    .mx_HomePage_header {
+        color: #2e2f32;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+    }
+
+    font-size: $font-16px;
+    h1 {
+        font-size: $font-32px;
+    }
+    h2 {
+        font-size: $font-24px;
+        color: #000;
+    }
+
+    .mx_HomePage_col {
+        display: flex;
+        flex-direction: row;
+    }
+
+    .mx_HomePage_row {
+        flex: 1 1 0;
+        display: flex;
+        flex-direction: row;
+        flex-wrap: wrap;
+    }
+
+    .mx_HomePage_logo {
+        margin: auto 20px auto 0;
+    }
+
+    h1, h2 {
+        font-weight: 600;
+        margin-bottom: 32px;
+    }
+
+    .mx_Spacer {
+        margin-top: 24px;
+    }
+
+    .mx_FooterLink {
+        color: #368bd6;
+        text-decoration: none;
+    }
+}