personal-website/front/dist/desktop.css
2023-07-24 03:31:25 +03:00

371 lines
6.3 KiB
CSS

.WdePrimitives .adjective {
border: 1px solid #555;
}
.WdePrimitives .black-border {
border: 1px solid #000;
}
.FileTileView {
width: 100%;
height: 100%;
}
.FileTileView.DragDropBorder {
box-shadow: inset 0 0 0 4px #99c;
}
.FileTileView .FlexContainer {
scrollbar-width: none;
-ms-overflow-style: none;
flex-flow: wrap;
place-content: flex-start;
align-items: flex-start;
gap: 20px 50px;
width: 100%;
height: auto;
margin: 15px;
display: flex;
}
.FileTileView::-webkit-scrollbar {
width: 0;
height: 0;
}
.FileTileView .Tile {
flex-flow: column;
justify-content: flex-start;
align-items: center;
gap: 2px;
width: 50px;
height: 50px;
padding: 0;
display: flex;
}
.FileTileView .Icon {
background-size: cover;
width: 32px;
height: 32px;
}
.FileTileView .Selected .Icon {
filter: brightness(.4);
}
.FileTileView .Lable {
white-space: nowrap;
}
.FileTileView .Selected .Lable {
white-space: nowrap;
color: #fff;
background-color: #000;
}
.scrollbar-place {
border-left: 1px solid #555;
flex: 1 0 auto;
order: 0;
align-self: stretch;
width: 14px;
height: 100%;
bottom: 0;
right: 0;
overflow: hidden;
}
.Focused .active .scrollbar-place {
background-color: #aaa;
border-left: 1px solid #000;
box-shadow: inset -1px 0 #ffffff4a, inset -2px 0 #ffffff30, inset 1px 1px #00000024, inset 2px 2px #00000030;
}
.scroll-element {
visibility: hidden;
background: #99f;
flex-direction: row;
justify-content: space-around;
align-items: center;
gap: 5px;
width: 14px;
height: 31px;
padding: 0;
display: flex;
position: relative;
box-shadow: 0 -1px #000, 0 1px #000, 0 2px #00000021, 0 3px #00000030, inset 0 1px #ffffff80, inset 1px 0 #ffffff80, inset -1px -1px #6666cce8;
}
.Focused .active .scroll-element {
visibility: visible;
}
.drag-element {
pointer-events: none;
filter: drop-shadow(1px 1px #339);
background: linear-gradient(#0000 0%, #ccf 0% 50%, #0000 50%) 0 0 / 2px 2px;
width: 7px;
height: 7px;
margin-left: -1px;
}
.ScrollContent {
scrollbar-width: none;
-ms-overflow-style: none;
overflow-x: hidden;
overflow-y: scroll;
}
.ScrollContent::-webkit-scrollbar {
width: 0;
height: 0;
}
.adjective {
border: 1px solid #555;
}
.convex {
box-shadow: 1px 1px #00000040, inset -1px -1px #00000045, inset 1px 1px #fff;
}
.border .grey {
border: 1px solid #555;
}
.border .black {
border: 1px solid #000;
}
.shadow .grey {
box-shadow: 1px 1px #555;
}
.shadow .black {
box-shadow: 1px 1px #000;
}
.rows-fill-shadowed, .window-frame.Focused .title-bar .visual-drag-area {
filter: drop-shadow(1px 1px #777);
background: linear-gradient(#0000 0%, #fff 0% 50%, #0000 50%) 0 0 / 2px 2px;
}
.wde-button {
background-color: #ddd;
border: 1px solid #000;
border-radius: 3px;
width: auto;
height: 20px;
box-shadow: inset -1px -1px #00000045, inset 1px 1px #fff;
}
.wde-button:active {
background-color: #666;
box-shadow: inset 1px 1px #00000045, inset -1px -1px gray;
}
.ContentBorder {
width: 100%;
height: 100%;
overflow: hidden;
}
.ContextMenu {
background-color: #ddd;
border: 1px solid #000;
width: auto;
height: auto;
position: absolute;
}
.ContextMenu .Content {
flex-direction: column;
align-items: flex-start;
width: auto;
height: auto;
display: flex;
position: relative;
}
.ContextMenu .Row {
width: 100%;
height: 16px;
}
.ContextMenu .Row:hover {
color: #fff;
background-color: #339;
}
.ContextMenu .Row .Lable {
white-space: nowrap;
margin-left: 20px;
margin-right: 12px;
font-family: Virtue;
}
@font-face {
font-family: Geneva;
src: url("Geneva.41461b69.woff2");
}
@font-face {
font-family: Charcoal;
src: url("Charcoal.cb9045e5.woff2");
}
.large-system-font, .title-bar .lable {
letter-spacing: .35px;
font-family: Charcoal;
font-size: 12px;
}
.small-system-font, .views-font, body {
font-family: Geneva;
}
.window-frame {
background-color: #ddd;
border: 1px solid #555;
flex-direction: column;
flex: 1 0 auto;
order: 1;
align-self: stretch;
align-items: flex-start;
gap: 4px;
padding: 2px 6px 4px 4px;
display: flex;
position: absolute;
box-shadow: 1px 1px #555;
}
.window-frame.Focused {
background-color: #ccc;
border: 1px solid #000;
box-shadow: 1px 1px #555, inset -1px -1px #00000045, inset 1px 1px #fff;
}
.content-border {
background-color: #eee;
border: 1px solid #555;
width: 100%;
height: 100%;
overflow: hidden;
}
.Focused .content-border {
background-color: #ddd;
border: 1px solid #000;
box-shadow: -1px -1px #00000040, 1px 1px #fff;
}
.title-bar {
flex-direction: row;
flex: none;
order: 0;
justify-content: center;
align-self: stretch;
align-items: center;
gap: 5px;
width: 100%;
height: 13px;
padding: 0;
display: flex;
}
.title-bar .lable {
color: gray;
pointer-events: none;
white-space: nowrap;
position: relative;
top: 1px;
}
.window-frame.Focused .title-bar .lable {
color: #000;
}
.window-frame.Focused .title-bar .visual-drag-area {
pointer-events: none;
width: 100%;
height: 11px;
}
.title-bar > .icon {
width: 16px;
height: 16px;
}
.title-bar > .button {
visibility: hidden;
background: linear-gradient(135deg, #999 18.18%, #fff 81.82%);
border: 1px solid #222;
flex: none;
order: 0;
width: 11px;
height: 11px;
padding: 0%;
position: relative;
top: 1px;
box-shadow: .5px .5px 0 .5px #fff, -.5px -.5px 0 .5px #00000040, inset 1px 1px #ffffff80, inset -1px -1px #00000045;
}
.title-bar > .button:active {
background-color: #0006;
box-shadow: .5px .5px 0 .5px #fff, -.5px -.5px 0 .5px #00000040;
}
.window-frame.Focused .title-bar > .button {
visibility: visible;
}
.NoClick {
pointer-events: none;
}
.Click {
pointer-events: all;
}
::-webkit-scrollbar {
width: 0;
height: 0;
}
body {
src: url("Geneva.41461b69.woff2");
-webkit-touch-callout: none;
-webkit-user-select: none;
user-select: none;
-khtml-user-select: none;
touch-action: manipulation;
width: 100%;
height: 100%;
margin: 0;
font-size: 11px;
position: absolute;
}
#applications {
visibility: hidden;
width: 0;
height: 0;
position: static;
}
#windows-layer {
width: 0;
height: 0;
position: static;
}
#desktop-layer {
background-color: #99c;
width: 100%;
height: 100%;
position: fixed;
}
/*# sourceMappingURL=desktop.css.map */