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

Harmonize border radii

Browse source 
// FREEBIE
This commit is contained in:
lilia 2016-04-01 14:24:13 -07:00
parent d4174b94f1
commit 6be7b765b2
5 changed files with 25 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
stylesheets/_conversation.scss
View file

@ -76,7 +76,7 @@
margin-bottom: 20px; margin-bottom: 20px;
background: $grey_l; background: $grey_l;
border: solid 1px $grey_l2; border: solid 1px $grey_l2;
border-radius: 5px; border-radius: $border-radius;
} }
.placeholder { .placeholder {
font-weight: bold; font-weight: bold;
@ -85,11 +85,11 @@
.message-detail { .message-detail {
.key-conflict-dialogue { .key-conflict-dialogue {
border-radius: 5px; border-radius: $border-radius;
margin: 20px 0; margin: 20px 0;
.header { .header {
border-radius: 5px 5px 0 0; border-radius: $border-radius $border-radius 0 0;
background: #F3F3A7; background: #F3F3A7;
margin: 0; margin: 0;
padding: 10px 20px padding: 10px 20px
@ -102,7 +102,7 @@
button.resolve { button.resolve {
outline: none; outline: none;
border: none; border: none;
border-radius: 5px; border-radius: $border-radius;
color: white; color: white;
font-weight: bold; font-weight: bold;
line-height: 36px; line-height: 36px;
@ -138,7 +138,7 @@
button { button {
border: none; border: none;
border-radius: 5px; border-radius: $border-radius;
color: white; color: white;
padding: 0.5em; padding: 0.5em;
font-weight: bold; font-weight: bold;
@ -174,7 +174,7 @@
position: absolute; position: absolute;
background: black; background: black;
color: white; color: white;
border-radius: 10px; border-radius: $border-radius;
padding: 0.5em; padding: 0.5em;
font-weight: normal; font-weight: normal;
bottom: calc(100% + 16px); bottom: calc(100% + 16px);
@ -253,7 +253,7 @@
display: inline-block; display: inline-block;
vertical-align: top; vertical-align: top;
padding: 9px 12px; padding: 9px 12px;
border-radius: 5px; border-radius: $border-radius;
box-shadow: 0 3px 3px -4px black; box-shadow: 0 3px 3px -4px black;
word-wrap: break-word; word-wrap: break-word;
margin-left: 8px; margin-left: 8px;
@ -491,7 +491,7 @@
} }
img { img {
border: 2px solid #ddd; border: 2px solid #ddd;
border-radius: 5px; border-radius: $border-radius;
max-height: 100px; max-height: 100px;
} }
@ -546,7 +546,7 @@
background: rgba(0, 0, 0, 0.75); background: rgba(0, 0, 0, 0.75);
color: white; color: white;
box-shadow: 0 0 5px 0 black; box-shadow: 0 0 5px 0 black;
border-radius: 20px; border-radius: $border-radius;
font-size: small; font-size: small;
} }
@ -556,7 +556,7 @@
margin: 100px auto; margin: 100px auto;
padding: 1em; padding: 1em;
background: white; background: white;
border-radius: 10px; border-radius: $border-radius;
overflow: auto; overflow: auto;
box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.2); box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.2);
@ -571,7 +571,7 @@
float: right; float: right;
margin-left: 10px; margin-left: 10px;
background-color: $grey_l; background-color: $grey_l;
border-radius: 5px; border-radius: $border-radius;
outline: none; outline: none;
padding: 5px 8px; padding: 5px 8px;
border: 1px solid $grey_l2; border: 1px solid $grey_l2;

8
stylesheets/_global.scss
View file

@ -77,7 +77,7 @@ button.back {
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
background: rgba(0,0,0,0.15); background: rgba(0,0,0,0.15);
border-radius: 10px; border-radius: $border-radius;
} }
.header-buttons { .header-buttons {
@ -279,7 +279,7 @@ $avatar-size: 44px;
font-size: 12px; font-size: 12px;
font-weight: bold; font-weight: bold;
text-align: center; text-align: center;
border-radius: 5px; border-radius: $border-radius;
background-color: $blue; background-color: $blue;
color: white; color: white;
border: solid 1px rgba(255,255,255,0.6); border: solid 1px rgba(255,255,255,0.6);
@ -437,7 +437,7 @@ $avatar-size: 44px;
} }
button, input[type=submit] { button, input[type=submit] {
border-radius: 4px; border-radius: $border-radius;
border: solid 1px #ccc; border: solid 1px #ccc;
cursor: pointer; cursor: pointer;
margin: 1em auto; margin: 1em auto;
@ -476,7 +476,7 @@ $avatar-size: 44px;
margin: 100px auto; margin: 100px auto;
padding: 1em; padding: 1em;
background: white; background: white;
border-radius: 10px; border-radius: $border-radius;
overflow: auto; overflow: auto;
box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.2); box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.2);
} }

3
stylesheets/_index.scss
View file

@ -166,7 +166,7 @@ input.search {
.hint { .hint {
margin: 10px; margin: 10px;
padding: 1em; padding: 1em;
border-radius: 10px; border-radius: $border-radius;
color: white; color: white;
border: 2px dashed white; border: 2px dashed white;
@ -209,7 +209,6 @@ input.search {
top: 50px; top: 50px;
left: 0; left: 0;
background: transparent; background: transparent;
border-radius: 10px;
color: white; color: white;
border: 2px dashed white; border: 2px dashed white;
overflow: visible; overflow: visible;

3
stylesheets/_variables.scss
View file

@ -32,13 +32,14 @@ $roboto-light: Roboto-Light, 'Helvetica Neue', Arial, Helvetica, sans-serif;
$header-height: 64px; $header-height: 64px;
$button-height: 24px; $button-height: 24px;
$header-color: $blue; $header-color: $blue;
$bubble-border-radius: 20px;
$unread-badge-size: 21px; $unread-badge-size: 21px;
$loading-height: 16px; $loading-height: 16px;
$big-avatar-min-width: 900px; $big-avatar-min-width: 900px;
$border-radius: 5px;
@mixin color-svg($svg, $color) { @mixin color-svg($svg, $color) {
-webkit-mask: url($svg) no-repeat center; -webkit-mask: url($svg) no-repeat center;
-webkit-mask-size: 100%; -webkit-mask-size: 100%;

15
stylesheets/manifest.css
View file

@ -89,7 +89,7 @@ button.back {
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
background: rgba(0, 0, 0, 0.15); background: rgba(0, 0, 0, 0.15);
border-radius: 10px; } border-radius: 5px; }
.header-buttons { .header-buttons {
height: 0; } height: 0; }
@ -370,7 +370,7 @@ img.emoji {
width: 100%; width: 100%;
resize: none; } resize: none; }
.debug-log button, .debug-log input[type=submit] { .debug-log button, .debug-log input[type=submit] {
border-radius: 4px; border-radius: 5px;
border: solid 1px #ccc; border: solid 1px #ccc;
cursor: pointer; cursor: pointer;
margin: 1em auto; margin: 1em auto;
@ -402,7 +402,7 @@ img.emoji {
margin: 100px auto; margin: 100px auto;
padding: 1em; padding: 1em;
background: white; background: white;
border-radius: 10px; border-radius: 5px;
overflow: auto; overflow: auto;
box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.2); } box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.2); }
.modal a.x { .modal a.x {
@ -576,7 +576,7 @@ input.search {
.hint { .hint {
margin: 10px; margin: 10px;
padding: 1em; padding: 1em;
border-radius: 10px; border-radius: 5px;
color: white; color: white;
border: 2px dashed white; } border: 2px dashed white; }
.hint h3 { .hint h3 {
@ -611,7 +611,6 @@ input.search {
top: 50px; top: 50px;
left: 0; left: 0;
background: transparent; background: transparent;
border-radius: 10px;
color: white; color: white;
border: 2px dashed white; border: 2px dashed white;
overflow: visible; } overflow: visible; }
@ -759,7 +758,7 @@ input.search {
position: absolute; position: absolute;
background: black; background: black;
color: white; color: white;
border-radius: 10px; border-radius: 5px;
padding: 0.5em; padding: 0.5em;
font-weight: normal; font-weight: normal;
bottom: calc(100% + 16px); bottom: calc(100% + 16px);
@ -1059,7 +1058,7 @@ input.search {
background: rgba(0, 0, 0, 0.75); background: rgba(0, 0, 0, 0.75);
color: white; color: white;
box-shadow: 0 0 5px 0 black; box-shadow: 0 0 5px 0 black;
border-radius: 20px; border-radius: 5px;
font-size: small; } font-size: small; }
.confirmation-dialog .content { .confirmation-dialog .content {
@ -1067,7 +1066,7 @@ input.search {
margin: 100px auto; margin: 100px auto;
padding: 1em; padding: 1em;
background: white; background: white;
border-radius: 10px; border-radius: 5px;
overflow: auto; overflow: auto;
box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.2); } box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.2); }
.confirmation-dialog .content .message { .confirmation-dialog .content .message {