paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-10-29 11:03:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

css: Add color variables to integrations.scss.

Browse Source
This commit is contained in:
Alexandra Ciobica
2019-08-16 00:00:56 +03:00
committed by Tim Abbott
parent 43d11285fa
commit f7e88fb2c1
1 changed files with 26 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
static/styles/portico/integrations.scss
View File

@@ -1,3 +1,9 @@
$light-blue-border: hsl(208, 46%, 93%);
$border-green: hsl(170, 47%, 53%);
$hover-green: hsl(170, 65%, 85%);
$text-green: hsl(170, 72%, 32%);
$category-text: hsl(219, 23%, 33%);
.portico-landing.integrations {
color: hsl(0, 0%, 27%);
font-weight: normal;
@@ -135,11 +141,11 @@
height: 45px;
padding: 0px 20px 0px 50px;
border-radius: 40px;
border: 1px solid hsl(208, 46%, 93%);
border: 1px solid $light-blue-border;
display: block;
&:focus {
border: 1px solid hsl(170, 47%, 53%);
border: 1px solid $border-green;
}
@media (max-width: 768px) {
@@ -160,7 +166,7 @@
left: 20px;
top: 13px;
font-size: 19px;
color: hsl(170, 47%, 53%);
color: $border-green;
}
@media (max-width: 768px) {
@@ -206,13 +212,13 @@
margin: 3px 0;
border-radius: 5px;
transition: all 0.3s ease;
color: hsl(219, 23%, 33%);
color: $category-text;
&.selected,
&:hover {
background-color: hsl(170, 65%, 85%);
color: hsl(170, 72%, 32%);
background-color: $hover-green;
color: $text-green;
cursor: pointer;
}
}
@@ -251,7 +257,7 @@
justify-content: space-between;
margin-left: 25px;
margin-right: 25px;
border: 1px solid hsl(208, 46%, 93%);
border: 1px solid $light-blue-border;
}
i {
@@ -273,16 +279,16 @@
}
h4 {
border-left: 1px solid hsl(208, 46%, 93%);
border-right: 1px solid hsl(208, 46%, 93%);
border-bottom: 1px solid hsl(208, 46%, 93%);
border-left: 1px solid $light-blue-border;
border-right: 1px solid $light-blue-border;
border-bottom: 1px solid $light-blue-border;
transition: all 0.3s ease;
font-size: .9em;
&.selected,
&:hover {
background-color: hsl(170, 65%, 85%);
color: hsl(170, 72%, 32%);
background-color: $hover-green;
color: $text-green;
}
}
}
@@ -329,13 +335,13 @@
padding: 0 4px;
margin: 7px 5px;
border-radius: 5px;
border: 1px solid hsl(208, 46%, 93%);
color: hsl(219, 23%, 33%);
border: 1px solid $light-blue-border;
color: $category-text;
text-align: center;
transition: all 0.3s ease;
&:hover {
border: 1px solid hsl(170, 47%, 53%);
border: 1px solid $border-green;
}
&.legacy {
@@ -497,12 +503,12 @@
text-align: center;
border-radius: 5px;
transition: all 0.3s ease;
background-color: hsl(208, 46%, 93%);
color: hsl(219, 23%, 33%);
background-color: $light-blue-border;
color: $category-text;
&:hover {
background-color: hsl(170, 65%, 85%);
color: hsl(170, 72%, 32%);
background-color: $hover-green;
color: $text-green;
}
}
}
@@ -535,7 +541,7 @@
align-items: center;
margin-bottom: 20px;
padding-bottom: 20px;
border-bottom: 1px solid hsl(206, 44%, 93%);
border-bottom: 1px solid $light-blue-border;
}
@media (max-width: 768px) {