summaryrefslogtreecommitdiff
path: root/addons/web/static/src/scss/webclient.scss
diff options
context:
space:
mode:
authorstephanchrst <stephanchrst@gmail.com>2022-05-10 21:51:50 +0700
committerstephanchrst <stephanchrst@gmail.com>2022-05-10 21:51:50 +0700
commit3751379f1e9a4c215fb6eb898b4ccc67659b9ace (patch)
treea44932296ef4a9b71d5f010906253d8c53727726 /addons/web/static/src/scss/webclient.scss
parent0a15094050bfde69a06d6eff798e9a8ddf2b8c21 (diff)
initial commit 2
Diffstat (limited to 'addons/web/static/src/scss/webclient.scss')
-rw-r--r--addons/web/static/src/scss/webclient.scss140
1 files changed, 140 insertions, 0 deletions
diff --git a/addons/web/static/src/scss/webclient.scss b/addons/web/static/src/scss/webclient.scss
new file mode 100644
index 00000000..19f107b4
--- /dev/null
+++ b/addons/web/static/src/scss/webclient.scss
@@ -0,0 +1,140 @@
+:root {
+ font-size: $o-root-font-size;
+}
+
+// ------------------------------------------------------------------
+// General
+// ------------------------------------------------------------------
+.o_web_client {
+ direction: ltr;
+ position: relative; // normally useless but required by bootstrap-datepicker
+ background-color: $o-webclient-background-color;
+}
+
+// ------------------------------------------------------------------
+// Misc. widgets
+// ------------------------------------------------------------------
+
+// Buttons
+.o_icon_button {
+ background-color: transparent;
+ border: 0;
+ padding: 0;
+ outline: none;
+}
+
+// Boolean Toggle widget
+div.o_boolean_toggle.custom-control.custom-checkbox {
+ $line-height-computed: $line-height-base * $font-size-base;
+ $slider-width: $line-height-computed * 1.5;
+ $circle-width: $line-height-computed * 0.6;
+
+ display: inline-block;
+ padding-left: $slider-width + 0.25rem;
+
+ > label.custom-control-label {
+ &::before, &::after {
+ content: "";
+ top: 0;
+ left: -($slider-width + 0.25rem);
+ }
+ &::before {
+ width: $slider-width;
+ height: 100%;
+ background-color: #a0a0a0 !important;
+ border-radius: 100px;
+ outline: none !important;
+ }
+ &::after {
+ transform: translate($line-height-computed * 0.2, $line-height-computed * 0.2);
+ width: ceil($circle-width / 1rem * $o-root-font-size);
+ height: ceil($circle-width / 1rem * $o-root-font-size);
+ border-radius: 100px;
+ background-color: $white;
+ cursor: pointer;
+ }
+ }
+ > input.custom-control-input:checked + label.custom-control-label {
+ &::before {
+ background-color: $o-brand-primary !important;
+ }
+ &::after {
+ transform: translate($slider-width - $circle-width - $line-height-computed * 0.2, $line-height-computed * 0.2);
+ background-image: none;
+ }
+ }
+}
+
+// Full bg colors (bootstrap extension)
+.bg-success-full {
+ background-color: theme-color('success');
+}
+.bg-warning-full {
+ background-color: theme-color('warning');
+}
+.bg-danger-full {
+ background-color: theme-color('danger');
+}
+.bg-info-full {
+ background-color: theme-color('info');
+}
+.bg-muted-full {
+ background-color: #dee2e6;
+}
+
+// Light version of contextual bg colors (e.g. bg-danger-light)
+@each $name in ('primary', 'secondary', 'success', 'danger', 'warning', 'info') {
+ @include bg-variant('.bg-#{$name}-light', rgba(theme-color($name), .5), #333);
+}
+
+.o_web_accesskey_overlay {
+ font-family: $font-family-sans-serif;
+}
+
+// Decorations
+.text-bf {
+ font-weight: bold;
+}
+.text-it {
+ font-style: italic;
+}
+
+//== Badges
+.badge {
+ margin: 1px 2px 1px 0;
+}
+
+// Btn-link variations
+.btn-link {
+ font-weight: $btn-font-weight;
+
+ &.btn-secondary {
+ @include o-btn-link-variant($body-color, $headings-color);
+ }
+ &.btn-success, &.text-success {
+ @include o-btn-link-variant($body-color, theme-color('success'));
+ }
+ &.btn-warning, &.text-warning {
+ @include o-btn-link-variant($body-color, theme-color('warning'));
+ }
+ &.btn-danger, &.text-danger {
+ @include o-btn-link-variant($body-color, theme-color('danger'));
+ }
+ &.btn-info, &.text-info {
+ @include o-btn-link-variant($body-color, darken(theme-color('info'), 20%));
+ }
+}
+
+//== Printing improvements
+@media print {
+ .table-responsive {
+ overflow-x: initial;
+ }
+}
+
+//== Action manager
+// ensure special links are styled as pointers even when they don't
+// have an href
+[type="action"], [type="toggle"] {
+ cursor: pointer !important;
+}