1
0
mirror of https://github.com/pattern-lab/patternlab-php.git synced 2025-01-17 22:29:12 +01:00

adding css styles for smarter annotations

This commit is contained in:
Dave Olsen 2014-01-25 13:11:07 -05:00
parent 52b527216f
commit 51984e001c
2 changed files with 28 additions and 43 deletions

View File

@ -515,34 +515,29 @@
.has-annotation {
cursor: help !important;
box-shadow: 0 0 10px gray;
position: relative !important;
overflow: visible !important; }
}
.has-annotation a, .has-annotation input {
cursor: help !important; }
.has-annotation:hover {
box-shadow: 0 0 10px #222222; }
.has-annotation.active {
box-shadow: inset 0 0 20px gray; }
.has-annotation .annotation-tip {
display: block !important; }
.annotation-tip {
position: absolute !important;
top: -2px !important;
left: -6px !important;
background: gray !important;
color: #dddddd !important;
opacity: 0.8 !important;
display: none !important;
font-size: 11px !important;
width: 18px !important;
height: 18px !important;
padding: 0 !important;
text-align: center !important;
border-radius: 10px !important; }
.annotation-tip:hover, .annotation-tip:focus {
opacity: 1 !important;
color: #fff !important; }
display: block;
position: absolute;
margin-top: -10px !important;
margin-left: -10px !important;
width: 25px !important;
height: 25px !important;
border-radius: 13px !important;
text-align: center !important;
background: #444 !important;
color: #fff !important;
font-weight: bold !important;
font-size: 16px !important;
z-index: 100;
}
#sg-comments-container {
max-width: 60em;

View File

@ -717,8 +717,6 @@ $animate-quick: 0.2s;
.has-annotation {
cursor: help !important;
box-shadow: 0 0 10px $sg-secondary;
position: relative !important;
overflow: visible !important;
a, input {
cursor: help !important;
@ -731,31 +729,23 @@ $animate-quick: 0.2s;
&.active {
box-shadow: inset 0 0 20px $sg-secondary;
}
.annotation-tip {
display: block !important;
}
}
.annotation-tip {
position: absolute !important;
top: -2px !important;
left: -6px !important;
background: $sg-secondary !important;
color: $sg-tertiary !important;
opacity: 0.8 !important;
display: none !important;
font-size: 11px !important;
width: 18px !important;
height: 18px !important;
padding: 0 !important;
display: block;
position: absolute;
margin-top: -10px !important;
margin-left: -10px !important;
width: 25px !important;
height: 25px !important;
border-radius: 13px !important;
text-align: center !important;
border-radius: 10px !important;
&:hover, &:focus {
opacity: 1 !important;
color: #fff !important;
}
background: #444 !important;
color: #fff !important;
font-weight: bold !important;
font-size: 16px !important;
z-index: 100;
}
#sg-comments-container {