From eae37267a5dd88233af8c8d93b1f9c8d80dc4757 Mon Sep 17 00:00:00 2001 From: Cesar G Date: Thu, 20 Mar 2014 02:33:19 -0700 Subject: [ticket/12265] Simplify contact icon design and move to dropdown. PHPBB3-12265 --- phpBB/styles/prosilver/theme/buttons.css | 55 ++++++++++++++++----- phpBB/styles/prosilver/theme/colours.css | 23 ++++----- phpBB/styles/prosilver/theme/content.css | 4 ++ phpBB/styles/prosilver/theme/en/stylesheet.css | 6 --- .../prosilver/theme/images/icon_contact_aim.gif | Bin 546 -> 0 bytes .../prosilver/theme/images/icon_contact_email.gif | Bin 523 -> 0 bytes .../prosilver/theme/images/icon_contact_icq.gif | Bin 562 -> 0 bytes .../prosilver/theme/images/icon_contact_jabber.gif | Bin 1014 -> 0 bytes .../prosilver/theme/images/icon_contact_msnm.gif | Bin 1466 -> 0 bytes .../prosilver/theme/images/icon_contact_www.gif | Bin 590 -> 0 bytes .../prosilver/theme/images/icon_contact_yahoo.gif | Bin 541 -> 0 bytes .../prosilver/theme/images/icons_contact.png | Bin 0 -> 8507 bytes 12 files changed, 56 insertions(+), 32 deletions(-) delete mode 100644 phpBB/styles/prosilver/theme/images/icon_contact_aim.gif delete mode 100644 phpBB/styles/prosilver/theme/images/icon_contact_email.gif delete mode 100644 phpBB/styles/prosilver/theme/images/icon_contact_icq.gif delete mode 100644 phpBB/styles/prosilver/theme/images/icon_contact_jabber.gif delete mode 100644 phpBB/styles/prosilver/theme/images/icon_contact_msnm.gif delete mode 100644 phpBB/styles/prosilver/theme/images/icon_contact_www.gif delete mode 100644 phpBB/styles/prosilver/theme/images/icon_contact_yahoo.gif create mode 100644 phpBB/styles/prosilver/theme/images/icons_contact.png (limited to 'phpBB/styles/prosilver/theme') diff --git a/phpBB/styles/prosilver/theme/buttons.css b/phpBB/styles/prosilver/theme/buttons.css index 93c325e416..7f271ee648 100644 --- a/phpBB/styles/prosilver/theme/buttons.css +++ b/phpBB/styles/prosilver/theme/buttons.css @@ -235,20 +235,49 @@ ul.profile-icons.responsive a.responsive-menu-link:before { max-width: 40%; } +.contact-icons.dropdown-contents { + min-width: 0; + padding: 0; +} + +.contact-icon { + background-repeat: no-repeat; + display: block; + height: 16px; + width: 16px; +} +.contact-icons a { + border-bottom: 1px dotted; + border-right: 1px dotted; + display: block; + float: left; + padding: 8px; +} + +.contact-icons div:last-child a { + border-bottom: none; +} + +.contact-icons .last-cell { + border-right: none; +} + + /* Profile & navigation icons */ -.email-icon, .email-icon a { background: none top left no-repeat; } -.aim-icon, .aim-icon a { background: none top left no-repeat; } -.phpbb_aol-icon, .phpbb_aol-icon a { background: none top left no-repeat; } -.yahoo-icon, .yahoo-icon a { background: none top left no-repeat; } -.phpbb_yahoo-icon, .phpbb_yahoo-icon a { background: none top left no-repeat; } -.web-icon, .web-icon a { background: none top left no-repeat; } -.phpbb_website-icon, .phpbb_website-icon a { background: none top left no-repeat; } -.msnm-icon, .msnm-icon a { background: none top left no-repeat; } -.phpbb_wlm-icon, .phpbb_wlm-icon a { background: none top left no-repeat; } -.icq-icon, .icq-icon a { background: none top left no-repeat; } -.phpbb_icq-icon, .phpbb_icq-icon a { background: none top left no-repeat; } -.jabber-icon, .jabber-icon a { background: none top left no-repeat; } -.pm-icon, .pm-icon a { background: none top left no-repeat; } +.pm-icon { background-position: 0 0; } +.email-icon { background-position: -21px 0; } +.jabber-icon { background-position: -82px 0; } +.phpbb_icq-icon { background-position: -61px 0 ; } +.phpbb_wlm-icon { background-position: -182px 0; } +.phpbb_aol-icon { background-position: -245px 0; } +.phpbb_website-icon { background-position: -40px 0; } +.phpbb_youtube-icon { background-position: -98px 0; } +.phpbb_facebook-icon { background-position: -119px 0; } +.phpbb_google_plus-icon { background-position: -140px 0; } +.phpbb_skype-icon { background-position: -161px 0; } +.phpbb_twitter-icon { background-position: -203px 0; } +.phpbb_yahoo-icon { background-position: -224px 0; } + .quote-icon, .quote-icon a { background: none top left no-repeat; } /* Moderator icons */ diff --git a/phpBB/styles/prosilver/theme/colours.css b/phpBB/styles/prosilver/theme/colours.css index 5f6ca4929c..bf47546b22 100644 --- a/phpBB/styles/prosilver/theme/colours.css +++ b/phpBB/styles/prosilver/theme/colours.css @@ -718,6 +718,14 @@ a.sendemail { background-image: url("images/buttons.png"); } +.contact-icons a { + border-color: #DCDCDC; +} + +.contact-icons a:hover { + background-color: #F2F6F9; +} + /* Icon images ---------------------------------------- */ .icon-faq { background-image: url("./images/icon_faq.gif"); } @@ -738,19 +746,8 @@ a.sendemail { .icon-mark { background-image: url("./images/icon_mark.gif"); } /* Profile & navigation icons */ -.email-icon, .email-icon a { background-image: url("./images/icon_contact_email.gif"); } -.phpbb_aol-icon, .phpbb_aol-icon a { background-image: url("./images/icon_contact_aim.gif"); } -.aim-icon, .aim-icon a { background-image: url("./images/icon_contact_aim.gif"); } -.yahoo-icon, .yahoo-icon a { background-image: url("./images/icon_contact_yahoo.gif"); } -.phpbb_yahoo-icon, .phpbb_yahoo-icon a { background-image: url("./images/icon_contact_yahoo.gif"); } -.web-icon, .web-icon a { background-image: url("./images/icon_contact_www.gif"); } -.phpbb_website-icon, .phpbb_website-icon a { background-image: url("./images/icon_contact_www.gif"); } -.msnm-icon, .msnm-icon a { background-image: url("./images/icon_contact_msnm.gif"); } -.phpbb_wlm-icon, .phpbb_wlm-icon a { background-image: url("./images/icon_contact_msnm.gif"); } -.icq-icon, .icq-icon a { background-image: url("./images/icon_contact_icq.gif"); } -.phpbb_icq-icon, .phpbb_icq-icon a { background-image: url("./images/icon_contact_icq.gif"); } -.jabber-icon, .jabber-icon a { background-image: url("./images/icon_contact_jabber.gif"); } -.pm-icon, .pm-icon a { background-image: url("./en/icon_contact_pm.gif"); } +.contact-icon { background-image: url("./images/icons_contact.png"); } + .quote-icon, .quote-icon a { background-image: url("./en/icon_post_quote.gif"); } ul.profile-icons.responsive a.responsive-menu-link { background-image: url("./images/icon_post_menu.png"); } diff --git a/phpBB/styles/prosilver/theme/content.css b/phpBB/styles/prosilver/theme/content.css index d27fb81fee..6d39e675ce 100644 --- a/phpBB/styles/prosilver/theme/content.css +++ b/phpBB/styles/prosilver/theme/content.css @@ -731,6 +731,10 @@ fieldset.polls dd div { height: auto !important; } +dd.profile-contact { + overflow: visible; +} + .online { background-image: none; background-position: 100% 0; diff --git a/phpBB/styles/prosilver/theme/en/stylesheet.css b/phpBB/styles/prosilver/theme/en/stylesheet.css index 82b7df0830..d8ca2558e5 100644 --- a/phpBB/styles/prosilver/theme/en/stylesheet.css +++ b/phpBB/styles/prosilver/theme/en/stylesheet.css @@ -7,16 +7,10 @@ ul.profile-icons li.edit-icon { width: 42px; height: 20px; } .online { background-image: url("./icon_user_online.gif"); } /* Icon images */ -.pm-icon, .pm-icon a { background-image: url("./icon_contact_pm.gif"); } .quote-icon, .quote-icon a { background-image: url("./icon_post_quote.gif"); } .edit-icon, .edit-icon a { background-image: url("./icon_post_edit.gif"); } /* EN Language Pack */ -.imageset.icon_contact_pm { - background-image: url("./icon_contact_pm.gif"); - padding-left: 28px; - padding-top: 20px; -} .imageset.icon_post_edit { background-image: url("./icon_post_edit.gif"); padding-left: 42px; diff --git a/phpBB/styles/prosilver/theme/images/icon_contact_aim.gif b/phpBB/styles/prosilver/theme/images/icon_contact_aim.gif deleted file mode 100644 index be039fcde2..0000000000 Binary files a/phpBB/styles/prosilver/theme/images/icon_contact_aim.gif and /dev/null differ diff --git a/phpBB/styles/prosilver/theme/images/icon_contact_email.gif b/phpBB/styles/prosilver/theme/images/icon_contact_email.gif deleted file mode 100644 index caa3683005..0000000000 Binary files a/phpBB/styles/prosilver/theme/images/icon_contact_email.gif and /dev/null differ diff --git a/phpBB/styles/prosilver/theme/images/icon_contact_icq.gif b/phpBB/styles/prosilver/theme/images/icon_contact_icq.gif deleted file mode 100644 index 48a09373eb..0000000000 Binary files a/phpBB/styles/prosilver/theme/images/icon_contact_icq.gif and /dev/null differ diff --git a/phpBB/styles/prosilver/theme/images/icon_contact_jabber.gif b/phpBB/styles/prosilver/theme/images/icon_contact_jabber.gif deleted file mode 100644 index e335433e97..0000000000 Binary files a/phpBB/styles/prosilver/theme/images/icon_contact_jabber.gif and /dev/null differ diff --git a/phpBB/styles/prosilver/theme/images/icon_contact_msnm.gif b/phpBB/styles/prosilver/theme/images/icon_contact_msnm.gif deleted file mode 100644 index e25469c3a5..0000000000 Binary files a/phpBB/styles/prosilver/theme/images/icon_contact_msnm.gif and /dev/null differ diff --git a/phpBB/styles/prosilver/theme/images/icon_contact_www.gif b/phpBB/styles/prosilver/theme/images/icon_contact_www.gif deleted file mode 100644 index 83cee9728d..0000000000 Binary files a/phpBB/styles/prosilver/theme/images/icon_contact_www.gif and /dev/null differ diff --git a/phpBB/styles/prosilver/theme/images/icon_contact_yahoo.gif b/phpBB/styles/prosilver/theme/images/icon_contact_yahoo.gif deleted file mode 100644 index 305f297fdb..0000000000 Binary files a/phpBB/styles/prosilver/theme/images/icon_contact_yahoo.gif and /dev/null differ diff --git a/phpBB/styles/prosilver/theme/images/icons_contact.png b/phpBB/styles/prosilver/theme/images/icons_contact.png new file mode 100644 index 0000000000..f84abd36a5 Binary files /dev/null and b/phpBB/styles/prosilver/theme/images/icons_contact.png differ -- cgit v1.2.1 From df8832455d48a8dd741c5d62f62071562b6615b4 Mon Sep 17 00:00:00 2001 From: Cesar G Date: Tue, 8 Apr 2014 04:48:57 -0700 Subject: [ticket/12265] Remove ugly logic. PHPBB3-12265 --- phpBB/styles/prosilver/theme/buttons.css | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) (limited to 'phpBB/styles/prosilver/theme') diff --git a/phpBB/styles/prosilver/theme/buttons.css b/phpBB/styles/prosilver/theme/buttons.css index 7f271ee648..b17903c958 100644 --- a/phpBB/styles/prosilver/theme/buttons.css +++ b/phpBB/styles/prosilver/theme/buttons.css @@ -254,12 +254,16 @@ ul.profile-icons.responsive a.responsive-menu-link:before { padding: 8px; } -.contact-icons div:last-child a { - border-bottom: none; +.contact-icons a:nth-child(4) { + border-right: none; } -.contact-icons .last-cell { - border-right: none; +.contact-icons a:nth-child(5) { + clear: left; +} + +.contact-icons div:last-child a { + border-bottom: none; } -- cgit v1.2.1 From ec145419eddce662e0afe050f14f0f690ecf40e2 Mon Sep 17 00:00:00 2001 From: Cesar G Date: Thu, 10 Apr 2014 05:18:57 -0700 Subject: [ticket/12265] Fix issue with dropdown being restricted by the width of parent PHPBB3-12265 --- phpBB/styles/prosilver/theme/common.css | 3 +++ 1 file changed, 3 insertions(+) (limited to 'phpBB/styles/prosilver/theme') diff --git a/phpBB/styles/prosilver/theme/common.css b/phpBB/styles/prosilver/theme/common.css index 298d310ab1..8f32decd19 100644 --- a/phpBB/styles/prosilver/theme/common.css +++ b/phpBB/styles/prosilver/theme/common.css @@ -470,6 +470,7 @@ ul.linklist.bulletin li.no-bulletin:before { border: 1px solid transparent; border-radius: 5px; padding: 9px 0 0; + margin-right: -500px; } .dropdown-container.topic-tools { @@ -485,6 +486,8 @@ ul.linklist.bulletin li.no-bulletin:before { .dropdown-left .dropdown, .nojs .rightside .dropdown { left: auto; right: 0; + margin-left: -500px; + margin-right: 0; } .dropdown-button-control .dropdown { -- cgit v1.2.1 From 11dd010f84044d8533a5eff387c2b57f62b4298f Mon Sep 17 00:00:00 2001 From: Cesar G Date: Thu, 10 Apr 2014 05:58:20 -0700 Subject: [ticket/12265] Add contact icon and remove border from last row & cells. PHPBB3-12265 --- phpBB/styles/prosilver/theme/buttons.css | 6 +----- phpBB/styles/prosilver/theme/content.css | 9 +++++++++ phpBB/styles/prosilver/theme/images/icon_contact.png | Bin 0 -> 340 bytes phpBB/styles/prosilver/theme/imageset.css | 11 ++++++----- 4 files changed, 16 insertions(+), 10 deletions(-) create mode 100644 phpBB/styles/prosilver/theme/images/icon_contact.png (limited to 'phpBB/styles/prosilver/theme') diff --git a/phpBB/styles/prosilver/theme/buttons.css b/phpBB/styles/prosilver/theme/buttons.css index b17903c958..4a243392ee 100644 --- a/phpBB/styles/prosilver/theme/buttons.css +++ b/phpBB/styles/prosilver/theme/buttons.css @@ -254,14 +254,10 @@ ul.profile-icons.responsive a.responsive-menu-link:before { padding: 8px; } -.contact-icons a:nth-child(4) { +.contact-icons .last-cell { border-right: none; } -.contact-icons a:nth-child(5) { - clear: left; -} - .contact-icons div:last-child a { border-bottom: none; } diff --git a/phpBB/styles/prosilver/theme/content.css b/phpBB/styles/prosilver/theme/content.css index 6d39e675ce..998b139262 100644 --- a/phpBB/styles/prosilver/theme/content.css +++ b/phpBB/styles/prosilver/theme/content.css @@ -735,6 +735,15 @@ dd.profile-contact { overflow: visible; } +.profile-contact .dropdown-container { + display: inline-block; + width: 30px; +} + +.profile-contact .icon_contact { + vertical-align: middle; +} + .online { background-image: none; background-position: 100% 0; diff --git a/phpBB/styles/prosilver/theme/images/icon_contact.png b/phpBB/styles/prosilver/theme/images/icon_contact.png new file mode 100644 index 0000000000..04e4d9ad17 Binary files /dev/null and b/phpBB/styles/prosilver/theme/images/icon_contact.png differ diff --git a/phpBB/styles/prosilver/theme/imageset.css b/phpBB/styles/prosilver/theme/imageset.css index e6d306c7fd..6bc345889e 100644 --- a/phpBB/styles/prosilver/theme/imageset.css +++ b/phpBB/styles/prosilver/theme/imageset.css @@ -356,13 +356,14 @@ span.imageset { padding-top: 20px; } +.imageset.icon_contact { + background-image: url("./images/icon_contact.png"); + padding-left: 16px; + padding-top: 12px; +} + /* English images for fallback */ -.imageset.icon_contact_pm { - background-image: url("./en/icon_contact_pm.gif"); - padding-left: 28px; - padding-top: 20px; -} .imageset.icon_post_edit { background-image: url("./en/icon_post_edit.gif"); padding-left: 42px; -- cgit v1.2.1 From b9f9c33199773b1ef51a0e20a044a320e1c029ea Mon Sep 17 00:00:00 2001 From: Cesar G Date: Fri, 11 Apr 2014 10:19:25 -0700 Subject: [ticket/12265] Ensure that there's only 4 icons per row in IE & Opera. PHPBB3-12265 --- phpBB/styles/prosilver/theme/buttons.css | 4 ++++ 1 file changed, 4 insertions(+) (limited to 'phpBB/styles/prosilver/theme') diff --git a/phpBB/styles/prosilver/theme/buttons.css b/phpBB/styles/prosilver/theme/buttons.css index 4a243392ee..b5c44d00de 100644 --- a/phpBB/styles/prosilver/theme/buttons.css +++ b/phpBB/styles/prosilver/theme/buttons.css @@ -262,6 +262,10 @@ ul.profile-icons.responsive a.responsive-menu-link:before { border-bottom: none; } +.contact-icons div { + clear: left; +} + /* Profile & navigation icons */ .pm-icon { background-position: 0 0; } -- cgit v1.2.1 From 89532ebbbe03245c186084780e49bdaf0b4a79ea Mon Sep 17 00:00:00 2001 From: Cesar G Date: Fri, 11 Apr 2014 10:40:49 -0700 Subject: [ticket/12265] Adjust alignment of AIM and Jabber icons. PHPBB3-12265 --- phpBB/styles/prosilver/theme/buttons.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'phpBB/styles/prosilver/theme') diff --git a/phpBB/styles/prosilver/theme/buttons.css b/phpBB/styles/prosilver/theme/buttons.css index b5c44d00de..e523daf55b 100644 --- a/phpBB/styles/prosilver/theme/buttons.css +++ b/phpBB/styles/prosilver/theme/buttons.css @@ -270,10 +270,10 @@ ul.profile-icons.responsive a.responsive-menu-link:before { /* Profile & navigation icons */ .pm-icon { background-position: 0 0; } .email-icon { background-position: -21px 0; } -.jabber-icon { background-position: -82px 0; } +.jabber-icon { background-position: -80px 0; } .phpbb_icq-icon { background-position: -61px 0 ; } .phpbb_wlm-icon { background-position: -182px 0; } -.phpbb_aol-icon { background-position: -245px 0; } +.phpbb_aol-icon { background-position: -244px 0; } .phpbb_website-icon { background-position: -40px 0; } .phpbb_youtube-icon { background-position: -98px 0; } .phpbb_facebook-icon { background-position: -119px 0; } -- cgit v1.2.1 From 05dec34917a057a4f28894869e5d3872d0ea1f3b Mon Sep 17 00:00:00 2001 From: Cesar G Date: Tue, 15 Apr 2014 09:00:14 -0700 Subject: [ticket/12265] Ensure that dropdown is always at the very left of the container PHPBB3-12265 --- phpBB/styles/prosilver/theme/content.css | 1 + 1 file changed, 1 insertion(+) (limited to 'phpBB/styles/prosilver/theme') diff --git a/phpBB/styles/prosilver/theme/content.css b/phpBB/styles/prosilver/theme/content.css index 998b139262..dc6ab9aef3 100644 --- a/phpBB/styles/prosilver/theme/content.css +++ b/phpBB/styles/prosilver/theme/content.css @@ -737,6 +737,7 @@ dd.profile-contact { .profile-contact .dropdown-container { display: inline-block; + text-align: left; width: 30px; } -- cgit v1.2.1