pages_core 3.14.0 → 3.15.1

data/app/assets/stylesheets/pages_core/admin/components/tag_editor.css

@@ -1,39 +1,41 @@
 .tag-editor {
-  margin-top: 10px;
-  margin-bottom: 1.5em;
-
-  & .tags {
-    line-height: 1.5;
-  }
-
-  & .tag {
-    font-size: 13px;
+  margin-top: 0.5rem;
+  margin-bottom: 1.5rem;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.5rem;
+
+  .tag {
+    font-size: 1rem;
     cursor: pointer;
-    display: block;
-    float: left;
-    margin: 0 5px 5px 0;
     padding: 0px;
     background: var(--background-disabled-color);
     border-radius: 5px;
-    line-height: 26px;
-    line-height: 36px;
     min-width: 40px;
+    height: 2rem;
     transition: all 200ms ease-out;
     user-select: none;
+    display: flex;
 
-    & label {
+    label {
+      display: flex;
       margin: 0px;
       padding: 0px 10px;
       color: inherit;
+      align-items: center;
+      gap: 0.5rem;
     }
 
-    & input {
-      margin: 2px 3px 0 0;
+    input {
+      /*margin: 2px 3px 0 0;*/
     }
 
-    & .name {
-      padding: 1px 5px;
-      margin: 0;
+    .name {
+    }
+
+    &:hover,
+    &:focus {
+      background: var(--background-highlight-color);
     }
 
     &.enabled {
@@ -41,20 +43,4 @@
       background: var(--blue-dark);
     }
   }
-
-  & .add-tag-form {
-    float: left;
-    width: 178px;
-    white-space: nowrap;
-  }
-
-  & input.add-tag {
-    margin-top: 0px;
-    border-radius: 5px;
-    margin: 0 4px 0 0;
-
-    &.example {
-      color: var(--text-light-color);
-    }
-  }
 }

data/app/assets/stylesheets/pages_core/admin/components/toast.css

@@ -6,8 +6,7 @@
   overflow: hidden;
   z-index: 200;
 
-  & .toast {
-    font-size: 14px;
+  .toast {
     display: inline-block;
     background: var(--background-invert-color);
     color: white;

data/app/assets/stylesheets/pages_core/admin/components/toolbar.css

@@ -15,27 +15,27 @@
     clear: both;
   }
 
-  & li {
+  li {
     list-style: none;
     margin: 0;
     padding: 0;
   }
 
-  & .info {
+  .info {
     float: right;
     color: var(--text-lighter-color);
     padding: 0px 10px;
   }
 
-  & .label {
+  .label {
     float: left;
     padding: 0px 10px;
     color: var(--text-light-color);
     border-right: 1px solid var(--border-color);
   }
 
-  & .button,
-  & button {
+  .button,
+  button {
     float: left;
     display: inline;
     margin: 0px;
@@ -51,12 +51,12 @@
     border-left: 1px solid #fff;
     border-right: 1px solid var(--border-color);
     color: var(--text-light-color);
-    font-size: 12px;
+    font-size: 0.875rem;
     background-color: #f8f8f8;
     transition: all 200ms ease-out;
 
-    & i.fa {
-      font-size: 14px;
+    i.fa {
+      font-size: 1rem;
     }
 
     &:focus,
@@ -87,11 +87,11 @@
     &.header {
       vertical-align: bottom;
 
-      & i {
+      i {
         margin-left: -6px;
       }
 
-      & i:after {
+      i:after {
         font-family: var(--font-os-sans);
         font-weight: bold;
         font-size: 13px;

data/app/assets/stylesheets/pages_core/admin/components/totp.css

@@ -21,6 +21,6 @@ ul.recovery-codes {
   flex-direction: column;
   align-items: flex-start;
   gap: 1rem;
-  font-size: 1.2em;
+  font-size: 1.2rem;
   font-weight: bold;
 }

data/app/assets/stylesheets/pages_core/admin/controllers/pages.css

@@ -24,42 +24,42 @@ td.drag-handle {
   margin-left: -8px;
   margin-top: 16px;
 
-  & .page-listing {
+  .page-listing {
     border: 1px solid transparent;
     padding: 3px 8px 2px 8px !important;
   }
 
-  & ul {
+  ul {
     border-left: 1px dotted #ccc !important;
     margin-left: 12px !important;
     padding-left: 8px !important;
   }
 
-  & ul li {
+  ul li {
     overflow: auto;
   }
 
-  & .page {
+  .page {
     padding: 4px 8px;
     line-height: 17px;
     float: left;
 
-    & .status {
+    .status {
       font-weight: normal;
     }
 
-    & a.page-name,
-    & a.page-name:visited {
+    a.page-name,
+    a.page-name:visited {
       text-decoration: none;
       color: #222;
     }
 
-    & a.page-name:hover {
+    a.page-name:hover {
       text-decoration: underline;
     }
 
     &.hidden {
-      & a.page-name {
+      a.page-name {
         color: #666;
       }
     }
@@ -68,30 +68,30 @@ td.drag-handle {
       background: #ffd;
       border: 1px solid #dda;
 
-      & .status {
+      .status {
         display: none;
       }
     }
   }
 
-  & .page-without-locale {
+  .page-without-locale {
     color: #888;
   }
 
-  & li {
-    font-weight: bold;
+  li {
+    font-weight: var(--bold-weight);
     margin: 0;
     padding: 0;
     clear: both;
   }
 
-  & li li {
+  li li {
     font-weight: normal;
     font-size: 12px;
     padding: 0;
   }
 
-  & ul {
+  ul {
     clear: both;
     list-style-type: none;
     border-left: 1px dashed #ccc;
@@ -99,11 +99,11 @@ td.drag-handle {
     padding: 0 0 0 12px;
   }
 
-  & .hover {
+  .hover {
     background: #cef;
   }
 
-  & .drag-handle {
+  .drag-handle {
     display: none;
   }
 
@@ -114,28 +114,28 @@ td.drag-handle {
 
 .news-item-list,
 .calendar-item-list {
-  & .name {
+  .name {
     line-height: 1.5;
 
-    & small {
+    small {
       font-weight: normal;
     }
   }
 
-  & .autopublish-notice {
+  .autopublish-notice {
     font-size: 0.75rem;
     font-weight: normal;
     color: var(--text-light-color);
   }
 
-  & .draft,
-  & .hidden,
-  & .autopublish,
-  & .reviewed {
+  .draft,
+  .hidden,
+  .autopublish,
+  .reviewed {
     background: var(--background-disabled-color);
   }
 
-  & .pinned .name {
+  .pinned .name {
     background: transparent
       radial-gradient(ellipse at center, #92b6c4 50%, transparent 50%) no-repeat
       left 12px top 50%;
@@ -146,32 +146,18 @@ td.drag-handle {
 .edit-page {
   width: auto;
 
-  & main div.content {
-    padding-top: 16px;
+  .advanced-options {
+    margin-top: 1.5rem;
   }
 
-  & .hidden-options {
-    display: none;
-  }
-
-  & .autopublish-notice,
-  & .published-date,
-  & .advanced-options {
-    display: none;
-
-    &.show {
-      display: block;
-    }
-  }
-
-  & main input[type="text"],
-  & main textarea {
+  main input[type="text"],
+  main textarea {
     width: 100%;
     max-width: 100%;
   }
 
-  & main input.page_title {
-    font-weight: bold;
+  main input.page_title {
+    font-weight: var(--bold-weight);
     font-size: 1.4em;
     color: var(--text-color);
   }
@@ -183,13 +169,13 @@ td.drag-handle {
   margin-right: 0;
   padding: 0;
 
-  & .embed-code {
+  .embed-code {
     display: inline-block;
     width: 60px;
     margin-right: 10px;
   }
 
-  & li {
+  li {
     line-height: 30px;
     border-top: 1px solid var(--border-color);
 
@@ -197,20 +183,20 @@ td.drag-handle {
       border-top: 0px;
     }
 
-    & .actions {
+    .actions {
       float: right;
     }
 
-    & .drag-handle {
+    .drag-handle {
       margin-right: 10px;
     }
   }
 
-  & .placeholder {
+  .placeholder {
     height: 30px;
   }
 
-  & .ui-sortable-helper {
+  .ui-sortable-helper {
     border: 1px solid var(--border-color) !important;
     background: rgba(250, 250, 250, 0.8);
   }

data/app/assets/stylesheets/pages_core/admin/global/fonts.css

@@ -0,0 +1,271 @@
+/* Inter */
+
+@font-face {
+  font-family: "InterVariable";
+  font-style: normal;
+  font-weight: 100 900;
+  font-display: swap;
+  src: url("InterVariable.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "InterVariable";
+  font-style: italic;
+  font-weight: 100 900;
+  font-display: swap;
+  src: url("InterVariable-Italic.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Inter";
+  font-style: normal;
+  font-weight: 100;
+  src: url("Inter-Thin.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Inter";
+  font-style: italic;
+  font-weight: 100;
+  src: url("Inter-ThinItalic.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Inter";
+  font-style: normal;
+  font-weight: 200;
+  src: url("Inter-ExtraLight.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Inter";
+  font-style: italic;
+  font-weight: 200;
+  src: url("Inter-ExtraLightItalic.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Inter";
+  font-style: normal;
+  font-weight: 300;
+  src: url("Inter-Light.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Inter";
+  font-style: italic;
+  font-weight: 300;
+  src: url("Inter-LightItalic.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Inter";
+  font-style: normal;
+  font-weight: 400;
+  src: url("Inter-Regular.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Inter";
+  font-style: italic;
+  font-weight: 400;
+  src: url("Inter-Italic.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Inter";
+  font-style: normal;
+  font-weight: 500;
+  src: url("Inter-Medium.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Inter";
+  font-style: italic;
+  font-weight: 500;
+  src: url("Inter-MediumItalic.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Inter";
+  font-style: normal;
+  font-weight: 600;
+  src: url("Inter-SemiBold.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Inter";
+  font-style: italic;
+  font-weight: 600;
+  src: url("Inter-SemiBoldItalic.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Inter";
+  font-style: normal;
+  font-weight: 700;
+  src: url("Inter-Bold.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Inter";
+  font-style: italic;
+  font-weight: 700;
+  src: url("Inter-BoldItalic.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Inter";
+  font-style: normal;
+  font-weight: 800;
+  src: url("Inter-ExtraBold.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Inter";
+  font-style: italic;
+  font-weight: 800;
+  src: url("Inter-ExtraBoldItalic.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Inter";
+  font-style: normal;
+  font-weight: 900;
+  src: url("Inter-Black.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Inter";
+  font-style: italic;
+  font-weight: 900;
+  src: url("Inter-BlackItalic.woff2") format("woff2");
+}
+
+/* InterDisplay */
+
+@font-face {
+  font-family: "InterDisplay";
+  font-style: normal;
+  font-weight: 100;
+  src: url("InterDisplay-Thin.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "InterDisplay";
+  font-style: italic;
+  font-weight: 100;
+  src: url("InterDisplay-ThinItalic.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "InterDisplay";
+  font-style: normal;
+  font-weight: 200;
+  src: url("InterDisplay-ExtraLight.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "InterDisplay";
+  font-style: italic;
+  font-weight: 200;
+  src: url("InterDisplay-ExtraLightItalic.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "InterDisplay";
+  font-style: normal;
+  font-weight: 300;
+  src: url("InterDisplay-Light.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "InterDisplay";
+  font-style: italic;
+  font-weight: 300;
+  src: url("InterDisplay-LightItalic.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "InterDisplay";
+  font-style: normal;
+  font-weight: 400;
+  src: url("InterDisplay-Regular.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "InterDisplay";
+  font-style: italic;
+  font-weight: 400;
+  src: url("InterDisplay-Italic.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "InterDisplay";
+  font-style: normal;
+  font-weight: 500;
+  src: url("InterDisplay-Medium.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "InterDisplay";
+  font-style: italic;
+  font-weight: 500;
+  src: url("InterDisplay-MediumItalic.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "InterDisplay";
+  font-style: normal;
+  font-weight: 600;
+  src: url("InterDisplay-SemiBold.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "InterDisplay";
+  font-style: italic;
+  font-weight: 600;
+  src: url("InterDisplay-SemiBoldItalic.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "InterDisplay";
+  font-style: normal;
+  font-weight: 700;
+  src: url("InterDisplay-Bold.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "InterDisplay";
+  font-style: italic;
+  font-weight: 700;
+  src: url("InterDisplay-BoldItalic.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "InterDisplay";
+  font-style: normal;
+  font-weight: 800;
+  src: url("InterDisplay-ExtraBold.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "InterDisplay";
+  font-style: italic;
+  font-weight: 800;
+  src: url("InterDisplay-ExtraBoldItalic.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "InterDisplay";
+  font-style: normal;
+  font-weight: 900;
+  src: url("InterDisplay-Black.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "InterDisplay";
+  font-style: italic;
+  font-weight: 900;
+  src: url("InterDisplay-BlackItalic.woff2") format("woff2");
+}