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

make css spacing consistent

Browse source
This commit is contained in:
brett 2020-10-01 13:42:39 -06:00 committed by Yann Esposito (Yogsototh)
parent 8fa24e5d8e
commit 9570100c79
Signed by untrusted user who does not match committer: yogsototh
GPG key ID: 7B19A4C650D59646
2 changed files with 131 additions and 100 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

188
static/css/main.css
View file

@ -8,23 +8,24 @@ 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;
} }
.queryInput { .queryInput {
width: 128px; width: 128px;
padding: 0 22px 0 2px; padding: 0 22px 0 2px;
@ -34,9 +35,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 +46,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 +62,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 +180,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;
} }

43
static/css/popup.css
View file

@ -1,34 +1,47 @@
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 { .alert {
background:#ced; background: #ced;
border:1px solid #acc; border: 1px solid #acc;
} }
form label { 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;