Changeset View
Changeset View
Standalone View
Standalone View
webroot/rsrc/css/application/differential/phui-inline-comment.css
Show First 20 Lines • Show All 144 Lines • ▼ Show 20 Lines | |||||
.differential-inline-comment.inline-comment-ghost | .differential-inline-comment.inline-comment-ghost | ||||
.differential-inline-comment-head { | .differential-inline-comment-head { | ||||
border-bottom: 1px solid {$lightgreyborder}; | border-bottom: 1px solid {$lightgreyborder}; | ||||
background-color: {$lightgreybackground}; | background-color: {$lightgreybackground}; | ||||
} | } | ||||
.differential-inline-comment.inline-comment-ghost | .differential-inline-comment.inline-comment-ghost | ||||
.button.simple { | .button.simple .phui-icon-view { | ||||
border-color: {$lightgreyborder}; | color: {$lightgreytext}; | ||||
} | } | ||||
.differential-inline-comment.inline-comment-ghost | /* - New/Edit Inline Comment -------------------------------------------------- | ||||
.button.simple .phui-icon-view { | |||||
Styles for when you are creating or editing an inline comment. | |||||
*/ | |||||
.differential-inline-comment .done-label { | |||||
display: inline-block; | |||||
color: {$sh-yellowicon}; | |||||
padding: 4px; | |||||
} | |||||
.differential-inline-comment.inline-state-is-draft .done-label, | |||||
.differential-inline-comment.inline-comment-ghost .done-label { | |||||
color: {$lightgreytext}; | color: {$lightgreytext}; | ||||
} | } | ||||
/* - New/Edit Inline Comment -------------------------------------------------- | /* - New/Edit Inline Comment -------------------------------------------------- | ||||
Styles for when you are creating or editing an inline comment. | Styles for when you are creating or editing an inline comment. | ||||
*/ | */ | ||||
▲ Show 20 Lines • Show All 67 Lines • ▼ Show 20 Lines | |||||
.differential-inline-comment .button.simple .phui-icon-view { | .differential-inline-comment .button.simple .phui-icon-view { | ||||
color: {$sh-yellowicon}; | color: {$sh-yellowicon}; | ||||
} | } | ||||
.differential-inline-comment.inline-state-is-draft | .differential-inline-comment.inline-state-is-draft | ||||
.differential-inline-done-label, | .differential-inline-done-label, | ||||
.differential-inline-comment.inline-state-is-draft | .differential-inline-comment.inline-state-is-draft | ||||
.button.simple, | |||||
.differential-inline-comment.inline-comment-ghost | |||||
.button.simple { | .button.simple { | ||||
border-color: {$lightgreyborder}; | border-color: {$lightgreyborder}; | ||||
color: {$lightgreytext}; | color: {$lightgreytext}; | ||||
} | } | ||||
.differential-inline-comment.inline-state-is-draft | .differential-inline-comment.inline-state-is-draft | ||||
.button.simple .phui-icon-view { | .button.simple .phui-icon-view { | ||||
color: {$lightgreytext}; | color: {$lightgreytext}; | ||||
Show All 9 Lines | /* - Done Button -------------------------------------------------------------- | ||||
Default colors, hovers, checked styles for the Done Button. | Default colors, hovers, checked styles for the Done Button. | ||||
*/ | */ | ||||
.differential-inline-done-label { | .differential-inline-done-label { | ||||
border: 1px solid {$sh-yellowborder}; | border: 1px solid {$sh-yellowborder}; | ||||
border-radius: 3px; | border-radius: 3px; | ||||
display: inline-block; | display: inline-block; | ||||
overflow: hidden; | |||||
margin-left: 8px; | |||||
padding: 3px 8px 4px; | padding: 3px 8px 4px; | ||||
cursor: pointer; | cursor: pointer; | ||||
} | } | ||||
.differential-inline-done-label .differential-inline-done { | .differential-inline-done-label .differential-inline-done { | ||||
margin: 0 6px 0 0; | margin: 0 6px 0 0; | ||||
display: inline; | display: inline; | ||||
cursor: pointer; | cursor: pointer; | ||||
Show All 17 Lines | |||||
} | } | ||||
.device-desktop .differential-inline-comment.inline-is-done | .device-desktop .differential-inline-comment.inline-is-done | ||||
.differential-inline-done-label:hover { | .differential-inline-done-label:hover { | ||||
background-color: #fff; | background-color: #fff; | ||||
color: {$sky}; | color: {$sky}; | ||||
} | } | ||||
.device-desktop .differential-inline-comment.inline-state-is-draft | |||||
.differential-inline-comment-head .button.simple.button-not-done:hover { | |||||
color: {$lightgreytext}; | |||||
background-color: transparent; | |||||
border-color: {$lightgreyborder}; | |||||
cursor: auto; | |||||
} | |||||
.device-desktop .differential-inline-comment .differential-inline-comment-head | |||||
.simple.button.button-not-done:hover { | |||||
color: {$sh-yellowicon}; | |||||
background-color: transparent; | |||||
border-color: {$sh-yellowborder}; | |||||
cursor: auto; | |||||
} | |||||
.differential-inline-comment.inline-is-done .differential-inline-comment-head | |||||
.button.simple.button-done { | |||||
background-color: #fff; | |||||
color: {$sky}; | |||||
border-color: {$sky}; | |||||
cursor: auto; | |||||
} | |||||
.differential-inline-comment.inline-is-done .differential-inline-comment-head | .differential-inline-comment.inline-is-done .differential-inline-comment-head | ||||
.button.simple.button-done .phui-icon-view { | .button-done { | ||||
color: {$sky}; | color: {$sky}; | ||||
} | } | ||||
/* - Inline Is Done ----------------------------------------------------------- | /* - Inline Is Done ----------------------------------------------------------- | ||||
Is Done for Diff Author = grey, for Diff Viewer = yellow. | Is Done for Diff Author = grey, for Diff Viewer = yellow. | ||||
▲ Show 20 Lines • Show All 73 Lines • ▼ Show 20 Lines | |||||
/* - Spooky Ghost UI ----------------------------------------------------------- | /* - Spooky Ghost UI ----------------------------------------------------------- | ||||
Hide your codez. | Hide your codez. | ||||
*/ | */ | ||||
.inline-comment-ghost .differential-inline-comment-head { | .inline-comment-ghost .differential-inline-comment-head { | ||||
padding-left: 40px; | padding-left: 40px; | ||||
padding-bottom: 0; | |||||
} | |||||
.inline-comment-ghost .inline-head-left { | |||||
padding: 4px 0; | |||||
} | } | ||||
.ghost-icon { | .ghost-icon { | ||||
background: {$darkgreybackground}; | background: {$darkgreybackground}; | ||||
float: left; | float: left; | ||||
margin-right: 8px; | margin-right: 8px; | ||||
padding: 2px 4px 1px 2px; | padding: 2px 4px 2px 2px; | ||||
position: absolute; | position: absolute; | ||||
top: 0; | top: 0; | ||||
left: 0; | left: 0; | ||||
} | } | ||||
.ghost-icon .phui-icon-view { | .ghost-icon .phui-icon-view { | ||||
padding: 7px; | padding: 7px; | ||||
font-size: 15px; | font-size: 15px; | ||||
Show All 20 Lines | |||||
.differential-inline-comment.inline-comment-ghost.ghost-is-expanded | .differential-inline-comment.inline-comment-ghost.ghost-is-expanded | ||||
.differential-inline-comment-head { | .differential-inline-comment-head { | ||||
border-bottom-color: {$thinblueborder}; | border-bottom-color: {$thinblueborder}; | ||||
position: relative; | position: relative; | ||||
} | } | ||||
.differential-inline-comment.inline-comment-ghost | .differential-inline-comment.inline-comment-ghost | ||||
.differential-inline-done-label { | .differential-inline-done-label, | ||||
.differential-inline-comment.inline-comment-ghost { | |||||
border-color: {$lightgreyborder}; | border-color: {$lightgreyborder}; | ||||
color: {$lightgreytext}; | color: {$lightgreytext}; | ||||
} | } |