yogsototh/espial
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Merge pull request #19 from brettinternet/input-font-size

Browse source 
make input font size 16pt which has better compatibility with safari
This commit is contained in:
Jon Schoning 2020-10-03 21:45:07 -05:00 committed by GitHub
parent 85fa64979c b27e05c635
commit cdbb612fd6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 151 additions and 108 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
purs/src/Component/BMark.purs
View file

@ -153,20 +153,20 @@ bmark b' =
div [ class_ "edit_bookmark_form pa2 pt0 bg-white" ] $ div [ class_ "edit_bookmark_form pa2 pt0 bg-white" ] $
[ form [ onSubmit (Just <<< BEditSubmit) ] [ form [ onSubmit (Just <<< BEditSubmit) ]
[ div_ [ text "url" ] [ div_ [ text "url" ]
, input [ type_ InputUrl , class_ "url w-100 mb2 pt1 f7 edit_form_input" , required true , name "url" , input [ type_ InputUrl , class_ "url w-100 mb2 pt1 edit_form_input" , required true , name "url"
, value (edit_bm.url) , onValueChange (editField Eurl) ] , value (edit_bm.url) , onValueChange (editField Eurl) ]
, div_ [ text "title" ] , div_ [ text "title" ]
, div [class_ "flex"] , div [class_ "flex"]
[input [ type_ InputText , class_ "title w-100 mb2 pt1 f7 edit_form_input" , name "title" [input [ type_ InputText , class_ "title w-100 mb2 pt1 edit_form_input" , name "title"
, value (edit_bm.title) , onValueChange (editField Etitle) ] , value (edit_bm.title) , onValueChange (editField Etitle) ]
, button [ disabled s.loading, type_ ButtonButton, onClick \_ -> Just BLookupTitle, class_ ("ml1 pa1 mb2 dark-gray ba b--moon-gray bg-near-white pointer rdim f7 " <> guard s.loading "bg-light-silver") ] [ text "fetch" ] , button [ disabled s.loading, type_ ButtonButton, onClick \_ -> Just BLookupTitle, class_ ("ml1 pa1 mb2 dark-gray ba b--moon-gray bg-near-white pointer rdim f7 " <> guard s.loading "bg-light-silver") ] [ text "fetch" ]
] ]
, div_ [ text "description" ] , div_ [ text "description" ]
, textarea [ class_ "description w-100 mb1 pt1 f7 edit_form_input" , name "description", rows 5 , textarea [ class_ "description w-100 mb1 pt1 edit_form_input" , name "description", rows 5
, value (edit_bm.description) , onValueChange (editField Edescription) ] , value (edit_bm.description) , onValueChange (editField Edescription) ]
, div [ id_ "tags_input_box"] , div [ id_ "tags_input_box"]
[ div_ [ text "tags" ] [ div_ [ text "tags" ]
, input [ id_ (tagid edit_bm), type_ InputText , class_ "tags w-100 mb1 pt1 f7 edit_form_input" , name "tags" , input [ id_ (tagid edit_bm), type_ InputText , class_ "tags w-100 mb1 pt1 edit_form_input" , name "tags"
, autocomplete false, attr "autocapitalize" "off" , autocomplete false, attr "autocapitalize" "off"
, value (edit_bm.tags) , onValueChange (editField Etags) ] , value (edit_bm.tags) , onValueChange (editField Etags) ]
] ]

4
purs/src/Component/NNote.purs
View file

@ -126,12 +126,12 @@ nnote st' =
renderNote_edit _ = renderNote_edit _ =
form [ onSubmit (Just <<< NEditSubmit) ] form [ onSubmit (Just <<< NEditSubmit) ]
[ p [ class_ "mt2 mb1"] [ text "title:" ] [ p [ class_ "mt2 mb1"] [ text "title:" ]
, input [ type_ InputText , class_ "title w-100 mb1 pt1 f7 edit_form_input" , name "title" , input [ type_ InputText , class_ "title w-100 mb1 pt1 edit_form_input" , name "title"
, value (edit_note.title) , onValueChange (editField Etitle), autofocus (null edit_note.title) , value (edit_note.title) , onValueChange (editField Etitle), autofocus (null edit_note.title)
] ]
, br_ , br_
, p [ class_ "mt2 mb1"] [ text "description:" ] , p [ class_ "mt2 mb1"] [ text "description:" ]
, textarea [ id_ (notetextid edit_note), class_ "description w-100 mb1 pt1 f7 edit_form_input" , name "text", rows 30 , textarea [ id_ (notetextid edit_note), class_ "description w-100 mb1 pt1 edit_form_input" , name "text", rows 30
, value (edit_note.text) , onValueChange (editField Etext) , value (edit_note.text) , onValueChange (editField Etext)
] ]
, div [ class_ "edit_form_checkboxes mb3"] , div [ class_ "edit_form_checkboxes mb3"]

195
static/css/main.css
View file

@ -8,23 +8,31 @@ body {
} }
button { button {
background:none; background: none;
border:none; border: none;
padding:0; padding: 0;
cursor:pointer; cursor: pointer;
} }
button:focus { button:focus {
outline: none; outline: none;
} }
[hidden] { [hidden] {
display: none !important display: none !important;
} }
input::placeholder { input::placeholder {
color: lightgray color: lightgray;
} }
input[type="text"],
input[type="url"],
input[type="password"],
textarea {
font-size: 16px;
}
.queryInput { .queryInput {
width: 128px; width: 128px;
padding: 0 22px 0 2px; padding: 0 22px 0 2px;
@ -34,9 +42,10 @@ input::placeholder {
border-color: gray; border-color: gray;
height: 22px; height: 22px;
line-height: 22px; line-height: 22px;
transition: width .1s ease-in-out transition: width 0.1s ease-in-out;
}
.queryInput.search-inactive {
} }
.queryInput.search-inactive {}
.queryInput:focus { .queryInput:focus {
width: 175px; width: 175px;
} }
@ -44,15 +53,15 @@ input::placeholder {
.queryInput.search-active { .queryInput.search-active {
border-color: #990; border-color: #990;
border-width: 2px; border-width: 2px;
background-color: #FF9; background-color: #ff9;
width: 175px; width: 175px;
} }
.queryIcon { .queryIcon {
position: absolute; position: absolute;
right: 0; right: 0;
top:1px; top: 1px;
cursor:pointer; cursor: pointer;
width:20px; width: 20px;
height: 20px; height: 20px;
fill: currentColor; fill: currentColor;
} }
@ -60,100 +69,116 @@ label {
cursor: pointer; cursor: pointer;
} }
.close-x-wrap { .close-x-wrap {
float: left; float: left;
width: 17px; width: 17px;
height: 17px; height: 17px;
top: 2px; top: 2px;
position: relative; position: relative;
right: 2px; right: 2px;
} }
.close-x { .close-x {
stroke: gray; stroke: gray;
fill: transparent; fill: transparent;
stroke-linecap: round; stroke-linecap: round;
stroke-width: 3; stroke-width: 3;
} }
.query-info-icon { .query-info-icon {
position: absolute; position: absolute;
top: 0px; top: 0px;
right: -18px; right: -18px;
text-decoration: none; text-decoration: none;
font-size: 12px; font-size: 12px;
padding: 0 8px 8px 0; padding: 0 8px 8px 0;
} }
.star { .star {
margin-left:-20px; margin-left: -20px;
font-size:1.2em; font-size: 1.2em;
position:relative; position: relative;
top:-2px; top: -2px;
} }
.star button { .star button {
transition: color .1s; transition: color 0.1s;
} }
.star.selected button { .star.selected button {
color:#22a; color: #22a;
} }
.edit_links button { .edit_links button {
transition: color .1s ease-in; transition: color 0.1s ease-in;
} }
.tag { .tag {
color:#a51; color: #a51;
line-height:190%; line-height: 190%;
display: inline-block; display: inline-block;
} }
.tag-include { .tag-include {
color:rgb(221, 221, 221); color: rgb(221, 221, 221);
line-height:190%; line-height: 190%;
display: inline-block; display: inline-block;
} }
.tag-exclude { .tag-exclude {
color:rgb(255, 170, 170); color: rgb(255, 170, 170);
line-height:190%; line-height: 190%;
display: inline-block; display: inline-block;
} }
.private { background:#ddd;border:1px solid #d1d1d1; } .private {
.unread { color:#b41 } background: #ddd;
.mark_read {color: #a81;} border: 1px solid #d1d1d1;
.flash { color:green;background:#efe } }
.unread {
color: #b41;
}
.mark_read {
color: #a81;
}
.flash {
color: green;
background: #efe;
}
.top_menu { .top_menu {
margin-top:6px; margin-top: 6px;
} }
.top_menu a { .top_menu a {
color: blue; color: blue;
} }
.bookmarklet { .bookmarklet {
padding:1px 2px 0px 2px; padding: 1px 2px 0px 2px;
} }
.alert { .alert {
background:#ced; background: #ced;
border:1px solid #acc; border: 1px solid #acc;
} }
.edit_bookmark_form {color:#888;} .edit_bookmark_form {
.edit_bookmark_form input {border:1px solid #ddd;} color: #888;
.edit_bookmark_form textarea {border:1px solid #ddd;} }
.edit_bookmark_form input {
border: 1px solid #ddd;
}
.edit_bookmark_form textarea {
border: 1px solid #ddd;
}
.nav-active { .nav-active {
background:#ff8; background: #ff8;
color:blue; color: blue;
} }
/* mobile device */ /* mobile device */
@media only screen and (max-width : 750px) { @media only screen and (max-width: 750px) {
body { body {
-webkit-text-size-adjust: none; -webkit-text-size-adjust: none;
} }
.display { .display {
float: none float: none;
} }
} }
@media only screen and (max-width : 500px) { @media only screen and (max-width: 500px) {
.filters { .filters {
clear: both; clear: both;
position: relative; position: relative;
@ -162,44 +187,44 @@ label {
} }
.rdim { .rdim {
opacity: .8; opacity: 0.8;
transition: all .15s ease-in; transition: all 0.15s ease-in;
} }
.rdim:hover, .rdim:hover,
.rdim:focus { .rdim:focus {
opacity: 1; opacity: 1;
transition: all .15s ease-in; transition: all 0.15s ease-in;
} }
.display .description > div p, .display .description > div p,
.display .description > div pre .display .description > div pre {
{ margin-top: 9px;
margin-top: 9px; margin-bottom: 9px;
margin-bottom: 9px;
} }
.display .description > div > *:first-child { .display .description > div > *:first-child {
margin-top: 2px; margin-top: 2px;
} }
.display .description > div > *:last-child { .display .description > div > *:last-child {
margin-bottom: 2px; margin-bottom: 2px;
} }
.display .description > div > ol li p { .display .description > div > ol li p {
margin-top: 0; margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
} }
.display .description > div > ul li p { .display .description > div > ul li p {
margin-top: 0; margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
} }
.display .description > div ol { .display .description > div ol {
padding-left: 23px; padding-left: 23px;
} }
.display .description > div ul { .display .description > div ul {
padding-left: 23px; padding-left: 23px;
} }
code, pre { code,
font-size:13px; pre {
font-size: 13px;
} }
#content:not([view-rendered]) .view-delay { #content:not([view-rendered]) .view-delay {
display: none !important display: none !important;
} }

48
static/css/popup.css
View file

@ -1,34 +1,52 @@
html { html {
box-sizing: border-box; box-sizing: border-box;
} }
[hidden] { [hidden] {
display: none !important display: none !important;
} }
button { button {
background:none; background: none;
border:none; border: none;
padding:0; padding: 0;
cursor:pointer; cursor: pointer;
} }
button:focus { button:focus {
outline: none; outline: none;
} }
.alert { input[type="text"],
background:#ced; input[type="url"],
border:1px solid #acc; textarea {
font-size: 16px;
} }
form label { .alert {
background: #ced;
border: 1px solid #acc;
}
form label {
margin: 0; margin: 0;
vertical-align: middle; vertical-align: middle;
display: table-cell; display: table-cell;
padding: 2px 0; padding: 2px 0;
} }
li { list-style-type: none; margin: 0; padding: 0; display: block;} li {
list-style-type: none;
margin: 0;
padding: 0;
display: block;
}
.when { color:#999} .when {
.unread { color:#b41 } color: #999;
a.unread { color:#b41 } }
a.bookmark_title { font-size:120%;} .unread {
color: #b41;
}
a.unread {
color: #b41;
}
a.bookmark_title {
font-size: 120%;
}
label { label {
cursor: pointer; cursor: pointer;

2
static/js/app.min.js vendored
View file

File diff suppressed because one or more lines are too long

BIN
static/js/app.min.js.gz
View file

Binary file not shown.

2
static/js/app.min.js.map
View file

File diff suppressed because one or more lines are too long

BIN
static/js/app.min.js.map.gz
View file

Binary file not shown.