diff --git a/baseframe/static/css/codemirror-material.css b/baseframe/static/css/codemirror-material.css index 1b076ae1..713c620b 100644 --- a/baseframe/static/css/codemirror-material.css +++ b/baseframe/static/css/codemirror-material.css @@ -16,3 +16,8 @@ border-color: #4a90e2; border-width: 2px; } + +.CodeMirror-wrap pre.CodeMirror-line, +.CodeMirror-wrap pre.CodeMirror-line-like { + padding: 0; +} diff --git a/baseframe/static/css/mui.css b/baseframe/static/css/mui.css index 81254635..6d395ca6 100644 --- a/baseframe/static/css/mui.css +++ b/baseframe/static/css/mui.css @@ -4258,6 +4258,61 @@ li p + ol { color: #21b685; } +.switch-input { + display: none; +} + +.switch-label { + position: relative; + display: inline-block; + cursor: pointer; + text-align: left; + padding: 16px 0 16px 32px; +} + +.switch-label:before, +.switch-label:after { + content: ''; + position: absolute; + margin: 0; + outline: 0; + top: 50%; + -ms-transform: translate(0, -50%); + -webkit-transform: translate(0, -50%); + transform: translate(0, -50%); + -webkit-transition: all 0.3s ease; + transition: all 0.3s ease; +} + +.switch-label:before { + left: 1px; + width: 34px; + height: 14px; + background-color: #9e9e9e; + border-radius: 8px; +} + +.switch-label:after { + left: 0; + width: 20px; + height: 20px; + background-color: #fafafa; + border-radius: 50%; + box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), + 0 1px 3px 0 rgba(0, 0, 0, 0.12); +} + +.switch-input:checked + .switch-label:before { + background-color: rgba(15, 115, 237, 0.6); +} + +.switch-input:checked + .switch-label:after { + background-color: #0f73ed; + -ms-transform: translate(80%, -50%); + -webkit-transform: translate(80%, -50%); + transform: translate(80%, -50%); +} + .chip { padding: 0 5px 5px; border: 0; @@ -4545,6 +4600,30 @@ li p + ol { outline: none; } +.mui-tabs__bar--pills li { + border: 1px solid rgba(132, 146, 166, 0.3); + border-radius: 30px; + margin-right: 8px; + background: #f9f9f9; +} +.mui-tabs__bar--pills li a { + height: 30px; + line-height: 30px; + padding-left: 16px; + padding-right: 16px; + cursor: pointer; + color: #4d5763; + text-decoration: none !important; + text-transform: inherit; +} +.mui-tabs__bar--pills li.mui--is-active { + border: 1px solid rgba(93, 169, 232, 0.2); + background: #cfefff; +} +.mui-tabs__bar--pills li.mui--is-active a { + text-decoration: none !important; +} + .mui-table.mui-table--hover > tbody > tr > td:hover { background-color: #bbdefb; } diff --git a/baseframe/static/sass/baseframe-material/_form.scss b/baseframe/static/sass/baseframe-material/_form.scss index 8bb702ff..d07d03ab 100644 --- a/baseframe/static/sass/baseframe-material/_form.scss +++ b/baseframe/static/sass/baseframe-material/_form.scss @@ -217,3 +217,52 @@ } } } + +.switch-input { + display: none; +} +.switch-label { + position: relative; + display: inline-block; + cursor: pointer; + text-align: left; + padding: 16px 0 16px 32px; +} +.switch-label:before, +.switch-label:after { + content: ''; + position: absolute; + margin: 0; + outline: 0; + top: 50%; + -ms-transform: translate(0, -50%); + -webkit-transform: translate(0, -50%); + transform: translate(0, -50%); + -webkit-transition: all 0.3s ease; + transition: all 0.3s ease; +} +.switch-label:before { + left: 1px; + width: 34px; + height: 14px; + background-color: #9e9e9e; + border-radius: 8px; +} +.switch-label:after { + left: 0; + width: 20px; + height: 20px; + background-color: #fafafa; + border-radius: 50%; + box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), + 0 1px 3px 0 rgba(0, 0, 0, 0.12); +} +.switch-input:checked + .switch-label:before { + background-color: transparentize($mui-primary-color, 0.4); +} +.switch-input:checked + .switch-label:after { + background-color: $mui-primary-color; + -ms-transform: translate(80%, -50%); + -webkit-transform: translate(80%, -50%); + transform: translate(80%, -50%); +} diff --git a/baseframe/static/sass/baseframe-material/_tabs.scss b/baseframe/static/sass/baseframe-material/_tabs.scss index c49ac189..82fbc39d 100644 --- a/baseframe/static/sass/baseframe-material/_tabs.scss +++ b/baseframe/static/sass/baseframe-material/_tabs.scss @@ -30,3 +30,29 @@ outline: none; } } + +.mui-tabs__bar--pills { + li { + border: 1px solid $mui-divider-color; + border-radius: 30px; + margin-right: $mui-grid-padding/2; + background: $mui-bg-color-accent; + } + li a { + height: 30px; + line-height: 30px; + padding-left: $mui-grid-padding; + padding-right: $mui-grid-padding; + cursor: pointer; + color: $mui-text-light; + text-decoration: none !important; + text-transform: inherit; + } + li.mui--is-active { + border: 1px solid transparentize($mui-text-info, 0.8); + background: $mui-info-color; + a { + text-decoration: none !important; + } + } +}