From: Marcel Werk Date: Mon, 12 Sep 2016 16:43:56 +0000 (+0200) Subject: Fixed multiple issues in style preview X-Git-Tag: 3.0.0_Beta_1~202 X-Git-Url: https://git.stricted.de/?a=commitdiff_plain;h=0aabd40b1b0b846b06910f5a49572ddb103d8e78;p=GitHub%2FWoltLab%2FWCF.git Fixed multiple issues in style preview --- diff --git a/wcfsetup/install/files/acp/style/acpStyleEditor.css b/wcfsetup/install/files/acp/style/acpStyleEditor.css index ce56a86cb0..ffd777782d 100644 --- a/wcfsetup/install/files/acp/style/acpStyleEditor.css +++ b/wcfsetup/install/files/acp/style/acpStyleEditor.css @@ -5,23 +5,21 @@ .spBoundary { margin: 0 40px; } /* ### header ### */ -#spHeader > .spBoundary { display: flex; flex-wrap: wrap; padding: 15px 0; } +#spHeader > .spBoundary { display: flex; flex-wrap: wrap; padding: 30px 0; } #spLogo { flex: 0 0 50%; } #spLogo > img { height: 40px; } #spSearch { flex: 0 0 50%; } -#spSearchBox { border: 1px solid #fff; } -#spMenu { flex: 0 0 50%; } +#spSearchBox { border-width: 0; } #spUser { flex: 0 0 50%; } -#spLogo, #spSearch, #spMenu, #spUser { align-items: center; display: flex; } +#spLogo, #spSearch { align-items: center; display: flex; } #spSearch, #spUser { justify-content: flex-end; } /* ### menu ### */ -#spMenu > ol > li:not(:last-child) { margin-right: 10px; } -#spMenu > ol > li > a { font-size: 14px; font-weight: 400; padding: 2px 7px; } -#spMenu > ol > li.active > a { font-weight: 600; } -#spMenu > ol > li.active > a::after { content: "\f0d7"; display: inline-block; font-family: FontAwesome; margin-left: 5px; } -#spMenu > ol > li.active { position: relative; } -#spSubMenu { border-bottom: 1px solid #fff; box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, .2); margin-top: 3px; padding: 3px 0; position: absolute; } +#spHeaderPanel ol.inlineList > li { margin-right: 0; } +#spHeaderPanel ol.inlineList > li > a { align-items: center; display: flex; font-size: 14px; font-weight: 400; height: 50px; padding: 0 15px; } +#spHeaderPanel ol.inlineList > li.active > a::after { content: "\f107"; display: inline-block; font-family: FontAwesome; margin-left: 5px; } +#spHeaderPanel ol.inlineList > li.active { position: relative; } +#spSubMenu { border-bottom: 1px solid #fff; box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, .2); padding: 3px 0; position: absolute; } #spSubMenu > li > a { display: block; padding: 5px 20px; white-space: nowrap; width: 120px; } /* ### navigation ### */ @@ -44,9 +42,10 @@ /* ### button ### */ #spButton .button.disabled, #spButtonPrimary .button.disabled { cursor: default; } +#spButtonPrimary { margin-top: 10px; } /* ### dropdown ### */ -#spDropdown { display: inline-block; float: none; position: relative; } +#spDropdown { display: inline-block; float: none; position: relative; visibility: visible; } /* ### footer box ### */ #spFooterBox > .spBoundary { display: flex; justify-content: space-between; padding: 15px 0; } @@ -75,6 +74,7 @@ .spSidebarBox.pointer { position: relative; } .spSidebarBox.pointer::before { border: 10px solid transparent; border-right-color: rgb(217, 237, 247); content: ""; display: block; left: -20px; position: absolute; } .spColor { align-items: center; } +.spColor:not(:first-child) { margin-top: 5px; } .spColorBox { background-color: #fff; border: 1px solid #ccc; margin-right: 10px !important; padding: 1px; } .spColorBox > span { display: block; height: 24px; width: 24px; } .spVariable, .spDescription { display: block; font-size: 12px; } diff --git a/wcfsetup/install/files/acp/templates/styleAdd.tpl b/wcfsetup/install/files/acp/templates/styleAdd.tpl index ac2ffddd15..1a5a79a8d4 100644 --- a/wcfsetup/install/files/acp/templates/styleAdd.tpl +++ b/wcfsetup/install/files/acp/templates/styleAdd.tpl @@ -469,28 +469,32 @@ {* colors *}
-

TODO: outdated!

+
+
+
    +
  1. Lorem
    2. +
  2. Ipsum Dolor
    3. +
  3. Sit Amet
    4. +
  4. Consetetur
    5. + +
  5. + Sadipscing +
      +
    1. Lorem
      2. +
    2. Ipsum
      3. +
    3. Dolor Sit
      4. +
    +
    6. +
+
+
+
-
-
    -
  1. Lorem
    2. -
  2. Ipsum Dolor
    3. -
  3. - Sit Amet -
      -
    1. Lorem
      2. -
    2. Ipsum
      3. -
    3. Dolor Sit
      4. -
    -
    4. -
-
-
@@ -508,7 +512,7 @@
Lorem Ipsum
-

+

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
@@ -520,7 +524,7 @@
Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
-

+
Tabular Box
@@ -710,10 +714,11 @@ 'wcfHeaderSearchBoxPlaceholder': '#spSearchBox::-webkit-input-placeholder { color: VALUE; } __COMBO_RULE__ #spSearchBox::-moz-placeholder { color: VALUE; } __COMBO_RULE__ #spSearchBox:-ms-input-placeholder { color: VALUE; }', 'wcfHeaderSearchBoxBackgroundActive': '#spSearchBox:focus, #spSearchBox:hover { background-color: VALUE; }', 'wcfHeaderSearchBoxTextActive': '#spSearchBox:focus, #spSearchBox:hover { color: VALUE; }', - 'wcfHeaderMenuBackground': '#spMenu > ol > li > a { background-color: VALUE; }', - 'wcfHeaderMenuLink': '#spMenu > ol > li > a { color: VALUE; }', - 'wcfHeaderMenuBackgroundActive': '#spMenu > ol > li.active > a, #spMenu > ol > li > a:hover { background-color: VALUE; }', - 'wcfHeaderMenuLinkActive': '#spMenu > ol > li.active > a, #spMenu > ol > li > a:hover { color: VALUE; }', + 'wcfHeaderMenuBackground': '#spHeaderPanel { background-color: VALUE; }', + 'wcfHeaderMenuLinkBackground': '#spHeaderPanel ol.inlineList > li > a { background-color: VALUE; }', + 'wcfHeaderMenuLinkBackgroundActive': '#spHeaderPanel ol.inlineList > li.active > a, #spHeaderPanel ol.inlineList > li > a:hover { background-color: VALUE; }', + 'wcfHeaderMenuLink': '#spHeaderPanel ol.inlineList > li > a { color: VALUE; }', + 'wcfHeaderMenuLinkActive': '#spHeaderPanel ol.inlineList > li.active > a, #spHeaderPanel ol.inlineList > li > a:hover { color: VALUE; }', 'wcfHeaderMenuDropdownBackground': '#spSubMenu { background-color: VALUE; }', 'wcfHeaderMenuDropdownBorder': '#spSubMenu { border-color: VALUE; }', 'wcfHeaderMenuDropdownLink': '#spSubMenu li > a { color: VALUE; }', diff --git a/wcfsetup/install/files/lib/acp/form/StyleAddForm.class.php b/wcfsetup/install/files/lib/acp/form/StyleAddForm.class.php index 763cd1e555..180a5b009e 100644 --- a/wcfsetup/install/files/lib/acp/form/StyleAddForm.class.php +++ b/wcfsetup/install/files/lib/acp/form/StyleAddForm.class.php @@ -436,7 +436,7 @@ class StyleAddForm extends AbstractForm { $this->colors = [ 'wcfHeader' => ['background', 'text', 'link', 'linkActive'], 'wcfHeaderSearchBox' => ['background', 'text', 'placeholder', 'backgroundActive', 'textActive'], - 'wcfHeaderMenu' => ['background', 'link', 'linkActive'], + 'wcfHeaderMenu' => ['background', 'linkBackground', 'linkBackgroundActive', 'link', 'linkActive'], 'wcfHeaderMenuDropdown' => ['background', 'border', 'link', 'backgroundActive', 'linkActive'], 'wcfNavigation' => ['background', 'text', 'link', 'linkActive'], 'wcfSidebar' => ['background', 'text', 'link', 'linkActive'],