anatolykopyl/warframe-center
1
0
Fork 0
Code Issues Pull Requests Projects Releases Activity

scss variables

Browse Source
This commit is contained in:
Anatoly Kopyl
2022-03-13 22:49:28 +03:00
parent 773797757c
commit 6ce512cac4
13 changed files with 76 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
app/package-lock.json generated
View File

@@ -6,9 +6,9 @@
"": {
"dependencies": {
"next": "latest",
"normalize.css": "^8.0.1",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"reset-css": "^5.0.1",
"sass": "^1.49.9",
"shared-stuff": "file:../shared-stuff"
},
@@ -2422,11 +2422,6 @@
"node": ">=0.10.0"
}
},
"node_modules/normalize.css": {
"version": "8.0.1",
"resolved": "https://registry.npmjs.org/normalize.css/-/normalize.css-8.0.1.tgz",
"integrity": "sha512-qizSNPO93t1YUuUhP22btGOo3chcvDFqFaj2TRybP0DMxkHOCTYwp3n34fel4a31ORXy4m1Xq0Gyqpb5m33qIg=="
},
"node_modules/object-assign": {
"version": "4.1.1",
"integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=",
@@ -2770,6 +2765,11 @@
"url": "https://github.com/sponsors/mysticatea"
}
},
"node_modules/reset-css": {
"version": "5.0.1",
"resolved": "https://registry.npmjs.org/reset-css/-/reset-css-5.0.1.tgz",
"integrity": "sha512-VyuJdNFfp5x/W6e5wauJM59C02Vs0P22sxzZGhQMPaqu/NGTeFxlBFOOw3eq9vQd19gIDdZp7zi89ylyKOJ33Q=="
},
"node_modules/resolve": {
"version": "1.22.0",
"integrity": "sha512-Hhtrw0nLeSrFQ7phPp4OOcVjLPIeMnRlr5mcnVuMe7M/7eBn98A3hmFRLoFo3DLZkivSYwhRUJTyPyWAk56WLw==",
@@ -4830,11 +4830,6 @@
"version": "3.0.0",
"integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA=="
},
"normalize.css": {
"version": "8.0.1",
"resolved": "https://registry.npmjs.org/normalize.css/-/normalize.css-8.0.1.tgz",
"integrity": "sha512-qizSNPO93t1YUuUhP22btGOo3chcvDFqFaj2TRybP0DMxkHOCTYwp3n34fel4a31ORXy4m1Xq0Gyqpb5m33qIg=="
},
"object-assign": {
"version": "4.1.1",
"integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM="
@@ -5064,6 +5059,11 @@
"integrity": "sha512-pq2bWo9mVD43nbts2wGv17XLiNLya+GklZ8kaDLV2Z08gDCsGpnKn9BFMepvWuHCbyVvY7J5o5+BVvoQbmlJLg==",
"dev": true
},
"reset-css": {
"version": "5.0.1",
"resolved": "https://registry.npmjs.org/reset-css/-/reset-css-5.0.1.tgz",
"integrity": "sha512-VyuJdNFfp5x/W6e5wauJM59C02Vs0P22sxzZGhQMPaqu/NGTeFxlBFOOw3eq9vQd19gIDdZp7zi89ylyKOJ33Q=="
},
"resolve": {
"version": "1.22.0",
"integrity": "sha512-Hhtrw0nLeSrFQ7phPp4OOcVjLPIeMnRlr5mcnVuMe7M/7eBn98A3hmFRLoFo3DLZkivSYwhRUJTyPyWAk56WLw==",

2
app/package.json
View File

@@ -7,9 +7,9 @@
},
"dependencies": {
"next": "latest",
"normalize.css": "^8.0.1",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"reset-css": "^5.0.1",
"sass": "^1.49.9",
"shared-stuff": "file:../shared-stuff"
},

1
app/pages/_app.js
View File

@@ -1,3 +1,4 @@
import 'reset-css'
import '../styles/global.scss'
import Layout from '../components/layout'

4
app/pages/home/Hero.js
View File

@@ -1,9 +1,9 @@
import React from 'react'
import { Component } from 'react'
import Image from 'next/image'
import styles from './Hero.module.scss'
import logo from './assets/warframe_logo.png'
export default class Hero extends React.Component {
export default class Hero extends Component {
render () {
return (
<div className={styles.hero}>

15
app/pages/home/Hero.module.scss
View File

@@ -3,12 +3,15 @@
padding: 128px 0;
position: relative;
background: white;
color: black;
text-align: center;
overflow: hidden;
}
.text, .logo {
width: 400px;
margin: auto;
}
.text, .logo {
width: 400px;
margin: auto;
}
.text {
}
}

4
app/pages/home/ItemRow.js
View File

@@ -1,6 +1,6 @@
import React from 'react'
import { Component } from 'react'
export default class ItemRow extends React.Component {
export default class ItemRow extends Component {
constructor ({ scanResult }) {
super()
this.scanResult = scanResult

0
app/public/gunner1.png → app/pages/home/assets/gunner1.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.7 MiB

After

Width:  |  Height:  |  Size: 1.7 MiB

0
app/public/gunner2.png → app/pages/home/assets/gunner2.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.1 MiB

After

Width:  |  Height:  |  Size: 1.1 MiB

4
app/pages/home/index.js
View File

@@ -1,10 +1,10 @@
import React from 'react'
import { Component } from 'react'
import dbConnect from '../../lib/dbConnect'
import { models } from 'shared-stuff'
import Hero from './Hero'
import Table from './Table'
export default class Home extends React.Component {
export default class Home extends Component {
constructor ({ scanResults }) {
super()
this.scanResults = scanResults

1
app/styles/_colors.scss Normal file
View File

@@ -0,0 +1 @@
$clr-text: #1f1f1f;

22
app/styles/_fonts.scss Normal file
View File

@@ -0,0 +1,22 @@
$text-font: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto,
Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue,
sans-serif;
$font-h0: normal normal bold 56px/64px $text-font;
$font-h1: normal normal bold 48px/56px $text-font;
$font-h2: normal normal bold 40px/48px $text-font;
$font-h3: normal normal bold 36px/44px $text-font;
$font-h4: normal normal bold 32px/40px $text-font;
$font-h5: normal normal bold 28px/36px $text-font;
$font-h6: normal normal bold 24px/32px $text-font;
$font-h7: normal normal bold 20px/26px $text-font;
$font-h8: normal normal bold 18px/24px $text-font;
$font-h9: normal normal bold 16px/20px $text-font;
$font-r8: normal normal normal 24px/30px $text-font;
$font-r7: normal normal normal 22px/28px $text-font;
$font-r6: normal normal normal 20px/26px $text-font;
$font-r5: normal normal normal 18px/24px $text-font;
$font-r4: normal normal normal 16px/22px $text-font;
$font-r3: normal normal normal 14px/18px $text-font;
$font-r2: normal normal normal 12px/16px $text-font;

2
app/styles/_variables.scss Normal file
View File

@@ -0,0 +1,2 @@
@import './fonts';
@import './colors';

26
app/styles/global.scss
View File

@@ -1,12 +1,32 @@
@import './variables';
html,
body {
padding: 0;
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto,
Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue,
sans-serif;
font: $font-r4;
color: $clr-text;
}
* {
box-sizing: border-box;
}
h1 {
font: $font-h1;
}
h2 {
font: $font-h2;
}
h3 {
font: $font-h3;
}
h4 {
font: $font-h4;
}
h5 {
font: $font-h5;
}
h6 {
font: $font-h6;
}