component nav tidy up

This commit is contained in:
Joe 2020-03-17 09:57:18 +00:00
parent 01a09df1e7
commit 88a7098617
5 changed files with 21 additions and 25 deletions

View File

@ -8,8 +8,6 @@
outline: none; outline: none;
border: none; border: none;
border-radius: 5px; border-radius: 5px;
background: rgba(249, 249, 249, 1);
min-width: 1.8rem; min-width: 1.8rem;
min-height: 1.8rem; min-height: 1.8rem;
padding-bottom: 10px; padding-bottom: 10px;
@ -20,6 +18,6 @@
font-size: 1.2rem; font-size: 1.2rem;
font-weight: 700; font-weight: 700;
color: rgba(22, 48, 87, 1); color: var(--secondary100);
} }
</style> </style>

View File

@ -23,11 +23,11 @@
} }
select { select {
height: 35px; height: 40px;
display: block; display: block;
font-family: sans-serif; font-family: sans-serif;
font-weight: 500; font-weight: 400;
color: #163057; color: #000333;
padding: 0 2.6em 0em 1.4em; padding: 0 2.6em 0em 1.4em;
width: 100%; width: 100%;
max-width: 100%; max-width: 100%;
@ -36,8 +36,7 @@
-moz-appearance: none; -moz-appearance: none;
-webkit-appearance: none; -webkit-appearance: none;
appearance: none; appearance: none;
background: #fff; background: var(--lightslate);
border: 1px solid #ccc;
} }
.arrow { .arrow {

View File

@ -36,8 +36,8 @@
--white: #FFFFFF; --white: #FFFFFF;
--darkslate: #1a202c; --darkslate: #1a202c;
--slate: #a0aec0; --slate: #d8d8d8;
--lightslate: #f7fafc; --lightslate: #f9f9f9;
--borderradius: 2px; --borderradius: 2px;
--borderradiusall: 2px 2px 2px 2px; --borderradiusall: 2px 2px 2px 2px;
@ -56,7 +56,7 @@
--quotation: var(--fontnormal) "italics" var(--darkslate) 16pt; --quotation: var(--fontnormal) "italics" var(--darkslate) 16pt;
--smallheavybodytext: var(--fontbold) "regular" var(--secondary100) 14pt; --smallheavybodytext: var(--fontbold) "regular" var(--secondary100) 14pt;
--background-button: #e6eeff; --background-button: #f9f9f9;
--button-text: #0055ff; --button-text: #0055ff;
} }

View File

@ -239,12 +239,12 @@
position: relative; position: relative;
padding: 0 15px; padding: 0 15px;
cursor: pointer; cursor: pointer;
border: 1px solid #ebebeb; border: 1px solid #d8d8d8;
border-radius: 2px; border-radius: 2px;
margin: 5px 0; margin: 5px 0;
height: 40px; height: 40px;
box-sizing: border-box; box-sizing: border-box;
color: #163057; color: #000333;
display: flex; display: flex;
align-items: center; align-items: center;
flex: 1; flex: 1;
@ -256,11 +256,10 @@
} }
.component > .name { .component > .name {
color: #163057; color: #000333;
display: inline-block; display: inline-block;
font-size: 12px; font-size: 12px;
font-weight: bold; opacity: 0.8;
opacity: 0.6;
} }
ul { ul {
@ -279,12 +278,11 @@
background: #fafafa; background: #fafafa;
padding: 10px; padding: 10px;
border-radius: 2px; border-radius: 2px;
color: rgba(22, 48, 87, 0.6); color:var(--secondary80);
} }
.preset-menu > span { .preset-menu > span {
font-size: 12px; font-size: 12px;
font-weight: bold;
text-transform: uppercase; text-transform: uppercase;
margin-top: 5px; margin-top: 5px;
} }

View File

@ -54,14 +54,15 @@
height: 100%; height: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding: 2rem 0; padding: 20px 0;
} }
.switcher { .switcher {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
margin-bottom: 25px; margin-bottom: 20px;
padding: 0 1.5rem; padding: 0 20px 20px;
border-bottom: 1px solid #d8d8d8;
} }
.switcher > button { .switcher > button {
@ -70,15 +71,15 @@
margin: 0; margin: 0;
padding: 0; padding: 0;
cursor: pointer; cursor: pointer;
font-weight: 600;
font-size: 0.85rem; font-size: 0.85rem;
font-weight: 400;
text-transform: uppercase; text-transform: uppercase;
color: #999; color: var(--secondary60);
background-color: rgba(0, 0, 0, 0);
} }
.switcher > .selected { .switcher > .selected {
color: #333; color: var(--secondary100);
font-weight: 500;
} }
.panel { .panel {