X-Git-Url: https://git.pterodactylus.net/?p=Sone.git;a=blobdiff_plain;f=src%2Fmain%2Fresources%2Fstatic%2Fcss%2Fsone.css;h=d1f85a2c26175c13c9f9defb1cafbf9c246ea87d;hp=0feb60116bb5b4faaeff26959c88d4104b14b02a;hb=02de134dcf3d4500ae02320aab2dae827d499fa1;hpb=5441ddb67671b8708417d91804f01bde85fbde2c diff --git a/src/main/resources/static/css/sone.css b/src/main/resources/static/css/sone.css index 0feb601..d1f85a2 100644 --- a/src/main/resources/static/css/sone.css +++ b/src/main/resources/static/css/sone.css @@ -1,7 +1,7 @@ /* Sone Main CSS File */ /* first, override some fproxy rules. */ -#sone .post .reply div,#sone .post .time,#sone .post .delete,#sone .post .show-reply-form, input[type=text], textarea { +#sone div, #sone span, #sone .post .time,#sone .post .delete,#sone .post .show-reply-form, input[type=text], textarea { font: inherit; } @@ -49,8 +49,59 @@ textarea { color: rgb(255, 172, 0); } +#sone a.internet { + color: rgb(255, 0, 0); +} + +#sone a.internet:before { + content: '⚠ '; +} + +#sone a.freenet:before { + content: '» '; +} + +#sone a.freenet-trusted { + color: rgb(0, 128, 0); +} + +#sone a.freenet-trusted:before { + content: '★ '; +} + +#sone a img { + border: none; +} + +#sone #notification-area { + margin-top: 1em; +} + +#sone #notification-area .notification { + padding: 1ex; + border: solid 1px #ccc; + background-color: #ffffa0; + margin-bottom: 1ex; + min-height: 3.5ex; +} + +#sone #notification-area .notification .dismiss { + float: right; +} + +#sone #notification-area .notification .post-count { + margin-left: 1ex; +} + +#sone #plugin-warning { + border: solid 0.5em red; + padding: 0.5em; + margin-bottom: 1em; +} + #sone #profile { height: 80px; + margin-top: 1em; margin-bottom: 1ex; } @@ -61,16 +112,10 @@ textarea { #sone #profile.online .picture { position: absolute; - background-image: url("../images/sone.png"); - width: 80px; - height: 80px; } #sone #profile.offline .picture { position: absolute; - background-image: url("../images/sone-offline.png"); - width: 80px; - height: 80px; } #sone #profile.offline .edit-profile-link, #sone #profile.offline .profile-link { @@ -109,6 +154,7 @@ textarea { #sone #main { padding: 1em; + padding-top: 0px; } #sone #edit-profile #birth-day, #sone #edit-profile #birth-month, #sone #edit-profile #birth-year { @@ -127,12 +173,27 @@ textarea { clear: both; } +#sone .post.new { + background-color: #ffffa0; + padding-left: 1ex; +} + #sone .post.last { padding: 1ex 0px; border-bottom: none; } -#sone .post .author { +#sone .post > .avatar { + position: absolute; +} + +#sone .post > .inner-part { + margin-left: 48px; + padding-left: 0.5em; + min-height: 48px; +} + +#sone .post .author, #sone .post .recipient { display: inline; font-weight: bold; } @@ -143,37 +204,56 @@ textarea { } #sone .post .status-line { - clear: both; margin-top: 0.5ex; font-size: 85%; } +#sone .separator { + font: inherit; + color: rgb(28, 131, 191); +} + #sone .post .time { display: inline; color: #666; } -#sone .post .delete, #sone .post .likes, #sone .post .like, #sone .post .unlike { +#sone .post .delete, #sone .post .likes, #sone .post .like, #sone .post .unlike, #sone .post .trust, #sone .post .distrust, #sone .post .untrust { display: inline; font: inherit; + margin: 0px; } #sone .post .likes.hidden { display: none; } -#sone .post .like.hidden, #sone .post .unlike.hidden { +#sone .post .like.hidden, #sone .post .unlike.hidden, #sone .post .trust.hidden, #sone .post .distrust.hidden, #sone .post .untrust.hidden { display: none; } -#sone .post .delete button, #sone .post .like button, #sone .post .unlike button { +#sone .post .delete button, #sone .post .like button, #sone .post .unlike button, #sone .post .trust button, #sone .post .distrust button, #sone .post .untrust button { border: 0px; background: none; padding: 0px; color: rgb(28, 131, 191); + font: inherit; + margin: 0px; } -#sone .post .delete button:hover, #sone .post .like button:hover, #sone .post .unlike button:hover { +#sone .post .trust button { + color: rgb(0, 128, 0); +} + +#sone .post .distrust button { + color: rgb(255, 0, 0); +} + +#sone .post .untrust button { + color: rgb(64, 64, 64); +} + +#sone .post .delete button:hover, #sone .post .like button:hover, #sone .post .unlike button:hover, #sone .post .trust button:hover, #sone .post .distrust button:hover, #sone .post .untrust button:hover { border: 0px; background: none; padding: 0px; @@ -181,10 +261,6 @@ textarea { cursor: pointer; } -#sone .post .delete:before, #sone .post .likes:before, #sone .post .like:before, #sone .post .unlike:before { - content: ' ‧ '; -} - #sone .post .likes span { font: inherit; color: green; @@ -195,6 +271,27 @@ textarea { padding-top: 0.2ex; } +#sone .post .replies .click-to-show { + background-color: #f0f0ff; + font-size: 85%; + padding: 0.5em; + cursor: pointer; +} + +#sone .post .replies .click-to-show.new { + background-color: #ffffa0; +} + +#sone .post .reply > .avatar { + position: absolute; +} + +#sone .post .reply > .inner-part { + margin-left: 36px; + padding-left: 0.5em; + min-height: 36px; +} + #sone .post .reply { clear: both; background-color: #f0f0ff; @@ -203,6 +300,10 @@ textarea { padding: 1ex; } +#sone .post .reply.new { + background-color: #ffffa0; +} + #sone .post .reply .time { float: none; display: inline; @@ -224,19 +325,6 @@ textarea { color: rgb(255, 172, 0); } -#sone .post .show-reply-form:before { - content: ' ‧ '; -} - -#sone .post .reply .status-line .delete { - float: none; - display: inline; -} - -#sone .post .reply .status-line .delete:before { - content: ' · '; -} - #sone .post .create-reply { clear: both; background-color: #f0f0ff; @@ -245,12 +333,12 @@ textarea { #sone .post .create-reply input[type=text] { margin-left: 0.5ex; - width: 50em; + width: 44em; } #sone .post .create-reply textarea { margin-left: 0.5ex; - width: 50em; + width: 44em; height: 4em; } @@ -270,8 +358,8 @@ textarea { background-color: #f0fff0; } -#sone .sone .id { - display: none; +#sone .sone.new { + background-color: #ffffa0; } #sone .sone .profile-link { @@ -313,7 +401,7 @@ textarea { font-weight: bold; } -#sone .sone form { +#sone .sone form.follow, #sone .sone form.unfollow, #sone .sone form.lock, #sone .sone form.unlock { display: inline; border: solid 1px #ccc; border-left: none; @@ -324,11 +412,7 @@ textarea { bottom: -0.5ex } -#sone .sone form.hidden { - display: none; -} - -#sone .sone form.block button, #sone .sone form.unblock button, #sone .sone form.follow button, #sone .sone form.unfollow button, #sone .sone form.blacklist button, #sone .sone form.unblacklist button { +#sone .sone form.follow button, #sone .sone form.unfollow button, #sone .sone form.lock button, #sone .sone form.unlock button { display: inline; color: rgb(28, 131, 191); background: none; @@ -337,11 +421,19 @@ textarea { padding: 0px; } -#sone .sone form.block button:hover, #sone .sone form.unblock button:hover, #sone .sone form.follow button:hover, #sone .sone form.unfollow button:hover, #sone .sone form.blacklist button:hover, #sone .sone form.unblacklist button:hover { +#sone .sone form.follow button:hover, #sone .sone form.unfollow button:hover, #sone .sone form.lock button:hover, #sone .sone form.unlock button:hover { display: inline; color: rgb(255, 172, 0); } +#sone .sone.locked form.lock, #sone .sone.unlocked form.unlock { + display: none; +} + +#sone .sone form.hidden { + display: none; +} + #sone .sone .spacer { display: inline; } @@ -350,19 +442,15 @@ textarea { } -#sone #tail .import-key, #sone #import-key .import-key { +#sone #tail { margin-top: 1em; border-top: solid 1px #ccc; - padding-top: 1em; + padding-top: 2em; text-align: center; font-size: 75%; color: #888; } -#sone #import-key .import-key { - border-top: none; -} - #sone #add-sone textarea, #sone #create-sone textarea, #sone #load-sone textarea, #sone #edit-profile textarea { height: 1.5em; }