Skip to content

Commit

Permalink
Release build 6.12.0 [ci release]
Browse files Browse the repository at this point in the history
  • Loading branch information
mgurgel authored and github-actions[bot] committed Aug 29, 2024
1 parent 799aae6 commit 5876a5d
Show file tree
Hide file tree
Showing 147 changed files with 18,631 additions and 148 deletions.
253 changes: 223 additions & 30 deletions Sources/ContentScopeScripts/dist/pages/release-notes/js/index.css
Original file line number Diff line number Diff line change
Expand Up @@ -15,56 +15,102 @@ a {
.Text_title-1 {
font-size: calc(22 * var(--px-in-rem));
line-height: calc(26 * var(--px-in-rem));
letter-spacing: calc(-0.26 * var(--px-in-rem));
&.Text_strictSpacing {
letter-spacing: calc(-0.26 * var(--px-in-rem));
}
}
.Text_title-2 {
font-size: calc(17 * var(--px-in-rem));
font-weight: 600;
line-height: calc(22 * var(--px-in-rem));
letter-spacing: calc(-0.43 * var(--px-in-rem));
&.Text_strictSpacing {
letter-spacing: calc(-0.43 * var(--px-in-rem));
}
}
.Text_title-2-emphasis {
font-size: calc(17 * var(--px-in-rem));
font-weight: 700;
line-height: calc(22 * var(--px-in-rem));
&.Text_strictSpacing {
letter-spacing: calc(-0.43 * var(--px-in-rem));
}
}
.Text_headline {
font-size: calc(13 * var(--px-in-rem));
font-weight: 600;
line-height: calc(16 * var(--px-in-rem));
letter-spacing: calc(-0.08 * var(--px-in-rem));
&.Text_strictSpacing {
letter-spacing: calc(-0.08 * var(--px-in-rem));
}
}
.Text_subheadline {
font-size: calc(11 * var(--px-in-rem));
line-height: calc(14 * var(--px-in-rem));
letter-spacing: calc(0.06 * var(--px-in-rem));
&.Text_strictSpacing {
letter-spacing: calc(0.06 * var(--px-in-rem));
}
}
.Text_body {
font-size: calc(13 * var(--px-in-rem));
line-height: calc(16 * var(--px-in-rem));
letter-spacing: calc(-0.08 * var(--px-in-rem));
&.Text_strictSpacing {
letter-spacing: calc(-0.08 * var(--px-in-rem));
}
}
.Text_body-emphasis {
font-size: calc(13 * var(--px-in-rem));
font-weight: 600;
line-height: calc(16 * var(--px-in-rem));
letter-spacing: calc(-0.08 * var(--px-in-rem));
&.Text_strictSpacing {
letter-spacing: calc(-0.08 * var(--px-in-rem));
}
}
.Text_label-small {
font-size: calc(11 * var(--px-in-rem));
line-height: calc(11 * var(--px-in-rem));
letter-spacing: calc(0.06 * var(--px-in-rem));
&.Text_strictSpacing {
letter-spacing: calc(0.06 * var(--px-in-rem));
}
}
.Text_label-default {
font-size: calc(13 * var(--px-in-rem));
line-height: calc(13 * var(--px-in-rem));
letter-spacing: calc(-0.08 * var(--px-in-rem));
&.Text_strictSpacing {
letter-spacing: calc(-0.08 * var(--px-in-rem));
}
}
.Text_label-medium {
font-size: calc(13 * var(--px-in-rem));
font-weight: 500;
line-height: calc(13 * var(--px-in-rem));
letter-spacing: calc(-0.25 * var(--px-in-rem));
&.Text_strictSpacing {
letter-spacing: calc(-0.25 * var(--px-in-rem));
}
}
.Text_caption-2-emphasis {
font-size: calc(10 * var(--px-in-rem));
line-height: calc(13 * var(--px-in-rem));
letter-spacing: calc(0.12 * var(--px-in-rem));
&.Text_strictSpacing {
letter-spacing: calc(0.12 * var(--px-in-rem));
}
}
[data-platform-name=ios] {
& .Text_title-2 {
font-size: calc(22 * var(--px-in-rem));
font-weight: 600;
line-height: calc(28 * var(--px-in-rem));
&.Text_strictSpacing {
letter-spacing: calc(0.35 * var(--px-in-rem));
}
}
& .Text_body {
font-size: calc(16 * var(--px-in-rem));
font-weight: 400;
line-height: calc(21 * var(--px-in-rem));
&.Text_strictSpacing {
letter-spacing: calc(-0.31 * var(--px-in-rem));
}
}
}

/* shared/components/Card/Card.module.css */
Expand All @@ -82,30 +128,174 @@ a {
/* shared/components/Button/Button.module.css */
.Button_button {
appearance: none;
background: var(--button-bg);
color: var(--button-text);
cursor: pointer;
}
.Button_apple {
background-blend-mode:
normal,
color-burn,
normal;
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0) 100%),
linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.06) 100%),
#007aff;
border-radius: var(--sp-2);
border: 1px solid rgba(40, 145, 255, 0.05);
box-shadow: 0px 0px 1px 0px rgba(40, 145, 255, 0.05), 0px 1px 1px 0px rgba(40, 145, 255, 0.10);
color: white;
font-size: 0.8125rem;
font-weight: 600;
line-height: var(--sp-8);
padding: 0 var(--sp-4);
[data-platform-name=macos] .Button_button {
border: 0;
border-radius: calc(5 * var(--px-in-rem));
box-shadow: var(--button-shadow);
font-size: calc(13 * var(--px-in-rem));
height: var(--sp-5);
opacity: var(--button-opacity);
padding: 0 var(--sp-3);
&:active {
background: var(--button-bg--active, var(--button-bg));
box-shadow: var(--button-shadow--active, var(--button-shadow));
color: var(--button-text--active, var(--button-text));
opacity: var(--button-opacity--active, var(--button-opacity));
}
&:disabled {
background: var(--button-bg--disabled, var(--button-bg));
box-shadow: var(--button-shadow--disabled, var(--button-shadow));
color: var(--button-text--disabled, var(--button-text));
opacity: var(--button-opacity--disabled, var(--button-opacity));
}
&:focus {
background: var(--button-bg--focus, var(--button-bg));
box-shadow: var(--button-shadow--focus, var(--button-shadow));
color: var(--button-text--focus, var(--button-text));
opacity: var(--button-opacity--focus, var(--button-opacity));
}
&:hover {
background: linear-gradient(0deg, rgba(255, 255, 255, 0.00) 0%, rgba(255, 255, 255, 0.16) 100%), #2749db;
background: var(--button-bg);
box-shadow: var(--button-shadow--hover, var(--button-shadow));
color: var(--button-text--hover, var(--button-text));
opacity: var(--button-opacity--hover, var(--button-opacity));
}
}
[data-platform-name=ios] .Button_button {
border-radius: var(--sp-2);
border: 0;
font-size: calc(15 * var(--px-in-rem));
font-weight: 600;
height: calc(50 * var(--px-in-rem));
letter-spacing: calc(-0.23 * var(--px-in-rem));
padding: 0 var(--sp-6);
text-align: center;
&:active {
background: linear-gradient(0deg, rgba(255, 255, 255, 0.00) 0%, rgba(255, 255, 255, 0.16) 100%), #1743d1;
background: var(--button-bg--active, var(--button-bg));
color: var(--button-text--active, var(--button-text));
}
&:disabled {
background: var(--button-bg--disabled, var(--button-bg));
color: var(--button-text--disabled, var(--button-text));
}
}
[data-platform-name=""] {
.Button_button {
background-blend-mode:
normal,
color-burn,
normal;
background: linear-gradient(180deg, var(rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0) 100%), linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.06) 100%)), #007aff;
border-radius: var(--sp-2);
border: 1px solid rgba(40, var(145, 255, 0.05));
box-shadow: 0 0 1px 0 rgba(40, var(145, 255, 0.05), 0 1px 1px 0 rgba(40, 145, 255, 0.1));
color: white;
font-size: calc(13 * var(--px-in-rem));
font-weight: 600;
line-height: var(--sp-8);
padding: 0 var(--sp-4);
&:hover {
background: linear-gradient(0deg, var(rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.16) 100%)), #2749db;
}
&:active {
background: linear-gradient(0deg, var(rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.16) 100%)), #1743d1;
}
}
}
[data-platform-name=macos] {
--macos-control-standard-background-rest: #fff;
--macos-control-standard-background-rest--dark: rgba(255, 255, 255, 0.28);
--macos-control-standard-background-pressed: #e7e7e7;
--macos-control-accent-branded-background-rest: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.16) 100%), #2749db;
--macos-control-accent-branded-background-pressed: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.16) 100%), #1743d1;
--macos-control-standard-shadow:
0 1px 0 0 rgba(255, 255, 255, 0.2) inset,
0 1px 0 0 rgba(255, 255, 255, 0.05) inset,
0 0 0 1px rgba(0, 0, 0, 0.1),
0 0 1px 0 rgba(0, 0, 0, 0.05),
0 1px 1px 0 rgba(0, 0, 0, 0.2);
--macos-control-accent-shadow:
0 1px 0 0 rgba(255, 255, 255, 0) inset,
0 1px 0 0 rgba(255, 255, 255, 0) inset,
0 0 0 1px rgba(0, 122, 255, 0.05),
0 0 1px 0 rgba(0, 122, 255, 0.05),
0 1px 1px 0 rgba(0, 122, 255, 0.1);
--macos-control-focused-shadow:
0 0 0 3px rgba(57, 105, 239, 0.55),
0 0 0 1px rgba(57, 105, 239, 0.55) inset,
0 0 1px 0 rgba(0, 0, 0, 0.05),
0 1px 1px 0 rgba(0, 0, 0, 0.1);
}
[data-platform-name=macos] .Button_button {
&.Button_standard {
--button-bg: var(--macos-control-standard-background-rest);
--button-text: var(--macos-text-primary);
--button-shadow: var(--macos-control-standard-shadow);
--button-opacity: 1;
--button-bg--active: var(--macos-control-standard-background-pressed);
--button-bg--disabled: var(--macos-control-standard-background-rest);
--button-text--disabled: var(--macos-text-primary);
--button-shadow--disabled: var(--macos-control-standard-shadow);
--button-opacity--disabled: 0.4;
--button-shadow--focus: var(--macos-control-focused-shadow);
}
&.Button_accent {
--button-bg: var(--macos-control-accent-branded-background-rest);
--button-text: var(--color-white);
--button-shadow: var(--macos-control-accent-shadow);
--button-opacity: 1;
--button-bg--active: var(--macos-control-accent-branded-background-pressed);
--button-bg--disabled: var(--macos-control-standard-background-rest);
--button-text--disabled: var(--macos-text-primary);
--button-shadow--disabled: var(--macos-control-standard-shadow);
--button-opacity--disabled: 0.4;
--button-shadow--focus: var(--macos-control-focused-shadow);
}
@media (prefers-color-scheme: dark) {
&.Button_standard {
--button-bg: var(--macos-control-standard-background-rest--dark);
--button-text: var(--color-white-at-84);
}
}
}
[data-platform-name=ios] .Button_button {
&.Button_primary {
--button-bg: var(--color-blue-50);
--button-text: var(--color-white);
--button-bg--active: var(--color-blue-70);
--button-text--active: var(--color-white);
--button-bg--disabled: var(--color-black-at-6);
--button-text--disabled: var(--color-black-at-36);
}
&.Button_ghost {
--button-bg: transparent;
--button-text: var(--color-blue-50);
--button-bg--active: rgba(57, var(105, 239, 0.12));
--button-text--active: var(--color-blue-70);
--button-bg--disabled: transparent;
--button-text--disabled: var(--color-black-at-36);
}
@media (prefers-color-scheme: dark) {
&.Button_primary {
--button-bg: var(--color-blue-30);
--button-text: var(--color-black-at-84);
--button-bg--active: var(--color-blue-50);
--button-text--active: var(--color-black-at-84);
--button-bg--disabled: var(--color-black-at-6);
--button-text--disabled: var(--color-black-at-36);
}
&.Button_ghost {
--button-bg: transparent;
--button-text: var(--color-blue-30);
--button-bg--active: rgba(114, var(149, 246, 0.2));
--button-text--active: var(--color-blue-20);
--button-bg--disabled: transparent;
--button-text--disabled: var(--color-black-at-36);
}
}
}

Expand Down Expand Up @@ -380,6 +570,7 @@ body {
--sp-256: 64rem;
--sp-192: 48rem;
--sp-96: 24rem;
--sp-90: 22.5rem;
--sp-80: 20rem;
--sp-72: 18rem;
--sp-64: 16rem;
Expand Down Expand Up @@ -487,6 +678,8 @@ body {
--theme-text-secondary-color: var(--color-white-at-50);
--theme-text-link-color: var(--ddg-color-primary-dark);
}
--macos-text-primary: var(--color-black-at-84);
--ios-content-max-width: calc(794 * var(--px-in-rem));
}

/* shared/styles/reset.css */
Expand All @@ -500,7 +693,7 @@ html[data-reduced-motion=true] * {
transition: none !important;
}
body {
font-family: system-ui;
font-family: var(--theme-font-family, system-ui);
font-size: 15px;
line-height: 20px;
letter-spacing: -0.08px;
Expand Down
17 changes: 11 additions & 6 deletions Sources/ContentScopeScripts/dist/pages/release-notes/js/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -669,7 +669,9 @@
// shared/components/Text/Text.module.css
var Text_default = {
"title-1": "Text_title-1",
strictSpacing: "Text_strictSpacing",
"title-2": "Text_title-2",
"title-2-emphasis": "Text_title-2-emphasis",
headline: "Text_headline",
subheadline: "Text_subheadline",
body: "Text_body",
Expand All @@ -681,8 +683,8 @@
};

// shared/components/Text/Text.js
function Text({ as: Comp = "p", variant, className, children }) {
return /* @__PURE__ */ y(Comp, { className: (0, import_classnames2.default)({ [Text_default[`${variant}`]]: variant }, className) }, children);
function Text({ as: Comp = "p", variant, strictSpacing = true, className, children }) {
return /* @__PURE__ */ y(Comp, { className: (0, import_classnames2.default)({ [Text_default[`${variant}`]]: variant, [Text_default.strictSpacing]: strictSpacing }, className) }, children);
}

// shared/components/Card/Card.js
Expand All @@ -704,15 +706,18 @@
// shared/components/Button/Button.module.css
var Button_default = {
button: "Button_button",
apple: "Button_apple"
standard: "Button_standard",
accent: "Button_accent",
primary: "Button_primary",
ghost: "Button_ghost"
};

// shared/components/Button/Button.js
function Button({ platform = "apple", children, onClick }) {
function Button({ variant, className, children, onClick }) {
return /* @__PURE__ */ y(
"button",
{
className: (0, import_classnames4.default)(Button_default.button, Button_default[platform]),
className: (0, import_classnames4.default)(Button_default.button, { [Button_default[`${variant}`]]: !!variant }, className),
onClick: (
/**
* @param {import("preact").JSX.TargetedMouseEvent<EventTarget>} event
Expand Down Expand Up @@ -956,7 +961,7 @@
]
}
];
return /* @__PURE__ */ y("main", { className: Components_default.main }, /* @__PURE__ */ y("h1", null, "Release Notes Components"), /* @__PURE__ */ y("h2", null, "DuckDuckGo Logo"), /* @__PURE__ */ y(DuckDuckGoLogo, null), /* @__PURE__ */ y("hr", null), /* @__PURE__ */ y("h2", null, "Page Title"), /* @__PURE__ */ y(PageTitle, { title: t3("browserReleaseNotes") }), /* @__PURE__ */ y("hr", null), /* @__PURE__ */ y("h2", null, "Update Status"), /* @__PURE__ */ y(UpdateStatus, { status: "loading", version: "1.0.1", timestamp: yesterdayInMilliseconds }), /* @__PURE__ */ y(UpdateStatus, { status: "loaded", version: "1.0.1", timestamp: todayInMilliseconds }), /* @__PURE__ */ y(UpdateStatus, { status: "updateReady", version: "1.2.0", timestamp: todayInMilliseconds }), /* @__PURE__ */ y("hr", null), /* @__PURE__ */ y("h2", null, "Restart Button"), /* @__PURE__ */ y("div", null, /* @__PURE__ */ y(Button, { platform: "apple" }, t3("restartToUpdate"))), /* @__PURE__ */ y("hr", null), /* @__PURE__ */ y("h2", null, "Content Placeholder"), /* @__PURE__ */ y(ContentPlaceholder, null), /* @__PURE__ */ y("hr", null), /* @__PURE__ */ y("h2", null, "Release Notes Heading"), /* @__PURE__ */ y(ReleaseNotesHeading, { title: "May 10 2023", version: "1.0.0", showNewTag: false }), /* @__PURE__ */ y(ReleaseNotesHeading, { title: "May 10 2024", version: "1.2.0", showNewTag: true }), /* @__PURE__ */ y("hr", null), /* @__PURE__ */ y("h2", null, "Release Notes Subheading"), /* @__PURE__ */ y(ReleaseNotesSubheading, { title: "Release Notes Subheading without Icon" }), /* @__PURE__ */ y(ReleaseNotesSubheading, { icon: "PrivacyPro", title: "Release Notes Subheading with Privacy Pro Icon" }), /* @__PURE__ */ y("hr", null), /* @__PURE__ */ y("h2", null, "Release Notes List"), /* @__PURE__ */ y(ReleaseNotesList, { notes: sampleNotesData[0].notes }), /* @__PURE__ */ y("hr", null), /* @__PURE__ */ y("h2", null, "Content Placeholder Inside a Card"), /* @__PURE__ */ y(Card, { className: Components_default.card }, /* @__PURE__ */ y(ContentPlaceholder, null)), /* @__PURE__ */ y("hr", null), /* @__PURE__ */ y("h2", null, "Release Notes Inside a Card"), /* @__PURE__ */ y(Card, { className: Components_default.card }, /* @__PURE__ */ y(ReleaseNotesContent, { status: "updateReady", title: "May 10 2024", version: "1.2.0", notes: sampleNotesData })), /* @__PURE__ */ y(ReleaseNotes, { releaseData: sampleData.loading }), /* @__PURE__ */ y(LoadingThen, null, /* @__PURE__ */ y(ReleaseNotes, { releaseData: sampleData.loaded })), /* @__PURE__ */ y(LoadingThen, null, /* @__PURE__ */ y(ReleaseNotes, { releaseData: sampleData.updateReady })));
return /* @__PURE__ */ y("main", { className: Components_default.main }, /* @__PURE__ */ y("h1", null, "Release Notes Components"), /* @__PURE__ */ y("h2", null, "DuckDuckGo Logo"), /* @__PURE__ */ y(DuckDuckGoLogo, null), /* @__PURE__ */ y("hr", null), /* @__PURE__ */ y("h2", null, "Page Title"), /* @__PURE__ */ y(PageTitle, { title: t3("browserReleaseNotes") }), /* @__PURE__ */ y("hr", null), /* @__PURE__ */ y("h2", null, "Update Status"), /* @__PURE__ */ y(UpdateStatus, { status: "loading", version: "1.0.1", timestamp: yesterdayInMilliseconds }), /* @__PURE__ */ y(UpdateStatus, { status: "loaded", version: "1.0.1", timestamp: todayInMilliseconds }), /* @__PURE__ */ y(UpdateStatus, { status: "updateReady", version: "1.2.0", timestamp: todayInMilliseconds }), /* @__PURE__ */ y("hr", null), /* @__PURE__ */ y("h2", null, "Restart Button"), /* @__PURE__ */ y("div", null, /* @__PURE__ */ y(Button, null, t3("restartToUpdate"))), /* @__PURE__ */ y("hr", null), /* @__PURE__ */ y("h2", null, "Content Placeholder"), /* @__PURE__ */ y(ContentPlaceholder, null), /* @__PURE__ */ y("hr", null), /* @__PURE__ */ y("h2", null, "Release Notes Heading"), /* @__PURE__ */ y(ReleaseNotesHeading, { title: "May 10 2023", version: "1.0.0", showNewTag: false }), /* @__PURE__ */ y(ReleaseNotesHeading, { title: "May 10 2024", version: "1.2.0", showNewTag: true }), /* @__PURE__ */ y("hr", null), /* @__PURE__ */ y("h2", null, "Release Notes Subheading"), /* @__PURE__ */ y(ReleaseNotesSubheading, { title: "Release Notes Subheading without Icon" }), /* @__PURE__ */ y(ReleaseNotesSubheading, { icon: "PrivacyPro", title: "Release Notes Subheading with Privacy Pro Icon" }), /* @__PURE__ */ y("hr", null), /* @__PURE__ */ y("h2", null, "Release Notes List"), /* @__PURE__ */ y(ReleaseNotesList, { notes: sampleNotesData[0].notes }), /* @__PURE__ */ y("hr", null), /* @__PURE__ */ y("h2", null, "Content Placeholder Inside a Card"), /* @__PURE__ */ y(Card, { className: Components_default.card }, /* @__PURE__ */ y(ContentPlaceholder, null)), /* @__PURE__ */ y("hr", null), /* @__PURE__ */ y("h2", null, "Release Notes Inside a Card"), /* @__PURE__ */ y(Card, { className: Components_default.card }, /* @__PURE__ */ y(ReleaseNotesContent, { status: "updateReady", title: "May 10 2024", version: "1.2.0", notes: sampleNotesData })), /* @__PURE__ */ y(ReleaseNotes, { releaseData: sampleData.loading }), /* @__PURE__ */ y(LoadingThen, null, /* @__PURE__ */ y(ReleaseNotes, { releaseData: sampleData.loaded })), /* @__PURE__ */ y(LoadingThen, null, /* @__PURE__ */ y(ReleaseNotes, { releaseData: sampleData.updateReady })));
}
function LoadingThen({ children }) {
const [ready, setReady] = h2(false);
Expand Down
Loading

0 comments on commit 5876a5d

Please sign in to comment.