YourWishes/domsPlace
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Cleaned more W95 code

Browse Source
This commit is contained in:
Dominic Masters
2018-03-18 11:03:00 +11:00
parent 2b828bf726
commit 567fa2b535
2 changed files with 82 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
public/components/w95/Window95.jsx
View File

@ -42,7 +42,7 @@ class Window95 extends Component {
let key = btnKeys[i]; let key = btnKeys[i];
var b = this.state.buttons[key]; var b = this.state.buttons[key];
if(b === false) continue; if(b === false) continue;
let cls = "btn " + btnKeys[i]; let cls = "c-window-btn " + btnKeys[i];
if(b !== true && b !== false) cls += " " + b; if(b !== true && b !== false) cls += " " + b;
btns.push(<div className={cls} key={i}></div>); btns.push(<div className={cls} key={i}></div>);
} }
@ -52,15 +52,15 @@ class Window95 extends Component {
menu = <ContextMenu menu={this.state.menu} />; menu = <ContextMenu menu={this.state.menu} />;
} }
let clss = "c-window "; let clss = "c-window";
if(this.props.className) clss += this.props.className; if(this.props.className) clss += " " + this.props.className;
return ( return (
<div className={clss}> <div className={clss}>
<div className="load_me_stuff"></div> <div className="load_me_stuff"></div>
<div className="c-title-bar"> <div className="c-title-bar">
{this.state.title} {this.state.title}
<div className="buttons"> <div className="c-window-buttons">
{btns} {btns}
</div> </div>
</div> </div>

78
public/styles/components/w95/_window-menu.scss Normal file
View File

@ -0,0 +1,78 @@
.c-context-menu {
width: 100%;
overflow: visible;
}
.c-context-menu__btn {
padding: (1px*$w95Scale) (5px*$w95Scale);
border: 1px*$w95Scale solid transparent;
display: inline-block;
position: relative;
&::first-letter {
text-decoration: underline;
}
&:hover {
border-bottom-color: #868686;
border-right-color: #868686;
border-top-color: #FFFFFF;
border-left-color: #FFFFFF;
}
&.active {
border-right-color: #FFFFFF;
border-bottom-color: #FFFFFF;
border-top-color: #868686;
border-left-color: #868686;
> .c-context-menu__menu {
display: block;
}
}
&.disabled {
color: $w95Disabled;
&:hover,.active {
border-right-color: transparent;
border-bottom-color: transparent;
border-top-color: transparent;
border-left-color: transparent;
}
}
}
.c-context-menu__menu {
@include border95($w95Scale);
border-top-width: 2px*$w95Scale;
position: absolute;
display: none;
background: $w95WindowBG;
left: -1px*$w95Scale;
margin-top: 2px*$w95Scale;
width: auto;
}
.c-context-menu__menu-option {
padding-left: 22px*$w95Scale;
padding-right: 22px*$w95Scale;
padding-bottom: 3px*$w95Scale;
padding-top: 1px*$w95Scale;
white-space: nowrap;
&:hover {
background: $w95Highlight;
color: white;
}
&:first-child {font-weight: bold;}
&::first-letter {
text-decoration: underline;
}
&.disabled {
color: $w95Disabled;
&:hover {background: inherit;color: $w95Disabled;}
}
}