Skip to content

Commit

Permalink
fix: improve mobile styles for input and select elements in Settings
Browse files Browse the repository at this point in the history
  • Loading branch information
TheodoreChu committed Dec 9, 2020
1 parent 971807f commit ee75f61
Show file tree
Hide file tree
Showing 11 changed files with 35 additions and 21 deletions.
12 changes: 6 additions & 6 deletions build/asset-manifest.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,9 @@
"static/js/0.6e8356b3.chunk.js.map": "./static/js/0.6e8356b3.chunk.js.map",
"static/js/1.beda51ec.chunk.js": "./static/js/1.beda51ec.chunk.js",
"static/js/1.beda51ec.chunk.js.map": "./static/js/1.beda51ec.chunk.js.map",
"main.css": "./static/css/main.2af4846f.chunk.css",
"main.js": "./static/js/main.0644b6a0.chunk.js",
"main.js.map": "./static/js/main.0644b6a0.chunk.js.map",
"main.css": "./static/css/main.0a0b72cc.chunk.css",
"main.js": "./static/js/main.2e234a7a.chunk.js",
"main.js.map": "./static/js/main.2e234a7a.chunk.js.map",
"runtime-main.js": "./static/js/runtime-main.62aa27b2.js",
"runtime-main.js.map": "./static/js/runtime-main.62aa27b2.js.map",
"static/css/4.7c0a8645.chunk.css": "./static/css/4.7c0a8645.chunk.css",
Expand Down Expand Up @@ -152,7 +152,7 @@
"static/js/73.942b36ff.chunk.js.map": "./static/js/73.942b36ff.chunk.js.map",
"index.html": "./index.html",
"static/css/4.7c0a8645.chunk.css.map": "./static/css/4.7c0a8645.chunk.css.map",
"static/css/main.2af4846f.chunk.css.map": "./static/css/main.2af4846f.chunk.css.map",
"static/css/main.0a0b72cc.chunk.css.map": "./static/css/main.0a0b72cc.chunk.css.map",
"static/js/4.3c5a17a5.chunk.js.LICENSE.txt": "./static/js/4.3c5a17a5.chunk.js.LICENSE.txt",
"static/js/65.a6ea35c2.chunk.js.LICENSE.txt": "./static/js/65.a6ea35c2.chunk.js.LICENSE.txt",
"static/media/codicon.css": "./static/media/codicon.b3726f01.ttf"
Expand All @@ -161,7 +161,7 @@
"static/js/runtime-main.62aa27b2.js",
"static/css/4.7c0a8645.chunk.css",
"static/js/4.3c5a17a5.chunk.js",
"static/css/main.2af4846f.chunk.css",
"static/js/main.0644b6a0.chunk.js"
"static/css/main.0a0b72cc.chunk.css",
"static/js/main.2e234a7a.chunk.js"
]
}
2 changes: 1 addition & 1 deletion build/index.html
Original file line number Diff line number Diff line change
@@ -1 +1 @@
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" type="image/png" href="./icon.png"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="The Append Editor is an unofficial editor for Standard Notes, a free, open-source, and end-to-end encrypted notes app. Try the demo at beta.appendeditor.com or learn more at appendeditor.com."/><link rel="apple-touch-icon" href="./icon192.png"/><link rel="manifest" href="./manifest.json"/><link rel="stylesheet" href="./katex/v0.12.0/katex.min.css" integrity="sha384-AfEj0r4/OFrOo5t7NnNe46zW/tFgW6x/bCJG8FqQCEo3+Aro6EYUG4+cU+KJWu/X" crossorigin="anonymous"/><title>Append Editor</title><link href="./static/css/4.7c0a8645.chunk.css" rel="stylesheet"><link href="./static/css/main.2af4846f.chunk.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script src="editor.worker.bundle.js"></script><script src="json.worker.bundle.js"></script><script src="css.worker.bundle.js"></script><script src="html.worker.bundle.js"></script><script src="ts.worker.bundle.js"></script><script>!function(e){function r(r){for(var n,c,f=r[0],d=r[1],u=r[2],b=0,l=[];b<f.length;b++)c=f[b],Object.prototype.hasOwnProperty.call(a,c)&&a[c]&&l.push(a[c][0]),a[c]=0;for(n in d)Object.prototype.hasOwnProperty.call(d,n)&&(e[n]=d[n]);for(i&&i(r);l.length;)l.shift()();return o.push.apply(o,u||[]),t()}function t(){for(var e,r=0;r<o.length;r++){for(var t=o[r],n=!0,f=1;f<t.length;f++){var d=t[f];0!==a[d]&&(n=!1)}n&&(o.splice(r--,1),e=c(c.s=t[0]))}return e}var n={},a={3:0},o=[];function c(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,c),t.l=!0,t.exports}c.e=function(e){var r=[],t=a[e];if(0!==t)if(t)r.push(t[2]);else{var n=new Promise((function(r,n){t=a[e]=[r,n]}));r.push(t[2]=n);var o,f=document.createElement("script");f.charset="utf-8",f.timeout=120,c.nc&&f.setAttribute("nonce",c.nc),f.src=function(e){return c.p+"static/js/"+({}[e]||e)+"."+{0:"6e8356b3",1:"beda51ec",5:"4048aec6",6:"4dee4811",7:"fc382a67",8:"13316ebe",9:"6be8d0d7",10:"89051c25",11:"1c80e612",12:"0720537a",13:"b4ec28c5",14:"06360f72",15:"f9206ac4",16:"2bc68063",17:"9d5cd374",18:"d8abfc79",19:"de5e1fc9",20:"b415724b",21:"86051422",22:"5d1cb176",23:"945b0ae5",24:"f686a994",25:"4595f0a3",26:"b1afae36",27:"849f0a21",28:"81357772",29:"c0bfe876",30:"f3538c17",31:"a12e1cef",32:"332b7c06",33:"f3b1b712",34:"7eb1edc2",35:"405ee1a2",36:"d0417e11",37:"1721bd72",38:"06f2cb17",39:"0a344a12",40:"6af8ab0d",41:"48b0a72e",42:"2038b393",43:"6a305906",44:"5c814b1e",45:"41bf54f8",46:"faef1d09",47:"fc2bc4fe",48:"d14adcb4",49:"c6a43cac",50:"9a810de3",51:"e51142f8",52:"aace1dec",53:"d39a2bb6",54:"9ecaa1f1",55:"6a361e8e",56:"612fba70",57:"0a31ecae",58:"3d408626",59:"9386a86a",60:"a685336b",61:"3dde6794",62:"63b04ad3",63:"23256c50",64:"59848527",65:"a6ea35c2",66:"e7a82d2b",67:"fec44c86",68:"dd7e6980",69:"2958abb0",70:"00c7bddd",71:"ecddd1fd",72:"389ed639",73:"942b36ff"}[e]+".chunk.js"}(e);var d=new Error;o=function(r){f.onerror=f.onload=null,clearTimeout(u);var t=a[e];if(0!==t){if(t){var n=r&&("load"===r.type?"missing":r.type),o=r&&r.target&&r.target.src;d.message="Loading chunk "+e+" failed.\n("+n+": "+o+")",d.name="ChunkLoadError",d.type=n,d.request=o,t[1](d)}a[e]=void 0}};var u=setTimeout((function(){o({type:"timeout",target:f})}),12e4);f.onerror=f.onload=o,document.head.appendChild(f)}return Promise.all(r)},c.m=e,c.c=n,c.d=function(e,r,t){c.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},c.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},c.t=function(e,r){if(1&r&&(e=c(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(c.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)c.d(t,n,function(r){return e[r]}.bind(null,n));return t},c.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return c.d(r,"a",r),r},c.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},c.p="./",c.oe=function(e){throw console.error(e),e};var f=this["webpackJsonpappend-editor"]=this["webpackJsonpappend-editor"]||[],d=f.push.bind(f);f.push=r,f=f.slice();for(var u=0;u<f.length;u++)r(f[u]);var i=d;t()}([])</script><script src="./static/js/4.3c5a17a5.chunk.js"></script><script src="./static/js/main.0644b6a0.chunk.js"></script></body></html>
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" type="image/png" href="./icon.png"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="The Append Editor is an unofficial editor for Standard Notes, a free, open-source, and end-to-end encrypted notes app. Try the demo at beta.appendeditor.com or learn more at appendeditor.com."/><link rel="apple-touch-icon" href="./icon192.png"/><link rel="manifest" href="./manifest.json"/><link rel="stylesheet" href="./katex/v0.12.0/katex.min.css" integrity="sha384-AfEj0r4/OFrOo5t7NnNe46zW/tFgW6x/bCJG8FqQCEo3+Aro6EYUG4+cU+KJWu/X" crossorigin="anonymous"/><title>Append Editor</title><link href="./static/css/4.7c0a8645.chunk.css" rel="stylesheet"><link href="./static/css/main.0a0b72cc.chunk.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script src="editor.worker.bundle.js"></script><script src="json.worker.bundle.js"></script><script src="css.worker.bundle.js"></script><script src="html.worker.bundle.js"></script><script src="ts.worker.bundle.js"></script><script>!function(e){function r(r){for(var n,c,f=r[0],d=r[1],u=r[2],b=0,l=[];b<f.length;b++)c=f[b],Object.prototype.hasOwnProperty.call(a,c)&&a[c]&&l.push(a[c][0]),a[c]=0;for(n in d)Object.prototype.hasOwnProperty.call(d,n)&&(e[n]=d[n]);for(i&&i(r);l.length;)l.shift()();return o.push.apply(o,u||[]),t()}function t(){for(var e,r=0;r<o.length;r++){for(var t=o[r],n=!0,f=1;f<t.length;f++){var d=t[f];0!==a[d]&&(n=!1)}n&&(o.splice(r--,1),e=c(c.s=t[0]))}return e}var n={},a={3:0},o=[];function c(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,c),t.l=!0,t.exports}c.e=function(e){var r=[],t=a[e];if(0!==t)if(t)r.push(t[2]);else{var n=new Promise((function(r,n){t=a[e]=[r,n]}));r.push(t[2]=n);var o,f=document.createElement("script");f.charset="utf-8",f.timeout=120,c.nc&&f.setAttribute("nonce",c.nc),f.src=function(e){return c.p+"static/js/"+({}[e]||e)+"."+{0:"6e8356b3",1:"beda51ec",5:"4048aec6",6:"4dee4811",7:"fc382a67",8:"13316ebe",9:"6be8d0d7",10:"89051c25",11:"1c80e612",12:"0720537a",13:"b4ec28c5",14:"06360f72",15:"f9206ac4",16:"2bc68063",17:"9d5cd374",18:"d8abfc79",19:"de5e1fc9",20:"b415724b",21:"86051422",22:"5d1cb176",23:"945b0ae5",24:"f686a994",25:"4595f0a3",26:"b1afae36",27:"849f0a21",28:"81357772",29:"c0bfe876",30:"f3538c17",31:"a12e1cef",32:"332b7c06",33:"f3b1b712",34:"7eb1edc2",35:"405ee1a2",36:"d0417e11",37:"1721bd72",38:"06f2cb17",39:"0a344a12",40:"6af8ab0d",41:"48b0a72e",42:"2038b393",43:"6a305906",44:"5c814b1e",45:"41bf54f8",46:"faef1d09",47:"fc2bc4fe",48:"d14adcb4",49:"c6a43cac",50:"9a810de3",51:"e51142f8",52:"aace1dec",53:"d39a2bb6",54:"9ecaa1f1",55:"6a361e8e",56:"612fba70",57:"0a31ecae",58:"3d408626",59:"9386a86a",60:"a685336b",61:"3dde6794",62:"63b04ad3",63:"23256c50",64:"59848527",65:"a6ea35c2",66:"e7a82d2b",67:"fec44c86",68:"dd7e6980",69:"2958abb0",70:"00c7bddd",71:"ecddd1fd",72:"389ed639",73:"942b36ff"}[e]+".chunk.js"}(e);var d=new Error;o=function(r){f.onerror=f.onload=null,clearTimeout(u);var t=a[e];if(0!==t){if(t){var n=r&&("load"===r.type?"missing":r.type),o=r&&r.target&&r.target.src;d.message="Loading chunk "+e+" failed.\n("+n+": "+o+")",d.name="ChunkLoadError",d.type=n,d.request=o,t[1](d)}a[e]=void 0}};var u=setTimeout((function(){o({type:"timeout",target:f})}),12e4);f.onerror=f.onload=o,document.head.appendChild(f)}return Promise.all(r)},c.m=e,c.c=n,c.d=function(e,r,t){c.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},c.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},c.t=function(e,r){if(1&r&&(e=c(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(c.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)c.d(t,n,function(r){return e[r]}.bind(null,n));return t},c.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return c.d(r,"a",r),r},c.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},c.p="./",c.oe=function(e){throw console.error(e),e};var f=this["webpackJsonpappend-editor"]=this["webpackJsonpappend-editor"]||[],d=f.push.bind(f);f.push=r,f=f.slice();for(var u=0;u<f.length;u++)r(f[u]);var i=d;t()}([])</script><script src="./static/js/4.3c5a17a5.chunk.js"></script><script src="./static/js/main.2e234a7a.chunk.js"></script></body></html>

Large diffs are not rendered by default.

1 change: 1 addition & 0 deletions build/static/css/main.0a0b72cc.chunk.css.map

Large diffs are not rendered by default.

1 change: 0 additions & 1 deletion build/static/css/main.2af4846f.chunk.css.map

This file was deleted.

2 changes: 0 additions & 2 deletions build/static/js/main.0644b6a0.chunk.js

This file was deleted.

1 change: 0 additions & 1 deletion build/static/js/main.0644b6a0.chunk.js.map

This file was deleted.

2 changes: 2 additions & 0 deletions build/static/js/main.2e234a7a.chunk.js

Large diffs are not rendered by default.

1 change: 1 addition & 0 deletions build/static/js/main.2e234a7a.chunk.js.map

Large diffs are not rendered by default.

10 changes: 5 additions & 5 deletions src/components/Settings.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -632,7 +632,7 @@ export default class Settings extends React.Component<
<label htmlFor={monacoEditorLanguageID}>
Monaco Editor Language:{' '}
</label>
<div>
<div className="input-and-undo-button">
<label>
<select
id={monacoEditorLanguageID}
Expand Down Expand Up @@ -736,7 +736,7 @@ export default class Settings extends React.Component<
]}
<section className="sk-panel-row settings">
<label htmlFor={fontSizeID}>Choose a base font size: </label>
<div>
<div className="input-and-undo-button">
<select
id={fontSizeID}
name={fontSizeID}
Expand Down Expand Up @@ -790,7 +790,7 @@ export default class Settings extends React.Component<
<label htmlFor={fontEditID}>
Choose a font for Edit/Append:{' '}
</label>
<div>
<div className="input-and-undo-button">
<input
list="fonts"
id={fontEditID}
Expand Down Expand Up @@ -828,7 +828,7 @@ export default class Settings extends React.Component<
<label htmlFor={fontViewID}>
Choose a font for View/Print:{' '}
</label>
<div>
<div className="input-and-undo-button">
<input
list="fonts"
id={fontViewID}
Expand Down Expand Up @@ -939,7 +939,7 @@ export default class Settings extends React.Component<
<label htmlFor={saveAsDefaultID}>
Save these settings as your personal default:{' '}
</label>
<div>
<div className="input-and-undo-button">
<label>
<input
id={saveAsDefaultID}
Expand Down
20 changes: 17 additions & 3 deletions src/stylesheets/main.scss
Original file line number Diff line number Diff line change
Expand Up @@ -562,13 +562,27 @@ button:focus {
color: var(--sn-stylekit-foreground-color);
}
input[type='text'] {
min-width: 250px;
min-width: 200px;
}
input[type='checkbox'] {
min-width: 250px;
min-width: 210px;
}
select {
min-width: 267px;
min-width: 217px;
}
.input-and-undo-button {
display: flex;
}
@media screen and (min-width: 360px) {
input[type='text'] {
min-width: 250px;
}
input[type='checkbox'] {
min-width: 260px;
}
select {
min-width: 267px;
}
}
.radio {
margin-top: 3px;
Expand Down

0 comments on commit ee75f61

Please sign in to comment.