Commit 5fc78807 authored by Rainhard Findling's avatar Rainhard Findling Committed by Chromium LUCI CQ

Privacy sandbox page: page skeleton

Bug: 1152336
Change-Id: Id5c0474e3ce8affdd42c33139ffa28f7d99aa9cc
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2584851Reviewed-by: default avatarRainhard Findling <rainhard@chromium.org>
Reviewed-by: default avatarChristian Dullweber <dullweber@chromium.org>
Commit-Queue: Rainhard Findling <rainhard@chromium.org>
Cr-Commit-Position: refs/heads/master@{#837042}
parent 60246fe0
<style include="cr-shared-style"> <style include="cr-shared-style">
.card {
background-color: var(--cr-card-background-color);
border-radius: var(--cr-card-border-radius);
box-shadow: var(--cr-card-shadow);
flex: 1;
}
.secondary {
color: var(--cr-secondary-text-color);
font-weight: 400;
}
.section-header {
color: var(--cr-primary-text-color);
font-size: 108%;
font-weight: 400;
letter-spacing: .25px;
margin-bottom: 12px;
margin-top: var(--cr-section-vertical-margin);
outline: none;
padding-bottom: 4px;
padding-top: 8px;
}
#page-container {
box-sizing: border-box;
display: block;
height: inherit;
margin: 0 auto;
max-width: 550px;
min-width: 400px;
position: relative;
width: calc(100% * var(--cr-centered-card-width-percentage));
}
#page-heading { #page-heading {
font-size: 2rem; font-size: 2rem;
font-weight: 200; font-weight: 200;
...@@ -8,6 +43,47 @@ ...@@ -8,6 +43,47 @@
} }
</style> </style>
<div class="cr-centered-card-container"> <div id="page-container">
<h1 id="page-heading">$i18n{privacySandboxPageHeading}</h1> <h1 id="page-heading">$i18n{privacySandboxPageHeading}</h1>
<div>
<h2 class="section-header" tabindex="-1">
$i18n{privacySandboxPageHeading}
</h2>
</div>
<div>$i18n{privacySandboxPageHeading}</div>
<div>
<h2 class="section-header" tabindex="-1">
$i18n{privacySandboxPageHeading}
</h2>
</div>
<div>$i18n{privacySandboxPageHeading}</div>
<div>
<ul>
<li><span>$i18n{privacySandboxPageHeading}</span></li>
<li><span>$i18n{privacySandboxPageHeading}</span></li>
<li><span>$i18n{privacySandboxPageHeading}</span></li>
</ul>
</div>
<div>
<h2 class="section-header" tabindex="-1">
$i18n{privacySandboxPageHeading}
</h2>
</div>
<div class="card">
<settings-toggle-button id="toggleButton"
class="hr" label="$i18n{privacySandboxPageHeading}">
</settings-toggle-button>
<div class="cr-row continuation">
<div class="secondary">$i18n{privacySandboxPageHeading}</div>
</div>
<div class="cr-row continuation">
<div class="secondary">$i18n{privacySandboxPageHeading}</div>
</div>
<div class="cr-row continuation">
<cr-button class="cr-button" id="button" aria-disabled="false"
role="button" tabindex="0" on-click="onButtonClick_">
$i18n{passwordViewDetails}
</cr-button>
</div>
</div>
</div> </div>
...@@ -2,6 +2,9 @@ ...@@ -2,6 +2,9 @@
// Use of this source code is governed by a BSD-style license that can be // Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file. // found in the LICENSE file.
import 'chrome://resources/cr_elements/shared_style_css.m.js'; import 'chrome://resources/cr_elements/shared_style_css.m.js';
import 'chrome://resources/cr_elements/shared_vars_css.m.js';
import '../settings.js';
import {html, Polymer} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js'; import {html, Polymer} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
Polymer({ Polymer({
...@@ -9,4 +12,8 @@ Polymer({ ...@@ -9,4 +12,8 @@ Polymer({
_template: html`{__html_template__}`, _template: html`{__html_template__}`,
/** @private */
onButtonClick_: function() {
// TODO(crbug/1152336): Implement button click.
},
}); });
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment