From c42c4ff2937211c7a761bdf02cb916b09b0c7fa0 Mon Sep 17 00:00:00 2001 From: Luzifr Date: Wed, 12 Oct 2011 21:43:44 +0200 Subject: [PATCH] Package Standalone List Design (not finished) Improved the package standalone listing; Some new icons; Brought back small buttons; Some other small improvements. --- wcfsetup/install/files/acp/style/style.css | 111 +++++++++++++++++- .../files/acp/templates/packageList.tpl | 88 +++++++------- .../files/acp/templates/userGroupAdd.tpl | 10 +- wcfsetup/install/files/icon/info1.svg | 71 +++++++++++ wcfsetup/install/files/icon/wcfIcon1.svg | 47 ++++++++ wcfsetup/install/lang/de.xml | 2 +- 6 files changed, 275 insertions(+), 54 deletions(-) create mode 100644 wcfsetup/install/files/icon/info1.svg create mode 100644 wcfsetup/install/files/icon/wcfIcon1.svg diff --git a/wcfsetup/install/files/acp/style/style.css b/wcfsetup/install/files/acp/style/style.css index 78e5aa048f..cd52b8d9fa 100644 --- a/wcfsetup/install/files/acp/style/style.css +++ b/wcfsetup/install/files/acp/style/style.css @@ -2303,6 +2303,7 @@ input[type='reset'], input[type='submit'], input[type='button'], .largeButtons ul li a, +.smallButtons > li > a, .badgeButton, .pageNavigation ul li:not(.children), .clipboardEditor > ul > li, @@ -2321,7 +2322,7 @@ input[type='button'], background-image: -ms-linear-gradient(rgba(255, 255, 255, 1), rgba(245, 245, 245, 1) 2px, rgba(235, 235, 235, 1)); background-image: -o-linear-gradient(rgba(255, 255, 255, 1), rgba(245, 245, 245, 1) 2px, rgba(235, 235, 235, 1)); background-image: linear-gradient(rgba(255, 255, 255, 1), rgba(245, 245, 245, 1) 2px, rgba(235, 235, 235, 1)); - + -webkit-transition: all .1s linear; -moz-transition: all .1s linear; -ms-transition: all .1s linear; @@ -2336,6 +2337,7 @@ input[type='submit']:hover, input[type='button']:hover, input[type='button'].default:hover, .largeButtons ul li a:hover, +.smallButtons > li > a:hover, .badgeButton:hover, .pageNavigation ul li:not(.disabled):hover, .clipboardEditor > ul > li:hover, @@ -2360,6 +2362,7 @@ input[type='submit']:focus, input[type='button']:focus, input[type='button'].default:focus, .largeButtons ul li a:focus, +.smallButtons > li > a:focus, .badgeButton:focus, .pageNavigation ul li:not(.disabled):active, .clipboardEditor > ul > li:focus, @@ -2369,6 +2372,7 @@ input[type='submit']:active, input[type='button']:active, input[type='button'].default:active, .largeButtons ul li a:active, +.smallButtons > li > a:active, .badgeButton:active, .pageNavigation ul li:not(.disabled):focus, .clipboardEditor > ul > li:active, @@ -2439,7 +2443,8 @@ input[type='button'].default:active, input[type='submit'], input[type='button'].default, -.largeButtons ul li.default a { +.largeButtons ul li.default a, +.smallButtons > li.default > a { color: #69c; border-width: 1px; border-style: solid; @@ -2536,7 +2541,8 @@ input[type='button'].default, input[type='submit']:hover, input[type='button'].default:hover, -.largeButtons ul li.default a:hover { +.largeButtons ul li.default a:hover, +.smallButtons > li.default > a:hover { -webkit-box-shadow: 0 0 10px #fa2; -moz-box-shadow: 0 0 10px #fa2; -ms-box-shadow: 0 0 10px #fa2; @@ -2624,7 +2630,8 @@ input[type='button'].default:focus, .largeButtons ul li.default a:focus, input[type='submit']:active, input[type='button'].default:active, -.largeButtons ul li.default a:active { +.largeButtons ul li.default a:active, +.smallButtons > li.default > a:active { -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, .1); -moz-box-shadow: inset 0 1px 3px rgba(0, 0, 0, .1); -ms-box-shadow: inset 0 1px 3px rgba(0, 0, 0, .1); @@ -2666,7 +2673,8 @@ input[type='button'].default:active, input[disabled='disabled'], input[type='button'][disabled='disabled'], -.largeButtons ul li.disabled a { +.largeButtons ul li.disabled a, +.smallButtons > li.disabled > a { color: #999; cursor: default; border-width: 1px; @@ -2846,8 +2854,99 @@ div.scrollableContainer > div:first-child p { position: absolute; } + + + + + + + +/* ############## Package List ############## */ + +/* -- -- -- Package Standalone -- -- -- */ + +/* Globals */ + +.infoPackageStandalone { + position: relative; + padding-bottom: 0; +} + +.infoPackageStandalone .packageStandaloneIcon { + position: absolute; + top: 30px; + left: 25px; + width: 96px; + height: 96px; +} + +.infoPackageStandalone section { + margin-left: 30px; +} + +/* Navigation */ + +.infoPackageStandalone footer { + position: relative; + right: -15px; +} + +.infoPackageStandalone footer nav { + text-align: right; + opacity: 0; - + -webkit-transition: all .2s linear; + -moz-transition: all .2s linear; + -ms-transition: all .2s linear; + -o-transition: all .2s linear; + transition: all .2s linear; +} + +.infoPackageStandalone:hover footer nav { + opacity: 1; +} + +.infoPackageStandalone footer nav ul.smallButtons { + list-style-type: none; + display: inline-block; + margin-right: -1px; + margin-bottom: -1px; +} + +.infoPackageStandalone footer nav ul.smallButtons > li { + float: left; + position: relative; + margin-left: -1px; +} + +.infoPackageStandalone footer nav ul.smallButtons > li > a { + text-decoration: none; + white-space: nowrap; + padding: 3px 7px; + overflow: hidden; +} + +.infoPackageStandalone footer nav ul.smallButtons > li.separator > a { + border-right: 1px dotted #bcd; +} + +.infoPackageStandalone footer nav ul.smallButtons > li:first-child > a { + border-top-left-radius: 13px; +} + +.infoPackageStandalone footer nav ul.smallButtons > li:last-child > a { + border-bottom-right-radius: 7px; +} + +.infoPackageStandalone footer nav ul.smallButtons > li > a img { + border: 0 !important; + vertical-align: middle; +} + + + + + diff --git a/wcfsetup/install/files/acp/templates/packageList.tpl b/wcfsetup/install/files/acp/templates/packageList.tpl index 9de4a0649f..970135bf0d 100644 --- a/wcfsetup/install/files/acp/templates/packageList.tpl +++ b/wcfsetup/install/files/acp/templates/packageList.tpl @@ -29,67 +29,71 @@ {if $plugins|count}
  • plugins
    • {/if} - + - + {hascontent} {/hascontent} diff --git a/wcfsetup/install/files/acp/templates/userGroupAdd.tpl b/wcfsetup/install/files/acp/templates/userGroupAdd.tpl index 38d083fa96..a94c72aba0 100644 --- a/wcfsetup/install/files/acp/templates/userGroupAdd.tpl +++ b/wcfsetup/install/files/acp/templates/userGroupAdd.tpl @@ -65,7 +65,7 @@ {if $additionalFields|isset}{@$additionalFields}{/if} - + {if $additionalFieldSets|isset}{@$additionalFieldSets}{/if}
    @@ -86,18 +86,18 @@ {/foreach} - + {foreach from=$categoryLevel1[categories] item=categoryLevel2} {/foreach}
    diff --git a/wcfsetup/install/files/icon/info1.svg b/wcfsetup/install/files/icon/info1.svg new file mode 100644 index 0000000000..b367b14bc5 --- /dev/null +++ b/wcfsetup/install/files/icon/info1.svg @@ -0,0 +1,71 @@ + + + + + + Info + Info Icon (outlined) + + + + + + + + + + + + + + + + + + diff --git a/wcfsetup/install/files/icon/wcfIcon1.svg b/wcfsetup/install/files/icon/wcfIcon1.svg new file mode 100644 index 0000000000..f9c8481f92 --- /dev/null +++ b/wcfsetup/install/files/icon/wcfIcon1.svg @@ -0,0 +1,47 @@ + + + + + + WCF-Icon + WCF-Icon Icon + + + + + + + + + + + + diff --git a/wcfsetup/install/lang/de.xml b/wcfsetup/install/lang/de.xml index eb39bf6b57..a45706968b 100644 --- a/wcfsetup/install/lang/de.xml +++ b/wcfsetup/install/lang/de.xml @@ -44,7 +44,7 @@ - + groupName}« wirklich löschen?]]> -- 2.20.1