Merge pull request #19 from brettinternet/input-font-size
make input font size 16pt which has better compatibility with safari
This commit is contained in:
commit
cdbb612fd6
|
@ -153,20 +153,20 @@ bmark b' =
|
|||
div [ class_ "edit_bookmark_form pa2 pt0 bg-white" ] $
|
||||
[ form [ onSubmit (Just <<< BEditSubmit) ]
|
||||
[ 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) ]
|
||||
, div_ [ text "title" ]
|
||||
, 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) ]
|
||||
, 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" ]
|
||||
, 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) ]
|
||||
, div [ id_ "tags_input_box"]
|
||||
[ 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"
|
||||
, value (edit_bm.tags) , onValueChange (editField Etags) ]
|
||||
]
|
||||
|
|
|
@ -126,12 +126,12 @@ nnote st' =
|
|||
renderNote_edit _ =
|
||||
form [ onSubmit (Just <<< NEditSubmit) ]
|
||||
[ 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)
|
||||
]
|
||||
, br_
|
||||
, 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)
|
||||
]
|
||||
, div [ class_ "edit_form_checkboxes mb3"]
|
||||
|
|
|
@ -8,23 +8,31 @@ body {
|
|||
}
|
||||
|
||||
button {
|
||||
background:none;
|
||||
border:none;
|
||||
padding:0;
|
||||
cursor:pointer;
|
||||
background: none;
|
||||
border: none;
|
||||
padding: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
button:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
|
||||
[hidden] {
|
||||
display: none !important
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
input::placeholder {
|
||||
color: lightgray
|
||||
color: lightgray;
|
||||
}
|
||||
|
||||
input[type="text"],
|
||||
input[type="url"],
|
||||
input[type="password"],
|
||||
textarea {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.queryInput {
|
||||
width: 128px;
|
||||
padding: 0 22px 0 2px;
|
||||
|
@ -34,9 +42,10 @@ input::placeholder {
|
|||
border-color: gray;
|
||||
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 {
|
||||
width: 175px;
|
||||
}
|
||||
|
@ -44,15 +53,15 @@ input::placeholder {
|
|||
.queryInput.search-active {
|
||||
border-color: #990;
|
||||
border-width: 2px;
|
||||
background-color: #FF9;
|
||||
background-color: #ff9;
|
||||
width: 175px;
|
||||
}
|
||||
.queryIcon {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top:1px;
|
||||
cursor:pointer;
|
||||
width:20px;
|
||||
top: 1px;
|
||||
cursor: pointer;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
fill: currentColor;
|
||||
}
|
||||
|
@ -60,100 +69,116 @@ label {
|
|||
cursor: pointer;
|
||||
}
|
||||
.close-x-wrap {
|
||||
float: left;
|
||||
width: 17px;
|
||||
height: 17px;
|
||||
top: 2px;
|
||||
position: relative;
|
||||
right: 2px;
|
||||
float: left;
|
||||
width: 17px;
|
||||
height: 17px;
|
||||
top: 2px;
|
||||
position: relative;
|
||||
right: 2px;
|
||||
}
|
||||
.close-x {
|
||||
stroke: gray;
|
||||
fill: transparent;
|
||||
stroke-linecap: round;
|
||||
stroke-width: 3;
|
||||
stroke: gray;
|
||||
fill: transparent;
|
||||
stroke-linecap: round;
|
||||
stroke-width: 3;
|
||||
}
|
||||
.query-info-icon {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
right: -18px;
|
||||
text-decoration: none;
|
||||
font-size: 12px;
|
||||
padding: 0 8px 8px 0;
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
right: -18px;
|
||||
text-decoration: none;
|
||||
font-size: 12px;
|
||||
padding: 0 8px 8px 0;
|
||||
}
|
||||
.star {
|
||||
margin-left:-20px;
|
||||
font-size:1.2em;
|
||||
position:relative;
|
||||
top:-2px;
|
||||
margin-left: -20px;
|
||||
font-size: 1.2em;
|
||||
position: relative;
|
||||
top: -2px;
|
||||
}
|
||||
|
||||
.star button {
|
||||
transition: color .1s;
|
||||
.star button {
|
||||
transition: color 0.1s;
|
||||
}
|
||||
.star.selected button {
|
||||
color:#22a;
|
||||
.star.selected button {
|
||||
color: #22a;
|
||||
}
|
||||
.edit_links button {
|
||||
transition: color .1s ease-in;
|
||||
transition: color 0.1s ease-in;
|
||||
}
|
||||
|
||||
.tag {
|
||||
color:#a51;
|
||||
line-height:190%;
|
||||
color: #a51;
|
||||
line-height: 190%;
|
||||
display: inline-block;
|
||||
}
|
||||
.tag-include {
|
||||
color:rgb(221, 221, 221);
|
||||
line-height:190%;
|
||||
color: rgb(221, 221, 221);
|
||||
line-height: 190%;
|
||||
display: inline-block;
|
||||
}
|
||||
.tag-exclude {
|
||||
color:rgb(255, 170, 170);
|
||||
line-height:190%;
|
||||
display: inline-block;
|
||||
color: rgb(255, 170, 170);
|
||||
line-height: 190%;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.private { background:#ddd;border:1px solid #d1d1d1; }
|
||||
.unread { color:#b41 }
|
||||
.mark_read {color: #a81;}
|
||||
.flash { color:green;background:#efe }
|
||||
.private {
|
||||
background: #ddd;
|
||||
border: 1px solid #d1d1d1;
|
||||
}
|
||||
.unread {
|
||||
color: #b41;
|
||||
}
|
||||
.mark_read {
|
||||
color: #a81;
|
||||
}
|
||||
.flash {
|
||||
color: green;
|
||||
background: #efe;
|
||||
}
|
||||
|
||||
.top_menu {
|
||||
margin-top:6px;
|
||||
.top_menu {
|
||||
margin-top: 6px;
|
||||
}
|
||||
.top_menu a {
|
||||
color: blue;
|
||||
}
|
||||
.bookmarklet {
|
||||
padding:1px 2px 0px 2px;
|
||||
.bookmarklet {
|
||||
padding: 1px 2px 0px 2px;
|
||||
}
|
||||
|
||||
.alert {
|
||||
background:#ced;
|
||||
border:1px solid #acc;
|
||||
.alert {
|
||||
background: #ced;
|
||||
border: 1px solid #acc;
|
||||
}
|
||||
|
||||
.edit_bookmark_form {color:#888;}
|
||||
.edit_bookmark_form input {border:1px solid #ddd;}
|
||||
.edit_bookmark_form textarea {border:1px solid #ddd;}
|
||||
.edit_bookmark_form {
|
||||
color: #888;
|
||||
}
|
||||
.edit_bookmark_form input {
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
.edit_bookmark_form textarea {
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
|
||||
.nav-active {
|
||||
background:#ff8;
|
||||
color:blue;
|
||||
background: #ff8;
|
||||
color: blue;
|
||||
}
|
||||
|
||||
/* mobile device */
|
||||
@media only screen and (max-width : 750px) {
|
||||
body {
|
||||
-webkit-text-size-adjust: none;
|
||||
@media only screen and (max-width: 750px) {
|
||||
body {
|
||||
-webkit-text-size-adjust: none;
|
||||
}
|
||||
.display {
|
||||
float: none
|
||||
float: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width : 500px) {
|
||||
@media only screen and (max-width: 500px) {
|
||||
.filters {
|
||||
clear: both;
|
||||
position: relative;
|
||||
|
@ -162,44 +187,44 @@ label {
|
|||
}
|
||||
|
||||
.rdim {
|
||||
opacity: .8;
|
||||
transition: all .15s ease-in;
|
||||
opacity: 0.8;
|
||||
transition: all 0.15s ease-in;
|
||||
}
|
||||
.rdim:hover,
|
||||
.rdim:focus {
|
||||
opacity: 1;
|
||||
transition: all .15s ease-in;
|
||||
opacity: 1;
|
||||
transition: all 0.15s ease-in;
|
||||
}
|
||||
.display .description > div p,
|
||||
.display .description > div pre
|
||||
{
|
||||
margin-top: 9px;
|
||||
margin-bottom: 9px;
|
||||
.display .description > div pre {
|
||||
margin-top: 9px;
|
||||
margin-bottom: 9px;
|
||||
}
|
||||
.display .description > div > *:first-child {
|
||||
margin-top: 2px;
|
||||
margin-top: 2px;
|
||||
}
|
||||
.display .description > div > *:last-child {
|
||||
margin-bottom: 2px;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
.display .description > div > ol li p {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.display .description > div > ul li p {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.display .description > div ol {
|
||||
padding-left: 23px;
|
||||
padding-left: 23px;
|
||||
}
|
||||
.display .description > div ul {
|
||||
padding-left: 23px;
|
||||
padding-left: 23px;
|
||||
}
|
||||
code, pre {
|
||||
font-size:13px;
|
||||
code,
|
||||
pre {
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
#content:not([view-rendered]) .view-delay {
|
||||
display: none !important
|
||||
display: none !important;
|
||||
}
|
||||
|
|
|
@ -1,34 +1,52 @@
|
|||
html {
|
||||
box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
[hidden] {
|
||||
display: none !important
|
||||
display: none !important;
|
||||
}
|
||||
button {
|
||||
background:none;
|
||||
border:none;
|
||||
padding:0;
|
||||
cursor:pointer;
|
||||
background: none;
|
||||
border: none;
|
||||
padding: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
button:focus {
|
||||
outline: none;
|
||||
}
|
||||
.alert {
|
||||
background:#ced;
|
||||
border:1px solid #acc;
|
||||
input[type="text"],
|
||||
input[type="url"],
|
||||
textarea {
|
||||
font-size: 16px;
|
||||
}
|
||||
form label {
|
||||
.alert {
|
||||
background: #ced;
|
||||
border: 1px solid #acc;
|
||||
}
|
||||
form label {
|
||||
margin: 0;
|
||||
vertical-align: middle;
|
||||
display: table-cell;
|
||||
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}
|
||||
.unread { color:#b41 }
|
||||
a.unread { color:#b41 }
|
||||
a.bookmark_title { font-size:120%;}
|
||||
.when {
|
||||
color: #999;
|
||||
}
|
||||
.unread {
|
||||
color: #b41;
|
||||
}
|
||||
a.unread {
|
||||
color: #b41;
|
||||
}
|
||||
a.bookmark_title {
|
||||
font-size: 120%;
|
||||
}
|
||||
|
||||
label {
|
||||
cursor: pointer;
|
||||
|
|
2
static/js/app.min.js
vendored
2
static/js/app.min.js
vendored
File diff suppressed because one or more lines are too long
Binary file not shown.
File diff suppressed because one or more lines are too long
Binary file not shown.
Loading…
Reference in a new issue