@recaptime-dev's working patches + fork for Phorge, a community fork of Phabricator. (Upstream dev and stable branches are at upstream/main and upstream/stable respectively.)
hq.recaptime.dev/wiki/Phorge
phorge
phabricator
Minor visual updates to applications.
Summary: Cleaned up spacing, added active state, tightened up radii.
Test Plan: Review in browser
Reviewers: epriestley, btrahan
Reviewed By: btrahan
CC: aran, Korvin
Differential Revision: https://secure.phabricator.com/D4129
+22
-16
+1
-1
src/__celerity_resource_map__.php
+1
-1
src/__celerity_resource_map__.php
···
2383
2383
),
2384
2384
'phabricator-application-launch-view-css' =>
2385
2385
array(
2386
-
'uri' => '/res/e33ff570/rsrc/css/application/base/phabricator-application-launch-view.css',
2386
+
'uri' => '/res/464720b1/rsrc/css/application/base/phabricator-application-launch-view.css',
2387
2387
'type' => 'css',
2388
2388
'requires' =>
2389
2389
array(
+21
-15
webroot/rsrc/css/application/base/phabricator-application-launch-view.css
+21
-15
webroot/rsrc/css/application/base/phabricator-application-launch-view.css
···
11
11
12
12
/* On desktops, put some space around the whole grid. */
13
13
.device-desktop .phabricator-application-list {
14
-
padding: .5em;
14
+
padding: 0 0 20px 20px;
15
15
}
16
16
17
17
/* On tablets, show two columns in the center. */
···
30
30
31
31
a.phabricator-application-launch-container {
32
32
display: inline-block;
33
-
width: 200px;
33
+
width: 220px;
34
34
min-height: 90px;
35
-
padding: 5px 15px 5px 90px;
35
+
padding: 12px 15px 10px 75px;
36
36
margin: 3px 6px;
37
37
overflow: hidden;
38
38
position: relative;
39
39
40
40
text-decoration: none;
41
-
border: 1px solid #737373;
41
+
border: 1px solid #a7a8aa;
42
42
background-color: #f3f3f3;
43
43
44
-
border-radius: 4px;
45
-
box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.10),
46
-
inset -1px -1px 2px rgba(0, 0, 0, 0.15);
44
+
border-radius: 3px;
45
+
box-shadow: 0px 1px 2px #ccc;
47
46
}
48
47
49
48
a.phabricator-application-launch-container:hover {
50
49
text-decoration: none;
51
50
}
52
51
52
+
a.phabricator-application-launch-container:active {
53
+
box-shadow: inset 0 0px 3px rgba(0, 0, 0, 0.9);
54
+
}
55
+
53
56
/* The hover effect looks awful on phones/tablets when scrolling. */
54
57
.device-desktop a.phabricator-application-launch-container:hover {
55
-
background-color: #3875d7;
56
-
border-color: #223366;
57
-
color: #eeeeee;
58
+
background-color: #638ed3;
59
+
border-color: #0a1d59;
60
+
color: #fff;
58
61
}
59
62
60
63
.phabricator-application-launch-name,
···
66
69
.phabricator-application-launch-icon {
67
70
display: block;
68
71
position: absolute;
69
-
left: 15px;
72
+
left: 10px;
70
73
top: 10px;
71
74
width: 56px;
72
75
height: 56px;
···
75
78
76
79
.phabricator-application-launch-name {
77
80
font-weight: bold;
81
+
font-size: 14px;
82
+
padding-bottom: 2px
78
83
}
79
84
80
85
.phabricator-application-launch-description {
81
-
color: #666666;
86
+
color: #888;
87
+
font-size: 12px
82
88
}
83
89
84
90
.device-desktop a.phabricator-application-launch-container:hover
···
133
139
}
134
140
135
141
.phabricator-application-status-type-needs {
136
-
background-image: url(/rsrc/image/appstatus_needs.png);
142
+
background-image: url(/res/2c1e193b/rsrc/image/appstatus_needs.png);
137
143
}
138
144
139
145
.phabricator-application-status-type-empty {
140
-
background-image: url(/rsrc/image/appstatus_empty.png);
146
+
background-image: url(/res/2f8102e0/rsrc/image/appstatus_empty.png);
141
147
}
142
148
143
149
.phabricator-application-status-type-info {
144
-
background-image: url(/rsrc/image/appstatus_info.png);
150
+
background-image: url(/res/407de6da/rsrc/image/appstatus_info.png);
145
151
}