From 5ad6d62fe78f27e3d9830862579699e7f9239a54 Mon Sep 17 00:00:00 2001 From: Alexander Ebert Date: Sat, 12 Mar 2016 14:06:18 +0100 Subject: [PATCH] Removed some obsolete LESS files --- wcfsetup/install/files/style/attachment.less | 194 -- wcfsetup/install/files/style/comment.less | 152 -- wcfsetup/install/files/style/dialog.less | 245 -- wcfsetup/install/files/style/element/dl.less | 139 - .../files/style/element/inputText.less | 41 - .../install/files/style/element/select.less | 14 - .../install/files/style/element/textarea.less | 16 - wcfsetup/install/files/style/form.less | 809 ------ wcfsetup/install/files/style/layout.less | 2359 ----------------- wcfsetup/install/files/style/message.less | 1134 -------- wcfsetup/install/files/style/sortable.less | 60 - wcfsetup/install/files/style/styleEditor.less | 42 - 12 files changed, 5205 deletions(-) delete mode 100644 wcfsetup/install/files/style/attachment.less delete mode 100644 wcfsetup/install/files/style/comment.less delete mode 100644 wcfsetup/install/files/style/dialog.less delete mode 100644 wcfsetup/install/files/style/element/dl.less delete mode 100644 wcfsetup/install/files/style/element/inputText.less delete mode 100644 wcfsetup/install/files/style/element/select.less delete mode 100644 wcfsetup/install/files/style/element/textarea.less delete mode 100644 wcfsetup/install/files/style/form.less delete mode 100644 wcfsetup/install/files/style/layout.less delete mode 100644 wcfsetup/install/files/style/message.less delete mode 100644 wcfsetup/install/files/style/sortable.less delete mode 100644 wcfsetup/install/files/style/styleEditor.less diff --git a/wcfsetup/install/files/style/attachment.less b/wcfsetup/install/files/style/attachment.less deleted file mode 100644 index 2570caec80..0000000000 --- a/wcfsetup/install/files/style/attachment.less +++ /dev/null @@ -1,194 +0,0 @@ -/* attachment thumbnail list */ -.attachmentThumbnailList, .attachmentFileList { - padding-top: @wcfGapSmall !important; - - > fieldset { - padding: 0; - - > legend { - border-bottom: 0; - font-size: @wcfTitleFontSize; - padding-bottom: @wcfGapSmall; - } - } -} - -.attachmentThumbnailList { - padding-bottom: @wcfGapSmall !important; - - > fieldset { - > ul { - padding: 0 @wcfGapSmall+@wcfGapTiny 0 @wcfGapTiny; - - > li { - margin: 0 0 @wcfGapMedium @wcfGapSmall; - vertical-align: top; - } - } - } -} - -.attachmentFileList { - > fieldset > ul > li { - &:not(:first-child) { - margin-top: @wcfGapTiny; - } - } -} - -.attachmentThumbnail { - background-color: white; - display: inline-block; - min-height: ~"@{wcf_option_attachment_thumbnail_height}px"; - min-width: ~"@{wcf_option_attachment_thumbnail_width}px"; - position: relative; - - > a { - display: inline-block; - min-height: ~"@{wcf_option_attachment_thumbnail_height}px"; - min-width: ~"@{wcf_option_attachment_thumbnail_width}px"; - } - - > div { - background-color: rgba(0, 0, 0, 0.6); - bottom: 0; - color: #fff; - position: absolute; - width: 100%; - padding: @wcfGapSmall 0; - - > p, - > small { - margin: 0 @wcfGapSmall; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - word-wrap: normal; - } - - > small { - display: block; - height: 0; - - .transition(height, .25s, ease-out); - } - } - - &:hover { - > div > small { - height: 1.27em; - } - } -} - -/* attachment form */ -.formAttachmentList { - border-bottom: 1px solid @wcfContainerBorderColor; - margin-bottom: @wcfGapSmall; - padding-bottom: @wcfGapSmall; - - > li { - margin-bottom: @wcfGapSmall; - - > div { - > div { - margin-right: @wcfGapSmall; - - > p { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - - > a { - display: block; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - } - } - } - - > ul { - margin-top: @wcfGapSmall; - - > li { - display: inline-block; - } - } - } - } - - &.sortableList { - list-style-type: none; - margin-left: 0; - } -} - -.formAttachmentContent { - .jsButtonAttachmentInsertAll { - vertical-align: baseline; - } - - .uploadButton { - vertical-align: bottom; - } - - > dl { - div + small { - margin-top: @wcfGapSmall !important; - } - } -} - -@media only screen and (min-width: 801px) { - .formAttachmentList { - > li { - float: left; - width: 50%; - } - } -} - -.box48 .attachmentTinyThumbnail { - max-height: 48px; - max-width: 48px; -} - -.box64 .attachmentTinyThumbnail { - max-height: 64px; - max-width: 64px; -} - -/* add search icon overlay on embedded attachments/images */ -.embeddedAttachmentLink, -.embeddedImageLink { - display: inline-block; - max-width: 100%; - min-height: 48px; - position: relative; - - &::after { - background-color: rgba(0, 0, 0, .8); - border-radius: 2px; - bottom: @wcfGapSmall; - color: white; - content: @fa-var-search; - display: block; - font-family: FontAwesome; - font-size: 21px; - opacity: .5; - padding: 2px 8px; - position: absolute; - right: @wcfGapSmall; - text-decoration: none; - - .boxShadow(0, 0, rgba(0, 0, 0, .15), 0, 3px); - .transition(opacity, .1s); - } - - &:hover { - &::after { - opacity: .8; - } - } -} diff --git a/wcfsetup/install/files/style/comment.less b/wcfsetup/install/files/style/comment.less deleted file mode 100644 index 0142b2e6c8..0000000000 --- a/wcfsetup/install/files/style/comment.less +++ /dev/null @@ -1,152 +0,0 @@ -/* ############## Profile Comments ############## */ -.comment, -.commentResponse { - position: relative; -} - -.commentList .buttonGroupNavigation { - position: absolute; - top: @wcfGapTiny; - right: @wcfGapMedium; - - > ul { - > li { - float: left; - opacity: 0; - - .transition(opacity, .1s); - - > a { - padding: @wcfGapTiny; - } - } - } -} - -.commentResponseList .buttonGroupNavigation { - right: @wcfGapSmall; -} - -.commentContent:hover > .buttonGroupNavigation > ul > li { - opacity: 1; -} - -.commentList textarea { - /* fixes flicker when expanding */ - line-height: 1.2em; - - /* controls textarea grow */ - min-height: @wcfBaseFontSize; - max-height: @wcfBaseFontSize * 10; - - + button { - margin-top: @wcfGapTiny; - } -} - -.commentResponse { - border-top: 1px solid @wcfContainerBorderColor; - padding: @wcfGapSmall; -} - -.commentOptionContainer { - > ul { - font-size: 0; - - > li { - &:not(:last-child)::after { - content: " - "; - } - - display: inline-block; - font-size: @wcfSmallFontSize; - padding-right: 3px; - } - } -} - -.commentOptionContainer.jsAddResponseActive, -.commentResponseList:not(:empty) + .commentOptionContainer { - border-top: 1px solid @wcfContainerBorderColor; - padding: @wcfGapSmall @wcfGapSmall 0; -} - -.commentResponseList:empty, -.commentContent + .commentOptionContainer:not(.jsAddResponseActive) { - margin-top: @wcfGapTiny; -} - -.commentContent + .commentOptionContainer.jsAddResponseActive { - margin-top: @wcfGapMedium; -} - -.commentResponseList:not(:empty) { - margin-top: @wcfGapMedium; -} - -.commentList > li:nth-child(2n) .commentResponseList .commentResponse:nth-child(2n+1) { - background-color: @wcfContainerBackgroundColor; - - .transition(background-color, .1s); -} - -.commentList > li:nth-child(2n+1) .commentResponseList .commentResponse:nth-child(2n+1) { - background-color: @wcfContainerAccentBackgroundColor; - - .transition(background-color, .1s); -} - -.commentResponseList > li:hover { - background-color: @wcfContainerHoverBackgroundColor !important; -} - -.commentList > li:not(.commentAdd):hover { - background-color: @wcfContainerBackgroundColor; - - &:nth-child(2n) { - background-color: @wcfContainerAccentBackgroundColor; - } -} - -/* buttons to load comments/responses */ -.commentList > .commentLoadNext { - text-align: center; - - > button { - padding-left: 30px; - padding-right: 30px; - } -} - -.commentList .userMessage { - margin-top: 0; -} - -.commentResponseContent { - position: relative; -} - -/* like display */ -.commentList .likesBadge { - display: inline-block; - margin: -2px 0 -2px @wcfGapTiny; -} - -@media only screen and (max-width: 800px) { - .commentList .buttonGroupNavigation { - top: 1px; - right: @wcfGapSmall; - } - - .commentResponseList .buttonGroupNavigation { - right: 0; - } - - .commentList .containerHeadline > h3 { - padding-right: @wcfGapLarge + @wcfGapMedium; - } - - .commentResponseContent > .containerHeadline > h3 { - padding-right: 2*@wcfGapMedium; - } -} diff --git a/wcfsetup/install/files/style/dialog.less b/wcfsetup/install/files/style/dialog.less deleted file mode 100644 index 800cd84156..0000000000 --- a/wcfsetup/install/files/style/dialog.less +++ /dev/null @@ -1,245 +0,0 @@ -.dialogOverlay { - background-color: transparent; - bottom: 0; - left: 0; - position: fixed; - right: 0; - top: 0; - visibility: hidden; - z-index: 399; - - transition: visibility 0s linear .3s; - - &[aria-hidden=false] { - /* do not animate opacity or background-color, the transition is anything but smooth due to the large area covered */ - background-color: rgba(255, 255, 255, .4); - visibility: visible; - - transition-delay: 0s; - } -} - -@-webkit-keyframes wcfDialog { - 0% { visibility: visible; opacity: 0; top: 8%; } - 100% { visibility: visible; opacity: 1; top: 10%; } -} - -@-webkit-keyframes wcfDialogOut { - 0% { visibility: visible; opacity: 1; top: 10%; } - 100% { visibility: hidden; opacity: 0; top: 12%; } -} - -.dialogContainer { - background-color: rgba(0, 0, 0, .4); - border: 3px solid transparent; - border-radius: 3px; - box-shadow: 0 1px 15px 0 rgba(0, 0, 0, .3); - box-sizing: border-box; - left: 50%; - max-height: 80%; - max-width: 80%; - min-width: 400px; - position: absolute; - top: 10%; - transform: translateX(-50%); - - -webkit-animation: wcfDialogOut .3s; - -webkit-animation-fill-mode: forwards; - - &[aria-hidden=false] { - -webkit-animation: wcfDialog .3s; - -webkit-animation-fill-mode: forwards; - } - - > header { - background: linear-gradient(to right, @wcfTabularBoxBackgroundColor, lighten(@wcfTabularBoxBackgroundColor, 10%)); - border-top-left-radius: 3px; - border-top-right-radius: 3px; - color: @wcfTabularBoxColor; - display: flex; - padding: 7px 10px; - - .textShadow(@wcfTabularBoxBackgroundColor); - - > span { - flex: 1; - font-size: 1.2rem; - } - - > a { - color: @wcfTabularBoxColor; - flex: 0 0 20px; - font-family: FontAwesome; - font-size: 18px; - text-align: right; - text-decoration: none; - - &:before { - content: @fa-var-times-circle; - } - - > span { - display: none; - } - } - } - - > .dialogContent { - background-color: @wcfContainerBackgroundColor; - box-sizing: border-box; - color: @wcfColor; - overflow: auto; - - &:not(.dialogContentNoPadding) { - padding: 10px; - padding-bottom: 0; - - &:after { - content: ""; - display: block; - height: 10px; - } - - &.dialogForm:after { - height: 17px; - } - } - - &:not(.dialogForm) { - border-bottom-left-radius: 3px; - border-bottom-right-radius: 3px; - } - - dl:not(.plain) { - > dt { - float: none; - margin-bottom: @wcfGapTiny; - text-align: left; - width: auto !important; - - &:empty { - margin-bottom: 0; - } - } - - > dd { - margin-left: 0 !important; - } - } - - .dialogFormSubmit { - background-color: @wcfContainerAccentBackgroundColor; - border-bottom-left-radius: 3px; - border-bottom-right-radius: 3px; - bottom: 0; - left: 0; - padding: 7px 10px; - position: absolute; - right: 0; - } - } -} - -@media only screen and (max-width: 800px) { -} - -/* static dialogs */ -.jsStaticDialogContent { - display: none; -} - -.dialogContentX { - - > .icon-spinner { - left: 50%; - margin: -21px -21px 0 0; - padding: 0 21px 0 21px; - position: absolute; - top: 50%; - } - - .formSubmit { - background-color: @wcfContainerAccentBackgroundColor; - border-bottom-left-radius: 7px; - border-bottom-right-radius: 7px; - border-top: 1px solid @wcfContainerBorderColor; - bottom: 0; - left: 0; - padding: 10px 0; - position: absolute; - width: 100%; - } -} - -/* package (un-)installation */ -#packageInstallationDialogContainer > .boxHeadline { - margin-top: 0; -} - -.spinner { - border: 1px solid rgba(0, 0, 0, .3); - border-radius: 6px; - box-sizing: border-box; - color: #fff; - left: 50%; - opacity: 0; - padding: 7px; - position: fixed; - text-align: center; - top: 200px; - visibility: hidden; - z-index: 401; - - transform: translateX(-50%); - - .boxShadow(0, 1px, rgba(0, 0, 0, .5), 7px); - .linearGradient(rgba(0, 0, 0, .5), rgba(0, 0, 0, 0), rgba(0, 0, 0, .7)); - - transition: visibility 0s linear .1s, opacity .1s linear; - - &.active { - opacity: 1; - visibility: visible; - - transition-delay: 0s; - } - - > .icon { - color: #fff; - } - - > span:not(.icon) { - display: block; - margin-top: @wcfGapSmall; - } -} - -.systemConfirmation p { - padding-top: @wcfGapSmall; -} - -/* notification overlay */ -#systemNotification { - left: 0; - pointer-events: none; - position: fixed; - top: 0; - width: 100%; - z-index: 460; - - > p { - border-top-left-radius: 0; - border-top-right-radius: 0; - border-top-width: 0; - cursor: pointer; - display: table; - margin: 0 auto; - max-width: 80%; - pointer-events: auto; - - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - } -} \ No newline at end of file diff --git a/wcfsetup/install/files/style/element/dl.less b/wcfsetup/install/files/style/element/dl.less deleted file mode 100644 index 07dd508859..0000000000 --- a/wcfsetup/install/files/style/element/dl.less +++ /dev/null @@ -1,139 +0,0 @@ -dl { - &:not(.plain) { - display: flex; - justify-content: space-between; - - &:not(:last-child) { - margin-bottom: 10px; - } - - > dt { - flex: 0 0 230px; - text-align: right; - } - - > dd { - flex: 0 0 auto; - /* work-around for IE10 which does not support calc() for flex-basis */ - width: calc(~"100% - 250px"); - } - - &.wide { - > dt { - display: none; - } - - > dd { - flex: 0 0 100%; - } - } - - & + dl:not(.plain) { - padding-top: 10px; - } - } - - &.dataList { - .clearfix; - - > dt { - clear: right; - color: rgba(128, 128, 128, 1); - float: left; - margin-right: 4px; - text-align: left; - - &:after { - content: ":"; - } - } - - > dd { - float: right; - text-align: right; - - &:not(:last-child) { - margin-bottom: 3px; - } - } - } - - &.inlineDataList { - font-size: .85rem; - - > dt { - display: inline-block; - - &:after { - content: ":"; - padding-left: 1px; - } - } - - > dd { - display: inline-block; - - &:not(:last-of-type):after { - content: ","; - padding-left: 1px; - } - } - } - - &.statsDataList { - align-items: center; - display: flex; - flex-direction: row-reverse; - flex-wrap: wrap; - - > dt { - color: @wcfDimmedColor; - flex: 0 0 60%; - font-size: .85rem; - margin-left: 5px; - overflow: hidden; - text-align: left; - white-space: nowrap; - } - - > dd { - flex: 0 0 35%; - overflow: hidden; - text-align: right; - text-overflow: ellipsis; - white-space: nowrap; - } - } - - &:not(.plain) > dd { - &:not(.floated) > label ~ small { - margin-left: 24px; - } - - > small:not(.innerError) { - color: rgb(128, 128, 128); - display: block; - margin-top: 5px; - } - } - - &.condensed { - display: block; - - > dt, - > dd { - display: block; - margin: 0; - text-align: left; - width: 100%; - } - - > dd + dt { - margin-top: 15px; - } - - > dt:not(:empty) { - margin-bottom: 5px; - } - } -} \ No newline at end of file diff --git a/wcfsetup/install/files/style/element/inputText.less b/wcfsetup/install/files/style/element/inputText.less deleted file mode 100644 index 797f4f2cdb..0000000000 --- a/wcfsetup/install/files/style/element/inputText.less +++ /dev/null @@ -1,41 +0,0 @@ -input[type="date"], -input[type="datetime"], -input[type="email"], -input[type="password"], -input[type="search"], -input[type="text"] { - background-color: @wcfInputBackgroundColor; - border: 1px solid @wcfInputBorderColor; - border-radius: 3px; - color: @wcfInputColor; - padding: 4px; - transition: background-color .2s linear, border-color .2s linear; - - &:hover { - background-color: @wcfInputHoverBackgroundColor; - border-color: @wcfInputHoverBorderColor; - } -} - -input { - box-sizing: border-box; - - &.tiny { - width: 80px; - } - - &.short { - min-width: 80px; - width: 10%; - } - - &.medium { - min-width: 150px; - width: 30%; - } - - &.long { - min-width: 150px; - width: 100%; - } -} diff --git a/wcfsetup/install/files/style/element/select.less b/wcfsetup/install/files/style/element/select.less deleted file mode 100644 index a7b1c8e5d0..0000000000 --- a/wcfsetup/install/files/style/element/select.less +++ /dev/null @@ -1,14 +0,0 @@ -select { - background-color: @wcfInputBackgroundColor; - border: 1px solid @wcfInputBorderColor; - border-radius: 3px; - color: @wcfInputColor; - padding: 2px 5px; - position: relative; - transition: background-color .2s linear, border-color .2s linear; - - &:hover { - background-color: @wcfInputHoverBackgroundColor; - border-color: @wcfInputHoverBorderColor; - } -} diff --git a/wcfsetup/install/files/style/element/textarea.less b/wcfsetup/install/files/style/element/textarea.less deleted file mode 100644 index 134228b09e..0000000000 --- a/wcfsetup/install/files/style/element/textarea.less +++ /dev/null @@ -1,16 +0,0 @@ -textarea { - background-color: @wcfInputBackgroundColor; - border: 1px solid @wcfInputBorderColor; - border-radius: 3px; - box-sizing: border-box; - color: @wcfInputColor; - font-family: "Segoe UI"; - padding: 5px; - transition: background-color .2s linear, border-color .2s linear; - width: 100%; - - &:hover { - background-color: @wcfInputHoverBackgroundColor; - border-color: @wcfInputHoverBorderColor; - } -} \ No newline at end of file diff --git a/wcfsetup/install/files/style/form.less b/wcfsetup/install/files/style/form.less deleted file mode 100644 index d3ff586683..0000000000 --- a/wcfsetup/install/files/style/form.less +++ /dev/null @@ -1,809 +0,0 @@ -/* ### fieldsets ### */ -fieldset { - padding-top: @wcfGapMedium; - - > legend { - border-bottom: 1px solid @wcfContainerBorderColor; - color: @wcfDimmedColor; - font-family: @wcfHeadlineFontFamily; - font-size: @wcfSubHeadlineFontSize; - font-weight: bold; - width: 100%; - padding-bottom: @wcfGapTiny; - - .textShadow(@wcfContainerBackgroundColor); - - + small { - display: inline-block; - margin-bottom: @wcfGapTiny; - position: relative; - top: -@wcfGapSmall; - } - } - - > dl:not(:first-of-type) { - margin-top: @wcfGapSmall+@wcfGapTiny; - } - - &:not(:first-of-type) { - margin-top: @wcfGapMedium; - } -} - -/* definition list */ -dl:not(.plain) { - position: relative; - - .clearfix(); - - > dd:not(:first-of-type), > dt:not(:first-of-type) { - margin-top: @wcfGapSmall+@wcfGapTiny; - } - - > dt { - color: @wcfLabelColor; - float: left; - text-align: right; - width: 230px; - - > label { - display: block; - } - - /* Reversed (flips the label aside the checkbox or radio button) - - use only when automatically generating checkboxes or radio-buttons! */ - &.reversed { - left: 270px; - margin-top: 2px; - position: absolute; - text-align: left; - white-space: nowrap; - width: auto; - word-wrap: normal; - right: 0; - - ~ dd > input[type='checkbox'], ~ dd > input[type='radio'] { - margin-left: 0; - } - - > label { - overflow: hidden; - text-overflow: ellipsis; - } - } - } - - > dd { - margin-left: 250px; - - > small:not(.innerError) { - color: @wcfDimmedColor; - display: block; - margin-top: 3px; - } - - > label { - color: @wcfLabelColor; - display: block; - - > input[type='checkbox'], > input[type='radio'] { - margin: 2px 2px 2px 0; - } - } - - > input[type='checkbox'], > input[type='radio'] { - ~ small { - margin-left: 21px; - margin-top: 2px; - } - } - - &:not(.floated) { - > label ~ small { - margin-left: 21px; - } - } - - &.floated { - > label { - display: inline-block; - margin-right: @wcfGapSmall; - } - } - - > input, textarea, select { - + label { - margin-top: 2px; - } - } - - > .innerError + label { - margin-top: 2px; - } - - &:after { - clear: left; - content: ""; - display: block; - } - } - - /* wide */ - &.wide { - > dt { - display: none; - } - - > dd { - margin-left: 0; - } - } - - /* disabled state */ - &.disabled { - > dt, > dd > label { - color: @wcfDimmedColor; - } - } - - &.condensed { - > dt { - float: none; - margin-bottom: @wcfGapTiny; - text-align: left; - width: auto !important; - - &:empty { - margin-bottom: 0; - } - } - - > dd { - margin-left: 0 !important; - } - } -} - -@media only screen and (max-width: 1024px) { - dl:not(.plain) { - > dt { - float: none; - margin-bottom: @wcfGapTiny; - text-align: left; - width: auto !important; - - &.reversed { - left: 20px; - } - } - - > dd { - margin-left: 0 !important; - } - } - - fieldset > dl:not(:first-of-type) { - margin-top: @wcfGapMedium; - } -} - -/* sidebar */ -.sidebar { - dl:not(.plain) { - &:not(:last-child) { - margin-bottom: @wcfGapMedium; - } - - > dt { - text-align: left; - float: none; - width: auto; - - .textShadow(@wcfSidebarBackgroundColor); - } - - > dd { - margin-top: 2px; - margin-left: 0; - } - } -} - -/* input prefix/suffix */ -.inputAddon { - display: flex; - - > .inputPrefix { - flex: 0 0 auto; - margin: 0 !important; - white-space: nowrap; - } - - > input { - border-radius: 0; - flex: 1 auto; - - &.tiny { - flex: 0 0 80px; - } - - &.short { - flex: 0 1 10%; - } - - &.medium { - flex: 0 1 30%; - } - - &:first-child { - border-radius: 3px 0 0 3px; - } - - &:last-child { - border-radius: 0 3px 3px 0; - } - } - - > .inputSuffix { - background-color: rgba(240, 240, 240, 1); - border: 1px solid @wcfContainerBorderColor; - border-left-width: 0; - border-radius: 0 3px 3px 0; - color: rgba(153, 153, 153, 1); - font-size: .85rem; - padding: @wcfGapTiny @wcfGapSmall; - } - - &.inputAddonTextarea { - flex-direction: column; - - > .inputPrefix { - align-self: flex-start; - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; - border-bottom-width: 0; - } - - > textarea { - border-top-left-radius: 0; - } - } - - &:not(.inputAddonTextarea) { - > .inputPrefix { - border-bottom-right-radius: 0; - border-right-width: 0; - border-top-right-radius: 0; - - &+ input { - border-bottom-left-radius: 0 !important; - border-top-left-radius: 0 !important; - } - } - } -} - -/* submit buttons */ -.formSubmit { - font-size: 0; - margin-top: @wcfGapMedium; - text-align: center; - - button, - input[type='reset'], - input[type='submit'], - input[type='button'], - .button { - font-size: 1rem; - } -} - - -/* ### inputs ### */ -/* globals */ -button, -input[type='reset'], -input[type='submit'], -input[type='button'], -input[type='checkbox'], -input[type='radio'], -select:not([multiple]) { - cursor: pointer; -} - -input[type='text'], -input[type='search'], /* Does not work in WebKit browsers */ -input[type='date'], -input[type='email'], -input[type='number'], -input[type='url'], -input[type='password'], -textarea, -select[multiple] { - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - border-radius: @wcfInputBorderRadius; - font-family: @wcfBaseFontFamily; - padding: 4px 3px; - margin: 0; -} - -select { - margin: 0; - max-width: 100%; - min-width: 1px; - padding: 3px; -} - -input[type='number'] { - text-align: right; -} - -/* reset textarea font size */ -textarea { - font-size: 1rem; -} - -/* normal state */ -input[type='text'], -input[type='search'], -input[type='date'], -input[type='datetime'], -input[type='email'], -input[type='number'], -input[type='url'], -input[type='password'], -textarea, -select[multiple] { - background-color: @wcfInputBackgroundColor; - border-color: @wcfInputBorderColor; - border-style: solid; - border-width: 1px; - color: @wcfInputColor; - - &::-webkit-input-placeholder { /* WebKit browsers */ - color: lighten(@wcfInputColor, 20%); - } - &::-moz-placeholder { /* Mozilla Firefox 19+ */ - color: lighten(@wcfInputColor, 20%); - } - &:-ms-input-placeholder { /* Internet Explorer 10+ */ - color: lighten(@wcfInputColor, 20%); - } -} - -/* hover */ -input[type='text']:hover, -input[type='search']:hover, -input[type='date']:hover, -input[type='datetime']:hover, -input[type='email']:hover, -input[type='number']:hover, -input[type='url']:hover, -input[type='password']:hover, -textarea:hover, -select[multiple]:hover { - background-color: @wcfInputHoverBackgroundColor; - border-color: @wcfInputHoverBorderColor; -} - -/* active / focus */ -input[type='text']:active, -input[type='search']:active, -input[type='date']:active, -input[type='datetime']:active, -input[type='email']:active, -input[type='number']:active, -input[type='url']:active, -input[type='password']:active, -textarea:active, -select[multiple]:active, - -input[type='text']:focus, -input[type='search']:focus, -input[type='date']:focus, -input[type='datetime']:focus, -input[type='email']:focus, -input[type='number']:focus -input[type='url']:focus, -input[type='password']:focus, -textarea:focus, -select[multiple]:focus { - background-color: @wcfInputHoverBackgroundColor; - border-color: @wcfInputHoverBorderColor; - outline: 0; -} - -/* read only state */ -input[type='text'][readonly], -input[type='search'][readonly], -input[type='email'][readonly], -input[type='number'][readonly], -input[type='date'][readonly], -input[type='datetime'][readonly], -input[type='url'][readonly], -input[type='password'][readonly], -textarea[readonly], -select[multiple][readonly] { - background-color: darken(@wcfInputBackgroundColor, 5%); - border-color: @wcfInputBorderColor; -} - -/* disabled state */ -input[type='text'][disabled], -input[type='search'][disabled], -input[type='date'][disabled], -input[type='datetime'][disabled], -input[type='email'][disabled], -input[type='number'][disabled], -input[type='url'][disabled], -input[type='password'][disabled], -textarea[disabled], -select[multiple][disabled] { - background-color: darken(@wcfInputBackgroundColor, 5%); - border-color: @wcfInputBorderColor; - color: @wcfDimmedColor; - cursor: not-allowed; - opacity: 1; /* ios fix */ -} - -/* success state */ -.formSuccess { - input[type='text'], - input[type='search'], - input[type='email'], - input[type='number'], - input[type='url'], - input[type='password'], - textarea { - background-color: @wcfSuccessBackgroundColor; - border-color: @wcfSuccessBorderColor; - } -} - -/* error state */ -.formError { - input[type='text'], - input[type='search'], - input[type='email'], - input[type='number'], - input[type='url'], - input[type='password'], - textarea { - background-color: @wcfErrorBackgroundColor; - border-color: @wcfErrorBorderColor; - } -} - -/* width */ -textarea { - width: 100%; -} - -.tiny { - width: 80px; -} - -.short { - min-width: 80px; - width: 10%; -} - -.medium { - min-width: 150px; - width: 30%; -} - -.long { - min-width: 150px; - width: 100%; -} - -@media only screen and (max-width: 800px) { - textarea { - max-height: 160px; - } - - .medium { - width: 100%; - } -} - -/* upload button */ -.uploadButton { - cursor: pointer; - display: inline-block; - overflow: hidden; - position: relative; - - input { - cursor: pointer; - right: 0; - opacity: 0; - padding: 4px 0; - position: absolute; - top: 0; - position: absolute; - } -} - -.uploadButton, -.uploadFallbackButton { - margin-top: @wcfGapSmall; -} - -/* element list with checkboxes */ -.structuredList { - background-color: @wcfContainerBackgroundColor; - - li { - padding: @wcfGapTiny @wcfGapSmall; - text-align: right; - - &:hover { - background-color: @wcfButtonHoverBackgroundColor; - } - - &:first-child { - border-radius: @wcfContainerBorderRadius @wcfContainerBorderRadius 0 0; - } - - &:last-child { - border-radius: 0 0 @wcfContainerBorderRadius @wcfContainerBorderRadius; - } - - &.category { - background-color: @wcfNavigationHeaderBackgroundColor; - - &:hover { - background-color: @wcfButtonHoverBackgroundColor; - } - } - - span { - float: left; - } - - label { - cursor: pointer; - margin: 0 @wcfGapSmall; - padding: 0 @wcfGapLarge; - } - } -} - -/* tag input list */ -.editableItemList ul li { - cursor: pointer; - margin-left: @wcfGapTiny; - - &:first-child { - margin-left: 0; - } -} - -/* Fixes weird firefox bug */ -select > option { - display: block !important; -} - -/* reCaptcha */ -.reCaptcha { - input.marginTop { - margin-top: @wcfGapMedium; - } -} - -/* disable auto zoom in mobile safari */ -@media only screen and (max-width: 800px) { - select, - textarea, - input[type="text"], - input[type="password"], - input[type="datetime"], - input[type="datetime-local"], - input[type="date"], - input[type="month"], - input[type="time"], - input[type="week"], - input[type="number"], - input[type="email"], - input[type="url"], - input[type="search"], - input[type="tel"], - input[type="color"], - .cke_editable, - .redactor-editor { - font-size: 16px; - } -} - -.flexibleButtonGroup { - display: inline-flex; - - > li { - border: 1px solid @wcfContainerBorderColor; - display: flex; - flex: 1 auto; - overflow: hidden; - - &:not(:last-child) { - border-right-width: 0; - } - - &.spaceAfter + li, - &:first-child { - border-bottom-left-radius: 3px; - border-top-left-radius: 3px; - } - - &.spaceAfter, - &:last-child { - border-bottom-right-radius: 3px; - border-top-right-radius: 3px; - } - - &.spaceAfter { - border-right-width: 1px; - margin-right: @wcfGapMedium; - } - - > input { - display: none; - - &:not(:checked) + label { - opacity: .6; - } - - &:checked + label { - opacity: 1; - } - } - - > a, - > label{ - color: @wcfColor; - cursor: pointer; - font-size: .85rem; - opacity: .6; - padding: @wcfGapTiny @wcfGapSmall; - text-align: center; - - transition: all .3s linear; - - &:hover { - opacity: 1 !important; - } - - > .icon { - cursor: pointer !important; - } - } - - > a { - &.active, - &:hover { - opacity: 1; - text-decoration: none; - } - } - - > input:checked + label.green, - > a.active.green { - background-color: rgb(223, 240, 216); - color: rgb(60, 118, 61); - - > .icon { - color: rgb(60, 118, 61); - } - } - - > input:checked + label.red, - > a.active.red { - background-color: rgb(242, 222, 222); - color: rgb(169, 68, 66); - - > .icon { - color: rgb(169, 68, 66); - } - } - - > input:checked + label.yellow, - > a.active.yellow { - background-color: rgb(252, 248, 227); - color: rgb(138, 109, 59); - - > .icon { - color: rgb(138, 109, 59); - } - } - } -} - -/* input item list */ -.inputItemList { - background-color: @wcfInputBackgroundColor; - border: 1px solid @wcfInputBorderColor; - border-radius: @wcfInputBorderRadius; - color: @wcfInputColor; - cursor: text; - display: flex; - flex-wrap: wrap; - padding: @wcfGapTiny @wcfGapTiny 0; - - transition-duration: .2s; - transition-property: background-color, border-color, box-shadow; - transition-timing-function: linear; - - &:hover { - background-color: @wcfInputHoverBackgroundColor; - border-color: @wcfInputHoverBorderColor; - } - - > li { - align-items: center; - display: flex; - flex: 0 auto; - margin: 0 @wcfGapSmall @wcfGapTiny 0; - padding: @wcfGapTiny @wcfGapSmall; - - &.item { - background-color: @wcfColor; - border-radius: 3px; - padding-right: @wcfGapLarge; - position: relative; - - &:hover, - &.active { - background-color: @wcfTabularBoxBackgroundColor; - color: @wcfTabularBoxColor; - } - - > span, - > .icon { - color: @wcfContentBackgroundColor; - font-size: .85rem; - text-shadow: none; - white-space: nowrap; - word-wrap: normal; - } - - > .icon { - bottom: 0; - height: auto; - position: absolute; - right: 0; - top: 0; - width: @wcfGapLarge; - - &:before { - left: 50%; - position: absolute; - top: 50%; - transform: translateX(-50%) translateY(-50%); - } - } - } - - &.input { - padding: 0; - width: 200px; - - > input { - background-color: transparent !important; - background-image: none !important; - border-width: 0 !important; - box-shadow: none !important; - outline: none !important; - padding: 0 !important; - width: 100% !important; - - &::-ms-clear { - /* hide "clear value" button in IE (displayed as "X") */ - display: none; - } - } - } - } -} diff --git a/wcfsetup/install/files/style/layout.less b/wcfsetup/install/files/style/layout.less deleted file mode 100644 index 34659d4f45..0000000000 --- a/wcfsetup/install/files/style/layout.less +++ /dev/null @@ -1,2359 +0,0 @@ -/* ### layout globals ### */ -.layoutFluid { - margin-left: auto; - margin-right: auto; - min-width: @wcfLayoutMinWidth; - max-width: @wcfLayoutMaxWidth; -} - -@media only screen and (max-width: 800px) { - .layoutFluid { - min-width: 0; - max-width: none; - } -} - -.layoutFixed { - margin-left: auto; - margin-right: auto; - width: @wcfLayoutFixedWidth; -} - -@media only screen and (max-width: 800px) { - .layoutFixed { - width: auto; - } -} - -@media only screen and (min-width: 801px) { - body { - min-width: 980px; - } -} - -/* ### header ### */ -#pageHeader { - z-index: 100; -} - -@media only screen and (max-width: 800px) { - #pageHeader { - margin-top: 48px; - } -} - -#top { - display: block; - height: 1px; - visibility: hidden; -} - -/* user panel */ -.userPanel { - background-color: @wcfUserPanelBackgroundColor; - height: 40px; - left: 0; - overflow: hidden; - position: absolute; - top: 0; - right: 0; - z-index: 200; - - .icon { - color: @wcfUserPanelColor; - - .textShadow(@wcfUserPanelBackgroundColor); - } - - > div { - position: relative; - - > ul.userPanelItems { - .clearfix; - - > li { - float: left; - - > a, - > div:not(.dropdownMenu) { - color: @wcfUserPanelColor; - display: block; - height: 20px; - padding: 12px 8px 8px 8px; - - .textShadow(@wcfUserPanelBackgroundColor); - .transition(background-color, .2s); - - &:hover { - background-color: @wcfUserPanelHoverBackgroundColor; - color: @wcfUserPanelHoverColor; - text-decoration: none; - } - - > .badge.badgeInverse { - background-color: @wcfTabularBoxBackgroundColor; - color: @wcfTabularBoxColor; - } - - > img { - position: relative; - top: -2px; - } - } - - > .framed > img { - margin-top: -5px; - margin-bottom: -4px; - padding: 0px; - top: 0; - } - } - } - - > .searchBar { - background-color: @wcfUserPanelHoverBackgroundColor; - position: absolute; - right: 0; - top: 0; - - &::before { - content: "\f002"; - color: @wcfUserPanelColor; - font-family: FontAwesome; - font-size: 14px; - left: 7px; - position: absolute; - top: 12px; - } - &.loading::before { - content: "\f110"; - - -moz-animation: spin 2s infinite linear; - -o-animation: spin 2s infinite linear; - -webkit-animation: spin 2s infinite linear; - animation: spin 2s infinite linear; - } - - > form { - display: inline-block; - - input[type="search"] { - background-color: transparent; - border-width: 0; - color: @wcfUserPanelColor; - height: 40px; - padding: 6px 12px 5px 26px; - width: 240px; - -webkit-appearance: textfield; - - .textShadow(@wcfUserPanelHoverBackgroundColor); - - &:focus { - outline: 0; - } - - &::-webkit-input-placeholder { /* WebKit browsers */ - color: darken(@wcfUserPanelColor, 20%); - } - &::-moz-placeholder { /* Mozilla Firefox 19+ */ - color: darken(@wcfUserPanelColor, 20%); - } - &:-ms-input-placeholder { /* Internet Explorer 10+ */ - color: darken(@wcfUserPanelColor, 20%); - } - - /* remove broken cancel-button (webkit) */ - &::-webkit-search-cancel-button{ - display:none; - } - } - } - - .dropdownMenu li > span { - max-width: 210px; - overflow: hidden; - text-overflow: ellipsis; - } - } - } -} - -@media only screen and (max-width: 800px) { - .userPanel { - height: 41px; - - .icon { - font-size: 21px; - height: auto; - width: auto; - } - - > div { - > ul.userPanelItems { - > li { - > a, - > div:not(.dropdownMenu) { - height: 21px; - padding: 11px 11px 9px 11px; - } - - > .framed > img { - margin-top: -4px; - } - - /* hide user panel labels */ - > a > span:not(.icon):not(.badge), - &#pageLanguageContainer > div > div > div > h3 { - display: none; - } - - > a > .badge { - top: -4px; - } - } - } - - > .searchBar { - height: 41px; - min-width: 40px; - right: 0 !important; - - &::before { - font-size: 21px; - } - - > form { - display: none; - - input[type="search"] { - height: 41px; - padding-left: 40px; - width: 100%; - } - } - - &.searchBarOpen { - width: 100%; - - > form { - display: block; - } - } - - &::before { - top: 8px; - } - } - } - } -} - -/* header logo */ -.logo { - margin-bottom: @wcfGapLarge; - margin-top: @wcfGapMedium; - - .clearfix; - - a { - display: block; - - &:hover { - text-decoration: none; - } - - h1 { - color: @wcfPageLinkHoverColor; - float: right; - font-size: @wcfHeadlineFontSize; - padding-top: @wcfGapLarge; - - .textShadow(@wcfPageBackgroundColor); - } - } -} - -.userPanel + .logo { - margin-top: @wcfGapMedium + 43px; -} - -@media only screen and (max-width: 800px) { - .logo { - display: none; - } -} - -/* sitemap */ -.sitemapList { - margin: 0 -@wcfGapSmall; - - li { - > a, - > h3 { - overflow: hidden; - padding: @wcfGapTiny @wcfGapMedium; - } - - > a { - border-radius: 6px; - display: block; - - .transition(background-color, .1s); - - &:hover { - background-color: @wcfContainerHoverBackgroundColor; - text-decoration: none; - } - } - } - - > li { - &:not(:first-child) { - margin-top: @wcfGapSmall; - } - - &:not(:last-child) { - border-bottom: 1px solid @wcfContainerBorderColor; - padding-bottom: @wcfGapSmall; - } - - > ul > li { - > a { - padding-left: @wcfGapMedium + @wcfGapLarge; - } - - > ul > li a { - padding-left: @wcfGapMedium + @wcfGapLarge * 2; - } - } - } -} - -/* main menu */ -.mainMenu { - font-size: 0; - white-space: nowrap; - - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - - > ul { - background-color: @wcfMainMenuBackgroundColor; - display: inline-block; - - > li { - display: inline-block; - font-size: @wcfTitleFontSize; - vertical-align: middle; - - > a { - color: @wcfMainMenuColor; - display: inline-block; - padding: 4px 9px; - - .textShadow(@wcfMainMenuBackgroundColor); - - &:hover { - color: @wcfMainMenuActiveColor; - text-decoration: none; - } - - > span { - color: @wcfMainMenuColor; - - .textShadow(@wcfMainMenuBackgroundColor); - - &:hover { - text-decoration: none; - } - } - } - - &.active > a, - &.active > a:hover { - background-color: @wcfNavigationHeaderBackgroundColor; - color: @wcfMainMenuActiveColor; - font-weight: bold; - text-align: center; - - .textShadow(@wcfNavigationHeaderBackgroundColor); - } - - &:not(:last-child) > a { - border-right: 1px solid @wcfContainerBorderColor; - } - } - } -} - -@media screen and (min-width: 801px), print { - .mainMenu > ul > li { - margin-top: -7px; - vertical-align: bottom; - - > a { - padding: 9px 21px; - } - - &.active { - font-size: @wcfSubHeadlineFontSize; - margin-top: -8px; - - > a { - min-width: 80px; - padding: 14px 21px 8px; - } - } - - &:not(.active) { - padding-top: 5px; - } - } -} - -@media only screen and (max-width: 800px) { - .mainMenu > ul > li.active { - margin-bottom: -1px; - - > a { - padding-bottom: 5px; - } - } -} - -/* navigation */ -.navigation { - padding: 0 7px; - - > ul { - display: inline-block; - font-size: 0; - - &.navigationItems, &.navigationIcons { - float: right; - - > li { - float: right; - } - } - - &.navigationIcons { - > li { - padding: 0 3px; - - > a { - display: inline-block; - padding: 4px 3px 3px; - } - } - } - - &.navigationItems { - border-right: 1px dotted @wcfContainerBorderColor; - - > li { - > p { - color: @wcfLinkColor; - } - } - } - - &.navigationItems, &.navigationMenuItems { - > li { - font-size: 1rem; - margin: 4px 7px 2px; - - > a { - color: @wcfLinkColor; - - &:hover { - color: @wcfLinkHoverColor; - text-decoration: none; - } - } - } - } - - &.navigationItems, - &.navigationMenuItems, - &.navigationIcons { - .icon { - color: @wcfLinkColor; - } - } - - &.navigationMenuItems { - float: left; - - > li { - display: inline-block; - - > .badge { - top: -2px; - } - } - } - } -} - -@media only screen and (max-width: 800px) { - .navigation.navigationHeader { - > ul.navigationIcons, - > ul.navigationItems/*, - > ul.navigationMenuItems*/ { - display: none; - } - } - - .navigation.navigationFooter { - > ul.navigationIcons, - > ul.navigationItems { - display: none; - } - - > ul.navigationMenuItems > li { - margin: 4px 7px 4px 0; - } - } -} - -.navigationHeader { - overflow: hidden; - .clearfix; - - background-color: @wcfNavigationHeaderBackgroundColor; - border-bottom: 1px solid @wcfContainerBorderColor; - border-top: 1px solid @wcfContainerBorderColor; - - > ul.navigationMenuItems { - white-space: nowrap; - } -} - -.navigationFooter { - .clearfix; - - background-color: @wcfNavigationFooterBackgroundColor; - border-top: 1px solid @wcfContainerBorderColor; -} - -@media only screen and (max-width: 800px) { - .navigationHeader { - min-height: 4px; - } -} - -/* ### footer ### */ -.footer { - padding-bottom: @wcfGapMedium; - z-index: 100; - - .footerContent { - text-align: center; - - a { - .textShadow(@wcfPageBackgroundColor); - .transition(color, .1s); - - &:hover { - text-decoration: none; - } - } - } -} - -@media only screen and (max-width: 800px) { - .footerContent { - margin: 0 @wcfGapMedium; - } -} - -/* ### content ### */ -#main { - background-color: @wcfContentBackgroundColor; - border-right: 1px solid transparent; /* workaround for strange display: table issues in webkit */ - box-sizing:border-box; - -moz-box-sizing:border-box; - z-index: 110; - - &.sidebarOrientationRight { - background-color: @wcfSidebarBackgroundColor; - } - - > div { - display: table; - table-layout: fixed; - width: 100%; - - > div { - display: table-row; - - > .sidebar, - > .content { - display: table-cell; - vertical-align: top; - - > .mobileSidebarToggleButton { - display: none; - } - } - - > .sidebar { - background-color: @wcfSidebarBackgroundColor; - width: 300px; - z-index: 120; - - .transition(width, .2s, ease); - - > span { - /* fix for Chrome in RTL mode */ - display: inline-block; - - position: absolute; - - > .collapsibleButton { - background-color: @wcfSidebarBackgroundColor; - border-radius: 6px 0 0 6px; - display: block; - height: 24px; - left: -20px; - position: absolute; - text-decoration: none; - top: 0; - width: 24px; - - &::before { - content: "\f054"; - font-family: FontAwesome; - font-size: 14px; - position: absolute; - left: 6px; - top: 4px; - - .textShadow(@wcfSidebarBackgroundColor); - } - } - } - - > div { - overflow: hidden; - width: 300px; - - .transition(width, .2s, ease); - } - } - - > .content { - background-color: @wcfContentBackgroundColor; - min-height: 100px; - padding: @wcfGapSmall @wcfGapLarge * 2 - @wcfGapTiny @wcfGapLarge; - z-index: 130; - } - } - } - - &:not(.sidebarOrientationLeft):not(.sidebarOrientationRight) { - .sidebar { - display: none; - } - } -} - -@media only screen and (max-width: 800px) { - /* hide sidebar */ - #main { - position: relative; - - > div > div { - > .sidebar, - > .content { - width: 100%; - } - } - - &.sidebarOrientationLeft { - > div > div { - > .sidebar { - display: none; - - > div { - width: 100%; - - fieldset { - width: 100%; - } - } - - > .mobileSidebarToggleButton { - border-radius: 0 0 0 @wcfSmallButtonBorderRadius; - border-width: 0 0 1px 1px; - display: block; - right: -3px; - position: absolute; - top: 0; - } - } - - > .content { - padding-top: 35px; - - > .mobileSidebarToggleButton { - border-radius: 0 0 @wcfSmallButtonBorderRadius 0; - border-width: 0 1px 1px 0; - display: block; - left: -3px; - position: absolute; - top: 0; - } - } - } - } - - &.sidebarOrientationRight { - > div > div { - > .sidebar { - display: none; - - > div { - width: 100%; - - fieldset { - width: 100%; - } - } - - > .mobileSidebarToggleButton { - border-radius: 0 0 @wcfSmallButtonBorderRadius 0; - border-width: 0 1px 1px 0; - display: block; - left: -3px; - position: absolute; - top: 0; - } - } - - > .content { - padding-top: 35px; - - > .mobileSidebarToggleButton { - border-radius: 0 0 0 @wcfSmallButtonBorderRadius; - border-width: 0 0 1px 1px; - display: block; - right: -3px; - position: absolute; - top: 0; - } - } - } - } - - &.mobileShowSidebar > div > div { - > .sidebar { - display: table-cell; - padding-top: 35px; - } - - > .content { - display: none; - } - } - - .content { - border-left: 0 !important; - border-right: 0 !important; - margin-left: 0; - margin-right: 0; - padding-left: 0 !important; - padding-right: 0 !important; - - > *:first-child { - margin-top: 0; - } - } - } -} - -@media only screen and (min-width: 801px) and (max-width: 1239px) { - #main { - > div > .content { - padding-left: @wcfGapLarge + @wcfGapSmall; - padding-right: @wcfGapLarge + @wcfGapSmall; - } - } -} - -@media only screen and (min-width: 801px) { - #main.sidebarOrientationRight.sidebarCollapsed { - > div > div { - > .sidebar { - width: 20px; - - > span > .collapsibleButton { - &::before { - content: "\f053"; - } - } - - > div { - width: 0; - } - } - } - } -} - -html[dir="rtl"] { - #main.sidebarOrientationRight > div > div > .sidebar > span > .collapsibleButton::before { - content: "\f053"; - } - - #main.sidebarOrientationRight.sidebarCollapsed > div > div > .sidebar > span > .collapsibleButton::before { - content: "\f054"; - } -} - -/* basic layout elements */ -.boxHeadline { - margin-top: @wcfGapMedium; - overflow: hidden; - - h1 { - font-size: @wcfHeadlineFontSize; - } - - > p { - color: @wcfDimmedColor; - font-size: @wcfSmallFontSize; - } - - > .dataList, - > .inlineDataList { - color: @wcfDimmedColor; - font-size: @wcfSmallFontSize; - } -} - -.boxHeadline > h1, -.boxSubHeadline > h2 { - color: @wcfHeadlineColor; - font-family: @wcfHeadlineFontFamily; - font-weight: bold; - - .textShadow(@wcfContentBackgroundColor); - - a { - color: @wcfHeadlineColor; - text-decoration: none; - } -} - -.boxSubHeadline { - > h2 { - font-size: @wcfSubHeadlineFontSize; - } -} - -@media only screen and (max-width: 800px) { - .boxHeadline { - margin-top: @wcfGapSmall; - margin-left: @wcfGapSmall; - margin-right: @wcfGapSmall; - } -} - -@media only screen and (min-width: 641px) and (max-width: 800px) { - .boxHeadline { - margin-left: @wcfGapMedium; - margin-right: @wcfGapMedium; - } -} - -.contentNavigation { - display: table; - width: 100%; - - > * { - margin-top: @wcfGapMedium; - } - - > nav.pageNavigation > ul { - float: left; - } - - > nav:not(.pageNavigation) > ul:not(.buttonGroup) { - margin-right: 2px; - float: right; - .buttonList; - - > li { - &:not(:last-child) { - margin-right: 0; - } - - &:not(:first-child) { - margin-left: 8px; - } - } - } - - > nav:not(.pageNavigation) > ul.buttonGroup { - float: right; - } - - > nav:not(.pageNavigation) + nav.jsClipboardEditor > ul, - > nav:not(.pageNavigation) + nav > ul.buttonGroup { - margin-right: 8px; - } -} - -@media only screen and (max-width: 800px) { - .contentNavigation { - box-sizing:border-box; - -moz-box-sizing:border-box; - -webkit-box-sizing:border-box; - padding-left: @wcfGapSmall; - padding-right: @wcfGapSmall; - } -} - -@media only screen and (min-width: 641px) and (max-width: 800px) { - .contentNavigation { - padding-left: @wcfGapMedium; - padding-right: @wcfGapMedium; - } -} - -.container { - background-color: @wcfContainerBackgroundColor; - border: 1px solid @wcfContainerBorderColor; -} - -.containerPadding { - padding: @wcfGapMedium @wcfGapLarge @wcfGapMedium; -} - -@media only screen and (max-width: 800px) { - .container { - border-width: 1px 0; - } - - .containerPadding { - padding: @wcfGapSmall; - } -} - -@media only screen and (min-width: 641px) and (max-width: 800px) { - .containerPadding { - padding-left: @wcfGapMedium; - padding-right: @wcfGapMedium; - } -} - -.containerHeadline { - > h3 { - font-size: @wcfTitleFontSize; - font-weight: bold; - - > small { - color: @wcfDimmedColor; - font-weight: normal; - text-shadow: none; - white-space: nowrap; - word-wrap: normal; - } - - > .badge { - top: -1px; - } - } - - > h3, > h3 > a { - .textShadow(@wcfContainerBackgroundColor); - } - - + * { - margin-top: @wcfGapSmall; - } -} - -.containerList { - > li { - padding: @wcfGapMedium @wcfGapLarge; - - .transition(background-color, .1s); - - &:nth-child(even) { - background-color: @wcfContainerAccentBackgroundColor; - } - - &:hover { - background-color: @wcfContainerHoverBackgroundColor; - - > div > div { - > .buttonGroupNavigation > .buttonList { - opacity: 1; - } - - > .containerHeadline > .containerContentType { - color: @wcfDimmedColor; - } - } - } - - &.showMore { - text-align: center; - - > button { - padding-left: 30px; - padding-right: 30px; - } - - > small { - color: @wcfDimmedColor; - } - } - - > div > div { - position: relative; - - > .buttonGroupNavigation { - margin-top: 0; - position: absolute; - right: 0; - top: 0; - - > .buttonList { - opacity: 0; - - .transition(opacity, .1s); - } - } - - > .containerHeadline { - > .containerContentType { - color: lighten(@wcfDimmedColor, 20%); - position: absolute; - right: 0; - top: 3px; - - .transition(color, .1s); - } - - .newContentBadge { - //background-color: darken(@wcfTabularBoxBackgroundColor, 10%); - color: @wcfTabularBoxColor; - text-transform: uppercase; - - .textShadow(darken(@wcfTabularBoxBackgroundColor, 10%)); - .linearGradient(darken(@wcfTabularBoxBackgroundColor, 10%), @wcfTabularBoxBackgroundColor, darken(@wcfTabularBoxBackgroundColor, 10%)); - } - } - } - } - - > * > li { - padding: @wcfGapMedium @wcfGapLarge; - } - - &.styleList > li > div.box64 { - > span { - text-align: center; - width: 110px; - } - - > div { - margin-left: 115px; - } - } -} - -@media only screen and (max-width: 800px) { - .containerList { - > li { - padding: @wcfGapSmall; - - .containerContentType { - display: none; - } - } - - &.infoBoxList { - > li.box32 { - > span.icon { - display: none; - } - - > div { - margin-left: 0; - } - } - } - } -} - -@media only screen and (min-width: 641px) and (max-width: 800px) { - .containerList { - > li { - padding: @wcfGapSmall @wcfGapMedium; - } - } -} - -@media screen and (min-width: 1240px) { - .containerList { - &.doubleColumned { - overflow: hidden; - - > li { - padding: 0; - float: left; - width: 50%; - height: 90px; - overflow: hidden; - - &:nth-child(even) { - float: right; - } - - &:nth-child(4n), &:nth-child(4n+1) { - background-color: @wcfContainerBackgroundColor; - } - - &:nth-child(4n+2), &:nth-child(4n+3) { - background-color: @wcfContainerAccentBackgroundColor; - } - - &:hover { - background-color: @wcfContainerHoverBackgroundColor; - } - - > div { - padding: @wcfGapMedium @wcfGapLarge; - } - } - - &::after { - content: ""; - display: table; - clear: left; - } - } - } -} - -.nestedCategoryList { - > li { - margin-top: @wcfGapMedium; - overflow: hidden; - - &:first-child { - margin-top: 0; - } - - > div { - padding: 0 @wcfGapMedium; - - > ol { - margin-top: 0; - - > li { - display: inline-block; - font-size: @wcfSmallFontSize; - } - } - } - } -} - -.flexibleCategoryList { - position: relative; - - > li { - margin-bottom: @wcfGapMedium; - - > ol { - margin-left: @wcfGapLarge; - } - - > ol > li > ol { - margin-bottom: @wcfGapSmall; - margin-left: @wcfGapLarge; - - > li { - font-size: @wcfSmallFontSize; - } - } - } -} - -@media all and (min-width: 801px) { - .nestedCategoryList.doubleColumned { - > li { - float: left; - width: 50%; - - &:nth-child(odd):not(:first-child) { - clear: left; - } - - &:nth-child(2) { - margin-top: 0; - } - } - - &::after { - content: ""; - display: table; - clear: left; - } - } - - .flexibleCategoryList:not(.flexibleCategoryListDisabled) { - /* WebKit */ - -webkit-column-count: 2; - - /* Firefox */ - -moz-column-count: 2; - - /* CSS 3 / Internet Explorer */ - column-count: 2; - - > li { - /* WebKit */ - -webkit-column-break-inside: avoid; - - /* CSS 3 / Internet Explorer */ - break-inside: avoid; - - > ol > li > ol { - font-size: 0; - - > li { - display: inline-block; - } - } - } - } - - /* Firefox */ - @-moz-document url-prefix() { - .flexibleCategoryList:not(.flexibleCategoryListDisabled) > li { - display: block; - overflow: hidden; - } - } -} - -.sidebarNestedCategoryList { - ol { - margin-left: @wcfGapMedium; - } - - li { - margin: 6px 0; - position: relative; - - > span { - position: absolute; - right: 0; - top: 2px; - } - - > a { - display: block; - overflow: hidden; - padding-right: 45px; - text-overflow: ellipsis; - } - - &.active > a { - font-weight: bold; - } - } -} - -.containerBoxList { - margin-bottom: -@wcfGapSmall; - - > li { - margin-bottom: @wcfGapSmall; - - > div { - overflow: hidden; - white-space: nowrap; - word-wrap: normal; - } - } -} - -@media all and (min-width: 801px) { - .containerBoxList { - &.doubleColumned, - &.tripleColumned { - .clearfix(); - - > li { - float: left; - - > div { - margin-right: @wcfGapLarge; - } - } - } - - &.doubleColumned { - > li { - width: 50%; - - &:nth-child(odd):not(:first-child) { - clear: left; - } - } - } - - &.tripleColumned { - > li { - width: 33%; - - &:nth-child(3n+1):not(:first-child) { - clear: left; - } - } - } - } -} - -/* boxes with an image */ -.box(@imageSize, @gapOffset: 0) { - /* using a min-height prevents us from clearing (which causes a lot of issues) */ - min-height: @imageSize + 4px; - - > :first-child { - float: left; - } - - > *:not(:first-child) { - margin-left: (@imageSize + @gapOffset); - } - - > .framed ~ * { - margin-left: (@imageSize + @gapOffset) + 4px; - } -} - -.box16 { .box(16px, 4px); } -.box24 { .box(24px, 4px); } -.box32 { .box(32px, 7px); } -.box48 { .box(48px, 7px); } -.box64 { .box(64px, 7px); } -.box96 { .box(96px, 11px); } -.box128 { .box(128px, 11px); } -.box256 { .box(256px, 21px); } - -/* bread crumbs */ -.breadcrumbs { - box-sizing: border-box; - overflow: hidden; - position: relative; - text-align: left; - - > ul { - .clearfix; - - > li { - float: left; - font-size: @wcfSmallFontSize; - list-style: none; - max-width: 30%; - padding-right: 10px; - position: relative; - - &:first-child > a { - &::before { - content: "\f015"; - display: inline-block; - font-family: FontAwesome; - font-size: 14px; - margin: -3px 7px -3px 0; - vertical-align: -1px; - } - } - - > a { - color: @wcfColor; - display: block; - overflow: hidden; - padding: 5px 1px 5px 5px; - text-decoration: none; - text-overflow: ellipsis; - white-space: nowrap; - word-wrap: normal; - - .textShadow(@wcfContentBackgroundColor); - } - - > .pointer { - padding: 5px 0; - position: absolute; - top: 0; - right: 0; - } - } - } -} - -@media only screen and (max-width: 800px) { - .content > .breadcrumbs { - background-color: @wcfContentBackgroundColor; - border: 1px solid @wcfContainerBorderColor; - border-radius: 6px; - display: inline-block; - margin-left: @wcfGapSmall; - margin-right: @wcfGapSmall; - max-width: 90%; - - > ul { - > li { - float: none; - max-width: none; - padding-right: 0; - - &:not(:last-child) { - display: none; - } - - > a { - padding: @wcfGapTiny @wcfGapMedium; - - &::before { - content: "\f062"; - font-family: FontAwesome; - font-size: 14px; - padding-right: @wcfGapSmall; - } - } - - > .pointer { - display: none; - } - } - } - - /* hide second breadcrumbs */ - ~ .breadcrumbs { - display: none; - } - } -} - -@media only screen and (min-width: 641px) and (max-width: 800px) { - .content > .breadcrumbs { - margin-left: @wcfGapMedium; - margin-right: @wcfGapMedium; - } -} - -.smallBreadcrumbs { - > li { - display: inline; - font-size: @wcfSmallFontSize; - } -} - -.ui-helper-hidden { - display: none; -} - -.ui-helper-hidden-accessible { - position: absolute !important; - clip: rect(1px 1px 1px 1px); - clip: rect(1px,1px,1px,1px); -} - -/* ### tabular boxes ### */ -.tabularBox { - background-color: @wcfTabularBoxBackgroundColor; - border: 1px solid @wcfContainerBorderColor; - - > .container { - border: 0; - } -} - -.tabularBoxTitle > header { - color: @wcfTabularBoxColor; - padding: 5px 7px; - - > h2 { - font-size: @wcfTitleFontSize; - font-weight: bold; - - .textShadow(@wcfTabularBoxBackgroundColor); - - > a { - color: @wcfTabularBoxColor; - - &:hover { - color: @wcfTabularBoxHoverColor; - text-decoration: none; - } - } - } - - .icon { - color: @wcfTabularBoxColor; - - .textShadow(@wcfTabularBoxBackgroundColor); - } -} - -@media only screen and (max-width: 800px) { - .tabularBox { - border-width: 1px 0; - } - - .tabularBoxTitle { - border-top-width: 0; - } -} - -@media only screen and (min-width: 641px) and (max-width: 800px) { - .tabularBoxTitle > header { - padding-left: @wcfGapMedium; - padding-right: @wcfGapMedium; - } -} - -.table, -.cke_wysiwyg_div table { - border-spacing: 0; - width: 100%; - - /* cells */ - th, - td { - padding: @wcfGapSmall; - text-align: left; - vertical-align: middle; - // non standard only webkit - word-break: break-word; - - > label { - cursor: pointer; - display: block; - margin: -@wcfGapSmall; - padding: @wcfGapSmall; - - > input[type="checkbox"] { - margin: -1px 3px 0; - } - } - } - - /* headline */ - th { - border-right: 1px solid rgba(0, 0, 0, .2); - color: @wcfTabularBoxColor; - font-size: @wcfSmallFontSize; - font-weight: bold; - white-space: nowrap; - word-wrap: normal; - - .textShadow(@wcfTabularBoxBackgroundColor); - .linearGradient(rgba(0, 0, 0, .3), rgba(0, 0, 0, 0), rgba(0, 0, 0, .3)); - - > a { - color: @wcfTabularBoxColor; - display: block; - margin: -@wcfGapSmall; - position: relative; - - &:hover { - text-decoration: none; - } - - > img { - margin: -5px 0; - } - } - - &.active > a { - background-color: rgba(0, 0, 0, .1); - color: @wcfTabularBoxHoverColor; - - .boxShadowInset(0, 10px, rgba(0, 0, 0, .1), 10px, -10px); - } - - &.ASC > a, - &.DESC > a { - padding-right: 20px; - } - - &.ASC > a::after, - &.DESC > a::after { - display: inline-block; - font-family: FontAwesome; - font-size: 14px; - position: absolute; - margin-left: @wcfGapTiny; - - .textShadow(@wcfTabularBoxBackgroundColor); - } - - &.ASC > a::after { - content: "\f0de"; - top: 8px; - } - - &.DESC > a::after { - content: "\f0dd"; - top: 3px; - } - - &:hover > a { - background-color: rgba(0, 0, 0, .2); - color: @wcfTabularBoxHoverColor; - } - - > * { - padding: @wcfGapSmall; - } - } - - /* content */ - td { - background-color: @wcfContainerBackgroundColor; - - .transition(background, .1s); - - &.columnMark, - &.columnStatus { - text-align: center; - width: 1px; - white-space: nowrap; - word-wrap: normal; - } - - &.columnDigits, - &.columnID { - text-align: right; - width: 1px; - white-space: nowrap; - word-wrap: normal; - } - - &.columnIcon { - text-align: left; - width: 1px; - white-space: nowrap; - word-wrap: normal; - } - - &.columnTitle { - font-weight: bold; - text-align: left; - } - - &.columnText { - font-weight: normal; - text-align: left; - max-width: 20%; - } - - &.columnDate { - font-size: @wcfSmallFontSize; - text-align: right; - width: 1px; - white-space: nowrap; - word-wrap: normal; - } - - &.columnURL, &.columnSmallText { - font-size: @wcfSmallFontSize; - text-align: left; - } - } - - /* striped */ - > tbody { - > tr:nth-child(even) > td { - background-color: @wcfContainerAccentBackgroundColor; - } - } - - /* hover */ - > tbody { - > tr { - &:not(:last-child) { - > td { - border-bottom: 1px solid rgba(255, 255, 255, .3); - } - } - - &:hover { - > td { - background-color: @wcfContainerHoverBackgroundColor; - } - } - - > td:not(:last-child) { - border-right: 1px solid rgba(255, 255, 255, .3); - } - - > td.focus { - background-color: @wcfContainerHoverBackgroundColor; - } - - > td.left { - text-align: left; - } - - > td.right { - text-align: right; - } - } - } - - .statusDisplay { - float: right; - - .statusIcons { - float: right; - margin-left: @wcfGapSmall; - - li { - display: inline-block; - } - } - } - - tr { - &.jsMarked { - color: @wcfSelectedColor; - - > td { - background-color: @wcfSelectedBackgroundColor !important; - } - - a:not(.badge) { - color: @wcfSelectedColor; - } - } - } -} - -@media screen and (max-width: 800px) { - .responsiveTable { - display: block; - - thead, tbody, th, td, tr { - display: block; - } - - thead tr { - display: none; - } - - tr { - border: 1px solid @wcfContainerBorderColor; - border-top-width: 0; - - &:last-child { - border-bottom-width: 0; - } - } - - td { - text-align: left !important; - max-width: none !important; - width: auto !important; - } - } -} - -/* ### definition lists ### */ -dl.statsDataList { - > dt { - color: @wcfDimmedColor; - display: block; - float: right; - font-size: @wcfSmallFontSize; - line-height: 1.5; - overflow: hidden; - text-align: left; - white-space: nowrap; - width: 62%; - word-wrap: normal; - - > a { - text-decoration: none; - } - - &:not(:first-child) { - clear: both; - } - } - - > dd { - color: @wcfColor; - float: left; - font-weight: bold; - margin: 0; - overflow: hidden; - text-align: right; - text-overflow: ellipsis; - white-space: nowrap; - width: 35%; - word-wrap: normal; - - > a { - text-decoration: none; - } - } - - &::after { - display: table; - content: ""; - clear: both; - } -} - -dl.inlineDataList { - overflow: hidden; - /*white-space: nowrap;*/ - - > dd { - display: inline-block; - margin: 0 @wcfGapTiny 0 0; - padding: 0; - } - - > dt { - color: @wcfDimmedColor; - display: inline-block; - margin: 0; - text-align: left; - width: auto; - - &::after { - content: ":"; - } - } -} - -dl.dataList { - .clearfix; - - dt { - color: @wcfDimmedColor; - clear: right; - float: left; - margin-right: @wcfGapTiny; - text-align: left; - - &::after { - content: ":"; - } - } - - dd { - float: right; - text-align: right; - - &:not(:last-child) { - margin-bottom: 3px; - } - } -} - -ul.inlineDataList, ul.dataList { - li { - display: inline-block; - - &:not(:last-child)::after { - content: ","; - } - } -} - -ul.inlineDataList { - display: inline-block; -} - -/* ### page navigation ### */ -.contentNavigation .pageNavigation { - float: left; - margin: @wcfGapMedium + 5 0 3px; - - ul li { - margin: 0 2px; - } -} - -.pageNavigation { - ul { - li { - border-radius: @wcfSmallButtonBorderRadius; - float: left; - font-weight: bold; - margin: 0 1px; - min-width: 19px; - padding: 0; - text-align: center; - - &:not(.active):not(.disabled) { - cursor: pointer; - } - - &.disabled { - background-image: none; - border: 1px solid rgba(0, 0, 0, .1); - cursor: not-allowed; - } - - &.skip { - > a { - padding: 2px 0 1px; - } - - > span { - padding: 3px 0 1px; - } - } - - &:not(.disabled):hover > a { - color: @wcfButtonHoverColor; - } - - &:not(.skip) > a { - padding: 2px 3px; - } - - &.active { - > span { - padding: 2px 3px; - } - } - - > a { - color: @wcfButtonColor; - display: block; - text-decoration: none; - - .textShadow(@wcfButtonBackgroundColor); - } - - > span:not(.invisible) { - display: inline-block; - } - } - } -} - -@media only screen and (max-width: 800px) { - .pageNavigation { - > ul > li { - &:not(.skip):not(.active) { - display: none; - } - - &:nth-last-child(2):not(.active) { - display: block; - } - - &.active { - > span { - &.invisible { - display: inline-block; - } - - &:not(.invisible) { - display: none; - } - } - } - } - } -} - -.statusDisplay .pageNavigation { - font-size: @wcfSmallFontSize; - float: left; - margin-top: 2px; - - ul { - li { - min-width: 13px; - - &:not(.skip) a { - padding: 1px; - } - } - } -} - -/* ### sidebar ### */ -.sidebar > div > fieldset:not(:last-child), .sidebar > div > div:not(:last-child) { - border-bottom: 1px solid @wcfContainerBorderColor; - margin-bottom: @wcfGapMedium; -} - -.sidebar.collapsibleMenu > div > fieldset, .sidebar.collapsibleMenu > div > div { - border-bottom-width: 0; -} - -.sidebar { - padding: @wcfGapLarge 0 @wcfGapSmall; - - fieldset { - padding: @wcfGapSmall @wcfGapMedium @wcfGapMedium; - margin-top: 0; - - /* collapsed sidebar overflow fix */ - box-sizing:border-box; - -moz-box-sizing:border-box; /* firefox */ - min-width: 300px; /* webkit */ - width: 300px; /* firefox */ - - > legend { - border-width: 0; - color: @wcfColor; - font-family: @wcfBaseFontFamily; - font-weight: normal; - font-size: 1rem; - padding: 0; - text-transform: uppercase; - - .textShadow(@wcfSidebarBackgroundColor); - - > .badge { - float: right; - } - - > a { - color: @wcfColor; - text-decoration: none; - } - - &.invisible + div { - margin-top: -@wcfGapSmall; - } - } - - &::after { - content: ""; - height: 0; - display: block; - clear: both; - } - - .button.more { - margin: 5px 0 0; - float: right; - } - - > nav { - margin: 0 -@wcfGapMedium 0; - - ul { - > li { - &.active { - background-color: @wcfContentBackgroundColor; - - > a { - font-weight: bold; - } - } - - &:hover:not(.active) { - > a { - color: @wcfLinkHoverColor; - } - } - - > a { - color: @wcfLinkColor; - display: block; - padding: @wcfGapTiny @wcfGapMedium @wcfGapSmall @wcfGapLarge; - - .textShadow(@wcfSidebarBackgroundColor); - - &:hover { - text-decoration: none; - } - } - } - } - } - } - - .sidebarBoxList > li:not(:last-child) { - margin-bottom: 7px; - } - - .sidebarBoxList { - overflow: hidden; - } - - .sidebarBoxHeadline { - > h3 { - color: @wcfLinkColor; - margin-bottom: 1px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - word-wrap: normal; - - .textShadow(@wcfSidebarBackgroundColor); - - a { - .textShadow(@wcfSidebarBackgroundColor); - } - - small { - text-shadow: none; - } - } - } - - .formSubmit { - margin-bottom: @wcfGapMedium; - margin-top: 0; - width: 300px; - } - - &.collapsibleMenu { - legend { - color: @wcfLinkColor; - cursor: pointer; - font-weight: bold; - font-size: 1.3rem; - padding-left: (@wcfGapLarge + 16px + @wcfGapTiny); - position: relative; - margin-left: -@wcfGapMedium; - text-transform: none; - - &::before { - content: "\f054"; - display: inline-block; - font-family: FontAwesome; - font-size: 14px; - height: 16px; - left: 21px; - position: absolute; - text-align: center; - top: 2px; - width: 16px; - } - - &.active::before { - content: "\f078"; - } - } - - nav { - ul { - > li { - > a { - padding-left: (@wcfGapLarge + 16px + @wcfGapTiny); - } - } - } - } - } - - dl.dataList { - font-size: @wcfSmallFontSize; - overflow: hidden; - } - - /* @deprecated */ - dl.inlineDataList { - font-size: @wcfSmallFontSize; - - > dt { - float: left; - } - - > dd { - display: block; - padding-right: @wcfGapMedium; - text-align: right; - } - } -} - -.sideBySide { - display: table; - table-layout: fixed; - width: 100%; - - > * { - display: table-cell; - width: 50%; - } -} - -/* ad locations */ -.wcfAdLocation { - overflow: hidden; -} - -.wcfAdLocationHeaderContent, -.wcfAdLocationFooterContent, -.wcfAdLocationFooterBottom { - text-align: center; - - > div { - display: inline-block; - text-align: left; - } -} - -.wcfAdLocationHeaderContent { - margin-top: @wcfGapSmall; -} - -.wcfAdLocationFooterContent, -.wcfAdLocationFooterBottom { - margin-top: @wcfGapMedium; -} - -.wcfAdLocationSidebarTop, -.wcfAdLocationSidebarBottom { - padding: 0 @wcfGapMedium @wcfGapMedium; - text-align: center; - - > div { - display: inline-block; - text-align: left; - } -} - -.wcfAdLocationLogo { - float: right; - padding: @wcfGapMedium @wcfGapMedium 0 @wcfGapMedium; -} - -/* print version */ -@media print { - * { - background-color: transparent !important; - background-image: none !important; - box-shadow: none !important; - color: #000 !important; - text-shadow: none !important; - } - - html, body { - font-size: 12pt !important; - } - - .badge { - &::before { - content: "["; - } - - &::after { - content: "]"; - } - } - - .content { - padding-left: 0 !important; - padding-right: 0 !important; - } - - .logo { - margin-top: 14px !important; - } - - a.externalURL::after { - content: " (" attr(href) ")"; - font-size: .85rem; - } - - .sidebar, - .button, - .navigationIcons, - .navigationMenuItems, - .navigationHeader, - .userPanel, - .styleChooser { - display: none !important; - } - -} - -/* -This is a dirty fix for a broken gutter / line number width calculation in Internet Explorer -see: http://beta.woltlab.com/index.php/Thread/3874-Kosmetik-Darstellungsfehler-IE10-Stil-bearbeiten/?postID=32177#post32177 -*/ -.CodeMirror-linenumber { - min-width: 32px !important; -} - -/* More line height for better readability */ -.CodeMirror-lines { - line-height: 1.2; -} - -/* Force LTR in RTL languages */ -.CodeMirror { - direction: ltr; -} - -/* twitter timeline on ACP index */ -#news-twitter-timeline > iframe { - width: 100% !important; -} - -/* jQuery UI resizable */ -.ui-resizable { position: relative;} -.ui-resizable-handle { position: absolute;font-size: 0.1px;z-index: 99999; display: block;} -.ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none; } -.ui-resizable-n { cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0px; } -.ui-resizable-s { cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0px; } -.ui-resizable-e { cursor: e-resize; width: 7px; right: -5px; top: 0px; height: 100%; } -.ui-resizable-w { cursor: w-resize; width: 7px; left: -5px; top: 0px; height: 100%; } -.ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: 1px; bottom: 1px; } -.ui-resizable-sw { cursor: sw-resize; width: 9px; height: 9px; left: -5px; bottom: -5px; } -.ui-resizable-nw { cursor: nw-resize; width: 9px; height: 9px; left: -5px; top: -5px; } -.ui-resizable-ne { cursor: ne-resize; width: 9px; height: 9px; right: -5px; top: -5px;} - -/* PerfectScrollbar plugin */ -.ps-container { - &:hover > .ps-scrollbar-y-rail > .ps-scrollbar-y { - background-color: rgba(102, 102, 102, .6); - } - - &.ps-active-y > .ps-scrollbar-y-rail { - display: block; - } - - > .ps-scrollbar-y-rail { - background-color: rgba(102, 102, 102, 0); - border-radius: 4px; - bottom: 0; - display: none; - position: absolute; - right: 2px; - width: 8px; - - .transition(background-color, .3s, linear); - - &:hover { - background-color: rgba(102, 102, 102, .3); - } - - > .ps-scrollbar-y { - background-color: rgba(102, 102, 102, 0); - border-radius: 4px; - position: relative; - - .transition(background-color, .3s, linear); - } - } -} diff --git a/wcfsetup/install/files/style/message.less b/wcfsetup/install/files/style/message.less deleted file mode 100644 index 503ff5fc3a..0000000000 --- a/wcfsetup/install/files/style/message.less +++ /dev/null @@ -1,1134 +0,0 @@ -/* ### message groups ### */ -.messageGroupList { - .columnSubject { - > .labelList { - float: right; - padding-left: 7px; - } - - > h3 { - > .messageGroupLink { - font-size: @wcfTitleFontSize; - } - - > .badge.label { - top: -2px; - } - } - - > small { - display: block; - } - - > nav { - font-size: @wcfSmallFontSize; - - > ul > li { - display: inline; - } - } - } - - tr { - &.new .columnSubject > h3 > .messageGroupLink { - font-weight: bold; - } - - &.new .columnAvatar div > p > img, - &:hover .columnAvatar div > p > img { - opacity: 1; - } - - &.messageDisabled { - color: @wcfDisabledColor; - - > td { - background-color: @wcfDisabledBackgroundColor !important; - } - - a:not(.badge) { - color: @wcfDisabledColor; - } - } - - &.messageDeleted { - color: @wcfDeletedColor; - - > td { - background-color: @wcfDeletedBackgroundColor !important; - } - - a:not(.badge) { - color: @wcfDeletedColor; - } - } - - .columnSubject .statusDisplay .pageNavigation { - opacity: 0; - - .transition(opacity, .2s); - } - - &:hover .columnSubject .statusDisplay .pageNavigation { - opacity: 1; - } - - &.new .columnAvatar > div { - &::after { - color: @wcfLinkColor; - content: "\f069"; - font-family: FontAwesome; - font-weight: normal !important; - font-style: normal !important; - font-size: 14px; - position: absolute; - text-decoration: none !important; - top: -4px; - right: -2px; - - .textShadow(@wcfContainerBackgroundColor); - } - } - } - - .columnAvatar { - div { - position: relative; - width: 40px; - height: 38px; - - > p > img { - opacity: .6; - - .transition(opacity, .2s); - } - } - - .myAvatar { - position: absolute; - width: 16px; - height: 16px; - bottom: -2px; - left: 24px; - opacity: 1; - - .boxShadow(0, 0, rgba(0, 0, 0, .3), 3px); - } - } - - .columnLastPost { - white-space: nowrap; - word-wrap: normal; - - > div > div > small { - color: @wcfDimmedColor; - } - } - - .messageGroupInfo { - font-size: @wcfSmallFontSize; - - > li { - display: inline-block; - - &:not(:first-child)::before { - content: " - "; - } - } - - &.mobileOptimization { - > li { - &.messageGroupLastPoster, - &.messageGroupLastPostTime { - display: none; - } - } - } - } -} - -@media only screen and (max-width: 800px) { - .messageGroupList { - .messageGroupInfo.mobileOptimization { - > li { - &.messageGroupAuthor, - &.messageGroupTime { - display: none; - } - - &.messageGroupLastPoster, - &.messageGroupLastPostTime { - display: inline-block; - } - - &.messageGroupLastPoster::before { - display: none; - } - } - } - } -} - -/* ### messages ### */ -@media only screen and (min-width: 801px) { - .messageList { - .messageGroupStarter { - position: relative; - - > .message::after { - content: "\f005"; - font-family: FontAwesome; - font-size: 14px; - display: block; - left: 4px; - position: absolute; - top: 2px; - - .textShadow(@wcfSidebarBackgroundColor); - } - - > .message.messageSidebarOrientationRight::after { - left: auto; - right: 4px; - } - } - } -} - -.message { - background-color: @wcfContainerHoverBackgroundColor; - border: 1px solid @wcfContainerBorderColor; - //overflow: hidden; /* todo: fixes floating issues when using message on pages with a sidebar */ - position: relative; - - &:hover { - .messageHeader .messageQuickOptions > li { - opacity: 1; - } - - .messageOptions nav { - opacity: 1; - } - } - - &.messageDisabled:not(.messageReduced) { - background-color: @wcfDisabledBackgroundColor; - - .messageSidebar { - color: @wcfDisabledColor; - - a { - color: @wcfDisabledColor; - } - } - } - - &.messageDeleted:not(.messageReduced) { - background-color: @wcfDeletedBackgroundColor; - - .messageSidebar { - color: @wcfDeletedColor; - - a { - color: @wcfDeletedColor; - } - } - } - - &.jsMarked:not(.messageReduced) { - background-color: @wcfSelectedBackgroundColor; - - .messageSidebar { - color: @wcfSelectedColor; - - a { - color: @wcfSelectedColor; - } - } - } - - .messageOptions { - font-size: @wcfSmallFontSize; - position: relative; - - &.forceHidden nav { - display: none !important; - } - - &.forceOpen nav { - opacity: 1; - } - - nav { - bottom: -2px; - opacity: 0; - position: absolute; - right: -22px; - text-align: right; - - .transition(opacity, .1s); - - ul.smallButtons { - > li { - a.button { - border-radius: 0; - } - } - } - } - } - - .messageHeader { - .messageQuickOptions { - float: right; - - > li { - display: inline-block; - opacity: .6; - - .transition(opacity, .2s); - - span.icon { - color: @wcfDimmedColor; - - .transition(color, .2s); - } - - > a:hover > span.icon { - color: @wcfLinkColor; - } - - > .badge { - top: -2px; - } - } - - input[type=checkbox] { - position: relative; - top: 1px; - } - } - - .permalink { - color: @wcfDimmedColor; - } - } - - &.dividers { - .userCredits { - border-top: 1px solid @wcfContainerBorderColor; - } - } -} - -.touch { - .message .messageOptions nav { - opacity: 1; - } - - .messageBody > footer { - padding-bottom: @wcfGapLarge + @wcfGapSmall; - } -} - -@media only screen and (max-width: 800px) { - .message { - border-width: 1px 0; - } -} - -/* sidebars orientations */ -.message.messageSidebarOrientationLeft { - .messageContent { - border-left: 1px solid @wcfContainerBorderColor; - margin: 0 0 0 211px; - } - - .messageSidebar { - float: left; - } -} - -.message.messageSidebarOrientationRight { - .messageContent { - border-right: 1px solid @wcfContainerBorderColor; - margin: 0 211px 0 0; - } - - .messageSidebar { - float: right; - } -} - -/* pointer */ -.message.messageSidebarOrientationLeft, -.message.messageSidebarOrientationRight { - .messageHeader { - &::before, - &::after { - border-width: 20px; - content: ""; - display: block; - height: 0; - position: absolute; - top: 35px; - width: 0; - } - - &::before { - z-index: 100; - } - - &::after { - z-index: 101; - } - } -} - -.message.messageSidebarOrientationLeft { - .messageHeader { - &::before, - &::after { - border-style: inset solid inset none; - } - - &::before { - border-color: transparent @wcfContainerBorderColor transparent transparent; - left: -20px; - } - - &::after { - border-color: transparent @wcfContainerBackgroundColor transparent transparent; - left: -19px; - } - } -} - -.message.messageSidebarOrientationRight { - .messageHeader { - &::before, - &::after { - border-style: inset none inset solid; - } - - &::before { - border-color: transparent transparent transparent @wcfContainerBorderColor; - right: -20px; - } - - &::after { - border-color: transparent transparent transparent @wcfContainerBackgroundColor; - right: -19px; - } - } -} - -/* new message badge */ -.message .newMessageBadge { - color: @wcfTabularBoxColor; - display: block; - font-size: @wcfSmallFontSize; - font-weight: bold; - padding: 6px 10px; - position: absolute; - text-transform: uppercase; - top: 24px; - - .boxShadow(1px, 1px, rgba(0, 0, 0, .2), 3px); - .linearGradient(darken(@wcfTabularBoxBackgroundColor, 10%), @wcfTabularBoxBackgroundColor, darken(@wcfTabularBoxBackgroundColor, 10%)); - .textShadow(darken(@wcfTabularBoxBackgroundColor, 10%)); - - &::before { - border-bottom: 4px solid darken(@wcfTabularBoxBackgroundColor, 20%); - content: ""; - display: block; - position: absolute; - top: -4px; - } -} - -.message.messageSidebarOrientationLeft .newMessageBadge { - border-radius: 0 5px 5px 0; - left: -219px; - - &::before { - border-left: 6px solid transparent; - left: 0; - } -} - -.message.messageSidebarOrientationRight .newMessageBadge { - right: -219px; -} - -.message.messageReduced .newMessageBadge { - right: -7px; - top: 21px; -} - -.message.messageSidebarOrientationRight, -.message.messageReduced { - .newMessageBadge { - border-radius: 5px 0 0 5px; - - &::before { - border-right: 6px solid transparent; - right: 0; - } - } -} - -.messageBody { - color: @wcfColor; - display: block; - line-height: 1.5; - - > div:not(.messageFooter):not(.redactor-box):not(.messageTabMenu) { - overflow: hidden; - padding-bottom: @wcfGapMedium; - - > div.messageText { - img { - max-width: 100%; - } - - table img { - max-width: none; - } - } - } - - > footer { - padding-bottom: @wcfGapMedium; - } - - > .messageSignature { - color: @wcfDimmedColor; - - img { - max-height: ~"@{wcf_option_signature_max_image_height}px"; - } - } - - .messageFooter { - > *:not(:first-child) { - margin-top: @wcfGapSmall; - } - } -} - -.messageTextPreview { - img { - max-width: 100%; - } - - table img { - max-width: none; - } -} - -@messageFooterNoteGradientColor: fade(@wcfContainerBorderColor, 20%); -@messageFooterNoteGradientColor2: fade(@messageFooterNoteGradientColor, 0%); -.messageFooterNote { - border-left: 2px solid @wcfContainerBorderColor; - color: @wcfDimmedColor; - font-size: @wcfSmallFontSize; - padding: @wcfGapTiny @wcfGapSmall; - - .linearGradientNative(~"90deg, @{messageFooterNoteGradientColor} 0%, @{messageFooterNoteGradientColor2} 40%"); -} - -// rtl fix -html[dir='rtl'] { - .messageFooterNote { - .linearGradientNative(~"270deg, @{messageFooterNoteGradientColor} 0%, @{messageFooterNoteGradientColor2} 40%"); - } -} - -.messageHeader + .messageBody > div:first-child:not(.redactor-box), -.messageBody > div:not(.messageFooter):not(.messageTabMenu):not(.redactor-box):not(:first-child) { - border-top: 1px dotted @wcfContainerBorderColor; - padding: @wcfGapMedium 0; -} - -.message .messageBody { - padding: @wcfGapMedium @wcfGapLarge 1px; -} - -.message .messageContent { - background-color: @wcfContainerBackgroundColor; - - .messageHeader { - padding: @wcfGapMedium @wcfGapLarge 0; - position: relative; - - .messageHeadline { - > h1 { - color: @wcfColor; - font-size: @wcfSubHeadlineFontSize; - font-weight: bold; - overflow: hidden; - padding-right: 21px; // reserved space for new badge - text-overflow: ellipsis; - - .textShadow(@wcfContainerBackgroundColor); - - + p { - margin-top: 2px; - } - } - - > p { - font-size: @wcfSmallFontSize; - - > .likesBadge { - margin: -2px 0 -1px 4px; - } - - > .username::after { - content: " - "; - } - } - } - - .box32 > .messageHeadline > p:first-child { - font-size: 1rem; - - > .username { - font-size: @wcfTitleFontSize; - font-weight: bold; - - .textShadow(@wcfContainerBackgroundColor); - } - - > .username { - display: block; - } - - > .username::after { - content: ""; - } - - > .likesBadge { - font-size: @wcfSmallFontSize; - top: -1px; - } - } - } -} - -.message .messageSidebar { - line-height: 1.3; - margin-bottom: -1px; - padding: @wcfGapMedium @wcfGapLarge @wcfGapLarge; - position: relative; - text-align: center; - width: 170px; /* Width toggle */ - - &::after { - clear: both; - content: ''; - display: block; - } - - header .username { - color: @wcfLinkColor; - font-size: @wcfTitleFontSize; - font-weight: bold; - padding: 0 3px 1px; - - .textShadow(@wcfContainerHoverBackgroundColor); - - a { - text-decoration: none; - } - } - - .userTitle { - margin: 7px 0 0; - } - - .userRank { - margin: 2px 0 0; - } - - .userAvatar { - display: inline-block; - margin: @wcfGapSmall 0 0; - position: relative; - text-align: left; - - > .badgeOnline { - border-radius: 0 5px 5px 0; - color: rgba(238, 255, 238, 1); - bottom: 7px; - left: -5px; - position: absolute; - text-transform: uppercase; - - .boxShadow(1px, 1px, rgba(0, 0, 0, .2), 3px); - .linearGradient(darken(rgba(0, 153, 0, 1), 10%), rgba(0, 153, 0, 1), darken(rgba(0, 153, 0, 1), 10%)); - .textShadow(darken(rgba(0, 153, 0, 1), 10%)); - - &::before { - border-bottom: 4px solid darken(rgba(0, 153, 0, 1), 20%); - border-left: 6px solid transparent; - content: ""; - display: block; - left: 0; - position: absolute; - top: -4px; - } - } - } - - .userCredits { - font-size: @wcfSmallFontSize; - margin: @wcfGapSmall 0 0; - overflow: hidden; - padding: @wcfGapSmall 0 0; - } -} - -.message:not(.messageReduced) .messageOptions { - .clearfix(); -} - -.message:not(.messageReduced) .messageBody { - .clearfix(); -} - -li:nth-child(2n+1) .message { - &.messageSidebarOrientationLeft .messageHeader::after { - border-right-color: @wcfContainerAccentBackgroundColor; - } - - &.messageSidebarOrientationRight .messageHeader::after { - border-left-color: @wcfContainerAccentBackgroundColor; - } - - .messageContent { - background-color: @wcfContainerAccentBackgroundColor; - } -} - -.messageReduced { - .messageOptions > .breadcrumbs { - bottom: 10px; - left: 0; - opacity: 1; - position: relative; - } - - &.messageDisabled { - border-color: @wcfDisabledColor; - - .messageContent { - @wcfDisabledBackgroundGradientColor: fade(@wcfDisabledBackgroundColor, 0%); - .linearGradientNative(~"180deg, @{wcfDisabledBackgroundColor}, @{wcfDisabledBackgroundGradientColor} 90px"); - } - } - - &.messageDeleted { - border-color: @wcfDeletedColor; - - .messageContent { - @wcfDeletedBackgroundGradientColor: fade(@wcfDeletedBackgroundColor, 0%); - .linearGradientNative(~"180deg, @{wcfDeletedBackgroundColor}, @{wcfDeletedBackgroundGradientColor} 90px"); - } - } - - &.jsMarked { - border-color: @wcfSelectedColor; - - .messageContent { - @wcfSelectedBackgroundGradientColor: fade(@wcfSelectedBackgroundColor, 0%); - .linearGradientNative(~"180deg, @{wcfSelectedBackgroundColor}, @{wcfSelectedBackgroundGradientColor} 90px"); - } - } -} - -.messageCollapsed { - color: @wcfDimmedColor; - opacity: .8; - padding: @wcfGapMedium @wcfGapLarge; - - .transition(opacity, .1s); - - &:hover { - opacity: 1; - } - - &.messageCollapsedExpandable { - cursor: pointer; - } - - h1 { - font-size: @wcfSmallFontSize; - } - - .messageCounter { - padding-top: 3px; - } - - &.jsMarked { - background-color: @wcfSelectedBackgroundColor !important; - color: @wcfColor; - - a { - color: @wcfColor; - } - } -} - -@media only screen and (max-width: 800px) { - .messageCollapsed { - padding: @wcfGapSmall; - } -} - -@media only screen and (min-width: 641px) and (max-width: 800px) { - .messageCollapsed { - padding: @wcfGapSmall @wcfGapMedium; - } -} - -/* quick reply and inline editor */ -.messageBody > span.icon-spinner { - left: 50%; - margin: -21px -21px 0 0; - position: absolute; - top: 50%; -} - -#messageQuickReply { - .formSubmit { - padding-bottom: @wcfGapMedium; - } -} - -/* message quotes */ -#showQuotes { - bottom: @wcfGapLarge + @wcfGapTiny; - cursor: pointer; - opacity: .7; - position: fixed; - right: @wcfGapLarge + @wcfGapTiny; - - .transition(opacity, .2s); - - &:hover { - opacity: 1; - } -} - -#messageQuoteList { - max-width: 800px !important; - - li { - &:not(:first-child) { - margin-top: @wcfGapSmall; - } - - > span { - float: left; - - > input { - vertical-align: bottom; - } - - > span { - cursor: pointer; - vertical-align: middle; - } - } - - div.jsQuote { - margin-left: 60px; - } - - div.jsFullQuote { - display: none; - } - } -} - -#quoteManagerCopy { - > span:not(.pointer) { - cursor: pointer; - } - - > .jsQuoteManagerQuoteAndInsert { - border-left: 1px solid @wcfTooltipColor; - margin-left: 4px; - padding-left: 4px; - } - - > .pointer { - border-width: 5px 5px 0; - bottom: -5px; - margin-left: -5px; - top: auto; - } -} - -/* share buttons */ -.messageShareButtons { - > ul > li { - display: inline-block; - - > a { - text-decoration: none; - - > .icon { - height: 28px; - } - } - - > .badge { - background-color: @wcfContainerBackgroundColor; - border: 1px solid @wcfContainerBorderColor; - border-radius: 3px; - color: @wcfColor; - line-height: 23px; - padding: 0 7px; - position: relative; - vertical-align: 1px; - - &::before { - border: 6px solid @wcfContainerBorderColor; - border-color: transparent @wcfContainerBorderColor transparent transparent; - content: ""; - display: block; - height: 0; - margin-top: -6px; - position: absolute; - right: 100%; - top: 50%; - width: 0; - } - - &::after { - border: 6px solid @wcfContainerBackgroundColor; - border-color: transparent @wcfContainerBackgroundColor transparent transparent; - content: ""; - display: block; - height: 0; - margin-right: -1px; - margin-top: -6px; - position: absolute; - right: 100%; - top: 50%; - width: 0; - } - } - } - - .jsShareFacebook:not(.disabled) { - > a > .icon { - color: rgb(59, 89, 152); - } - } - - .jsShareTwitter:not(.disabled) { - > a > .icon { - color: rgb(64, 153, 255); - } - } - - .jsShareGoogle:not(.disabled) { - > a > .icon { - color: rgb(211, 72, 54); - } - } - - .jsShareReddit:not(.disabled) { - > a > .icon { - color: rgb(95, 153, 207); - } - } -} - -.contentNavigation > .messageShareButtons { - float: right; - margin-right: @wcfGapMedium; - margin-top: 0; -} - -.messageSearchResultList { - > li > .box48 > div > .containerHeadline > h3 { - padding-right: 100px; - } -} - -.likeButton.active, /* deprecated */ -.wcfLikeButton.active { - .icon { - color: rgba(0, 153, 0, 1); - } -} - -.dislikeButton.active, /* deprecated */ -.wcfDislikeButton.active { - .icon { - color: rgba(204, 0, 0, 1); - } -} - -@media screen and (max-width: 800px), print { - .message.messageSidebarOrientationLeft, - .message.messageSidebarOrientationRight { - .messageContent { - border: 0; - margin: 0; - } - - .messageSidebar { - float: none; - min-height: 37px; - } - - .messageHeader { - &::before, - &::after { - display: none; - } - } - } - - .message .messageHeader .messageQuickOptions, - .message .messageBody .messageSignature, - .message .messageSidebar .userCredits { - display: none; - } - - .message .messageSidebar { - padding: 7px; - text-align: left; - width: auto; - - > div { - margin-left: 40px; - } - - .userAvatar { - left: 7px; - position: absolute; - top: 0; - - img { - height: 32px !important; - width: 32px !important; - } - - > .badgeOnline { - display: none; - } - } - - .userTitle { - margin-top: -2px; - } - } - - /* reduce paddings */ - .message .messageContent .messageHeader { - padding: @wcfGapSmall @wcfGapSmall 0; - } - - .message .messageBody { - padding: @wcfGapSmall; - } - - .message .messageBody > div:not(.messageFooter):not(.messageTabMenu):not(.redactor-box) { - padding: @wcfGapSmall 0; - } - - .message .messageBody > footer { - padding: 0; - position: absolute; - right: @wcfGapSmall; - top: @wcfGapSmall; - } - - .message .messageOptions nav { - opacity: 1; - position: static; - text-align: left; - } - - .message .newMessageBadge { - display: none; - } -} - -@media screen and (min-width: 641px) and (max-width: 800px), print { - .message .messageSidebar, - .message .messageContent .messageHeader, - .message .messageBody { - padding-left: @wcfGapMedium; - padding-right: @wcfGapMedium; - } - - .message .messageSidebar { - .userAvatar { - left: @wcfGapMedium; - } - } - - .message .messageBody > footer { - right: @wcfGapMedium; - } -} - -@media only screen and (max-width: 800px) { - .moderationList { - thead { - display: none; - } - - tbody { - .columnAssignedUserID, - .columnLastChangeTime { - display: none; - } - } - } -} - -/* edit history */ -.editHistoryDiff { - > .sideBySide:first-child { - margin-bottom: @wcfGapLarge; - text-align: center; - } - - .sideBySide { - > div:first-child { - padding-right: @wcfGapMedium; - } - - > div:last-child { - padding-left: @wcfGapMedium; - } - } -} - -@media only screen and (max-width: 800px) { - .editHistoryVersionList { - .columnUser, - .columnEditReason { - display: none; - } - } -} - -.messageFloatObjectLeft { - float: left; - margin: 0 @wcfGapMedium @wcfGapSmall 0; -} - -.messageFloatObjectRight { - float: right; - margin: 0 0 @wcfGapSmall @wcfGapMedium; -} diff --git a/wcfsetup/install/files/style/sortable.less b/wcfsetup/install/files/style/sortable.less deleted file mode 100644 index 399f45daf0..0000000000 --- a/wcfsetup/install/files/style/sortable.less +++ /dev/null @@ -1,60 +0,0 @@ -.sortableListContainer .sortablePlaceholder { - background-color: @wcfWarningBackgroundColor; - border: 1px solid @wcfWarningBorderColor; - color: @wcfWarningColor; - margin: @wcfGapTiny 0; - padding: @wcfGapTiny; -} - -.sortablePlaceholder.sortableInvalidTarget { - background-color: @wcfErrorBackgroundColor; - border: 1px solid @wcfErrorBorderColor; - color: @wcfErrorColor; -} - -.sortableList { - list-style-position: outside; - list-style-type: decimal; - margin-left: @wcfGapLarge; - - .jsCollapsibleCategory > .sortableNodeLabel { - background-color: @wcfTabularBoxBackgroundColor; - color: @wcfTabularBoxColor; - padding-left: 7px; - - > a { - color: @wcfTabularBoxColor; - } - - .icon { - color: @wcfTabularBoxColor; - - .textShadow(@wcfTabularBoxBackgroundColor); - } - } - - .statusDisplay { - float: right; - } -} - -.sortableNode { - cursor: move; - - &.ui-sortable-helper { - list-style: none; - } -} - -.sortableNodeLabel { - padding: @wcfGapSmall @wcfGapSmall @wcfGapSmall 0; - display: block; -} - -.sortableList:not(.simpleSortableList) .sortableNodeLabel { - border-bottom: 1px solid @wcfContainerBorderColor; -} - -.simpleSortableList { - min-height: @wcfGapLarge; -} \ No newline at end of file diff --git a/wcfsetup/install/files/style/styleEditor.less b/wcfsetup/install/files/style/styleEditor.less deleted file mode 100644 index 7f66ff03e1..0000000000 --- a/wcfsetup/install/files/style/styleEditor.less +++ /dev/null @@ -1,42 +0,0 @@ -.colorPreview { - background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEX////MzMw46qqDAAAAD0lEQVQI12P4z4Ad4ZAAAH6/D/Hgw85/AAAAAElFTkSuQmCC); - border: 1px solid @wcfContainerBorderColor; - border-radius: @wcfContainerBorderRadius; - display: inline-block; - - &:hover { - .boxShadow(0, 0, @wcfContainerBorderColor, 15px, 0); - } - - > div { - border: 2px solid @wcfContentBackgroundColor; - border-radius: @wcfContainerBorderRadius; - cursor: pointer; - display: block; - height: 60px; - width: 180px; - } -} - -.colorList { - > li { - float: left; - padding: @wcfGapSmall; - - > figure > figcaption { - font-size: @wcfSmallFontSize; - margin-bottom: @wcfGapSmall; - text-align: center; - } - } - - &::after { - clear: both; - content: ""; - display: block; - } -} - -#tplStyleAdd #styleLogo { - background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEX////MzMw46qqDAAAAD0lEQVQI12P4z4Ad4ZAAAH6/D/Hgw85/AAAAAElFTkSuQmCC); -} -- 2.20.1