diff --git a/client/homebrew/editor/settingsEditor/settingsEditor.less b/client/homebrew/editor/settingsEditor/settingsEditor.less deleted file mode 100644 index 21e8e1af6..000000000 --- a/client/homebrew/editor/settingsEditor/settingsEditor.less +++ /dev/null @@ -1,373 +0,0 @@ -@import '@sharedStyles/core.less'; - - -.settingsEditor { - position : absolute; - box-sizing : border-box; - width : 100%; - height : calc(100vh - 54px); // 54px is the height of the navbar + snippet bar. probably a better way to dynamic get this. - padding : 25px; - overflow-y : auto; - font-size : 13px; - background-color : #999999; - - h1 { - margin : 0 0 40px; - font-weight : bold; - text-transform : uppercase; - } - - h2 { - margin : 20px 0; - font-weight : bold; - color : #555555; - border-bottom : 2px solid gray; - } - - & > div { margin-bottom : 10px; } - - .field-group { - display : flex; - flex-wrap : wrap; - gap : 10px; - width : 100%; - } - - .field-column { - display : flex; - flex : 5 0 200px; - flex-direction : column; - gap : 10px; - } - - .field { - position : relative; - display : flex; - justify-content: space-between; - flex-wrap : wrap; - width : 100%; - min-width : 200px; - border-bottom:1px solid; - padding:5px; - & > label { - width : fit-content; - font-size : 0.9em; - font-weight : 800; - line-height : 1.8em; - text-transform : uppercase; - } - & > .value { - flex : 1 1 auto; - width : 50px; - &[data-tooltip-right] { max-width : 380px; } - &:invalid { background : #FFB9B9; } - small { - display : block; - font-size : 0.9em; - font-style : italic; - line-height : 1.4em; - } - } - input[type='text'], textarea { - border : 1px solid gray; - &:focus { outline : 1px solid #444444; } - } - - &.description { - flex : 1; - textarea.value { - height : auto; - font-family : 'Open Sans', sans-serif; - resize : none; - } - } - - &.thumbnail, &.themes { - label { line-height : 2.0em; } - .value { - overflow : hidden; - text-overflow : ellipsis; - } - button { - .colorButton(); - padding : 0px 5px; - color : white; - background-color : black; - border : 1px solid #999999; - &:hover { background-color : #777777; } - } - } - - &.tags .tagInput-dropdown { - z-index : 400; - max-width : 200px; - } - &.language .value { - z-index : 300; - max-width : 150px; - } - - &.themes { - .value { - overflow : visible; - text-overflow : auto; - } - button { - padding-right : 5px; - padding-left : 5px; - } - } - - &.invitedAuthors .value { - z-index : 100; - - .tagInput-dropdown { max-width : 200px; } - } - } - - .thumbnail-preview { - position : relative; - flex : 1 1; - justify-self : center; - width : 80px; - height : min-content; - max-height : 115px; - aspect-ratio : 1 / 1; - object-fit : contain; - background-color : #AAAAAA; - } - - .renderers.field .value { - label { - display : inline-flex; - align-items : center; - margin-right : 15px; - font-size : 0.9em; - font-weight : 800; - vertical-align : middle; - white-space : nowrap; - cursor : pointer; - user-select : none; - } - input { - margin : 3px; - vertical-align : middle; - cursor : pointer; - } - } - .publish.field .value { - position : relative; - margin-bottom : 15px; - button { width : 100%; } - button.publish { - .colorButton(@blueLight); - } - button.unpublish { - .colorButton(@silver); - } - } - - .delete.field .value { - button { - .colorButton(@red); - } - } - .authors.field { - .tag { - font-weight:300; - transition:background-color 0.2s; - - &.owner { - position: relative; - background-color:@silverLight; - min-width:25px; - display:grid; - place-items:center; - font-weight: 900; - - &::after { - content: "\f521"; - font-family: "Font Awesome 6 Free"; - color:gold; - position: absolute; - top: 0; - left: 0; - width:15px; - height:15px; - rotate:-25deg; - translate:-30% -50%; - transform: scaleY(0.7); - } - } - &:has(button) a { - padding-right:5px; - } - &:has(button:hover) { - background:#d97d7d; - } - - button { - color:@red; - } - - - } - a { - color:black; - text-decoration:unset; - } - } - - .themes.field { - & .dropdown-container { - position : relative; - z-index : 200; - background-color : white; - } - & .dropdown-options { overflow-y : visible; } - .disabled { - font-style : italic; - color : dimgray; - background-color : darkgray; - } - .item { - position : relative; - padding : 3px 3px; - overflow : visible; - background-color : white; - border-top : 1px solid rgb(118, 118, 118); - .preview { - position : absolute; - top : 0; - right : 0; - z-index : 1; - display : flex; - flex-direction : column; - width : 200px; - overflow : hidden; - color : black; - background : #CCCCCC; - border-radius : 5px; - box-shadow : 0 0 5px black; - opacity : 0; - transition : opacity 250ms ease; - h6 { - padding-block : 0.5em; - padding-inline : 1em; - font-weight : 900; - border-bottom : 2px solid hsl(0,0%,40%); - } - } - - .texture-container { - position : absolute; - top : 0; - left : 0; - width : 100%; - height : 100%; - min-height : 100%; - overflow : hidden; - > img { - position : absolute; - top : 0; - right : 0; - width : 50%; - min-height : 100%; - -webkit-mask-image : linear-gradient(90deg, transparent, black 20%); - mask-image : linear-gradient(90deg, transparent, black 20%); - } - } - - &:hover { - color : white; - background-color : @blue; - filter : unset; - } - &:hover > .preview { opacity : 1; } - } - } - - .field .list { - display : flex; - flex : 1 0; - flex-wrap : wrap; - - > * { flex : 0 0 auto; } - - #groupedIcon { - #backgroundColors; - position : relative; - top : -0.3em; - right : -0.3em; - display : inline-block; - min-width : 20px; - height : ~'calc(100% + 0.6em)'; - color : white; - text-align : center; - cursor : pointer; - - i { - position : relative; - top : 50%; - transform : translateY(-50%); - } - - &:not(:last-child) { border-right : 1px solid black; } - - &:last-child { border-radius : 0 0.5em 0.5em 0; } - } - - .tag { - padding : 0.35em; - margin : 2px; - font-size : 0.95em; - background-color : #DDDDDD; - border-radius : 0.5em; - - .icon { #groupedIcon; } - - button { - cursor : pointer; - } - } - - .input-group { - height : ~'calc(.9em + 4px + .6em)'; - - input { border-radius : 0.5em 0 0 0.5em; } - - input:last-child { border-radius : 0.5em; } - - .value { - width : 7.5vw; - min-width : 75px; - height : 100%; - } - - .input-group { - height : ~'calc(.9em + 4px + .6em)'; - - input { border-radius : 0.5em 0 0 0.5em; } - - input:last-child { border-radius : 0.5em; } - - .value { - width : 7.5vw; - min-width : 75px; - height : 100%; - } - - .invalid:focus { background-color : pink; } - - .icon { - #groupedIcon; - top : -0.54em; - right : 1px; - height : 97%; - - i { font-size : 1.125em; } - } - } - } - } -} \ No newline at end of file