SamanthaNguyen has uploaded a new change for review. (
https://gerrit.wikimedia.org/r/401109 )
Change subject: Split off profile form and tab styles from UserProfile.css into
their own modules
......................................................................
Split off profile form and tab styles from UserProfile.css into their own
modules
This introduces 2 new ResourceLoader modules, representing styles for
profile forms and special profile tab styles respectively. This helps reduces
the overhead on UserProfile.css.
Module names:
- ext.socialprofile.special.updateprofile.css
- ext.socialprofile.userprofile.tabs.css
The profile form styles are also loaded on Special:EditProfile (despite
the slightly different name of the special page). The name isn't much to
worry about right now since there'll be a future refactoring patch to merge
the functionality of Special:EditProfile into Special:UpdateProfile anyways.
Change-Id: Iad1b5203697a0c8353ad67c0c9a87f0f63247a8d
---
A UserProfile/ProfileTabs.css
M UserProfile/SpecialEditProfile.php
A UserProfile/SpecialUpdateProfile.css
M UserProfile/SpecialUpdateProfile.php
M UserProfile/SpecialUploadAvatar.php
M UserProfile/UserProfile.css
M UserProfile/UserProfile.php
7 files changed, 267 insertions(+), 248 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/SocialProfile
refs/changes/09/401109/1
diff --git a/UserProfile/ProfileTabs.css b/UserProfile/ProfileTabs.css
new file mode 100644
index 0000000..a241d22
--- /dev/null
+++ b/UserProfile/ProfileTabs.css
@@ -0,0 +1,45 @@
+.profile-tab-bar {
+ margin-top: 20px;
+}
+
+.profile-tab {
+ background-color: #68bd46;
+ text-align: center;
+ height: 22px;
+ min-width: 72px;
+ float: left;
+ padding: 6px 5px 0 5px;
+ margin: 0 5px 0 0;
+}
+
+.profile-tab-on {
+ background-color: #466c2c;
+ float: left;
+ height: 22px;
+ color: #fff;
+ font-size: 12px;
+ min-width: 72px;
+ font-weight: 700;
+ padding: 6px 5px 0 5px;
+ margin: 0 5px 0 0;
+ text-align: center;
+}
+
+.profile-tab-on a,
+.profile-tab a {
+ color: #fff;
+ font-weight: 400;
+ text-decoration: none;
+}
+
+.profile-tab a:hover {
+ color: #466C2C;
+}
+
+.profile-tab a:visited {
+ color: #fff !important;
+}
+
+.profile-tab-on a:visited {
+ color: #fff !important;
+}
\ No newline at end of file
diff --git a/UserProfile/SpecialEditProfile.php
b/UserProfile/SpecialEditProfile.php
index b4d68a2..c407cf8 100644
--- a/UserProfile/SpecialEditProfile.php
+++ b/UserProfile/SpecialEditProfile.php
@@ -55,9 +55,10 @@
}
// Add CSS & JS
- $out->addModuleStyles( array(
- 'ext.socialprofile.userprofile.css'
- ) );
+ $out->addModuleStyles( [
+ 'ext.socialprofile.userprofile.tabs.css',
+ 'ext.socialprofile.special.updateprofile.css'
+ ] );
$out->addModules( 'ext.userProfile.updateProfile' );
// Get the user's name from the wpUser URL parameter
diff --git a/UserProfile/SpecialUpdateProfile.css
b/UserProfile/SpecialUpdateProfile.css
new file mode 100644
index 0000000..6b84d5a
--- /dev/null
+++ b/UserProfile/SpecialUpdateProfile.css
@@ -0,0 +1,186 @@
+.firstHeading {
+ border-bottom: none;
+ margin: 0 !important;
+ display: none;
+}
+
+.profile-info {
+ padding: 25px 0;
+}
+
+.profile-update {
+ padding: 0;
+}
+
+.profile-update-button {
+ background-color: #78ba5d;
+ border: 1px solid #6b6b6b;
+ color: #fff;
+ font-size: 13px;
+ padding: 3px;
+}
+
+.profile-update-title {
+ color: #333;
+ font-size: 16px;
+ font-weight: 700;
+ margin: 0 0 5px 0 !important;
+}
+
+.profile-update-title img {
+ vertical-align: middle;
+ margin: -3px 0 0 5px;
+}
+
+.profile-update-unit-left {
+ color: #797979;
+ font-size: 12px;
+ font-weight: 700;
+ float: left;
+ width: 150px;
+}
+
+.profile-update-unit {
+ float: left;
+ width: 450px;
+}
+
+.profile-update-unit-small {
+ color: #797979;
+ font-size: 10px;
+ float: left;
+ width: 450px;
+}
+
+.profile-update-row {
+ color: #797979;
+ font-weight: 700;
+ font-size: 12px;
+}
+
+.profile-update-links {
+ margin: 0 0 10px 0;
+ font-weight: 700;
+}
+
+.profile-update-links a {
+ text-decoration: none;
+}
+
+.profile-status {
+ background-color: #fffb9b;
+ font-weight: 700;
+ padding: 0 5px 0 5px;
+}
+
+.profile-on {
+ background-color: #fffb9b;
+ border: 1px solid #fdc745;
+ font-weight: 700;
+ padding: 1px 5px 1px 5px;
+}
+
+/* The text "Message type" on the left side of the message type selector on
profile page */
+.profile-board-message-type {
+ color: #797979;
+}
+
+/* Responsive stuff for mobile devices */
+@media screen and (max-width: 750px) {
+ /* Special:UpdateProfile & Special:EditProfile */
+ .mw-special-EditProfile textarea,
+ .mw-special-UpdateProfile textarea {
+ min-width: 60%;
+ max-width: 100%;
+ }
+ div.profile-tab {
+ /**
+ * I don't like how the tabs' texts are off-center, but this
+ * is still better than nothing
+ */
+ margin-bottom: 10px;
+ }
+}
+
+@media screen and (max-width: 750px) and (orientation: portrait) {
+ .mw-special-EditProfile textarea,
+ .mw-special-UpdateProfile textarea {
+ width: 30% !important;
+ }
+}
+
+/* Privacy */
+.mw-special-UpdateProfile div#mw-content-text .visualClear {
+ height: 20px;
+}
+
+.eye-container {
+ width: 130px;
+ height: 20px;
+ /* @embed */
+ background: #a3c2d5 url(../images/eye.png) 0 0 no-repeat;
+ border-radius: 4px;
+ opacity: 0.5;
+ overflow: hidden;
+ position: relative;
+ top: -25px;
+ cursor: pointer;
+ box-shadow: 2px 2px 3px -1px darkgray;
+}
+
+/** @todo FIXME: this is an awful hack for Special:UpdateProfile (the
"personal information" page) */
+div.eye-container[fieldkey="up_real_name"],
+div.eye-container[fieldkey="up_email"],
+div.eye-container[fieldkey="up_location_city"],
+div.eye-container[fieldkey="up_hometown_country"],
+div.eye-container[fieldkey="up_birthday"] {
+ top: 5px;
+}
+
+div.eye-container[fieldkey="up_hometown_city"],
+div.eye-container[fieldkey="up_location_country"] {
+ top: 10px;
+}
+
+.eye-container:hover {
+ opacity: 1.0;
+}
+
+.eye-container .title {
+ font-size: 12px;
+ font-weight: 700;
+ color: #fff;
+ padding: 0 0 0 25px;
+}
+
+.eye-container .menu {
+ padding: 10px 0 10px 0;
+}
+
+.eye-container .menu .item {
+ /* @embed */
+ background: #a3c2d5 url(../images/eye-bw.png) 5px 1px no-repeat;
+ color: #fff;
+ height: 18px;
+ font-size: 12px;
+ font-weight: 700;
+ padding: 0 0 0 30px;
+ margin: 4px 0 4px 0;
+}
+
+.eye-container .menu .item:hover {
+ background-color: #fff;
+ box-shadow: 1px 1px 1px -1px #000;
+ color: #a3c2d5;
+}
+
+/*
+.profile-info-other-info .eye-container,.profile-info-custom-info
.eye-container,
+#profile-update-personal-aboutme .eye-container,
+#profile-update-personal-work .eye-container,
+#profile-update-personal-education .eye-container,
+#profile-update-personal-places .eye-container,
+#profile-update-personal-web .eye-container {
+ top: -35px !important;
+}
+*/
\ No newline at end of file
diff --git a/UserProfile/SpecialUpdateProfile.php
b/UserProfile/SpecialUpdateProfile.php
index 9cdb2af..45d8620 100644
--- a/UserProfile/SpecialUpdateProfile.php
+++ b/UserProfile/SpecialUpdateProfile.php
@@ -152,10 +152,11 @@
}
// Add CSS & JS
- $out->addModuleStyles( array(
+ $out->addModuleStyles( [
'ext.socialprofile.clearfix',
- 'ext.socialprofile.userprofile.css'
- ) );
+ 'ext.socialprofile.userprofile.tabs.css',
+ 'ext.socialprofile.special.updateprofile.css'
+ ] );
$out->addModules( 'ext.userProfile.updateProfile' );
if ( $request->wasPosted() ) {
diff --git a/UserProfile/SpecialUploadAvatar.php
b/UserProfile/SpecialUploadAvatar.php
index cefd354..74a39b8 100644
--- a/UserProfile/SpecialUploadAvatar.php
+++ b/UserProfile/SpecialUploadAvatar.php
@@ -47,7 +47,7 @@
// Add CSS
$out->addModuleStyles( [
- 'ext.socialprofile.userprofile.css',
+ 'ext.socialprofile.userprofile.tabs.css',
'ext.socialprofile.special.uploadavatar.css'
] );
diff --git a/UserProfile/UserProfile.css b/UserProfile/UserProfile.css
index 97f333e..94ce95c 100644
--- a/UserProfile/UserProfile.css
+++ b/UserProfile/UserProfile.css
@@ -88,6 +88,19 @@
position: relative;
}
+#profile-toggle-button {
+ background-color: #ffa500;
+ top: 5px;
+ right: 0;
+ padding: 2px 10px;
+ position: absolute;
+}
+
+#profile-toggle-button a {
+ color: #fff;
+ font-weight: 700;
+}
+
#profile-title-container {
padding: 0 0 6px 6px;
}
@@ -493,244 +506,3 @@
font-size: 9px;
text-decoration: none;
}
-
-/* Update Profile */
-.profile-info {
- padding: 25px 0;
-}
-
-.profile-update {
- padding: 0;
-}
-
-.profile-tab-bar {
- margin-top: 20px;
-}
-
-.profile-tab {
- background-color: #68bd46;
- text-align: center;
- height: 22px;
- min-width: 72px;
- float: left;
- padding: 6px 5px 0 5px;
- margin: 0 5px 0 0;
-}
-
-.profile-tab-on {
- background-color: #466c2c;
- float: left;
- height: 22px;
- color: #fff;
- font-size: 12px;
- min-width: 72px;
- font-weight: 700;
- padding: 6px 5px 0 5px;
- margin: 0 5px 0 0;
- text-align: center;
-}
-
-.profile-tab-on a,
-.profile-tab a {
- color: #fff;
- font-weight: 400;
- text-decoration: none;
-}
-
-.profile-tab a:hover {
- color: #466C2C;
-}
-
-.profile-tab a:visited {
- color: #fff !important;
-}
-
-.profile-tab-on a:visited {
- color: #fff !important;
-}
-
-.profile-update-button {
- background-color: #78ba5d;
- border: 1px solid #6b6b6b;
- color: #fff;
- font-size: 13px;
- padding: 3px;
-}
-
-.profile-update-title {
- color: #333;
- font-size: 16px;
- font-weight: 700;
- margin: 0 0 5px 0 !important;
-}
-
-.profile-update-title img {
- vertical-align: middle;
- margin: -3px 0 0 5px;
-}
-
-.profile-update-unit-left {
- color: #797979;
- font-size: 12px;
- font-weight: 700;
- float: left;
- width: 150px;
-}
-
-.profile-update-unit {
- float: left;
- width: 450px;
-}
-
-.profile-update-unit-small {
- color: #797979;
- font-size: 10px;
- float: left;
- width: 450px;
-}
-
-.profile-update-row {
- color: #797979;
- font-weight: 700;
- font-size: 12px;
-}
-
-.profile-update-links {
- margin: 0 0 10px 0;
- font-weight: 700;
-}
-
-.profile-update-links a {
- text-decoration: none;
-}
-
-.profile-status {
- background-color: #fffb9b;
- font-weight: 700;
- padding: 0 5px 0 5px;
-}
-
-.profile-on {
- background-color: #fffb9b;
- border: 1px solid #fdc745;
- font-weight: 700;
- padding: 1px 5px 1px 5px;
-}
-
-#profile-toggle-button {
- background-color: #ffa500;
- top: 5px;
- right: 0;
- padding: 2px 10px;
- position: absolute;
-}
-
-#profile-toggle-button a {
- color: #fff;
- font-weight: 700;
-}
-
-/* The text "Message type" on the left side of the message type selector on
profile page */
-.profile-board-message-type {
- color: #797979;
-}
-
-/* Responsive stuff for mobile devices */
-@media screen and (max-width: 750px) {
- /* Special:UpdateProfile & Special:EditProfile */
- .mw-special-EditProfile textarea,
- .mw-special-UpdateProfile textarea {
- min-width: 60%;
- max-width: 100%;
- }
- div.profile-tab {
- /**
- * I don't like how the tabs' texts are off-center, but this
- * is still better than nothing
- */
- margin-bottom: 10px;
- }
-}
-
-@media screen and (max-width: 750px) and (orientation: portrait) {
- .mw-special-EditProfile textarea,
- .mw-special-UpdateProfile textarea {
- width: 30% !important;
- }
-}
-
-/* Privacy */
-.mw-special-UpdateProfile div#mw-content-text .visualClear {
- height: 20px;
-}
-
-.eye-container {
- width: 130px;
- height: 20px;
- /* @embed */
- background: #a3c2d5 url(../images/eye.png) 0 0 no-repeat;
- border-radius: 4px;
- opacity: 0.5;
- overflow: hidden;
- position: relative;
- top: -25px;
- cursor: pointer;
- box-shadow: 2px 2px 3px -1px darkgray;
-}
-
-/** @todo FIXME: this is an awful hack for Special:UpdateProfile (the
"personal information" page) */
-div.eye-container[fieldkey="up_real_name"],
-div.eye-container[fieldkey="up_email"],
-div.eye-container[fieldkey="up_location_city"],
-div.eye-container[fieldkey="up_hometown_country"],
-div.eye-container[fieldkey="up_birthday"] {
- top: 5px;
-}
-
-div.eye-container[fieldkey="up_hometown_city"],
-div.eye-container[fieldkey="up_location_country"] {
- top: 10px;
-}
-
-.eye-container:hover {
- opacity: 1.0;
-}
-
-.eye-container .title {
- font-size: 12px;
- font-weight: 700;
- color: #fff;
- padding: 0 0 0 25px;
-}
-
-.eye-container .menu {
- padding: 10px 0 10px 0;
-}
-
-.eye-container .menu .item {
- /* @embed */
- background: #a3c2d5 url(../images/eye-bw.png) 5px 1px no-repeat;
- color: #fff;
- height: 18px;
- font-size: 12px;
- font-weight: 700;
- padding: 0 0 0 30px;
- margin: 4px 0 4px 0;
-}
-
-.eye-container .menu .item:hover {
- background-color: #fff;
- box-shadow: 1px 1px 1px -1px #000;
- color: #a3c2d5;
-}
-
-/*
-.profile-info-other-info .eye-container,.profile-info-custom-info
.eye-container,
-#profile-update-personal-aboutme .eye-container,
-#profile-update-personal-work .eye-container,
-#profile-update-personal-education .eye-container,
-#profile-update-personal-places .eye-container,
-#profile-update-personal-web .eye-container {
- top: -35px !important;
-}
-*/
diff --git a/UserProfile/UserProfile.php b/UserProfile/UserProfile.php
index 6e6eb48..914a8d2 100644
--- a/UserProfile/UserProfile.php
+++ b/UserProfile/UserProfile.php
@@ -103,6 +103,13 @@
'position' => 'top'
);
+$wgResourceModules['ext.socialprofile.userprofile.tabs.css'] = array(
+ 'styles' => 'ProfileTabs.css',
+ 'localBasePath' => __DIR__,
+ 'remoteExtPath' => 'SocialProfile/UserProfile',
+ 'position' => 'top'
+);
+
$wgResourceModules['ext.socialprofile.special.uploadavatar.css'] = array(
'styles' => 'SpecialUploadAvatar.css',
'localBasePath' => __DIR__,
@@ -110,6 +117,13 @@
'position' => 'top'
);
+$wgResourceModules['ext.socialprofile.special.updateprofile.css'] = array(
+ 'styles' => 'SpecialUpdateProfile.css',
+ 'localBasePath' => __DIR__,
+ 'remoteExtPath' => 'SocialProfile/UserProfile',
+ 'position' => 'top'
+);
+
# Add new log types for profile edits and avatar uploads
global $wgLogTypes, $wgLogNames, $wgLogHeaders, $wgLogActions;
$wgLogTypes[] = 'profile';
--
To view, visit https://gerrit.wikimedia.org/r/401109
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: Iad1b5203697a0c8353ad67c0c9a87f0f63247a8d
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/SocialProfile
Gerrit-Branch: master
Gerrit-Owner: SamanthaNguyen <samanthanguyen1...@gmail.com>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
