From d0a2c3be5e9cfcd7a9ca556fe5da1ab3bcd6d365 Mon Sep 17 00:00:00 2001 From: Richard Haeser Date: Tue, 22 Oct 2019 11:49:42 +0200 Subject: [PATCH] [TASK] Changed colors to make sure contrast is enough to be accessible Closes: #74 --- Resources/Private/Styles/Base/_widget.scss | 4 ++-- Resources/Private/Styles/Widgets/_ctaWidget.scss | 3 ++- Resources/Private/Styles/Widgets/_numberWidget.scss | 2 +- Resources/Public/CSS/Modal/style.css | 2 +- Resources/Public/CSS/ctaWidget.min.css | 2 +- Resources/Public/CSS/dashboard.min.css | 2 +- Resources/Public/CSS/numberWidget.min.css | 2 +- 7 files changed, 9 insertions(+), 8 deletions(-) diff --git a/Resources/Private/Styles/Base/_widget.scss b/Resources/Private/Styles/Base/_widget.scss index 12f286f..4723e8d 100644 --- a/Resources/Private/Styles/Base/_widget.scss +++ b/Resources/Private/Styles/Base/_widget.scss @@ -104,8 +104,8 @@ } th { - font-weight: 400; - color: #fff; + font-weight: 600; + color: #000; } } diff --git a/Resources/Private/Styles/Widgets/_ctaWidget.scss b/Resources/Private/Styles/Widgets/_ctaWidget.scss index 005968a..78c8615 100644 --- a/Resources/Private/Styles/Widgets/_ctaWidget.scss +++ b/Resources/Private/Styles/Widgets/_ctaWidget.scss @@ -4,8 +4,9 @@ align-items: center; padding: $block-gutter / 2; background-color: $primary-color; + font-weight: 600; font-size: 14px; - color: #fff; + color: #000; &:hover, &:focus { diff --git a/Resources/Private/Styles/Widgets/_numberWidget.scss b/Resources/Private/Styles/Widgets/_numberWidget.scss index ee2bcab..92c8ceb 100644 --- a/Resources/Private/Styles/Widgets/_numberWidget.scss +++ b/Resources/Private/Styles/Widgets/_numberWidget.scss @@ -17,7 +17,7 @@ line-height: 1.3; margin-bottom: 5px; font-size: 16px; - color: #7f7f7f; + color: #000; } .dashboard-widget-number--number { diff --git a/Resources/Public/CSS/Modal/style.css b/Resources/Public/CSS/Modal/style.css index 72de29e..e735943 100644 --- a/Resources/Public/CSS/Modal/style.css +++ b/Resources/Public/CSS/Modal/style.css @@ -1 +1 @@ -.dashboard-modal .modal-content{background-color:#f8f8f8}.dashboard-modal .widgetSelector-widgets{display:flex;flex-flow:row wrap;margin:0 -1.1rem}.dashboard-modal .widgetSelector-widget{width:100%;padding:0 1.1rem 2.2rem}@media screen and (min-width:768px){.dashboard-modal .widgetSelector-widget{width:50%}}.dashboard-modal .widgetSelector-widget-block{display:flex;align-items:center;height:100%;padding:1.5rem;background-color:#fff;box-shadow:0 5px 10px 0 rgba(0,0,0,.05)}.dashboard-modal .widgetSelector-widget-icon{margin-right:1.5rem}.dashboard-modal .widgetSelector-widget-title{font-weight:800;font-size:1.4rem}.dashboard-modal .widgetSelector-widget-description{margin-top:.5rem} \ No newline at end of file +.dashboard-modal .modal-content{background-color:#f8f8f8}.dashboard-modal .widgetSelector-widgets{display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap;margin:0 -1.1rem}.dashboard-modal .widgetSelector-widget{width:100%;padding:0 1.1rem 2.2rem}@media screen and (min-width:768px){.dashboard-modal .widgetSelector-widget{width:50%}}.dashboard-modal .widgetSelector-widget-block{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;height:100%;padding:1.5rem;background-color:#fff;box-shadow:0 5px 10px 0 rgba(0,0,0,.05)}.dashboard-modal .widgetSelector-widget-icon{margin-right:1.5rem}.dashboard-modal .widgetSelector-widget-title{font-weight:800;font-size:1.4rem}.dashboard-modal .widgetSelector-widget-description{margin-top:.5rem} \ No newline at end of file diff --git a/Resources/Public/CSS/ctaWidget.min.css b/Resources/Public/CSS/ctaWidget.min.css index 652c52a..bda4294 100644 --- a/Resources/Public/CSS/ctaWidget.min.css +++ b/Resources/Public/CSS/ctaWidget.min.css @@ -1 +1 @@ -.widget-cta{display:flex;justify-content:center;align-items:center;padding:1.5rem;background-color:#f49702;font-size:1.4rem;color:#fff}.widget-cta:focus,.widget-cta:hover{background-color:#fbb037} \ No newline at end of file +.widget-cta{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;padding:1.5rem;background-color:#f49702;font-weight:600;font-size:1.4rem;color:#000}.widget-cta:focus,.widget-cta:hover{background-color:#fbb037} \ No newline at end of file diff --git a/Resources/Public/CSS/dashboard.min.css b/Resources/Public/CSS/dashboard.min.css index 903e534..888b24b 100644 --- a/Resources/Public/CSS/dashboard.min.css +++ b/Resources/Public/CSS/dashboard.min.css @@ -1 +1 @@ -.dashBoardButton-addItem{position:fixed;right:3.7rem;bottom:3.7rem;z-index:2;display:inline-block;padding:2rem;background-color:#868e96;color:#fff}.dashBoardButton-addItem:focus,.dashBoardButton-addItem:hover{background-color:#f49702;color:#fff}.dashboardHeader{display:flex;align-items:center}.dashboard-item{position:absolute;z-index:1;width:50%;height:21rem;padding:0 2.2rem 4.4rem}@media screen and (min-width:1285px){.dashboard-item{width:25%;min-width:32rem}}.dashboard-item.muuri-item-positioning{z-index:2}.dashboard-item.muuri-item-positioning .widget-remove{display:none}.dashboard-item.muuri-item-placeholder{z-index:2;margin:0;opacity:.5}.dashboard-item.muuri-item-placeholder .widget{border:1px dashed #707070}.dashboard-item.muuri-item-placeholder .widget-remove{display:none}.dashboard-item.muuri-item-dragging,.dashboard-item.muuri-item-releasing{z-index:9999}.dashboard-item.muuri-item-releasing .widget-remove{display:none}.dashboard-item.muuri-item-dragging{cursor:move}.dashboard-item.muuri-item-hidden{z-index:0}.dashboard-item.widget-waiting{line-height:210px}.dashboard-item--h4{height:42rem}.dashboard-item--h4.widget-waiting{line-height:420px}.dashboard-item--h6{height:63rem}.dashboard-item--h6.widget-waiting{line-height:630px}.dashboard-item--w4{width:100%}@media screen and (min-width:1285px){.dashboard-item--w4{width:50%;min-width:62rem}}.dashboard-item-content{position:relative;width:100%;height:100%}.dashboardTabs{margin-left:2.2rem}.dashboardTab{display:inline-block;padding:1rem 1.3rem;margin:0 1.5rem 2rem 0;background-color:#868e96;font-size:1.4rem;color:#fff}.dashboardTab:focus,.dashboardTab:hover{background-color:#fbb037}.dashboardTab--active{background-color:#f49702;pointer-events:none}.dashboard-widget{height:100%}.module.module{background-color:#f8f8f8}.module.module h1{line-height:calc(48 / 32);margin-bottom:2rem;font-weight:900;font-size:3.2rem}.dashboard-grid{position:relative;box-sizing:content-box;margin-right:-2.3rem;margin-left:-2.3rem}.widget{height:100%;background-color:#fff;box-shadow:0 5px 10px 0 rgba(0,0,0,.05);color:#333}.widget:hover .widget-move,.widget:hover .widget-remove{display:block}.widget-content-main{overflow-x:hidden;overflow-y:auto;width:100%;height:100%;padding:3rem}.widget-waiting{position:absolute;top:50%;left:50%;line-height:300px;margin-right:-50%;transform:translate(-50%,-50%)}.widget-id{position:absolute;top:0;left:.7rem;height:3rem;line-height:30px;font-weight:400;font-size:1.6rem;text-align:left}.widget-actions{position:absolute;top:2rem;right:3rem;display:flex}.widget-move,.widget-remove{position:relative;display:none;width:1.5rem;height:1.5rem;color:#868e96;text-align:center}.widget-move:focus,.widget-move:hover,.widget-remove:focus,.widget-remove:hover{color:#000}.widget-move .icon,.widget-remove .icon{width:100%;height:100%}.widget-move{margin-right:1rem;cursor:-webkit-grab;cursor:grab}.widget-content{display:flex;flex-direction:column;height:100%}.widget-content-title{padding:1.5rem 3rem;border-bottom:1px solid #ededed;font-weight:900;font-size:1.6rem}.widget-table{width:100%}.widget-table tr:nth-child(even){background-color:#ededed}.widget-table td,.widget-table th{padding:.6rem 1rem}.widget-table thead tr{background-color:#fbb037}.widget-table th{font-weight:400;color:#fff}.widget-table-comment{margin-top:2rem;font-style:italic;color:#868e96}.widget-chart{width:100%;height:100%}.widget-edit{width:4.5rem;text-align:center}.widget-editIcon{color:#000}.widget-editIcon:focus,.widget-editIcon:hover{color:#f49702}.u-flex{display:flex} \ No newline at end of file +.dashBoardButton-addItem{position:fixed;right:3.7rem;bottom:3.7rem;z-index:2;display:inline-block;padding:2rem;background-color:#868e96;color:#fff}.dashBoardButton-addItem:focus,.dashBoardButton-addItem:hover{background-color:#f49702;color:#fff}.dashboardHeader{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.dashboard-item.muuri-item-placeholder .widget-remove,.dashboard-item.muuri-item-positioning .widget-remove,.dashboard-item.muuri-item-releasing .widget-remove{display:none}.dashboard-item{position:absolute;z-index:1;width:50%;height:21rem;padding:0 2.2rem 4.4rem}@media screen and (min-width:1285px){.dashboard-item{width:25%;min-width:32rem}}.dashboard-item.muuri-item-positioning{z-index:2}.dashboard-item.muuri-item-placeholder{z-index:2;margin:0;opacity:.5}.dashboard-item.muuri-item-placeholder .widget{border:1px dashed #707070}.dashboard-item.muuri-item-dragging,.dashboard-item.muuri-item-releasing{z-index:9999}.dashboard-item.muuri-item-dragging{cursor:move}.dashboard-item.muuri-item-hidden{z-index:0}.dashboard-item.widget-waiting{line-height:210px}.dashboard-item--h4{height:42rem}.dashboard-item--h4.widget-waiting{line-height:420px}.dashboard-item--h6{height:63rem}.dashboard-item--h6.widget-waiting{line-height:630px}.dashboard-item--w4{width:100%}@media screen and (min-width:1285px){.dashboard-item--w4{width:50%;min-width:62rem}}.dashboard-item-content{position:relative;width:100%;height:100%}.dashboardTabs{margin-left:2.2rem}.dashboardTab{display:inline-block;padding:1rem 1.3rem;margin:0 1.5rem 2rem 0;background-color:#868e96;font-size:1.4rem;color:#fff}.dashboardTab:focus,.dashboardTab:hover{background-color:#fbb037}.dashboardTab--active{background-color:#f49702;pointer-events:none}.dashboard-widget{height:100%}.module.module{background-color:#f8f8f8}.module.module h1{line-height:calc(48 / 32);margin-bottom:2rem;font-weight:900;font-size:3.2rem}.dashboard-grid{position:relative;box-sizing:content-box;margin-right:-2.3rem;margin-left:-2.3rem}.widget{height:100%;background-color:#fff;box-shadow:0 5px 10px 0 rgba(0,0,0,.05);color:#333}.widget:hover .widget-move,.widget:hover .widget-remove{display:block}.widget-content-main{overflow-x:hidden;overflow-y:auto;width:100%;height:100%;padding:3rem}.widget-waiting{position:absolute;top:50%;left:50%;line-height:300px;margin-right:-50%;transform:translate(-50%,-50%)}.widget-id{position:absolute;top:0;left:.7rem;height:3rem;line-height:30px;font-weight:400;font-size:1.6rem;text-align:left}.widget-actions{position:absolute;top:2rem;right:3rem;display:-ms-flexbox;display:flex}.widget-move,.widget-remove{position:relative;display:none;width:1.5rem;height:1.5rem;color:#868e96;text-align:center}.widget-chart,.widget-move .icon,.widget-remove .icon{width:100%;height:100%}.widget-move:focus,.widget-move:hover,.widget-remove:focus,.widget-remove:hover{color:#000}.widget-move{margin-right:1rem;cursor:grab}.widget-content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;height:100%}.widget-content-title{padding:1.5rem 3rem;border-bottom:1px solid #ededed;font-weight:900;font-size:1.6rem}.widget-table{width:100%}.widget-table tr:nth-child(even){background-color:#ededed}.widget-table td,.widget-table th{padding:.6rem 1rem}.widget-table thead tr{background-color:#fbb037}.widget-table th{font-weight:600;color:#000}.widget-table-comment{margin-top:2rem;font-style:italic;color:#868e96}.widget-edit{width:4.5rem;text-align:center}.widget-editIcon{color:#000}.widget-editIcon:focus,.widget-editIcon:hover{color:#f49702}.u-flex{display:-ms-flexbox;display:flex} \ No newline at end of file diff --git a/Resources/Public/CSS/numberWidget.min.css b/Resources/Public/CSS/numberWidget.min.css index 7022ac8..7b67bf4 100644 --- a/Resources/Public/CSS/numberWidget.min.css +++ b/Resources/Public/CSS/numberWidget.min.css @@ -1 +1 @@ -.dashboard-widget-number--icon{display:flex;justify-content:center;align-items:center;width:4.2rem;margin-right:2rem;color:#000}.dashboard-widget-number--content{display:flex;flex-direction:column;justify-content:center}.dashboard-widget-number--title{line-height:1.3;margin-bottom:.5rem;font-size:1.6rem;color:#7f7f7f}.dashboard-widget-number--number{line-height:1.3;font-weight:900;font-size:2.4rem} \ No newline at end of file +.dashboard-widget-number--icon{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;width:4.2rem;margin-right:2rem;color:#000}.dashboard-widget-number--content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center}.dashboard-widget-number--title{line-height:1.3;margin-bottom:.5rem;font-size:1.6rem;color:#000}.dashboard-widget-number--number{line-height:1.3;font-weight:900;font-size:2.4rem} \ No newline at end of file