This commit is contained in:
Nilstrieb 2021-02-13 18:42:57 +01:00
parent 666ed243e0
commit ef74a238b7
17 changed files with 30 additions and 23 deletions

View file

@ -1,2 +0,0 @@
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#282c34;color:#fff}#parent{display:grid;grid-template-rows:150px auto;grid-template-areas:"header" "main"}main{grid-area:main}.model{display:inline-block}.model img{height:200px}:root{--nav-color:#b0c2ce;--nav-hover-color:#a9a9a9}header{grid-area:header}header h1{margin-top:50px;text-align:center}nav{list-style-type:none;overflow:visible;background-color:#b0c2ce;background-color:var(--nav-color);width:100%;position:fixed;top:0;height:50px}nav,nav ul{margin:0;padding:0}nav ul,nav ul li{height:100%}nav ul li{float:left;border-right:1px solid grey;width:15%;position:relative;display:inline-block;font-size:1.5em;background-color:#b0c2ce;background-color:var(--nav-color);cursor:pointer;margin:auto}nav ul li:hover{background-color:#a9a9a9;color:#a9a9a9;color:var(--nav-hover-color);transition-duration:.4s}nav ul li button{display:block;text-align:center;color:#000;width:100%;height:100%;background-color:#b0c2ce;background-color:var(--nav-color);border:none;cursor:pointer}nav ul li button:focus{outline:0}nav ul li button:hover{background-color:#a9a9a9;background-color:var(--nav-hover-color)}nav ul li div{display:none;background-color:#b0c2ce;background-color:var(--nav-color);z-index:1;width:100%}nav ul li:hover div{display:block}nav ul li div button{padding:8px 0}
/*# sourceMappingURL=main.241b79e6.chunk.css.map */

View file

@ -1 +0,0 @@
{"version":3,"sources":["webpack://src/app.css","webpack://src/template.css"],"names":[],"mappings":"AAAA,KACI,QAAS,CACT,mJAEU,CACV,kCAAmC,CACnC,iCAAkC,CAElC,wBAAyB,CACzB,UACJ,CAEA,QACI,YAAa,CACb,6BAA8B,CAC9B,mCAEJ,CAEA,KACI,cACJ,CAEA,OACI,oBACJ,CAEA,WACI,YACJ,CC7BA,MACI,mBAA+B,CAC/B,yBACJ,CAEA,OACI,gBACJ,CAEA,UACI,eAAgB,CAChB,iBACJ,CAGA,IACI,oBAAqB,CAGrB,gBAAiB,CACjB,wBAAkC,CAAlC,iCAAkC,CAClC,UAAW,CAEX,cAAe,CACf,KAAM,CACN,WACJ,CAGA,WAZI,QAAS,CACT,SAeJ,CAGA,iBANI,WAkBJ,CAZA,UACI,UAAW,CACX,2BAA4B,CAE5B,SAAU,CACV,iBAAkB,CAClB,oBAAqB,CAErB,eAAgB,CAChB,wBAAkC,CAAlC,iCAAkC,CAClC,cAAe,CACf,WACJ,CAGA,gBACI,wBAA0B,CAC1B,aAA6B,CAA7B,4BAA6B,CAC7B,uBACJ,CAGA,iBACI,aAAc,CACd,iBAAkB,CAClB,UAAY,CACZ,UAAW,CACX,WAAY,CACZ,wBAAkC,CAAlC,iCAAkC,CAClC,WAAY,CACZ,cACJ,CAGA,uBACI,SACJ,CAGA,uBACI,wBAAwC,CAAxC,uCACJ,CAGA,cACI,YAAa,CACb,wBAAkC,CAAlC,iCAAkC,CAClC,SAAU,CACV,UACJ,CAGA,oBACI,aACJ,CAGA,qBACI,aACJ","file":"main.241b79e6.chunk.css","sourcesContent":["body {\n margin: 0;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',\n 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',\n sans-serif;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n\n background-color: #282c34;\n color: white;\n}\n\n#parent {\n display: grid;\n grid-template-rows: 150px auto;\n grid-template-areas: \"header\"\n \"main\";\n}\n\nmain {\n grid-area: main;\n}\n\n.model {\n display: inline-block;\n}\n\n.model img {\n height: 200px;\n}",":root {\r\n --nav-color: rgb(176, 194, 206);\r\n --nav-hover-color: darkgrey;\r\n}\r\n\r\nheader {\r\n grid-area: header;\r\n}\r\n\r\nheader h1 {\r\n margin-top: 50px;\r\n text-align: center;\r\n}\r\n\r\n/*Navigation*/\r\nnav {\r\n list-style-type: none;\r\n margin: 0;\r\n padding: 0;\r\n overflow: visible;\r\n background-color: var(--nav-color);\r\n width: 100%;\r\n\r\n position: fixed;\r\n top: 0;\r\n height: 50px;\r\n}\r\n\r\n/*main ul*/\r\nnav ul {\r\n height: 100%;\r\n margin: 0;\r\n padding: 0;\r\n}\r\n\r\n/*nav li item*/\r\nnav ul li {\r\n float: left;\r\n border-right: 1px solid gray;\r\n height: 100%;\r\n width: 15%;\r\n position: relative;\r\n display: inline-block;\r\n\r\n font-size: 1.5em;\r\n background-color: var(--nav-color);\r\n cursor: pointer;\r\n margin: auto;\r\n}\r\n\r\n/*nav li item on hover*/\r\nnav ul li:hover {\r\n background-color: darkgray;\r\n color: var(--nav-hover-color);\r\n transition-duration: 0.4s;\r\n}\r\n\r\n/*all nav button*/\r\nnav ul li button {\r\n display: block;\r\n text-align: center;\r\n color: black;\r\n width: 100%;\r\n height: 100%;\r\n background-color: var(--nav-color);\r\n border: none;\r\n cursor: pointer;\r\n}\r\n\r\n/*all nav button focus - remove outline so it looks like a normal link*/\r\nnav ul li button:focus {\r\n outline: 0;\r\n}\r\n\r\n/*all nav a hover*/\r\nnav ul li button:hover {\r\n background-color: var(--nav-hover-color);\r\n}\r\n\r\n/*drop menu*/\r\nnav ul li div {\r\n display: none;\r\n background-color: var(--nav-color);\r\n z-index: 1;\r\n width: 100%;\r\n}\r\n\r\n/*drop menu main hover*/\r\nnav ul li:hover div {\r\n display: block;\r\n}\r\n\r\n/*drop menu button*/\r\nnav ul li div button {\r\n padding: 8px 0 8px 0;\r\n}"]}

View file

@ -0,0 +1,2 @@
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#282c34;color:#fff}#parent{display:grid;grid-template-rows:150px auto;grid-template-areas:"header" "main"}main{grid-area:main}:root{--nav-color:#b0c2ce;--nav-hover-color:#a9a9a9}header{grid-area:header}header h1{margin-top:50px}main{margin:10px}nav{list-style-type:none;overflow:visible;background-color:#b0c2ce;background-color:var(--nav-color);width:100%;position:fixed;top:0;height:50px;z-index:1}nav,nav ul{margin:0;padding:0}nav ul,nav ul li{height:100%}nav ul li{float:left;border-right:1px solid grey;width:15%;position:relative;display:inline-block;font-size:1.8em;background-color:#b0c2ce;background-color:var(--nav-color);cursor:pointer;margin:auto}nav ul li:hover{background-color:#a9a9a9;color:#a9a9a9;color:var(--nav-hover-color);transition-duration:.4s}nav ul li a{display:block;text-align:center;text-decoration:none;color:#000;width:100%;height:100%;background-color:#b0c2ce;background-color:var(--nav-color);border:none;cursor:pointer}nav ul li a:focus{outline:0}nav ul li a:hover{background-color:#a9a9a9;background-color:var(--nav-hover-color)}nav ul li .content{display:none;background-color:#b0c2ce;background-color:var(--nav-color);z-index:1;width:100%}nav ul li:hover .content{display:block}nav ul li .content a{padding:8px 0}:root{--model-image-height:200px}.model{position:relative;text-align:center;display:inline-block;transform:scale(1)}.model,.model:hover{color:#fff;transition-duration:.1s;transition-timing-function:ease-out}.model:hover{transform:scale(1.02)}.model .model-info{visibility:hidden;height:100%;width:100%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);line-height:200px;line-height:var(--model-image-height)}.model:hover .model-info{visibility:visible;background-color:rgba(0,0,0,.5)}.model img{height:200px;height:var(--model-image-height)}.model-info-text{vertical-align:middle;display:inline-block;font-size:1.5em}
/*# sourceMappingURL=main.59edd118.chunk.css.map */

View file

@ -0,0 +1 @@
{"version":3,"sources":["webpack://src/app.css","webpack://src/Plane.css"],"names":[],"mappings":"AAAA,KACI,QAAS,CACT,mJAEU,CACV,kCAAmC,CACnC,iCAAkC,CAElC,wBAAyB,CACzB,UACJ,CAEA,QACI,YAAa,CACb,6BAA8B,CAC9B,mCAEJ,CAEA,KACI,cACJ,CAEA,MACI,mBAA+B,CAC/B,yBACJ,CAEA,OACI,gBACJ,CAEA,UACI,eACJ,CAEA,KACI,WACJ,CAGA,IACI,oBAAqB,CAGrB,gBAAiB,CACjB,wBAAkC,CAAlC,iCAAkC,CAClC,UAAW,CAEX,cAAe,CACf,KAAM,CACN,WAAY,CAEZ,SACJ,CAGA,WAdI,QAAS,CACT,SAiBJ,CAGA,iBANI,WAkBJ,CAZA,UACI,UAAW,CACX,2BAA4B,CAE5B,SAAU,CACV,iBAAkB,CAClB,oBAAqB,CAErB,eAAgB,CAChB,wBAAkC,CAAlC,iCAAkC,CAClC,cAAe,CACf,WACJ,CAGA,gBACI,wBAA0B,CAC1B,aAA6B,CAA7B,4BAA6B,CAC7B,uBACJ,CAGA,YACI,aAAc,CACd,iBAAkB,CAClB,oBAAqB,CACrB,UAAY,CACZ,UAAW,CACX,WAAY,CACZ,wBAAkC,CAAlC,iCAAkC,CAClC,WAAY,CACZ,cACJ,CAGA,kBACI,SACJ,CAGA,kBACI,wBAAwC,CAAxC,uCACJ,CAGA,mBACI,YAAa,CACb,wBAAkC,CAAlC,iCAAkC,CAClC,SAAU,CACV,UACJ,CAGA,yBACI,aACJ,CAGA,qBACI,aACJ,CC5HA,MACI,0BACJ,CAEA,OACI,iBAAkB,CAClB,iBAAkB,CAElB,oBAAqB,CACrB,kBAGJ,CAEA,oBAPI,UAAY,CAGZ,uBAAyB,CACzB,mCAQJ,CALA,aAEI,qBAGJ,CAEA,mBACI,iBAAkB,CAElB,WAAY,CACZ,UAAW,CAEX,iBAAkB,CAClB,OAAQ,CACR,QAAS,CACT,8BAAgC,CAEhC,iBAAsC,CAAtC,qCACJ,CAEA,yBACI,kBAAmB,CACnB,+BACJ,CAEA,WACI,YAAiC,CAAjC,gCACJ,CAGA,iBACI,qBAAsB,CACtB,oBAAqB,CAErB,eACJ","file":"main.59edd118.chunk.css","sourcesContent":["body {\n margin: 0;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',\n 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',\n sans-serif;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n\n background-color: #282c34;\n color: white;\n}\n\n#parent {\n display: grid;\n grid-template-rows: 150px auto;\n grid-template-areas: \"header\"\n \"main\";\n}\n\nmain {\n grid-area: main;\n}\n\n:root {\n --nav-color: rgb(176, 194, 206);\n --nav-hover-color: darkgrey;\n}\n\nheader {\n grid-area: header;\n}\n\nheader h1 {\n margin-top: 50px;\n}\n\nmain {\n margin: 10px;\n}\n\n/*Navigation*/\nnav {\n list-style-type: none;\n margin: 0;\n padding: 0;\n overflow: visible;\n background-color: var(--nav-color);\n width: 100%;\n\n position: fixed;\n top: 0;\n height: 50px;\n\n z-index: 1;\n}\n\n/*main ul*/\nnav ul {\n height: 100%;\n margin: 0;\n padding: 0;\n}\n\n/*nav li item*/\nnav ul li {\n float: left;\n border-right: 1px solid gray;\n height: 100%;\n width: 15%;\n position: relative;\n display: inline-block;\n\n font-size: 1.8em;\n background-color: var(--nav-color);\n cursor: pointer;\n margin: auto;\n}\n\n/*nav li item on hover*/\nnav ul li:hover {\n background-color: darkgray;\n color: var(--nav-hover-color);\n transition-duration: 0.4s;\n}\n\n/*all nav a*/\nnav ul li a {\n display: block;\n text-align: center;\n text-decoration: none;\n color: black;\n width: 100%;\n height: 100%;\n background-color: var(--nav-color);\n border: none;\n cursor: pointer;\n}\n\n/*all nav a focus - remove outline so it looks like a normal link*/\nnav ul li a:focus {\n outline: 0;\n}\n\n/*all nav a hover*/\nnav ul li a:hover {\n background-color: var(--nav-hover-color);\n}\n\n/*drop menu*/\nnav ul li .content {\n display: none;\n background-color: var(--nav-color);\n z-index: 1;\n width: 100%;\n}\n\n/*drop menu main hover*/\nnav ul li:hover .content {\n display: block;\n}\n\n/*drop menu a*/\nnav ul li .content a {\n padding: 8px 0 8px 0;\n}",":root {\r\n --model-image-height: 200px;\r\n}\r\n\r\n.model {\r\n position: relative;\r\n text-align: center;\r\n color: white;\r\n display: inline-block;\r\n transform: scale(1);\r\n transition-duration: 0.1s;\r\n transition-timing-function: ease-out;\r\n}\r\n\r\n.model:hover {\r\n color: white;\r\n transform: scale(1.02);\r\n transition-duration: 0.1s;\r\n transition-timing-function: ease-out;\r\n}\r\n\r\n.model .model-info {\r\n visibility: hidden;\r\n\r\n height: 100%;\r\n width: 100%;\r\n\r\n position: absolute;\r\n top: 50%;\r\n left: 50%;\r\n transform: translate(-50%, -50%);\r\n\r\n line-height: var(--model-image-height);\r\n}\r\n\r\n.model:hover .model-info {\r\n visibility: visible;\r\n background-color: rgba(0, 0, 0, 0.5);\r\n}\r\n\r\n.model img {\r\n height: var(--model-image-height);\r\n}\r\n\r\n\r\n.model-info-text {\r\n vertical-align: middle;\r\n display: inline-block;\r\n\r\n font-size: 1.5em;\r\n}"]}