未验证 提交 0c7afa82 编写于 作者: R Rachel Macfarlane 提交者: GitHub

Issue reporter responsive CSS (#43007)

上级 0f303447
......@@ -249,15 +249,30 @@ export class IssueReporter extends Disposable {
document.getElementById('github-submit-btn').addEventListener('click', () => this.createIssue());
document.getElementById('disableExtensions').addEventListener('click', () => {
const disableExtensions = document.getElementById('disableExtensions');
disableExtensions.addEventListener('click', () => {
ipcRenderer.send('workbenchCommand', 'workbench.extensions.action.disableAll');
ipcRenderer.send('workbenchCommand', 'workbench.action.reloadWindow');
});
document.getElementById('showRunning').addEventListener('click', () => {
disableExtensions.addEventListener('keydown', (e) => {
if (e.keyCode === 13 || e.keyCode === 32) {
ipcRenderer.send('workbenchCommand', 'workbench.extensions.action.disableAll');
ipcRenderer.send('workbenchCommand', 'workbench.action.reloadWindow');
}
});
const showRunning = document.getElementById('showRunning');
showRunning.addEventListener('click', () => {
ipcRenderer.send('workbenchCommand', 'workbench.action.showRuntimeExtensions');
});
showRunning.addEventListener('keydown', (e) => {
if (e.keyCode === 13 || e.keyCode === 32) {
ipcRenderer.send('workbenchCommand', 'workbench.action.showRuntimeExtensions');
}
});
// Cmd+Enter or Mac or Ctrl+Enter on other platforms previews issue and closes window
if (platform.isMacintosh) {
let prevKeyWasCommand = false;
......
......@@ -35,9 +35,11 @@ export default (): string => `
<div class="block block-system">
<details>
<summary>${escape(localize('systemInfo', "My System Info"))}
<input class="sendData" type="checkbox" id="includeSystemInfo" checked>
<label class="caption" for="includeSystemInfo">${escape(localize('sendData', "Send my data"))}</label>
</input>
<div class="include-data">
<input class="sendData" type="checkbox" id="includeSystemInfo" checked>
<label class="caption" for="includeSystemInfo">${escape(localize('sendData', "Send my data"))}</label>
</input>
</div>
</summary>
<div class="block-info">
<!-- To be dynamically filled -->
......@@ -47,9 +49,11 @@ export default (): string => `
<div class="block block-process">
<details>
<summary>${escape(localize('processes', "Currently Running Processes"))}
<input class="sendData" type="checkbox" id="includeProcessInfo" checked>
<label class="caption" for="includeProcessInfo">${escape(localize('sendData', "Send my data"))}</label>
</input>
<div class="include-data">
<input class="sendData" type="checkbox" id="includeProcessInfo" checked>
<label class="caption" for="includeProcessInfo">${escape(localize('sendData', "Send my data"))}</label>
</input>
</div>
</summary>
<div class="block-info">
<!-- To be dynamically filled -->
......@@ -59,9 +63,11 @@ export default (): string => `
<div class="block block-workspace">
<details>
<summary>${escape(localize('workspaceStats', "My Workspace Stats"))}
<input class="sendData" type="checkbox" id="includeWorkspaceInfo" checked>
<label class="caption" for="includeWorkspaceInfo">${escape(localize('sendData', "Send my data"))}</label>
</input>
<div class="include-data">
<input class="sendData" type="checkbox" id="includeWorkspaceInfo" checked>
<label class="caption" for="includeWorkspaceInfo">${escape(localize('sendData', "Send my data"))}</label>
</input>
</div>
</summary>
<pre class="block-info">
<code>
......@@ -73,9 +79,11 @@ export default (): string => `
<div class="block block-extensions">
<details>
<summary>${escape(localize('extensions', "My Extensions"))}
<input class="sendData" type="checkbox" id="includeExtensions" checked>
<label class="caption" for="includeExtensions">${escape(localize('sendData', "Send my data"))}</label>
</input>
<div class="include-data">
<input class="sendData" type="checkbox" id="includeExtensions" checked>
<label class="caption" for="includeExtensions">${escape(localize('sendData', "Send my data"))}</label>
</input>
</div>
</summary>
<div class="block-info">
<!-- To be dynamically filled -->
......@@ -87,17 +95,21 @@ export default (): string => `
<div class="section">
<div id="disabledExtensions">
<label>${escape(localize('tryDisablingExtensions', "Is the problem reproducible when extensions are disabled?"))}</label>
<div class="choice">
<input type="radio" id="reproducesWithoutExtensions" value=true name="reprosWithoutExtensions" />
<label for="reproducesWithoutExtensions">${escape(localize('yes', "Yes"))}</label>
</div>
<div class="choice">
<input type="radio" id="reproducesWithExtensions" value=false name="reprosWithoutExtensions" checked/>
<label for="reproducesWithExtensions">${escape(localize('no', "No"))}</label>
<div class="extensions-form">
<label>${escape(localize('tryDisablingExtensions', "Is the problem reproducible when extensions are disabled?"))}</label>
<div class="form-buttons">
<div class="choice">
<input type="radio" id="reproducesWithoutExtensions" value=true name="reprosWithoutExtensions" />
<label for="reproducesWithoutExtensions">${escape(localize('yes', "Yes"))}</label>
</div>
<div class="choice">
<input type="radio" id="reproducesWithExtensions" value=false name="reprosWithoutExtensions" checked/>
<label for="reproducesWithExtensions">${escape(localize('no', "No"))}</label>
</div>
</div>
</div>
<div class="instructions">Try to reproduce the problem after <button id="disableExtensions" class="workbenchCommand">${escape(localize('disableExtensions', "disabling all extensions and reloading the window"))}</button>.</div>
<div class="instructions">If you suspect it's an extension issue, <button id="showRunning" class="workbenchCommand">${escape(localize('showRunningExtensions', "see all running extensions"))}</button>.</div>
<div class="instructions">${escape(localize('disableExtensionsLabel', "Try to reproduce the problem after "))}<span tabIndex=0 role="button" id="disableExtensions" class="workbenchCommand">${escape(localize('disableExtensions', "disabling all extensions and reloading the window"))}</span>.</div>
<div class="instructions">${escape(localize('showRunningExtensionsLabel', "If you suspect it's an extension issue, "))}<span tabIndex=0 role="button"id="showRunning" class="workbenchCommand">${escape(localize('showRunningExtensions', "see all running extensions"))}</span>.</div>
</div>
</div>
......
......@@ -34,25 +34,8 @@ td {
margin-bottom: 1.5em;
}
#issue-type-label {
width: 12%;
}
#issue-type {
width: calc(88% - 5px);
}
#issue-title-label {
width: 10%;
display: inline-block
}
#issue-title {
width: calc(90% - 5px);
}
#similar-issues {
margin-left: 67px;
margin-left: 10%;
display: block;
}
......@@ -183,13 +166,31 @@ button:disabled {
margin-bottom: 1em;
}
.choice {
display: inline-block;
margin: 0 5px;
.extensions-form {
display: flex;
}
.choice > label, .choice > input {
.extensions-form > .form-buttons {
display: flex;
margin-left: 20px;
}
.extensions-form > .form-buttons > .choice {
margin-right: 35px;
position: relative;
}
.extensions-form > .form-buttons > .choice > label, .extensions-form > .form-buttons > .choice > input {
cursor: pointer;
height: 100%;
margin-top: 1px;
}
.extensions-form > .form-buttons > .choice > label {
position: absolute;
top: 50%;
margin-top: -50%;
left: 20px;
}
.system-info {
......@@ -212,11 +213,18 @@ summary {
margin-top: 1em;
}
.caption {
.include-data {
display: inline-block;
position: relative;
}
.include-data > .caption {
display: inline-block;
font-size: 12px;
vertical-align: middle;
height: 18px;
position: absolute;
width: 80px;
top: 2px;
left: 30px;
}
.sendData {
......@@ -245,14 +253,9 @@ input:disabled {
margin-top: .5em;
}
.workbenchCommand {
padding: 0;
font-size: 12px;
background: transparent;
}
.workbenchCommand:disabled {
color: #868e96;
cursor: pointer;
}
.block-extensions .block-info {
......@@ -281,4 +284,55 @@ a {
button {
background-color: #007ACC;
color: #fff;
}
#issue-type-label {
width: 95px;
}
#issue-type {
width: calc(100% - 100px);
}
#issue-title-label {
width: 80px;
display: inline-block;
}
#issue-title {
width: calc(100% - 85px);
}
@media (max-width: 950px) {
#issue-type-label {
width: 12%;
}
#issue-type {
width: calc(88% - 5px);
}
#issue-title-label {
width: 10%;
display: inline-block
}
#issue-title {
width: calc(90% - 5px);
}
}
@media (max-width: 620px) {
#issue-title-label, #issue-type-label {
display: none !important;
}
#issue-type, #issue-title {
width: 100%;
}
#similar-issues {
margin-left: 0;
}
}
\ No newline at end of file
......@@ -51,6 +51,8 @@ export class IssueService implements IIssueService {
this._issueWindow = new BrowserWindow({
width: position.width,
height: position.height,
minWidth: 300,
minHeight: 200,
x: position.x,
y: position.y,
title: localize('issueReporter', "Issue Reporter"),
......@@ -95,7 +97,7 @@ export class IssueService implements IIssueService {
}
let state = {
width: 750,
width: 800,
height: 900,
x: undefined,
y: undefined
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册