Differential D12641 Diff 30358 webroot/rsrc/css/application/differential/phui-inline-comment.css

Changeset 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};
}		}