thegamer/Cable-Desktop
2
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Harmonize x/close buttons

Browse source 
// FREEBIE
This commit is contained in:
lilia 2016-04-01 15:15:02 -07:00
parent 242c05834b
commit e5748b974f
4 changed files with 43 additions and 63 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
background.html
View file

@ -108,7 +108,7 @@
</script>
<script type='text/x-tmpl-mustache' id='attachment-preview'>
<img src='{{ source }}' class='preview' />
<div class='close'>x</div>
<div class='x close'></div>
</script>
<script type='text/x-tmpl-mustache' id='hasRetry'>
{{ messageNotSent }}
@ -331,7 +331,7 @@
<script type='text/x-tmpl-mustache' id='debug-log'>
<div class='content'>
<div>
<a class='x close'>&times;</a>
<a class='x close'></a>
<h1> {{ title }} </h1>
<p> {{ debugLogExplanation }}</p>
</div>
@ -348,7 +348,7 @@
</script>
<script type='text/x-tmpl-mustache' id='settings'>
<div class='content'>
<a class='x close'>&times;</a>
<a class='x close'></a>
<h3>{{ notifications }}</h3>
<p>{{ notificationSettingsDialog }}</p>
<div>

3
stylesheets/_conversation.scss
View file

@ -496,6 +496,9 @@
}
.close {
position: absolute;
top: 5px;
right: 2px;
background: #999;
&:hover {

48
stylesheets/_global.scss
View file

@ -169,23 +169,6 @@ button.back {
cursor: pointer;
z-index: 1;
}
.close {
font-family: sans-serif;
color: white;
position: absolute;
top: 5px;
right: 2px;
cursor: pointer;
border-radius: 50%;
width: 20px;
height: 20px;
padding: 0px;
background: #666;
color: #fff;
text-align: center;
}
}
.dropoff {
@ -487,23 +470,24 @@ $avatar-size: 44px;
overflow: auto;
box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.2);
}
}
a.x {
display: inline-block;
float: right;
cursor: pointer;
.x {
display: inline-block;
float: right;
cursor: pointer;
border-radius: 50%;
width: 22px;
height: 22px;
padding: 3px;
background: $grey;
font-family: sans-serif;
color: white;
border-radius: 50%;
width: 20px;
height: 20px;
padding: 0px;
background: #666;
color: #fff;
text-align: center;
font-size: 19px;
&:before {
content: '';
display: block;
width: 100%;
height: 100%;
@include color-svg('/images/x.svg', white);
}
}

49
stylesheets/manifest.css
View file

@ -172,20 +172,6 @@ button.back {
left: 0;
cursor: pointer;
z-index: 1; }
.file-input .close {
font-family: sans-serif;
color: white;
position: absolute;
top: 5px;
right: 2px;
cursor: pointer;
border-radius: 50%;
width: 20px;
height: 20px;
padding: 0px;
background: #666;
color: #fff;
text-align: center; }
.dropoff {
outline: solid 1px #2090ea; }
@ -412,20 +398,24 @@ img.emoji {
border-radius: 5px;
overflow: auto;
box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.2); }
.modal a.x {
display: inline-block;
float: right;
cursor: pointer;
font-family: sans-serif;
color: white;
border-radius: 50%;
width: 20px;
height: 20px;
padding: 0px;
background: #666;
color: #fff;
text-align: center;
font-size: 19px; }
.x {
display: inline-block;
float: right;
cursor: pointer;
border-radius: 50%;
width: 22px;
height: 22px;
padding: 3px;
background: #616161; }
.x:before {
content: '';
display: block;
width: 100%;
height: 100%;
-webkit-mask: url("/images/x.svg") no-repeat center;
-webkit-mask-size: 100%;
background-color: white; }
input[type=text]:active, input[type=text]:focus, input[type=search]:active, input[type=search]:focus, textarea:active, textarea:focus {
outline: 1px solid #2090ea; }
@ -1026,6 +1016,9 @@ input.search {
border-radius: 5px;
max-height: 100px; }
.bottom-bar .attachment-previews .close {
position: absolute;
top: 5px;
right: 2px;
background: #999; }
.bottom-bar .attachment-previews .close:hover {
background: #616161; }