are0h
/
Fipamo
1
2
Fork 0
Code Issues 19 Pull Requests 1 Packages Projects 1 Releases 22 Wiki Activity

changed dashboard color palette to be WCAG AA compliant

Browse Source
sql-version-freeze
Ro 6 years ago
parent 77f4a2721d
commit 7b6d849b10
6 changed files with 140 additions and 128 deletions
Show Stats Download Patch File Download Diff File

224
themes/dash/assets/css/dash.css
Unescape Escape View File

@ -1357,8 +1357,8 @@ sub {
}
sup {
top: -0.55em;
background: #d1ccc7;
color: #968c80;
background: #c1cdd7;
color: #374857;
border-radius: 2px;
padding: 0 2px 0 2px;
margin: 0 2px 0 0;
@ -1535,7 +1535,7 @@ template {
h1,
h2,
h3 {
color: #643c32;
color: #b2cce5;
}
h1 {
font-size: 2em;
@ -1556,13 +1556,13 @@ h3 {
**/
html,
body {
background-color: #968c80;
background-color: #374857;
font: 400 1em 'Apercu', Helvetica, Arial, sans-serif;
height: 100%;
}
a {
font: 300 1em $titleType;
color: #643c32;
color: #b2cce5;
text-decoration: underline;
-moz-transition: all 0.1s linear;
-webkit-transition: all 0.1s linear;
@ -1570,11 +1570,11 @@ a {
transition: all 0.1s linear;
}
a:hover {
color: #7c4a3e;
color: #bad1e8;
}
svg.icons {
width: 20px;
fill: #643c32;
fill: #b2cce5;
}
#loader {
position: fixed;
@ -1586,7 +1586,7 @@ svg.icons {
justify-content: center;
}
#loader i {
color: #ce9134;
color: #f5ab35;
}
.blog-container {
width: 100%;
@ -1599,7 +1599,7 @@ svg.icons {
.main-container section header {
width: 100%;
height: 100px;
background-color: #6b6258;
background-color: #27323d;
margin: 0;
padding: 0;
}
@ -1617,29 +1617,29 @@ svg.icons {
.main-container section header #header-wrapper #header-two label#the-title {
font-family: 'Apercu-Mono';
font-size: 2em;
color: #968c80;
color: #374857;
text-decoration: none;
display: block;
}
::-moz-selection {
background-color: #cd898d;
color: #eee;
background-color: #fc6399;
color: #f2f1ef;
}
::selection {
background-color: #cd898d;
color: #eee;
background-color: #fc6399;
color: #f2f1ef;
}
::-o-selection {
background-color: #cd898d;
color: #eee;
background-color: #fc6399;
color: #f2f1ef;
}
::-ms-selection {
background-color: #cd898d;
color: #eee;
background-color: #fc6399;
color: #f2f1ef;
}
::-webkit-selection {
background-color: #cd898d;
color: #eee;
background-color: #fc6399;
color: #f2f1ef;
}
@media only screen and (max-width: 640px) {
.main-container .content #the-intro {
@ -1666,7 +1666,7 @@ svg.icons {
font-size: 3.3rem;
}
.main-container .header .header-desc span a {
color: #eee;
color: #f2f1ef;
width: 250px;
font-weight: 300;
display: inline-block;
@ -1676,7 +1676,7 @@ svg.icons {
margin: 0 0 50px 0;
}
.main-container .header .header-desc #the-intro {
color: #643c32;
color: #b2cce5;
opacity: 0;
font: 400 1.8em $titleType;
display: inline-block;
@ -1746,7 +1746,7 @@ svg.icons {
}
#dash-index-content #dash-index #dash-index-wrapper #dash-login #dash-index-one #dash-index-title,
#dash-index-content #dash-index #dash-index-wrapper #dash-login #dash-index-two #dash-index-title {
color: #eee;
color: #f2f1ef;
font: 400 2em $titleType;
vertical-align: top;
}
@ -1759,20 +1759,20 @@ svg.icons {
#dash-index-content #dash-index #dash-index-wrapper #dash-menu a {
display: inline-block;
vertical-align: top;
background: #897e71;
background: #32414e;
width: 30%;
padding: 5px;
border-radius: 3px;
color: #643c32;
color: #b2cce5;
margin: 0 10px 10px 0;
}
#dash-index-content #dash-index #dash-index-wrapper #dash-menu a:hover {
background: #7a7065;
background: #2c3a46;
}
#dash-index-content #dash-index #dash-index-wrapper #dash-menu a svg {
display: inline-block;
vertical-align: top;
fill: #eee;
fill: #f2f1ef;
}
#dash-index-content #dash-index #dash-index-wrapper #dash-menu a label {
display: inline-block;
@ -1782,7 +1782,7 @@ svg.icons {
cursor: pointer;
}
#dash-index-content #dash-index #dash-index-wrapper #dash-recent {
background: #a1988d;
background: #455b6e;
width: 100%;
height: 100%;
padding: 5px 0 0 0;
@ -1792,7 +1792,7 @@ svg.icons {
margin: 50px auto;
}
#dash-index-content #dash-index #dash-index-wrapper #dash-recent #recent-list h3 {
color: #897e71;
color: #32414e;
}
#dash-index-content #dash-index #dash-index-wrapper #dash-recent #recent-list a {
font-size: 1.5em;
@ -1832,13 +1832,13 @@ svg.icons {
}
.folio-hub .project-list span.drag-handle {
padding: 10px;
color: #ce9134;
color: #f5ab35;
cursor: pointer;
}
.folio-hub .project-list .project-item {
width: 100%;
display: inline-block;
background: #38332e;
background: #28343e;
padding: 5px;
margin-bottom: 10px;
border-radius: 5px;
@ -1848,10 +1848,10 @@ svg.icons {
transition: all 0.3s linear;
}
.folio-hub .project-list .project-item:hover {
background: #544d45;
background: #3b4e5e;
}
.upload-list {
color: #d1ccc7;
color: #c1cdd7;
display: inline-block;
vertical-align: top;
width: 260px;
@ -1868,7 +1868,7 @@ svg.icons {
width: 400px;
height: 70px;
background: $form-background;
color: #d1ccc7;
color: #c1cdd7;
text-align: center;
padding: 40px 0 0;
font-size: 12px;
@ -1920,7 +1920,7 @@ svg.icons {
padding: 0;
}
#bm-content #bookmark-display .bookmark-list .bookmark-entry {
background: #2a2723;
background: #1e272f;
width: 50%;
height: 500px;
background-size: cover;
@ -1940,13 +1940,13 @@ svg.icons {
display: block;
font-size: 0.5em;
padding: 10px;
background: #968c80;
background: #374857;
border-radius: 5px;
}
#bm-content #bookmark-display .bookmark-list #paginate-control {
width: 100%;
height: 300px;
background: #544d45;
background: #3b4e5e;
display: flex;
align-items: center;
justify-content: center;
@ -1961,7 +1961,7 @@ svg.icons {
}
#bm-content #bookmark-display .bookmark-list #paginate-control #paginate label {
padding: 5px;
color: #ce9134;
color: #f5ab35;
font-size: 2.2em;
}
#bm-content #bookmark-display .bookmark-list #paginate-control #paginate a {
@ -1987,7 +1987,7 @@ svg.icons {
font: 400 1.5em $bodyType;
}
#work-content #header #header-two p span {
color: #643c32;
color: #b2cce5;
}
#work-content #work-display {
padding: 0;
@ -2000,8 +2000,8 @@ svg.icons {
display: inline-block;
vertical-align: top;
background-size: cover;
background-color: #ce9134;
color: #ce9134;
background-color: #f5ab35;
color: #f5ab35;
}
#work-content #work-list .work-item span {
font: 600 0.7em $titleType;
@ -2011,7 +2011,7 @@ svg.icons {
}
#work-content #work-contact #contact-form label {
font: 600 0.8em $titleType;
color: #cd898d;
color: #fc6399;
margin: 0 0 15px 0;
display: block;
}
@ -2030,17 +2030,17 @@ svg.icons {
}
#work-content #work-contact #contact-info label#request-status {
font: 600 0.8em $titleType;
color: #cd898d;
color: #fc6399;
margin: 0 0 15px 0;
display: block;
text-transform: uppercase;
}
#work-content #work-contact #contact-info p {
font: 400 1em $bodyType;
color: #ce9134;
color: #f5ab35;
}
#work-content #work-contact #contact-info p i {
color: #cd898d;
color: #fc6399;
}
#project-content {
width: 100%;
@ -2052,11 +2052,11 @@ svg.icons {
}
#project-content #project-display #project-info span {
font: 400 2em $titleType;
color: #eee;
color: #f2f1ef;
}
#project-content #project-display #project-desc {
font: 300 1.2em $bodyType;
color: #ce9134;
color: #f5ab35;
}
#project-content #project-images {
margin: 10px 0 0 0;
@ -2088,8 +2088,8 @@ input[type=text] {
padding: 5px;
font: 1em 'Apercu-Mono';
display: inline-block;
background-color: #897e71;
color: #643c32;
background-color: #32414e;
color: #b2cce5;
}
textarea {
border: 0;
@ -2099,8 +2099,8 @@ textarea {
}
button,
input[type=submit] {
background: #cd898d;
color: #b9595f;
background: #fc6399;
color: #fb1e6c;
font: 1em 'Apercu-Mono';
border-radius: 3px;
position: relative;
@ -2109,29 +2109,29 @@ input[type=submit] {
}
select {
font: 1em 'Apercu-Mono';
border: 1px solid #643c32;
border: 1px solid #b2cce5;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
color: #968c80;
color: #374857;
}
::-webkit-input-placeholder {
font: 1em 'Apercu-Mono';
color: #aba399;
color: #546d84;
}
:-moz-placeholder {
/* Firefox 18- */
font: 1em 'Apercu-Mono';
color: #aba399;
color: #546d84;
}
::-moz-placeholder {
/* Firefox 19+ */
font: 1em 'Apercu-Mono';
color: #aba399;
color: #546d84;
}
:-ms-input-placeholder {
font: 1em 'Apercu-Mono';
color: #aba399;
color: #546d84;
}
/**
-------------------------------
@ -2160,10 +2160,10 @@ select {
}
#entries-index #entries-index-wrapper a span {
font-size: 0.8em;
color: #b5afa6;
color: #62809b;
}
#entries-index #entries-index-wrapper a:hover {
background: #908578;
background: #344453;
}
#entries-index #entries-index-wrapper #entries-list {
color: #32302f;
@ -2194,36 +2194,37 @@ select {
padding: 0.75rem;
}
#entries-edit-index #entries-edit-index-wrapper #entry-header #entry-title #entry_title {
background: #91867a;
background: #354554;
font-family: 'Apercu';
width: 100%;
height: 150px;
font-size: 1.5em;
color: #eee;
color: #f2f1ef;
}
#entries-edit-index #entries-edit-index-wrapper #entry-header #entry-title #entry-date {
background: #897e71;
background: #32414e;
border-radius: 0 3px 3px 0;
width: 105px;
font-family: 'Apercu';
color: #cd898d;
color: #fc6399;
height: 35px;
vertical-align: top;
text-align: center;
}
#entries-edit-index #entries-edit-index-wrapper #entry-header #entry-title label {
background: #81776b;
background: #2f3d4a;
border-radius: 3px 0 0 3px;
display: inline-block;
padding: 5px;
color: #a69d93;
color: #4c6479;
line-height: 35px;
}
#entries-edit-index #entries-edit-index-wrapper #entry-header #entry-meta #entry_tags {
background: #91867a;
background: #354554;
font-family: 'Apercu';
width: 100%;
height: 150px;
color: #4c463f;
color: #1c242c;
}
#entries-edit-index #entries-edit-index-wrapper #entry-header #entry-meta #featured-click,
#entries-edit-index #entries-edit-index-wrapper #entry-header #entry-meta #post-image {
@ -2238,8 +2239,8 @@ select {
justify-content: center;
width: 100%;
min-height: 200px;
background: #4c463f;
color: #968c80;
background: #1c242c;
color: #374857;
vertical-align: middle;
font-family: 'Apercu-Mono';
}
@ -2255,10 +2256,10 @@ select {
}
#entries-edit-index #entries-edit-index-wrapper #entry-feature #featured-new-image-btn #new-upload-link {
padding-top: 4px;
background: #eee;
background: #f2f1ef;
}
#entries-edit-index #entries-edit-index-wrapper #entry-feature #featured-new-image-btn #new-upload-link svg {
fill: #cd898d;
fill: #fc6399;
}
#entries-edit-index #entries-edit-index-wrapper #edit-content {
width: 100%;
@ -2268,7 +2269,7 @@ select {
#entries-edit-index #entries-edit-index-wrapper #edit-content #edit-content-wrapper pre code {
line-height: 1.6em;
font-size: 1.25em;
color: #32302f;
color: #bebebe;
word-wrap: normal;
white-space: pre-wrap;
line-break: normal;
@ -2279,12 +2280,12 @@ select {
left: 0;
right: 0;
bottom: 0;
background: rgba(46,42,38,0.75);
background: rgba(17,22,26,0.75);
z-index: 2000;
}
.dp {
position: relative;
background: #968c80;
background: #374857;
box-shadow: 2px 2px 16px rgba(0,0,0,0.25);
line-height: 1.4;
border-radius: 4px;
@ -2301,7 +2302,7 @@ select {
top: 0;
left: 0;
right: 0;
background: #cd898d;
background: #fc6399;
}
.dp-permanent .dp {
padding-top: 0;
@ -2356,7 +2357,7 @@ select {
text-align: center;
text-decoration: none;
position: relative;
color: #eee;
color: #f2f1ef;
border-radius: 2px;
border: 0;
background: transparent;
@ -2365,7 +2366,7 @@ select {
position: relative;
text-align: center;
padding-bottom: 16px;
background: #897e71;
background: #32414e;
}
.dp-next,
.dp-prev {
@ -2374,7 +2375,7 @@ select {
height: 30px;
overflow: hidden;
top: 14px;
color: #4c463f;
color: #1c242c;
border-radius: 2px;
border: 0;
background: transparent;
@ -2422,13 +2423,13 @@ select {
}
.dp-cal-footer {
text-align: center;
background: #897e71;
background: #32414e;
}
.dp-day-today:after {
content: '';
height: 0;
width: 0;
border: 7px solid #cd898d;
border: 7px solid #fc6399;
border-bottom-color: transparent;
border-left-color: transparent;
position: absolute;
@ -2443,7 +2444,7 @@ select {
width: 33%;
padding: 8px;
text-decoration: none;
color: #4c463f;
color: #1c242c;
border: 0;
background: transparent;
}
@ -2458,8 +2459,8 @@ select {
.dp-prev:active,
.dp-cal-month:active,
.dp-cal-year:active {
background: #cd898d;
color: #eee;
background: #fc6399;
color: #f2f1ef;
}
@media screen and (min-device-width: 1200px) {
.dp-close:hover,
@ -2476,8 +2477,8 @@ select {
.dp-cal-month:hover,
.dp-cal-year:hover,
.dp-cal-year:focus {
background: #cd898d;
color: #eee;
background: #fc6399;
color: #f2f1ef;
}
}
.dp-col-header,
@ -2516,14 +2517,14 @@ select {
.dp-month:focus,
.dp-year:focus {
outline: none;
background: #7c4a3e;
color: #eee;
background: #bad1e8;
color: #f2f1ef;
}
.dp-selected:hover,
.dp-selected:focus,
.dp-selected {
background: #643c32;
color: #eee;
background: #b2cce5;
color: #f2f1ef;
}
.dp-day-disabled {
background: transparent;
@ -2591,12 +2592,12 @@ select {
top: 1px;
padding: 2px;
border-radius: 3px;
background: rgba(137,126,113,0.5);
background: rgba(50,65,78,0.5);
width: 100%;
z-index: 2000;
}
#edit-control button {
margin: 5px;
margin: 3px;
}
#edit-control #post-sumbit-btn {
-moz-transition: all 0.3s linear;
@ -2616,16 +2617,16 @@ select {
visibility: hidden;
}
#edit-control .submit-start {
background: #eee;
background: #f2f1ef;
}
#edit-control .submit-start svg {
fill: #cd898d;
fill: #fc6399;
}
#edit-control .submit-cool {
background: #65b16c;
background: #32cd32;
}
#edit-control .submit-cool svg {
fill: #eee;
fill: #f2f1ef;
}
#edit-control #option-date {
height: 30px;
@ -2635,28 +2636,28 @@ select {
margin: -13px 5px 0 0;
display: inline-block;
vertical-align: top;
fill: #eee;
fill: #f2f1ef;
}
#edit-control .content-editor-btn-icon {
height: 30px;
width: 30px;
background: #643c32;
background: #b2cce5;
padding: 5px 5px 1px 5px;
border-radius: 20px;
color: #968c80;
color: #374857;
display: inline-block;
vertical-align: top;
text-align: center;
}
#edit-control .content-editor-btn-icon svg {
fill: #968c80;
fill: #374857;
}
#edit-control .content-editor-btn-text {
width: 30px;
background: #643c32;
background: #b2cce5;
padding: 5px;
border-radius: 20px;
color: #968c80;
color: #374857;
vertical-align: top;
display: inline-block;
text-align: center;
@ -2688,7 +2689,7 @@ select {
display: block;
overflow-x: auto;
padding: 0.5em;
background: #897e71;
background: #344453;
}
.hljs,
.hljs-subst {
@ -2696,12 +2697,13 @@ select {
}
.hljs-deletion,
.hljs-formula,
.hljs-keyword,
.hljs-link,
.hljs-selector-tag {
color: #cfa99f;
.hljs-keyword .hljs-selector-tag {
color: #bebebe;
font-style: italic;
}
.hljs-link {
color: #fc6399;
}
.hljs-built_in,
.hljs-emphasis,
.hljs-name,
@ -2709,13 +2711,13 @@ select {
.hljs-strong,
.hljs-title,
.hljs-variable {
color: #c0bab3;
color: #ffa07a;
}
.hljs-attr,
.hljs-params,
.hljs-template-tag,
.hljs-type {
color: #d8a75d;
color: #89c4f4;
}
.hljs-builtin-name,
.hljs-doctag,
@ -2728,7 +2730,7 @@ select {
.hljs-regexp,
.hljs-selector-id,
.hljs-template-variable {
color: #fe8019;
color: #f5ab35;
}
.hljs-addition,
.hljs-meta-string,
@ -2737,7 +2739,7 @@ select {
.hljs-selector-class,
.hljs-string,
.hljs-symbol {
color: #903d42;
color: #f6dd74;
}
.hljs-attribute,
.hljs-bullet,
@ -2747,7 +2749,7 @@ select {
.hljs-meta-keyword,
.hljs-selector-pseudo,
.hljs-tag {
color: #4c463f;
color: #8ea4b8;
}
.hljs-comment {
color: #928374;

2
themes/dash/assets/css/dash.css.map
View File

File diff suppressed because one or more lines are too long

18
themes/dash/src/styles/main/_colors.styl
Unescape Escape View File

@ -1,12 +1,18 @@
$primary = #968c80;
$secondary = #643c32;
$tertiary = #ce9134
$highlight = #cd898d;
$white = #eee;
$primary = #374857;
$secondary = #b2cce5;
$tertiary = #f5ab35;
$highlight = #fc6399;
$white = #f2f1ef;
$grey = #abb7b7;
$black = #32302f;
//editor colors
$eventCool = #65b16c
$eventCool = #32cd32
$eventLame = #ce483b
$editorPrimary = #bebebe;
$editorSecondary = #ffa07a;
$editorTertiary = #89c4f4;
$editorString = #f6dd74;
//Bulma overrides

19
themes/dash/src/styles/main/_editor-highlight.styl
Unescape Escape View File

@ -3,32 +3,35 @@
display block
overflow-x auto
padding 0.5em
background $primary - 10%
background $primary - 5%
.hljs, .hljs-subst
color #ebdbb2
.hljs-deletion, .hljs-formula, .hljs-keyword, .hljs-link, .hljs-selector-tag
color $secondary + 60%
.hljs-deletion, .hljs-formula, .hljs-keyword .hljs-selector-tag
color $editorPrimary
font-style italic
.hljs-link
color $highlight
.hljs-built_in, .hljs-emphasis, .hljs-name, .hljs-quote, .hljs-strong, .hljs-title, .hljs-variable
color $primary + 40%
color $editorSecondary
.hljs-attr, .hljs-params, .hljs-template-tag, .hljs-type
color $tertiary + 20%
color $editorTertiary
.hljs-builtin-name, .hljs-doctag, .hljs-literal, .hljs-number
color #8f3f71
.hljs-code, .hljs-meta, .hljs-regexp, .hljs-selector-id, .hljs-template-variable
color #fe8019
color $tertiary
.hljs-addition, .hljs-meta-string, .hljs-section, .hljs-selector-attr, .hljs-selector-class, .hljs-string, .hljs-symbol
color $highlight - 40%
color $editorString
.hljs-attribute, .hljs-bullet, .hljs-class, .hljs-function, .hljs-function .hljs-keyword, .hljs-meta-keyword, .hljs-selector-pseudo, .hljs-tag
color $primary - 50%
color $primary + 50%
.hljs-comment
color #928374

2
themes/dash/src/styles/main/_editor.styl
Unescape Escape View File

@ -8,7 +8,7 @@
z-index 2000
button
margin 5px
margin 3px
#post-sumbit-btn
object-transitions(0.3s)

3
themes/dash/src/styles/main/_entries.styl
Unescape Escape View File

@ -70,6 +70,7 @@
color $highlight
height 35px
vertical-align top
text-align: center
label
background $primary - 15%
@ -132,7 +133,7 @@
// font-family 'Apercu-Mono'
line-height 1.6em
font-size 1.25em
color $black
color $editorPrimary
word-wrap normal
white-space pre-wrap
line-break normal

Write Preview
Loading…
Cancel
Save