summaryrefslogtreecommitdiff
path: root/addons/web/static/src/scss/ribbon.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/ribbon.scss
parent0a15094050bfde69a06d6eff798e9a8ddf2b8c21 (diff)
initial commit 2
Diffstat (limited to 'addons/web/static/src/scss/ribbon.scss')
-rw-r--r--addons/web/static/src/scss/ribbon.scss74
1 files changed, 74 insertions, 0 deletions
diff --git a/addons/web/static/src/scss/ribbon.scss b/addons/web/static/src/scss/ribbon.scss
new file mode 100644
index 00000000..6837b0c7
--- /dev/null
+++ b/addons/web/static/src/scss/ribbon.scss
@@ -0,0 +1,74 @@
+.ribbon {
+ width: 150px;
+ height: 150px;
+ overflow: hidden;
+ position: absolute;
+
+ &::before, &::after {
+ position: absolute;
+ z-index: -1;
+ content: '';
+ display: block;
+ border: 5px solid #2980b9;
+ }
+
+ & span {
+ z-index: 1;
+ position: absolute;
+ display: grid;
+ align-items: center;
+ width: 225px;
+ height: 48px;
+ padding: 0 44px;
+ box-shadow: 0 5px 10px rgba(0, 0, 0, .1);
+ color: #fff;
+ font: 700 18px/1 'Lato', sans-serif;
+ text-shadow: 0 1px 1px rgba(0, 0, 0, .2);
+ text-transform: uppercase;
+ text-align: center;
+ overflow: hidden;
+ user-select: none;
+ &.o_small {
+ font-size: 12px;
+ }
+ &.o_medium {
+ font-size: 15px;
+ }
+ }
+
+ &-top-right {
+ margin-top: -$o-sheet-vpadding;
+ right: 0;
+
+ &::before, &::after {
+ border-top-color: black;
+ border-right-color: black;
+ }
+
+ &::before {
+ top: 0;
+ left: 0;
+ }
+
+ &::after {
+ bottom: 0;
+ right: 0;
+ }
+
+ & span {
+ left: -15px;
+ top: 30px;
+ transform: rotate(45deg);
+ }
+ }
+}
+
+// after ribbon widget there can be field widgets or oe_title which may
+// have widgets on right end, add margin-right so ribbon not overlap on it
+.ribbon {
+ &:not(.o_invisible_modifier) {
+ ~ .oe_title, ~ .o_field_widget {
+ margin-right: 100px;
+ }
+ }
+}