Tweaked appearance

This commit is contained in:
Marcin Kurczewski 2014-10-11 22:44:07 +02:00
parent 7ff35f4848
commit 33b205b574
3 changed files with 29 additions and 23 deletions

View file

@ -64,7 +64,8 @@ input[type=button]::before {
} }
button, button,
input[type=button] { input[type=button] {
vertical-align: top; vertical-align: middle;
line-height: normal;
background: transparent; background: transparent;
position: relative; position: relative;
padding: 2px 15px 3px 15px; padding: 2px 15px 3px 15px;
@ -95,7 +96,7 @@ input[type=button]:not(:disabled):active::before {
} }
button:not(:disabled):focus, button:not(:disabled):focus,
input[type=button]:not(:disabled):focus { input[type=button]:not(:disabled):focus {
border-color: #64C2ED; box-shadow: 0 1px 1px 0 #e5e5e5, 0 0 0 2px #64C2ED inset;
} }
button:disabled { button:disabled {
color: gray; color: gray;

View file

@ -2,9 +2,8 @@
text-align: center; text-align: center;
} }
.post-list form input,
.post-list form button { .post-list form button {
font-size: 15px; margin-left: 0.25em;
} }
.post-list .search { .post-list .search {
@ -54,15 +53,15 @@
.post-small a:focus, .post-small a:focus,
.post-small a:hover { .post-small a:hover {
background: #afe; background: #64C2ED;
border-color: #5da; border-color: #64C2ED;
box-shadow: 0 0 0 2px #5da; box-shadow: 0 0 0 2px #64C2ED;
outline: 0; outline: 0;
} }
.post-small a:focus img, .post-small a:focus img,
.post-small a:hover img { .post-small a:hover img {
opacity: .9; opacity: .8 !important;
} }
.post-small a .info { .post-small a .info {
@ -72,7 +71,7 @@
bottom: 0; bottom: 0;
left: 0; left: 0;
right: 0; right: 0;
background: #5da; background: #64C2ED;
color: black; color: black;
} }
.post-small a .info ul { .post-small a .info ul {
@ -90,7 +89,7 @@
display: block; display: block;
} }
.post-small:not(.post-type-image) a:before { .post-small:not(.post-type-image) a::before {
display: block; display: block;
content: ''; content: '';
z-index: 2; z-index: 2;
@ -103,7 +102,7 @@
border-left: 50px solid transparent; border-left: 50px solid transparent;
} }
.post-small:not(.post-type-image) a:after { .post-small:not(.post-type-image) a::after {
display: block; display: block;
content: '...'; content: '...';
z-index: 3; z-index: 3;
@ -118,14 +117,14 @@
color: white; color: white;
font-size: 15px; font-size: 15px;
} }
.post-small.post-type-youtube a:after { .post-small.post-type-youtube a::after {
font-size: 13px; font-size: 13px;
content: 'youtube'; content: 'youtube';
} }
.post-small.post-type-video a:after { .post-small.post-type-video a::after {
content: 'video'; content: 'video';
} }
.post-small.post-type-flash a:after { .post-small.post-type-flash a::after {
content: 'flash'; content: 'flash';
} }
@ -137,6 +136,7 @@
right: 0; right: 0;
top: 50%; top: 50%;
bottom: 0; bottom: 0;
pointer-events: none;
} }
.post-small .action button { .post-small .action button {
@ -147,23 +147,28 @@
margin: -1em auto 0 auto; margin: -1em auto 0 auto;
box-sizing: content-box; box-sizing: content-box;
opacity: .7; opacity: .7;
box-shadow: none;
pointer-events: auto;
}
.post-small .action button:focus {
box-shadow: 0 0 0 2px #64C2ED inset !important;
} }
.tagged .action button, .tagged .action button,
.untagged .action button { .untagged .action button {
border: 1px solid black; border: 1px solid black;
font-weight: bold; font-weight: bold;
box-shadow: none; text-shadow: none;
}
.untagged .action button::before {
background: red;
} }
.untagged .action button { .untagged .action button {
background: red;
color: white; color: white;
} }
.tagged .action button { .tagged .action button::before {
background: lime; background: lime;
}
.tagged .action button {
color: black; color: black;
} }
.untagged .post-small img,
.tagged .post-small img {
opacity: .85;
}

View file

@ -5,8 +5,8 @@
<% if (privileges.canMassTag) { %> <% if (privileges.canMassTag) { %>
<div class="mass-tag-wrapper"> <div class="mass-tag-wrapper">
<p class="mass-tag-info">Tagging with <span class="mass-tag"><%= massTag %></span></p> <p class="mass-tag-info">Tagging with <span class="mass-tag"><%= massTag %></span></p><!--
<button name="mass-tag">Mass tag</button> --><button name="mass-tag">Mass tag</button>
</div> </div>
<% } %> <% } %>
</form> </form>