From: Alexander Ebert Date: Sun, 20 Mar 2016 09:46:53 +0000 (+0100) Subject: Removed old LESS files X-Git-Tag: 3.0.0_Beta_1~2001 X-Git-Url: https://git.stricted.de/?a=commitdiff_plain;h=839bbac0cec51a281852f2c6d7111468c08122dd;p=GitHub%2FWoltLab%2FWCF.git Removed old LESS files --- diff --git a/wcfsetup/install/files/style/acl.less b/wcfsetup/install/files/style/acl.less deleted file mode 100644 index 1993069673..0000000000 --- a/wcfsetup/install/files/style/acl.less +++ /dev/null @@ -1,75 +0,0 @@ -.aclList, -.aclPermissionList { - margin-top: 0; - min-height: 100px; - - > li { - display: block; - padding: @wcfGapTiny; - - &:first-child { - border-top-left-radius: @wcfContainerBorderRadius; - border-top-right-radius: @wcfContainerBorderRadius; - } - - &:last-child:not(:first-child) { - border-bottom-left-radius: @wcfContainerBorderRadius; - border-bottom-right-radius: @wcfContainerBorderRadius; - } - } -} - -.aclList { - margin-bottom: @wcfGapSmall; - - > li { - cursor: pointer; - - &:hover, - &.active:hover { - background-color: @wcfButtonHoverBackgroundColor; - } - - &.active { - background-color: @wcfContainerAccentBackgroundColor; - } - - > span:last-child { - float: right; - margin-right: @wcfGapSmall; - } - } -} - -.aclPermissionList { - margin-top: @wcfGapSmall; - min-height: 200px; - text-align: right; - - > li { - &:hover { - background-color: @wcfButtonHoverBackgroundColor; - } - - &.aclCategory { - background-color: @wcfContainerHoverBackgroundColor; - padding: @wcfGapTiny @wcfGapSmall+@wcfGapTiny; - text-align: left; - } - - &.aclFullAccess { - background-color: @wcfContainerAccentBackgroundColor; - } - - > span { - float: left; - padding-left: @wcfGapSmall; - } - - > label { - cursor: pointer; - margin: 0 @wcfGapSmall; - padding: 0 @wcfGapLarge; - } - } -} \ No newline at end of file diff --git a/wcfsetup/install/files/style/bbcode.less b/wcfsetup/install/files/style/bbcode.less deleted file mode 100644 index c47d49f0b0..0000000000 --- a/wcfsetup/install/files/style/bbcode.less +++ /dev/null @@ -1,425 +0,0 @@ -/* Code Box */ -.codeBox { - background-color: @wcfContentBackgroundColor; - clear: both; - margin: (@wcfGapSmall + @wcfGapTiny) 0; - - > div { - padding: @wcfGapMedium @wcfGapLarge @wcfGapMedium @wcfGapMedium; - - .boxShadowNative(~"inset 4em 0 0 " @wcfContainerBackgroundColor ~", inset 4.1em 0 0" lighten(@wcfContainerBorderColor, 10%)); - - > div { - margin: 0 0 @wcfGapSmall 3.4em; - - > h3 { - font-size: @wcfTitleFontSize; - font-weight: bold; - padding-left: @wcfGapSmall; - position: relative; - - > span.icon { - position: absolute; - right: 0; - top: 3px; - } - } - } - - > ol { - list-style-type: decimal; - margin-left: 3.4em; - - > li { - font-family: Consolas, 'Courier New', monospace; - margin: 0; - padding-left: @wcfGapSmall; - position: relative; - white-space: pre-wrap; - word-break: break-all; - word-wrap: break-word; - - > .lineAnchor { - display: block; - height: 1.4em; - left: -3.6em; - position: absolute; - top: 0; - width: 3.0em; - } - - &:target { - background-color: @wcfHighlightBackgroundColor; - } - } - } - } - - &.minimized { - max-height: 200px; - overflow: hidden; - position: relative; - - > .codeBoxExpand { - background-color: @wcfContainerBackgroundColor; - border-top: 1px solid @wcfContainerBorderColor; - bottom: 0; - cursor: pointer; - display: block; - height: 20px; - left: 0; - padding: 4px; - position: absolute; - right: 0; - text-align: center; - - .boxShadow(0, -10px, @wcfContainerBackgroundColor, 25px, 5px); - } - } -} - -// rtl fix -html[dir='rtl'] { - .codeBox { - > div { - .boxShadowNative(~"inset -4em 0 0 " @wcfContainerBackgroundColor ~", inset -4.1em 0 0" lighten(@wcfContainerBorderColor, 10%)); - } - } -} - -@media only screen and (max-width: 800px) { - .codeBox { - > div { - padding: @wcfGapSmall; - - .boxShadow(0, 0, transparent); - - > div { - margin-left: 0; - - > h3 { - padding-left: 0; - } - } - - > ol { - list-style-type: none; - margin-left: 0; - overflow: auto; - - > li { - padding-left: 0; - white-space: pre; - word-wrap: normal; - } - } - } - } -} - -/* ############## Code Styles ############## */ - -/* -- -- -- Code Box -- -- -- */ - -.codeBox .hlQuotes { - color: red; -} - -.codeBox .hlComments, -.codeBox .hlOperators { - color: green; -} - -.codeBox .hlKeywords1 { - color: blue; -} - -.codeBox .hlKeywords2 { - color: darkred; -} - -.codeBox .hlKeywords3 { - color: darkviolet; -} - -.codeBox .hlKeywords4 { - color: darkgoldenrod; -} - -.codeBox .hlKeywords5 { - color: crimson; -} - -.codeBox .hlNumbers { - color: darkorange; -} - -/* -- -- -- Code Highlighters -- -- -- */ - -/* DIFF */ - -.diffHighlighter .hlComments { - color: darkviolet; -} - -.diffHighlighter .hlRemoved { - color: red; -} - -.diffHighlighter .hlAdded { - color: green; -} - -/* PHP */ - -.phpHighlighter .hlKeywords2 { - color: green; -} - -.phpHighlighter .hlComments { - color: darkgoldenrod; -} - -/* CSS */ - -.cssHighlighter .hlComments { - color: #236e26; -} - -.cssHighlighter .hlColors { - color: #751116; -} - -.cssHighlighter .hlNumbers, -.sqlHighlighter .hlNumbers { - color: #1906fd; -} - -.cssHighlighter .hlKeywords1 { - color: #87154f; -} - -.cssHighlighter .hlKeywords2 { - color: #994509; -} - -.cssHighlighter .hlKeywords3, -.cssHighlighter .hlKeywords4 { - color: inherit; -} - -/* SQL */ - -.sqlHighlighter .hlKeywords1 { - color: #663821; -} - -.sqlHighlighter .hlKeywords2 { - color: #871550; -} - -/* Quote Box */ -.quoteBox { - min-height: 28px; - position: relative; - - .clearfix; - - &.quoteBoxSimple { - clear: both; - margin: (@wcfGapSmall + @wcfGapTiny) 0; - padding-left: 54px; - } - - &.container { - background-color: @wcfContentBackgroundColor; - } - - > header { - padding-bottom: @wcfGapTiny; - border-bottom: 1px dotted @wcfContainerBorderColor; - margin-bottom: @wcfGapSmall; - - .userSelectNone; - - > h3 { - font-weight: bold; - } - } - - /* quote icon */ - > div:first-of-type { - &::before { - content: "\f10d"; - color: @wcfDimmedColor; - font-family: FontAwesome; - font-size: 28px; - position: absolute; - left: @wcfGapMedium; - top: @wcfGapSmall; - } - } - - /* nested quotes */ - .quoteBox { - margin-left: 0; - padding-left: @wcfGapLarge; - min-height: 0; - - > div:first-of-type { - &::before { - display: none; - } - } - } -} - -.quoteBoxAuthor { - clear: both; - margin: (@wcfGapSmall + @wcfGapTiny) 0; - position: relative; - - .clearfix; - - > .quoteAuthorAvatar { - float: left; - - &::before, - &::after { - border-style: inset solid inset none; - border-width: 15px; - content: ""; - display: block; - height: 0; - position: absolute; - top: 15px; - width: 0; - } - - &::before { - border-color: transparent @wcfContainerBorderColor transparent transparent; - left: 75px; - z-index: 100; - } - - &::after { - border-color: transparent @wcfContentBackgroundColor transparent transparent; - left: 76px; - z-index: 101; - } - - + .quoteBox { - margin-left: 90px; - padding-left: @wcfGapLarge; - - /* hide quote icon */ - > div:first-of-type { - &::before { - display: none; - } - } - } - - > a { - display: inline-block; - } - } - - /* nested quotes */ - .quoteBoxAuthor { - > .quoteAuthorAvatar { - display: none; - - + .quoteBox { - margin-left: 0; - } - } - } -} - -@media only screen and (max-width: 800px) { - .quoteBoxAuthor { - > .quoteAuthorAvatar { - display: none; - } - } - - .quoteBox { - margin-left: 0 !important; - padding-left: 28px !important; - - > div:first-of-type { - &::before { - display: block !important; - font-size: 14px; - left: @wcfGapSmall; - } - } - - /* nested quotes */ - .quoteBox { - padding-left: @wcfGapSmall !important; - - > div:first-of-type { - &::before { - display: none !important; - } - } - } - } -} - -/* spoiler box */ -.spoilerBox { - background-color: @wcfContentBackgroundColor; - clear: both; - font-size: 1rem; - padding-bottom: @wcfGapSmall; - - > header { - margin-bottom: @wcfGapSmall; - - .userSelectNone; - } - - > div { - overflow: hidden; - padding-bottom: @wcfGapSmall; - } -} - -/* inline code tag */ -kbd, -.inlineCode { - background-color: @wcfContentBackgroundColor; - border: 1px solid @wcfContainerBorderColor; - border-radius: 3px; - display: inline-block; - font-family: Consolas, 'Courier New', monospace; - margin: 0 2px; - padding: 0 5px; - word-break: break-all; - word-wrap: break-word; -} - -/* smiley list */ -ul.smileyList > li { - display: inline; -} - -/* bbcode table */ -.bbcodeTable { - display: inline-block; -} - -@media screen and (max-width: 800px) { - .bbcodeTable { - display: block; - } -} - -/* media provider */ -/* thanks for this generic class name usage, github */ -.gist .highlight { - background-color: inherit; -} diff --git a/wcfsetup/install/files/style/bbcode/bbcodeCollapsible.less b/wcfsetup/install/files/style/bbcode/bbcodeCollapsible.less deleted file mode 100644 index 38b9aa4f09..0000000000 --- a/wcfsetup/install/files/style/bbcode/bbcodeCollapsible.less +++ /dev/null @@ -1,26 +0,0 @@ -.collapsibleBbcode { - > .toggleButton { - background-color: @wcfContainerBackgroundColor; - border-top: 1px solid @wcfContainerBorderColor; - cursor: pointer; - display: block; - height: 20px; - padding: 4px; - text-align: center; - } - - &.collapsed { - max-height: 200px; - overflow: hidden; - position: relative; - - > .toggleButton { - bottom: 0; - left: 0; - position: absolute; - right: 0; - - .boxShadow(0, -10px, @wcfContainerBackgroundColor, 25px, 5px); - } - } -} diff --git a/wcfsetup/install/files/style/bbcode/code.less b/wcfsetup/install/files/style/bbcode/code.less deleted file mode 100644 index 7119590857..0000000000 --- a/wcfsetup/install/files/style/bbcode/code.less +++ /dev/null @@ -1,103 +0,0 @@ -.codeBox { - background-color: @wcfContentBackgroundColor; - border: 1px solid rgb(79, 129, 189); - border-width: 1px 0; - clear: both; - margin: 20px 0; - - &:first-child { - margin-top: 0; - } - - > div { - padding: 10px; - - .boxShadowNative(~"inset 4em 0 0 " @wcfContainerBackgroundColor ~", inset 4.1em 0 0" lighten(@wcfContainerBorderColor, 10%)); - - > div { - margin: 0 0 10px 3.4em; - - > h3 { - .wcfFontLarge; - - /*font-size: @wcfTitleFontSize; - font-weight: bold;*/ - padding-left: @wcfGapSmall; - position: relative; - - > .icon { - position: absolute; - right: 0; - top: 3px; - } - } - } - - > ol { - list-style-type: decimal; - margin-left: 3.4em; - - > li { - font-family: Consolas, 'Courier New', monospace; - margin: 0; - padding-left: @wcfGapSmall; - position: relative; - white-space: pre-wrap; - word-break: break-all; - word-wrap: break-word; - - > .lineAnchor { - display: block; - height: 1.4em; - left: -3.6em; - position: absolute; - top: 0; - width: 3.0em; - } - - &:target { - background-color: @wcfHighlightBackgroundColor; - } - } - } - } -} - -// rtl fix -html[dir='rtl'] { - .codeBox { - > div { - .boxShadowNative(~"inset -4em 0 0 " @wcfContainerBackgroundColor ~", inset -4.1em 0 0" lighten(@wcfContainerBorderColor, 10%)); - } - } -} - -@media only screen and (max-width: 800px) { - .codeBox { - > div { - padding: @wcfGapSmall; - - .boxShadow(0, 0, transparent); - - > div { - margin-left: 0; - - > h3 { - padding-left: 0; - } - } - - > ol { - list-style-type: none; - margin-left: 0; - overflow: auto; - - > li { - padding-left: 0; - white-space: pre; - word-wrap: normal; - } - } - } - } -} diff --git a/wcfsetup/install/files/style/bbcode/codeInline.less b/wcfsetup/install/files/style/bbcode/codeInline.less deleted file mode 100644 index b733d156f1..0000000000 --- a/wcfsetup/install/files/style/bbcode/codeInline.less +++ /dev/null @@ -1,5 +0,0 @@ -kbd { - border: 1px solid rgb(238, 238, 238); - border-radius: 3px; - padding: 3px 5px; -} diff --git a/wcfsetup/install/files/style/global.less b/wcfsetup/install/files/style/global.less deleted file mode 100644 index 2031ddf59c..0000000000 --- a/wcfsetup/install/files/style/global.less +++ /dev/null @@ -1,440 +0,0 @@ -/* ### globals ### */ -html, body { - font-size: @wcfBaseFontSize; -} - -body { - background-color: @wcfPageBackgroundColor; - color: @wcfColor; - font-family: @wcfBaseFontFamily; - line-height: @wcfBaseLineHeight; - position: relative; - word-wrap: break-word; -} - -small { - font-size: @wcfSmallFontSize; -} - -img { - vertical-align: middle; - - &.disabled { - opacity: .3; - } -} - -a { - color: @wcfLinkColor; - cursor: pointer; - text-decoration: none; - - &:hover { - color: @wcfLinkHoverColor; - text-decoration: underline; - } - - &.externalURL::after { - content: "\f08e"; - display: inline-block; - font-family: FontAwesome !important; - font-size: 14px !important; - font-weight: normal !important; - font-style: normal !important; - margin-left: @wcfGapTiny; - vertical-align: -1px; - } -} - -pre { - word-wrap: normal; - white-space: pre; -} - -.footerContent, .logo { - color: @wcfPageColor; - - a { - color: @wcfPageLinkColor; - - &:hover { - color: @wcfPageLinkHoverColor; - } - } -} - -.nativeList { - margin: 1em 0; - margin-left: 40px; - - ul, - ol { - margin-bottom: 0; - margin-top: 0; - } - - li { - margin: @wcfGapSmall 0; - } -} - -ul.nativeList { - list-style-type: disc; -} -ol.nativeList { - list-style-type: decimal; -} - -.htmlContent { - p { - margin: 1em 0; - } - - h1 { - font-size: @wcfSubHeadlineFontSize; - } - - h2 { - font-size: @wcfTitleFontSize; - } - - h1, h2, h3, h4, h5, h6 { - font-weight: bold; - margin: 0.5em 0; - } - - ul, ol { - .nativeList; - } - - ul { - list-style-type: disc; - } - - ol { - list-style-type: decimal; - } -} - -/* workaroud for broken date display on rtl pages in chrome */ -.datetime { - display: inline-block; -} - -/* hide broken reCaptcha iframe */ -body > iframe[src="about:blank"] { - display:none; -} - -::selection { - text-shadow: 0 1px 0 rgba(255, 255, 255, .5) !important; - color: #300; - background-color: rgba(255, 170, 34, .7); -} - -.invisible { - display: none; -} - -.marginTopLarge { - margin-top: @wcfGapLarge; -} - -.marginTop, -.marginMedium { - margin-top: @wcfGapMedium; -} - -.marginTopSmall { - margin-top: @wcfGapSmall; -} - -.marginTopTiny { - margin-top: @wcfGapTiny; -} - -.textLeft { - text-align: left; -} - -.textCenter, -.center { - text-align: center; -} - -.textRight { - text-align: right; -} - -.textJustify { - text-align: justify; -} - -.pointer { - cursor: pointer; -} - -.dimmed { - color: @wcfDimmedColor; -} - -.monospace { - font-family: Consolas, 'Courier New', monospace !important; -} - -.iconFlag { - background-color: @wcfContentBackgroundColor; - border: 1px solid @wcfContainerBorderColor; - padding: 1px; - - height: 15px; - width: 24px; -} - -.framed { - > canvas, - > img, - > .icon { - background-color: @wcfContentBackgroundColor; - border: 1px solid @wcfContainerBorderColor; - padding: 1px; - } -} - -.highlight { - background-color: @wcfHighlightBackgroundColor; -} - -.grayscale { - //filter: url(../images/grayscale-filter.svg#grayscale); - // Firefox does not allow SVG filters to be retrieved from a different domain, embed it directly (Firefox 35+ seems to support the native property!) - filter: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cfilter%20id%3D%22grayscale%22%3E%3CfeColorMatrix%20type%3D%22matrix%22%20values%3D%220.3333%200.3333%200.3333%200%200%200.3333%200.3333%200.3333%200%200%200.3333%200.3333%200.3333%200%200%200%200%200%201%200%22%2F%3E%3C%2Ffilter%3E%3C%2Fsvg%3E#grayscale); - filter: gray; - -webkit-filter: grayscale(1); -} - -/* fixes fieldset overflow issues */ -/* webkit */ -fieldset { - min-width: 0; -} -/* firefox */ -@-moz-document url-prefix() { - fieldset { - display: table-column; - } -} - -.elementPointer { - position: absolute; - top: 0; - transform: translateY(-100%); - - &.center { - left: 50%; - transform: translateX(-50%) translateY(-100%); - } - - &.left { - left: 4px; - } - - &.right { - right: 4px; - } - - &.flipVertical { - bottom: 0; - top: auto; - transform: translateY(100%); - - &.center { - transform: translateX(-50%) translateY(100%); - } - } -} - -/* balloon tooltips */ -.balloonTooltip { - background-color: @wcfTooltipBackgroundColor; - border-radius: 6px; - color: @wcfTooltipColor; - font-size: @wcfSmallFontSize; - max-width: 300px; - opacity: 0; - padding: 5px 10px 7px; - position: absolute; - visibility: hidden; - z-index: 800; - - transition: visibility 0s linear .2s, opacity .2s linear .2s; - - > .elementPointer { - border-color: @wcfTooltipBackgroundColor transparent; - border-style: solid; - border-width: 0 5px 5px; - - &.flipVertical { - border-width: 5px 5px 0; - } - } - - .boxShadow(0, 3px, rgba(0, 0, 0, .3), 7px); - - &.active { - opacity: 1; - visibility: visible; - - transition-delay: 0s; - } -} - -/* ### badges ### */ -/* default values */ -.badge { - background-color: @wcfColor; - border-radius: 9px; - color: @wcfContentBackgroundColor; - display: inline-block; - font-size: @wcfSmallFontSize; - font-weight: bold; - padding: 1px 6px 1px; - position: relative; - text-shadow: none !important; /* necessary to avoid ugly text shadows in comment lists; @todo: better solution without "!important" */ - vertical-align: middle; - white-space: nowrap; - word-wrap: normal; - - &.label { - border-radius: 4px; - font-weight: normal; - } - - /* colors */ - &.badgeUpdate { - background-color: @wcfTabularBoxBackgroundColor; - color: @wcfTabularBoxColor; - } - - &.badgeInverse { - background-color: @wcfTabularBoxColor; - color: @wcfTabularBoxBackgroundColor; - } - - /* default label colors */ - &.green { - background-color: rgba(0, 153, 0, 1); - color: rgba(238, 255, 238, 1); - } - - &.red { - background-color: rgba(204, 0, 0, 1); - color: rgba(255, 238, 238, 1); - } - - &.black { - background-color: #333; - color: #fff; - } - - &.brown { - background-color: #c63; - color: #fff; - } - - &.orange { - background-color: #f90; - color: #fff; - } - - &.yellow { - background-color: #ff0; - color: #333; - } - - &.blue { - background-color: #369; - color: #fff; - } - - &.purple { - background-color: #c0f; - color: #fff; - } - - &.pink { - background-color: #f0c; - color: #fff; - } -} - -a.badge:hover { - color: @wcfContentBackgroundColor; - text-decoration: none; - - &.black { - background-color: #000; - } - - &.brown { - background-color: #930; - } - - &.red { - background-color: #900; - } - - &.orange { - background-color: #f60; - } - - &.yellow { - background-color: #cc0; - } - - &.green { - background-color: #060; - } - - &.blue { - background-color: #036; - } - - &.purple { - background-color: #90c; - } - - &.pink { - background-color: #c09; - } -} - -/* the CSS below can be detected through JavaScript and works better than matchMedia-API (not supported by IE9) */ -@media only screen and (max-width: 800px) { - html { - caption-side: bottom; - } - - body { - caption-side: top; - } -} - -@media only screen and (max-width: 800px) and (-webkit-min-device-pixel-ratio: 2) { - // Preserve HTML font-size when iPhone orientation changes from portrait to landscape - html { - -webkit-text-size-adjust: 100%; - } - - // Fixes zoom when iPhone orientation changes from portrait to landscape - /* - - disabled this for now, it seems to cause some weird zoom-in bugs on iOS 9 and everything works w/o it too - - html.iOS, - html.iOS > body { - width: 100%; - overflow: hidden; - } - */ -} \ No newline at end of file diff --git a/wcfsetup/install/files/style/googleMaps.less b/wcfsetup/install/files/style/googleMaps.less deleted file mode 100644 index 32185652fd..0000000000 --- a/wcfsetup/install/files/style/googleMaps.less +++ /dev/null @@ -1,43 +0,0 @@ -.googleMap { - height: 400px; -} - -.sidebarGoogleMap { - height: 250px; -} - -// CSS code taken from map type controls -.googleMapsCustomControlContainer { - cursor: pointer !important; - margin-top: 5px; - - .googleMapsCustomControl { - .userSelectNone; - - text-align: center; - position: relative; - color: rgb(86, 86, 86); - font-size: 11px !important; - background-color: rgb(255, 255, 255); - padding: 1px 6px; - border-radius: 3px; - background-clip: padding-box; - border: 1px solid rgba(0, 0, 0, 0.14902); - box-shadow: rgba(0, 0, 0, 0.298039) 0px 1px 4px -1px; - min-width: 29px; - - &:hover { - background-color: rgb(235, 235, 235); - color: rgb(0, 0, 0); - } - - &.active { - color: rgb(0, 0, 0); - font-weight: 500; - } - } -} - -.googleMapsUseLocationSuggestionLink { - font-size: @wcfSmallFontSize; -} diff --git a/wcfsetup/install/files/style/imageViewer.less b/wcfsetup/install/files/style/imageViewer.less deleted file mode 100644 index 537b45c299..0000000000 --- a/wcfsetup/install/files/style/imageViewer.less +++ /dev/null @@ -1,604 +0,0 @@ -#lbOverlay { - background-color: #000; - bottom: 0; - left: 0; - position: fixed; - right: 0; - top: 0; - z-index: 399; -} - -#lbPrevLink, -#lbNextLink { - display: block; - overflow: hidden; - position: absolute; - top: 0; - width: 50%; - outline: none; - - > span { - background-color: #fff; - display: none; - padding: @wcfGapSmall; - position: absolute; - top: 20%; - } - - &:hover > span { - .boxShadow(0, 0, @wcfButtonHoverBorderColor, 20px); - } -} - -#lbPrevLink { - left: 0; - - > span { - border-radius: 0 30px 30px 0; - left: 0; - padding-right: @wcfGapMedium; - } -} - -#lbNextLink { - right: 0; - - > span { - border-radius: 30px 0 0 30px; - padding-left: @wcfGapMedium; - right: 0; - } -} - -#lbEnlarge, -#lbCloseLink { - cursor: pointer; - display: block; - float: right; - padding-right: @wcfGapSmall; - outline: none; -} - -#lbCenter, #lbBottomContainer { - background-color: #fff; - overflow: hidden; - position: absolute; - z-index: 400; -} - -#lbCenter > .icon-spinner { - left: 50%; - margin: -21px 0 0 -21px; - position: absolute; - top: 50%; -} - -#lbImage { - background-repeat: no-repeat; - background-size: cover; - border: 10px solid #fff; - left: 0; - position: absolute; - top: 0; - - &:hover { - #lbNextLink, - #lbPrevLink { - > span { - display: block; - } - } - } -} - -#lbBottom { - border: 10px solid #fff; - border-top-style: none; - color: #666; -} - -#lbCaption, #lbNumber { - margin-right: 71px; -} - -#lbCaption { - font-weight: bold; -} - -/* ImageViewer for WCF */ -@wcfImageViewerBorderColor: rgba(51, 51, 51, 1); -@wcfImageViewerFontColor: rgba(211, 211, 211, 1); - -.wcfImageViewer { - background-color: rgba(0, 0, 0, 1); - bottom: 0; - display: none; - left: 0; - opacity: 0; - position: fixed; - right: 0; - top: 0; - z-index: 399; - - .icon { - color: rgba(102, 102, 102, 1); - - text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); - } - - &.open { - display: block; - opacity: 1; - } - - &.maximized:not(.wcfImageViewerMobile) { - > header { - top: -100px; - } - - > div { - bottom: 0; - border-color: fade(@wcfImageViewerBorderColor, 0%); - top: 0; - } - - > footer { - bottom: -100px; - } - } - - &.wcfImageViewerStatic > header > div { - > h1, - > h2, - > h3 { - margin-left: 0 !important; - } - } - - &.wcfImageViewerMobile { - > header, - > footer { - background-color: rgba(0, 0, 0, 1); - opacity: 1; - position: absolute; - visibility: visible; - z-index: 402; - } - - &.maximized { - > header, - > footer { - opacity: 0; - visibility: hidden; - - transition: visibility 0s linear .5s, opacity .5s linear; - } - - > div > ul > li.pointer { - opacity: 0; - } - } - - > div { - bottom: 0; - top: 0; - - > ul { - > li { - background-color: rgba(224, 224, 224, 1); - border-radius: 30px; - margin-top: -24px; - opacity: 0; - position: absolute; - top: 50%; - - .transition(opacity, .3s); - - &.pointer { - opacity: 1; - } - - &.wcfImageViewerSlideshowButtonPrevious { - left: 10px; - - > span { - left: -3px; - position: relative; - top: 2px; - } - } - - &.wcfImageViewerSlideshowButtonNext { - right: 10px; - - > span { - position: relative; - right: -1px; - top: 2px; - } - } - - &.wcfImageViewerSlideshowButtonFull { - bottom: 80px; - left: 50%; - top: auto; - - transform: translateX(-50%); - -ms-transform: translateX(-50%); - -webkit-transform: translateX(-50%); - - > span { - font-size: 32px; - left: 2px; - position: relative; - top: 10px; - } - } - - &.wcfImageViewerSlideshowButtonToggle, - &.wcfImageViewerSlideshowButtonEnlarge, - { - display: none; - } - } - } - } - - > footer { - > .wcfImageViewerButtonPrevious, - > .wcfImageViewerButtonNext { - display: none; - } - - > div { - margin: 0; - } - } - } - - > header, - > div, - > footer { - box-sizing: border-box; - -moz-box-sizing: border-box; - left: 0; - position: fixed; - right: 0; - z-index: 400; - } - - > header { - height: 100px; - overflow: hidden; - padding: 1rem; - top: 0; - - > div { - > h1, - > h2, - > h3 { - color: @wcfImageViewerFontColor; - margin-left: 80px !important; - - > a { - color: @wcfImageViewerFontColor; - } - } - - > h1 { - font-size: 1.75rem; - } - - > h2 { - font-size: 1.25rem; - } - - > h3 { - color: @wcfImageViewerFontColor; - font-size: .85rem; - margin-top: .25rem; - } - - > a > img { - height: 64px; - width: 64px; - } - } - - > .wcfImageViewerButtonClose { - opacity: .6; - position: absolute; - right: 26px; - top: 26px; - - .transition(opacity, .3s); - - &:hover { - opacity: 1; - } - } - } - - > div { - background-color: rgba(0, 0, 0, 1); - border-bottom: 1px solid @wcfImageViewerBorderColor; - border-top: 1px solid @wcfImageViewerBorderColor; - bottom: 100px; - top: 100px; - z-index: 401; - - .transition(~"top, bottom, border-color", .3s); - - &.loading:before { - content: @spinner; - margin: -24px 0 0 -24px; - left: 50%; - position: absolute; - top: 50%; - - color: @wcfColor; - display: inline-block; - font-family: FontAwesome; - font-weight: normal !important; - font-style: normal !important; - line-height: 1em; - text-align: center; - - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - - .textShadow(@wcfContentBackgroundColor); - - .icon48; - .icon-spinner; - } - - > img { - opacity: 0; - position: absolute; - top: 50%; - z-index: 10; - - .transition(opacity, .75s); - - &.animateTransformation { - transition: left .3s, margin-top .3s, height .3s, width .3s, opacity .75s; - -webkit-transition: left .3s, margin-top .3s, height .3s, width .3s, opacity .75s; - } - - &.active { - opacity: 1; - z-index: 20; - } - } - } - - &:not(.wcfImageViewerMobile) { - > header { - .transition(top, .3s); - } - - > footer { - .transition(bottom, .3s); - } - - > div { - cursor: pointer; - - > img, - > ul { - cursor: default; - } - - > ul { - background-color: rgba(0, 0, 0, 1); - border: 1px solid @wcfImageViewerBorderColor; - border-bottom-width: 0; - border-radius: 5px 5px 0 0; - bottom: 0; - display: inline-block; - left: 50%; - margin-left: -122px; - opacity: .4; - position: absolute; - z-index: 30; - - .transition(opacity, .5s); - - &:hover { - opacity: 1; - } - - > li { - display: inline-block; - opacity: .6; - - .transition(opacity, .5s); - - &.pointer > span.icon { - cursor: pointer; - } - - &.active, - &.pointer:hover { - opacity: 1; - } - - &.wcfImageViewerSlideshowButtonToggle > span, - &.wcfImageViewerSlideshowButtonEnlarge > span, - &.wcfImageViewerSlideshowButtonFull > span { - font-size: 28px; - - &:before { - left: 2px; - position: relative; - top: 9px; - } - } - - &.wcfImageViewerSlideshowButtonEnlarge, - &.wcfImageViewerSlideshowButtonFull { - border-left: 1px solid @wcfImageViewerBorderColor; - box-sizing: border-box; - } - - > span { - vertical-align: middle; - } - } - } - } - } - - > footer { - bottom: 0; - height: 100px; - padding: 10px; - - &:hover > div > ul > li > img { - filter: none; - -webkit-filter: none; - } - - > span { - bottom: 0; - font-size: 48px; - padding-top: 26px; - opacity: 0; - position: absolute; - top: 0; - width: 30px; - z-index: 2; - - .transition(opacity, .5s); - - &.pointer { - opacity: .6; - - &:hover { - opacity: 1; - } - } - - &.wcfImageViewerButtonPrevious { - left: 5px; - } - - &.wcfImageViewerButtonNext { - right: 5px; - } - } - - > div { - height: 80px; - margin: 0 35px; - overflow: hidden; - white-space: nowrap; - - > ul { - font-size: 0; - height: 80px; - z-index: 1; - - transition: margin-left cubic-bezier(.5, 1.595, .56, .98) .75s; - -webkit-transition: margin-left cubic-bezier(.5, 1.595, .56, .98) .75s; - - > li { - display: inline-block; - height: 80px; - opacity: .6; - position: relative; - width: 80px; - - .transition(opacity, .5s); - - &.active, - &:hover { - opacity: 1; - } - - &:not(:last-child) { - margin-right: 10px; - } - - &.active > img { - filter: none; - -webkit-filter: none; - } - - &.loading{ - &:before { - content: @spinner; - margin: -16px 0 0 -16px; - left: 50%; - position: absolute; - top: 50%; - z-index: -1; - - color: @wcfColor; - display: inline-block; - font-family: FontAwesome; - font-weight: normal !important; - font-style: normal !important; - line-height: 1em; - text-align: center; - - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - - .textShadow(@wcfContentBackgroundColor); - - .icon32; - .icon-spinner; - } - - > img { - opacity: 0; - } - } - - > img { - height: 80px; - opacity: 1; - width: 80px; - - .grayscale; - transition: filter .5s, opacity 1s; - -webkit-transition: -webkit-filter .5s, opacity 1s; - } - } - } - } - } -} - -@media only screen and (max-width: 800px) { - .wcfImageViewer { - > header { - height: 80px; - - > .wcfImageViewerButtonClose { - right: 16px; - top: 16px; - } - } - - > footer { - height: 80px; - - > div { - height: 60px; - - > ul { - height: 60px; - - > li { - height: 60px; - } - } - } - } - } -} diff --git a/wcfsetup/install/files/style/label.less b/wcfsetup/install/files/style/label.less deleted file mode 100644 index afb73cc782..0000000000 --- a/wcfsetup/install/files/style/label.less +++ /dev/null @@ -1,75 +0,0 @@ -/* #### Labels #### */ -/* label list */ -.labelList { - font-size: 0; - margin-bottom: -@wcfGapTiny; - - > li { - display: inline-block; - margin-bottom: @wcfGapTiny; - - &:not(:last-child) { - margin-right: @wcfGapTiny; - } - } -} - -.boxHeadline.labeledHeadline { - font-size: 0; - - > ul { - display: inline-block; - font-size: 1rem; - - &:not(:empty) { - margin-right: @wcfGapSmall; - } - } - - > ul.statusIcons { - > li { - display: inline-block; - } - } - - > ul.labelList { - position: relative; - top: -4px; - } -} - -.boxHeadline.labeledHeadline > h1, -.boxSubHeadline.labeledHeadline > h2 { - display: inline-block; - margin-right: @wcfGapSmall; -} - -/* ACP label list */ -#labelList { - .clearfix(); - - li { - float: left; - margin-right: 1%; - width: 30%; - - &.labelCustomClass { - position: relative; - - input[type='radio'] { - left: 0; - position: absolute; - top: 0; - } - - span { - display: block; - margin-left: 24px; - } - } - } -} - -.labelChooser > .dropdownToggle > span { - cursor: pointer; -} \ No newline at end of file diff --git a/wcfsetup/install/files/style/poll.less b/wcfsetup/install/files/style/poll.less deleted file mode 100644 index 0510b488a3..0000000000 --- a/wcfsetup/install/files/style/poll.less +++ /dev/null @@ -1,84 +0,0 @@ -#pollOptionContainer .sortableList { - padding: @wcfGapSmall 0; - - .sortableNode { - margin-top: @wcfGapSmall; - - .sortableButtonContainer > img { - cursor: pointer; - margin-right: @wcfGapMedium; - } - } -} - -.pollContainer { - float: left; - margin: 0 @wcfGapMedium @wcfGapSmall 0; - max-width: 50%; - min-width: 300px; - - > .formSubmit { - background-color: @wcfContainerAccentBackgroundColor; - border-top: 1px solid @wcfContainerBorderColor; - margin: @wcfGapMedium -@wcfGapLarge -@wcfGapMedium -@wcfGapLarge; - padding: 10px 0; - } -} - -.pollInnerContainer { - > p:first-of-type { - margin-top: @wcfGapSmall; - } -} - -.pollResultList { - li { - margin-bottom: 8px; - padding: 1px 0; - position: relative; - z-index: 0; - - .transition(background-color, .1s); - - &:last-child { - margin-bottom: 0px; - } - - &:hover { - background-color: @wcfContainerAccentBackgroundColor; - border-radius: 0 5px 5px 0; - } - - .pollMeter { - background-color: @wcfContainerHoverBackgroundColor; - border-radius: 0 5px 5px 0; - height: 100%; - left: 0; - position: absolute; - top: 0; - z-index: -1; - } - - .caption { - color: @wcfLinkColor; - padding: 2px 0; - - .optionName { - display: block; - padding: 0 3.5em 0 @wcfGapSmall; - } - - .relativeVotes { - position: absolute; - right: 7px; - top: 3px; - } - } - } -} - -@media only screen and (max-width: 800px) { - .pollContainer > .formSubmit { - margin: @wcfGapMedium -@wcfGapMedium -@wcfGapSmall -@wcfGapMedium; - } -} \ No newline at end of file diff --git a/wcfsetup/install/files/style/slideshow.less b/wcfsetup/install/files/style/slideshow.less deleted file mode 100644 index 1b851d539b..0000000000 --- a/wcfsetup/install/files/style/slideshow.less +++ /dev/null @@ -1,47 +0,0 @@ -.slideshowContainer { - overflow: hidden; - position: relative; - - > ul:not(.slideshowButtonList) > li:not(:first-child) { - display: none; - } - - > .slideshowItemList { - position: absolute; - - .transition(left, .8s, ease-out); - - > li.slideshowItem { - display: block; - float: left; - overflow: hidden; - position: absolute; - top: 0; - - /* fixes font rendering bug */ - -webkit-transform: translate3d(0, 0, 0); - } - } - - > .slideshowButtonList { - position: absolute; - right: 0; - top: 0; - - > li { - display: inline-block; - - > a > .icon { - color: @wcfContainerHoverBackgroundColor; - - &.active { - color: @wcfLinkColor; - } - } - - &:hover > a > .icon { - color: @wcfLinkHoverColor; - } - } - } -} \ No newline at end of file diff --git a/wcfsetup/install/files/style/tagging.less b/wcfsetup/install/files/style/tagging.less deleted file mode 100644 index fc5ade2ac8..0000000000 --- a/wcfsetup/install/files/style/tagging.less +++ /dev/null @@ -1,58 +0,0 @@ -.tagList { - > li { - display: inline-block; - } -} - -.tag { - border-radius: 0 4px 4px 0; - font-weight: normal; - height: 13px; - margin-left: 6px; - padding-bottom: 2px; - padding-left: 10px; - - &::before { - border-color: transparent @wcfColor transparent transparent; - border-style: inset solid inset inset; - border-width: 8px 8px 8px 0; - clip: rect(auto auto auto 2px); - content: ""; - height: 0; - left: -8px; - position: absolute; - top: 0; - width: 0; - } - - &::after { - background: @wcfContentBackgroundColor; - border-radius: 2px; - content: ""; - height: 4px; - left: -2px; - position: absolute; - top: 6px; - width: 4px; - - .boxShadow(0, -1px, rgba(0, 0, 0, .2), 2px); - } - - &:hover { - background-color: @wcfTabularBoxBackgroundColor; - color: @wcfTabularBoxColor; - - &::before { - border-right-color: @wcfTabularBoxBackgroundColor; - } - } -} - -.editableItemList li.tag { - margin-bottom: 11px; - margin-left: 10px; -} - -.editableItemList li.tag:first-child { - margin-left: 6px; -} diff --git a/wcfsetup/install/files/style/ui/poll.less b/wcfsetup/install/files/style/ui/poll.less deleted file mode 100644 index 423600a0d7..0000000000 --- a/wcfsetup/install/files/style/ui/poll.less +++ /dev/null @@ -1,88 +0,0 @@ -#pollOptionContainer .sortableList { - padding: @wcfGapSmall 0; - - .sortableNode { - margin-top: @wcfGapSmall; - - .sortableButtonContainer > img { - cursor: pointer; - margin-right: @wcfGapMedium; - } - } -} - -.pollContainer { - float: left; - margin: 0 15px 10px 0; - max-width: 50%; - min-width: 300px; - - > .formSubmit { - background-color: @wcfContainerAccentBackgroundColor; - border-top: 1px solid @wcfContainerBorderColor; - margin-top: 20px; - padding: 10px 0; - } -} - -.pollInnerContainer { - > dl { - flex-wrap: wrap; - } - - > p:first-of-type { - margin-top: @wcfGapSmall; - } -} - -.pollResultList { - li { - margin-bottom: 8px; - padding: 1px 0; - position: relative; - z-index: 0; - - .transition(background-color, .1s); - - &:last-child { - margin-bottom: 0px; - } - - &:hover { - background-color: @wcfContainerAccentBackgroundColor; - border-radius: 0 5px 5px 0; - } - - .pollMeter { - background-color: @wcfContainerHoverBackgroundColor; - border-radius: 0 5px 5px 0; - height: 100%; - left: 0; - position: absolute; - top: 0; - z-index: -1; - } - - .caption { - color: @wcfLinkColor; - padding: 2px 0; - - .optionName { - display: block; - padding: 0 3.5em 0 @wcfGapSmall; - } - - .relativeVotes { - position: absolute; - right: 7px; - top: 3px; - } - } - } -} - -@media only screen and (max-width: 800px) { - .pollContainer > .formSubmit { - margin: @wcfGapMedium -@wcfGapMedium -@wcfGapSmall -@wcfGapMedium; - } -} \ No newline at end of file diff --git a/wcfsetup/install/files/style/ui/table.less b/wcfsetup/install/files/style/ui/table.less deleted file mode 100644 index bbc5111265..0000000000 --- a/wcfsetup/install/files/style/ui/table.less +++ /dev/null @@ -1,216 +0,0 @@ -.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; - } - } - } -} diff --git a/wcfsetup/install/files/style/user.less b/wcfsetup/install/files/style/user.less deleted file mode 100644 index 8f20b11d3b..0000000000 --- a/wcfsetup/install/files/style/user.less +++ /dev/null @@ -1,383 +0,0 @@ -/* user profile sidebar */ -.sidebar { - .userAvatar { - text-align: center; - overflow: hidden; - - > a { - display: block; - } - } - - .userList > li > a { - font-size: @wcfSmallFontSize; - } -} - -.framedIconList { - li { - float: left; - margin: 0 2px 4px 0; - - .framed { - display: inline-block; - } - } - - &::after { - content: ""; - height: 0; - display: block; - clear: both; - } -} - -/* user information */ -.userInformation { - > .inlineDataList, - > .dataList { - font-size: @wcfSmallFontSize; - } - - > .dataList { - margin-top: 0; - } - - > .inlineDataList { - margin-top: @wcfGapSmall; - - ~ .inlineDataList { - margin-top: 0; - } - } - - > .containerHeadline + .inlineDataList { - margin-top: 0; - } - - > .containerHeadline > p { - margin-bottom: 2px; - } - - > .userFacts { - overflow: hidden; - } -} - -.userTitleBadge { - font-weight: normal; - max-width: 154px; - overflow: hidden; - text-overflow: ellipsis; -} - -.userProfilePreview { - position: relative; - - > .userInformation { - padding-bottom: 16px;// + @wcfGapTiny; - - > .userStats, - > .userFields { - margin-bottom: @wcfGapTiny+1; - padding-top: @wcfGapTiny+1; - border-top: 1px dotted @wcfContainerBorderColor; - } - - > .userFields { - padding-bottom: @wcfGapTiny+1; - border-bottom: 1px dotted @wcfContainerBorderColor; - } - - > .buttonGroupNavigation { - position: absolute; - bottom: 0; - right: 0; - } - } -} - -/* ##### User List #### */ -.userHeadline { - padding-right: 428px; - position: relative; - - > nav.buttonGroupNavigation { - position: absolute; - right: @wcfGapSmall; - top: @wcfGapSmall; - } - - > .dataList { - overflow: hidden; - } -} - -.letters { - > li { - margin-bottom: @wcfGapTiny; - - > .button { - min-width: 1.2em; - text-align: center; - } - } -} - -/* recent activities */ -.recentActivityList { - > li { - /* todo: remove with 2.2 */ - &.recentActivitiesMore { - text-align: center; - - > button { - padding-left: 30px; - padding-right: 30px; - } - - > small { - color: @wcfDimmedColor; - } - } - - > div.box48 > div { - overflow: hidden; - } - } -} - -.likeList { - > li:first-child { - padding-bottom: @wcfGapSmall; - text-align: right; - - &:hover { - background-color: @wcfContainerBackgroundColor; - } - - > ul.buttonGroup { - display: inline-block; - margin-bottom: @wcfGapSmall; - - &:not(:first-child) { - margin-left: @wcfGapTiny; - } - } - } -} - -@media only screen and (max-width: 800px) { - .likeList { - > li:first-child { - padding-bottom: 0; - } - } -} - -/* dashboard boxes */ -.dashboardBoxSidebarButton { - padding-bottom: @wcfGapLarge !important; - - > div { - text-align: center; - - > .button { - font-size: @wcfTitleFontSize; - padding: 5px 13px; - } - } -} - -.usersOnlineInfoBox { - .usersOnlineLegend { - margin-top: @wcfGapSmall; - - > p { - display: inline-block; - } - - > ul { - display: inline-block; - } - } -} - -@media only screen and (max-width: 800px) { - #tplUser .userHeadline { - overflow: visible; - padding-right: 30px; - - > .invisible { - display: block; - float: left; - } - - > *:not(.invisible) { - margin-left: 59px; - } - } -} - -/* avatar cropping */ -.userAvatarCrop { - cursor: pointer; -} - -#userAvatarCropSelection { - position: relative; - margin: 0 auto; -} - -#userAvatarCropOverlay { - background-color: #000000; - height: 100%; - opacity: 0.5; - position: absolute; - left: 0; - top: 0; - width: 100%; - z-index: 10; -} - -#userAvatarCropOverlaySelection { - cursor: move; - position: absolute; - left: 0; - top: 0; - height: 128px; - overflow: hidden; - width: 128px; - z-index: 20; -} - -/* 3rd party login */ -.buttonList.thirdPartyLogin { - text-align: center; -} - -.thirdPartyLoginButton { - border-radius: 3px; - border: 1px solid rgba(255, 255, 255, 0.1); - color: #fff; - display: inline-block; - font-size: 0; - - &:hover { - color: #fff; - text-decoration: none; - } - - > .icon { - border-right: 1px solid rgba(0, 0, 0, 0.1); - color: #fff; - text-shadow: none; - padding: 4px 6px; - } - - > span:not(.icon) { - font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; - font-size: 1rem; - padding: 4px 12px; - } - - &.googleLoginButton { - background-color: rgb(221, 75, 57); - - &:hover { - background-color: rgb(202, 53, 35); - } - } - - &.facebookLoginButton { - background-color: rgb(59, 89, 152); - - &:hover { - background-color: rgb(48, 72, 123); - } - } - - &.twitterLoginButton { - background-color: rgb(85, 172, 238); - - &:hover { - background-color: rgb(48, 154, 234); - } - } - - &.githubLoginButton { - background-color: rgb(68, 68, 68); - - &:hover { - background-color: rgb(48, 48, 48); - } - } -} - -/* user notifications */ -.userNotificationItemList > .notificationItem { - &.groupedNotificationItem > div > .framed > span.fa-users:before { - position: relative; - top: 3px; - } - - &.notificationUnconfirmed { - position: relative; - - > div > .details { - padding-right: 16px + @wcfGapLarge; - } - - > .notificationItemMarkAsConfirmed { - opacity: .6; - position: absolute; - right: @wcfGapLarge; - top: 50%; - - transform: translateY(-50%); - -ms-transform: translateY(-50%); - -webkit-transform: translateY(-50%); - - .transition(opacity, .3s, linear); - } - - &:hover > .notificationItemMarkAsConfirmed { - opacity: 1; - } - } - - > div > .details { - padding-top: 3px; - - .userLink { - font-weight: bold; - } - } -} - -/* user notification settings */ -#notificationSettings .notificationSettingsEmail { - &:not(.active) { - display: none; - } - - &.dropdownOpen > a { - opacity: 1; - } -} - -.dashboardBoxRecentActivityHeadline { - overflow: visible; - position: relative; - min-height: 30px; - - > nav.buttonGroupNavigation { - position: absolute; - right: 4px; - top: 2px; - } -} - -#aboutMe img { - max-width: 100%; -} \ No newline at end of file