From: Marcel Werk Date: Thu, 5 Apr 2012 15:56:18 +0000 (+0200) Subject: Many style fixes X-Git-Tag: 2.0.0_Beta_1~1163 X-Git-Url: https://git.stricted.de/?a=commitdiff_plain;h=99a780611e81f76325ffeb85ffd64e04cdd08980;p=GitHub%2FWoltLab%2FWCF.git Many style fixes --- diff --git a/wcfsetup/install/files/style/badge.less b/wcfsetup/install/files/style/badge.less index 78496b406e..57df5b2d67 100644 --- a/wcfsetup/install/files/style/badge.less +++ b/wcfsetup/install/files/style/badge.less @@ -15,8 +15,8 @@ border-radius: 13px; color: @wcfPageLinkHoverColor; display: inline-block; - font-size: 70%; - padding: 2px 8px; + font-size: @wcfSmallFontSize; + padding: 1px 8px 2px; position: relative; text-shadow: none; white-space: nowrap; @@ -24,7 +24,7 @@ .badgeShadow(@wcfContentBackgroundColor); &.badgeUpdate { - background-color: #336699; + background-color: #369; color: @wcfPageLinkHoverColor; } @@ -44,4 +44,25 @@ .badgeShadow(@wcfPageBackgroundColor); } +} + +/* special */ +.containerHeadline h1 .badge { + font-size: 70%; + top: -1px; +} + +.boxHeadline > hgroup h1 .badge { + font-size: 50%; + top: -3px; +} + +.mainMenu .badge { + font-size: 70%; + top: -1px; +} + +.mainMenu .active .badge { + font-size: 65%; + top: -2px; } \ No newline at end of file diff --git a/wcfsetup/install/files/style/breadcrumbs.less b/wcfsetup/install/files/style/breadcrumbs.less index f50f8d898b..5195efe200 100644 --- a/wcfsetup/install/files/style/breadcrumbs.less +++ b/wcfsetup/install/files/style/breadcrumbs.less @@ -15,7 +15,7 @@ > ul { > li { float: left; - font-size: 85%; + font-size: @wcfSmallFontSize; list-style: none; max-width: 30%; position: relative; diff --git a/wcfsetup/install/files/style/codebox.less b/wcfsetup/install/files/style/codebox.less index 7b8e862807..0e5e4648cc 100644 --- a/wcfsetup/install/files/style/codebox.less +++ b/wcfsetup/install/files/style/codebox.less @@ -171,6 +171,7 @@ background-position: 12px 12px; background-repeat: no-repeat; padding: 10px 20px 10px 58px; + min-height: 28px; header { padding: 0 0 4px 0 !important; diff --git a/wcfsetup/install/files/style/comments.less b/wcfsetup/install/files/style/comments.less index 8268d91641..64581e98f4 100644 --- a/wcfsetup/install/files/style/comments.less +++ b/wcfsetup/install/files/style/comments.less @@ -1,63 +1,58 @@ /* ############## Profile Comments ############## */ -.commentList > li, .commentResponseList > li { - position: relative; -} - -.commentOptions { - display: block; - position: absolute; - top: @wcfGapMedium; - right: @wcfGapMedium; +.commentList { + .comment, .commentResponse { + position: relative; + } - li { - float: left; - opacity: 0; + .commentOptions { + display: block; + position: absolute; + top: @wcfGapMedium; + right: @wcfGapMedium; - .transition(opacity, .1s); - - a { - padding: 4px; + li { + float: left; + opacity: 0; + + .transition(opacity, .1s); + + a { + padding: 4px; + } } } -} - -.commentResponseList .commentOptions { - top: @wcfGapSmall; - right: @wcfGapSmall; -} - -.commentContent:hover .commentOptions li { - opacity: 1; -} - -.commentAdd small, .commentResponseAdd small { - color: @wcfDimmedColor; - margin-top: 3px; -} - -.commentList > li > div > div > .commentContent { - margin-bottom: @wcfGapMedium; -} + + .commentResponseList .commentOptions { + top: @wcfGapSmall; + right: @wcfGapSmall; + } + + .commentContent:hover .commentOptions li { + opacity: 1; + } -.commentResponseList { - > li { + .commentAdd small, .commentResponseAdd small { + color: @wcfDimmedColor; + } + + .commentContent:not(.commentResponseContent) { + margin-bottom: @wcfGapMedium; + } + + .commentResponseList .commentResponse { border-top: 1px solid @wcfContainerBorderColor; padding: @wcfGapSmall; - - &:nth-child(2n) { - //background-color: @wcfContainerAccentBackgroundColor; - } } -} - -.commentResponseAdd { - border-top: 1px solid @wcfContainerBorderColor; - padding: 7px 7px 0; -} - -.commentResponseAdd ~ .commentResponseList > li:first-child { - margin-top: 7px; + + .commentResponseAdd { + border-top: 1px solid @wcfContainerBorderColor; + padding: 7px 7px 0; + } + + .commentResponseAdd ~ .commentResponseList .commentResponse:first-child { + margin-top: 7px; + } } .commentList > li:nth-child(2n) .commentResponseList > li:nth-child(2n+1) { diff --git a/wcfsetup/install/files/style/dialog.less b/wcfsetup/install/files/style/dialog.less index 207b1d0207..df0fc5f1f5 100644 --- a/wcfsetup/install/files/style/dialog.less +++ b/wcfsetup/install/files/style/dialog.less @@ -21,7 +21,7 @@ } .dialogTitlebar { - background-color: saturate(lighten(@wcfPageBackgroundColor, 20%), 20%); + background-color: @wcfTabularBoxBackgroundColor; background-image: url(../../images/header.png); background-position: top left; background-repeat: repeat-x; @@ -35,7 +35,7 @@ .dialogTitle { color: @wcfPageLinkHoverColor; display: block; - font-size: 170%; + font-size: @wcfHeadlineFontSize; font-weight: bold; .textShadow(saturate(lighten(@wcfPageBackgroundColor, 20%), 20%)); diff --git a/wcfsetup/install/files/style/dropdown.less b/wcfsetup/install/files/style/dropdown.less index 5012d35077..a287c389f5 100644 --- a/wcfsetup/install/files/style/dropdown.less +++ b/wcfsetup/install/files/style/dropdown.less @@ -150,6 +150,14 @@ .textShadow(@wcfDropdownHoverBackgroundColor); } } + + .containerHeadline { + margin-bottom: 0; + + h2 { + font-size: @wcfSmallFontSize; + } + } } } diff --git a/wcfsetup/install/files/style/forms.less b/wcfsetup/install/files/style/forms.less index 150fc5fcf6..e1f2dfd886 100644 --- a/wcfsetup/install/files/style/forms.less +++ b/wcfsetup/install/files/style/forms.less @@ -84,12 +84,6 @@ dl.wide > dd { dl > dd > small { color: @wcfDimmedColor; display: block; - font-size: 85%; - margin: 3px 0 7px; -} - -dl > dd > p { - margin-top: 5px; } /* Nested */ diff --git a/wcfsetup/install/files/style/layout.less b/wcfsetup/install/files/style/layout.less index 312393a58f..7f20272d92 100644 --- a/wcfsetup/install/files/style/layout.less +++ b/wcfsetup/install/files/style/layout.less @@ -6,7 +6,7 @@ body { color: @wcfPageColor; font-family: @wcfBaseFontFamily; font-size: @wcfBaseFontSize; - line-height: 1; + line-height: @wcfBaseLineHeight; } a { @@ -36,8 +36,7 @@ a { } small { - font-size: 85%; - margin-top: 2px; + font-size: @wcfSmallFontSize; } .invisible { @@ -96,15 +95,18 @@ img { background-color: @wcfContainerHoverBackgroundColor; } } + + > * > li { + padding: @wcfGapMedium @wcfGapLarge; + } } .containerHeadline { margin-bottom: @wcfGapSmall; > h1 { - font-size: 120%; + font-size: @wcfTitleFontSize; font-weight: bold; - margin-bottom: 2px; > small { color: @wcfDimmedColor; @@ -152,10 +154,11 @@ img { hgroup { > h1 { color: @wcfHeadlineColor; - font-size: 170%; + font-family: @wcfHeadlineFontFamily; + font-size: @wcfHeadlineFontSize; font-weight: bold; border-bottom: 1px solid @wcfHeadlineColor; - padding: 1px 0 10px; + padding: 1px 0 5px; .textShadow(@wcfContentBackgroundColor); @@ -180,9 +183,10 @@ img { > h1 { border-bottom: 1px solid @wcfDimmedColor; color: @wcfDimmedColor; - font-size: 150%; + font-family: @wcfHeadlineFontFamily; + font-size: @wcfSubHeadlineFontSize; font-weight: bold; - padding: 1px 0 10px; + padding: 1px 0 5px; .textShadow(@wcfContainerBackgroundColor); } @@ -244,8 +248,7 @@ ul.dataList { } .contentOptions { - font-size: 100%; - line-height: 1; + font-size: @wcfSmallFontSize; position: relative; nav { diff --git a/wcfsetup/install/files/style/like.less b/wcfsetup/install/files/style/like.less index af9639b60b..fd7088afd6 100644 --- a/wcfsetup/install/files/style/like.less +++ b/wcfsetup/install/files/style/like.less @@ -26,7 +26,6 @@ .likesWidget > ul > li { text-align: right; - margin-top: 3px; display: inline-block; } diff --git a/wcfsetup/install/files/style/message.less b/wcfsetup/install/files/style/message.less index ef4cc048a4..2deca5152d 100644 --- a/wcfsetup/install/files/style/message.less +++ b/wcfsetup/install/files/style/message.less @@ -3,7 +3,6 @@ border: 1px solid @wcfContainerBorderColor; position: relative; - //.boxShadow(0, 0, #eee, 7px); .borderRadius(); &:after { @@ -109,12 +108,12 @@ .messageCounter { float: right; - font-size: 90%; + font-size: @wcfSmallFontSize; font-weight: bold; margin-left: @wcfGapSmall; a { - padding: 2px 5px; + padding: 1px 5px; } } } @@ -150,25 +149,24 @@ .borderRadius(); header { - padding: 20px 20px 5px; + padding: 20px 20px 0; position: relative; time { color: @wcfDimmedColor; - font-size: 85%; - margin-top: @wcfGapSmall; + font-size: @wcfSmallFontSize; } .likesDisplay { display: inline-block; - margin: -2px 0 -2px @wcfGapTiny; + margin: -2px 0 -2px 4px; } .messageTitle { color: @wcfColor; - font-size: 130%; + font-size: @wcfSubHeadlineFontSize; font-weight: bold; - padding: 13px 0 0; + padding: @wcfGapSmall 0 0; .textShadow(@wcfContainerBackgroundColor); } @@ -299,12 +297,8 @@ } .message { - .messageSignature { - border-top: 1px dotted @wcfContainerBorderColor; + .signature { color: lighten(@wcfColor, 10%); - display: block; - margin: 10px 0 0; - padding: 10px 0; } } diff --git a/wcfsetup/install/files/style/pagination.less b/wcfsetup/install/files/style/pagination.less index 7cd589bc8d..6caf3411e4 100644 --- a/wcfsetup/install/files/style/pagination.less +++ b/wcfsetup/install/files/style/pagination.less @@ -41,7 +41,7 @@ } &.skip { - padding: 2px 0 1px; + padding: 1px 0 1px; } &:not(.disabled):hover a { @@ -49,13 +49,13 @@ } &:not(.skip) a { - padding: 3px 1px; + padding: 2px 1px; } &.active, &.active:hover { border: 1px solid darken(@wcfButtonColor, 5%); color: lighten(@wcfButtonBackgroundColor, 5%); - padding: 3px 0; + padding: 2px 0; .linearGradient(@wcfButtonColor, darken(@wcfButtonColor, 10%), @wcfButtonColor 3px); .textShadow(#000); @@ -82,9 +82,8 @@ /* Special -> Status Display */ .statusDisplay .pageNavigation { - font-size: 80%; + font-size: @wcfSmallFontSize; float: left; - margin-right: 7px; margin-top: 2px; ul { diff --git a/wcfsetup/install/files/style/tabular.less b/wcfsetup/install/files/style/tabular.less index 8d8d2c5864..5083974e2b 100644 --- a/wcfsetup/install/files/style/tabular.less +++ b/wcfsetup/install/files/style/tabular.less @@ -192,13 +192,10 @@ .statusIcons { float: right; + margin-left: 7px; li { display: inline-block; } } - - img { - cursor: pointer; - } } \ No newline at end of file diff --git a/wcfsetup/install/files/style/user.less b/wcfsetup/install/files/style/user.less index 1274d5854f..b47fc77a65 100644 --- a/wcfsetup/install/files/style/user.less +++ b/wcfsetup/install/files/style/user.less @@ -10,7 +10,7 @@ .framedIconList { li { float: left; - margin: 0 4px 4px 0; + margin: 0 2px 4px 0; .framed { display: inline-block; @@ -29,11 +29,7 @@ /* ##### User List #### */ .simpleUserList { h2, p, dl { - font-size: 85%; - } - - p, dl { - margin-bottom: 2px; + font-size: @wcfSmallFontSize; } } diff --git a/wcfsetup/install/files/style/userPanel.less b/wcfsetup/install/files/style/userPanel.less index 6addb00085..df03061952 100644 --- a/wcfsetup/install/files/style/userPanel.less +++ b/wcfsetup/install/files/style/userPanel.less @@ -15,7 +15,7 @@ &:hover { background-color: rgba(0, 0, 0, .9); - .searchBar input[type="text"] { + .searchBar input[type="search"] { background-color: darken(@wcfPageBackgroundColor, 5%); } } diff --git a/wcfsetup/install/files/style/variables.less b/wcfsetup/install/files/style/variables.less index 49de615222..92e83a7b9d 100644 --- a/wcfsetup/install/files/style/variables.less +++ b/wcfsetup/install/files/style/variables.less @@ -21,7 +21,12 @@ /* font */ @wcfBaseFontSize: 13px; @wcfBaseFontFamily: "Trebuchet MS", Arial, sans-serif; -@wcfBaseLineHeight: 15px; +@wcfBaseLineHeight: 1.27; +@wcfHeadlineFontSize: 170%; +@wcfHeadlineFontFamily: @wcfBaseFontFamily; +@wcfSubHeadlineFontSize: 140%; +@wcfTitleFontSize: 120%; +@wcfSmallFontSize: 85%; /* container */ @wcfContainerAccentBackgroundColor: darken(@wcfContainerBackgroundColor, 3%); diff --git a/wcfsetup/install/files/style/wbb.less b/wcfsetup/install/files/style/wbb.less index 705eb87c70..324d0ef033 100644 --- a/wcfsetup/install/files/style/wbb.less +++ b/wcfsetup/install/files/style/wbb.less @@ -22,7 +22,7 @@ } .wbbStats { - font-size: 85%; + font-size: @wcfSmallFontSize; left: 50%; margin-top: @wcfGapSmall; position: absolute; @@ -34,7 +34,6 @@ dt { float: right; - padding-bottom: 4px; width: 40%; &:after { @@ -45,7 +44,6 @@ dd { float: left; margin: 0; - padding-bottom: 4px; text-align: right; width: 58%; } @@ -72,14 +70,13 @@ h1 a { display: inline-block; overflow: hidden; - padding-bottom: 2px; /* prevents letters from being cut */ text-overflow: ellipsis; width: 98%; white-space: nowrap; } h2 { - font-size: 85%; + font-size: @wcfSmallFontSize; time { color: @wcfDimmedColor; @@ -89,8 +86,6 @@ } .wbbSubBoards { - margin-top: @wcfGapSmall; - li { display: inline-block; } @@ -98,7 +93,6 @@ .wbbBoardDescription { font-size: 90%; - padding-top: @wcfGapTiny; } .wbbBoardContainer { @@ -141,12 +135,12 @@ .borderRadius(@wcfContainerBorderRadius); } - .new > div > hgroup > h1 { - font-weight: bold; + .wbbBoard > div > hgroup > h1 { + font-weight: normal; } - .wbbBoard > div > hgroup > h1 { - font-size: 120%; + .new > div > hgroup > h1, .wbbSubBoards li.new a { + font-weight: bold; } .wbbCollapsibleCategory .collapsibleButton { @@ -182,8 +176,7 @@ .wbbThreadList { .wbbLastPost h2 { color: @wcfDimmedColor; - font-size: 85%; - margin-top: 2px; + font-size: @wcfSmallFontSize; } .columnLastPost { @@ -215,6 +208,15 @@ } } + .columnTopic .labelList { + float: right; + padding-left: 7px; + } + + .columnTopic .wbbTopicLink { + font-size: @wcfTitleFontSize; + } + tr.new .columnTopic > h1 { font-weight: bold; } @@ -264,7 +266,7 @@ color: @wcfLinkColor; display: inline-block; font-weight: bold; - font-size: 85%; + font-size: @wcfSmallFontSize; left: -220px; top: 30px; padding: 6px 10px; @@ -319,7 +321,7 @@ } time { - font-size: 85%; + font-size: @wcfSmallFontSize; font-style: italic; }