diff --git a/config.toml b/config.toml new file mode 100644 index 0000000..2e4c528 --- /dev/null +++ b/config.toml @@ -0,0 +1,5 @@ +languageCode = "en-us" +title = "SimpleSystems, LLC" + +[markup.goldmark.renderer] +unsafe= true diff --git a/content/about/_index.md b/content/about/_index.md new file mode 100644 index 0000000..e69de29 diff --git a/content/blog/_index.md b/content/blog/_index.md new file mode 100644 index 0000000..e69de29 diff --git a/content/blog/cryptocurrency.md b/content/blog/cryptocurrency.md new file mode 100644 index 0000000..2da8dc4 --- /dev/null +++ b/content/blog/cryptocurrency.md @@ -0,0 +1,88 @@ +--- +img: /img/monero.png +title: Monero +author: Jeff Russo +pdate: Dec 1, 2019 +desc: This is why we accept crypto +--- + +Simple Systems will accept payment in +[Monero](https://web.getmonero.org/), +[Bitcoin](https://bitcoin.org/), or +[Litecoin](https://litecoin.org/). + +## What is cryptocurrency? +Cryptocurrency is a medium of exchange that uses cryptography to ensure the key [properties](https://en.wikipedia.org/wiki/Money#Properties) of money are fulfilled. +It is decentralized, meaning no single entity controls it; all the regulations come from cryptography and consensus. + +## Centralized fiat currencies +Today, governments across the world maintain different fiat currencies. +Fiat has some advantages over its predecessor, precious metals. +The government can control the supply, stabilizing the value. +It is also more portable than precious metals. +Carrying a bag of gold doesn't make sense when you can use Apple Pay or Google Pay. + +Unfortunately, fiat currencies always end in disaster. +The longest lasting fiat currency was around for 325 years, but its value eventually went to zero. +A currency which experiences hyperinflation eventually becomes worthless. +Here are a few examples of this happening: +* Z$100 trillion loaves of bread in Zimbabwe +* German Papiermark: The currency was inflated to the point of people getting paid in wheelbarrows of cash. + +

+ Wheelbarrow of Cash +

+ +* Venezuela could not afford to print money +* This video shows some recent history of inflation rates. + +The US Dollar is relatively strong, but its value has still been inflated away since its inception. +If you saved a dollar in 1913, it only has about 4 cents worth of buying power now. + +## Bitcoin - A Major Breakthrough +[Bitcoin](https://bitcoin.org/bitcoin.pdf) was a major breakthrough in both computing and money. +It's Proof of Work consensus algorithm is the backbone of most cryptocurrencies. +This method enables entities from around the world to agree on something. +For cryptocurrencies, that something is the possession of money. +An agreement on the ownership of about $150B has been reached every ten minutes for over a decade. + +Bitcoin's ledger is completely transparent. +When a transaction is created, the sender, receiver, and amount is made public. +This can be a problem for a few reasons. +First, it allows anyone to see how much money anyone else has. +If you get a cup of coffee, you most likely wouldn't advertise your bank account balance; why do this with crypto? +Secondly, this allows entities to discriminate based on transaction history. +Some bitcoin is considered tainted if it has been involved in illegal activities. +Organizations can refuse to do business with certain tainted bitcoin addresses. +By analogy, if you find a $10 bill on the ground and pick it up, should you be tied to its history? +If that $10 was in a bank robbery last year, should it be deemed to have less than $10 in value? + +## Monero - Fungible +[Monero](https://web.getmonero.org/) is cryptocurrency which was released a few years after Bitcoin. +It is [fungible](https://web.getmonero.org/resources/moneropedia/fungibility.html) unlike Bitcoin, meaning each unit of currency is of equal value as the others. +This is achieved by keeping the ledger private. +Transactions are put out in the open like Bitcoin, but the details are encrypted. +This means there is no way to discriminate against a user based on their financial history. + +Monero is private by default, but has the ability to reveal transactions at your discretion. +In the case of a business, it may be required to show the "books". +This is simple with a view key that can be used to show incoming transactions. + +## Be your own bank +One of the advantages to using cryptocurrency is that you are your own bank. +As long as you hold your private keys, your funds are safe. +With today's computing power, you will be long gone before [your key is guessed](https://bitcoin.stackexchange.com/questions/2847/how-long-would-it-take-a-large-computer-to-crack-a-private-key). + +Credit card companies and banks get [hacked](https://www.washingtonpost.com/national-security/capital-one-data-breach-compromises-tens-of-millions-of-credit-card-applications-fbi-says/2019/07/29/72114cc2-b243-11e9-8f6c-7828e68cb15f_story.html), and when they do the consequences are serious. +When you are your own bank, there is no middle man, and it is your responsibility to secure your finances. +As mentioned earlier, the Bitcoin network has not gone down in over a decade. Monero has a similar track record. +This 24/7 availability gives you 24/7 access. + +## Conclusion +I think cryptocurrencies are the future of money. +They are superior to fiat in so many ways. +There are almost no barriers to entry; Essentially anyone with internet access can use crypto. +For myself and my company, this makes it very easy to be my own bank. + +We will accept crypto because we believe it is only a matter of time before the world starts converting from fiat to it. +Our preference is Monero because we see it as technologically superior. diff --git a/content/blog/simplicity.md b/content/blog/simplicity.md new file mode 100644 index 0000000..7fd9e19 --- /dev/null +++ b/content/blog/simplicity.md @@ -0,0 +1,10 @@ +--- +img: /img/settings.png +title: "Simplicity" +author: Jeff Russo +pdate: Dec 7, 2019 +desc: What is a simple system? +--- + +A simple system is an encapsulation of complexity. +It presents to the user an uncomplicated interface. diff --git a/content/jobs/front-end-engineer.md b/content/jobs/front-end-engineer.md new file mode 100644 index 0000000..d15a3ca --- /dev/null +++ b/content/jobs/front-end-engineer.md @@ -0,0 +1,37 @@ +--- +title: Front End Engineer +icon: desktop_mac +desc: As a front end engineer, your mission is to create meaningful web interfaces. You’ll work with project leaders and back end engineers to bring projects to life. +--- + +# Front End Engineer +--- + +### About the company +Simple Systems is a software company. +Our mission is to deliver simple solutions for complex problems. + +### About the job +As a front end engineer, your mission is to create meaningful web interfaces. +You’ll work with project leaders and back end engineers to bring projects to life. + +### Expectations +* Work with project leaders to gain understanding of their vision +* Bring that vision to the web +* Work with backend engineers to connect services to the UI +* Own the code you write +* Review code from other front end engineers +* Suggest improvements throughout codebase +* Be open to suggestions for your code + +### Competencies +* Ownership mentality: Take responsibility for what you do. +* Clear communication: Software engineering is a team process. Be able to communicate with teammates. +* Constant learning: Keep up to date on technologies. +* Lazy programming: Think before you code. +* Testing: Unit tests are a must. Testing logic is important too. +* Documentation: Other engineers should be able to pick up your code without hassle. +* Currently we use Vue.js, but are more concerned with fundamentals than specific technology. + +### Interested? +Email a resume and brief description about yourself to jobs@simplesystems.tech. diff --git a/content/portfolio/_index.md b/content/portfolio/_index.md new file mode 100644 index 0000000..9a2a750 --- /dev/null +++ b/content/portfolio/_index.md @@ -0,0 +1,10 @@ +{ + "projects": [ + { + "title": "SBA Ponderay", + "img": "https://sbaponderay.com/img/sba-ponderay.png", + "desc": "SBA Ponderay is a Jiu Jitsu gym in Ponderay, ID. It specializes in the Progressive System of Brazilian Jiu Jitsu. Simple Systems' owner trains there several times a week.", + "href": "https://sbaponderay.com/" + } + ] +} diff --git a/content/services/_index.md b/content/services/_index.md new file mode 100644 index 0000000..5c387e1 --- /dev/null +++ b/content/services/_index.md @@ -0,0 +1,45 @@ +{ + "services": [ + { + "title": "Software", + "img": "/img/monitor.png", + "desc": [ + "We are passionate about creating software to solve problems. We have experience in a broad range of software environments including web, database, machine automation, and backend services.", + "Simple Systems can consult with you on a comprehensive solution that fits your business needs. Our process is flexible and will be tuned to the problem we're solving. Once the system is complete, we can deliver it, or manage it for you." + ], + "links": [ + { "text": "Our Projects", "href": "https://git.simplesystems.tech/SimpleSystems" } + ] + }, + { + "title": "Websites", + "img": "/img/website.png", + "desc": [ + "Every business needs a web presence. It is one of the most effective ways to drive customers to your business.", + "It can be a deterrent if it is not high quality though! Over half of users will abandon your site if it does not load in under 3 seconds. It is crucial that the website displays quickly and looks good.", + "Simple Systems can improve your prospective clients' experience by building a website from scratch, or cleaning up the existing one. We can handle all the hosting for you too!" + ], + "links": [ + { "text": "Our Portfolio", "href": "/portfolio/" } + ] + }, + { + "title": "Data Management", + "img": "/img/database.png", + "desc": [ + "The manner in which you store your data will affect business performance. If it is unorganized, accessing it can be slow. This can impair future upgrades and additions to your application. Make sure your data is organized and, most importantly, secured.", + "Storage systems are evolving all the time, and moving to a new one may save a lot of money. Data migrations are tricky, and can lose data if done incorrectly. It is important to have a documented process and verification everything worked.", + "Simple Systems can pick the right type of database for your needs, design it, and deploy it. After it is deployed and tested, we can maintain it as your data needs change. We can also work with you to increase the performance of your current solution, or migrate it to something better." + ] + }, + { + "title": "Engineering Discipline", + "img": "/img/checklist.png", + "desc": [ + "Sometimes it is important to move fast and get features done quickly. This mode of operation will build technical debt that must eventually be paid. Code will become fragile and unmanageable. The epitome of this development pace is rewriting a project from scratch because it has become cheaper to do so than maintain.", + "Disciplined engineers do not let this happen. They are patient, calculating, and write code deliberately. This will allow features to be released faster in the future.", + "Simple Systems can help guide your team on these practices. We have the experience of small startups all the way to fortune 50 companies." + ] + } + ] +} diff --git a/data/home/ssattrs.json b/data/home/ssattrs.json new file mode 100644 index 0000000..64c00a3 --- /dev/null +++ b/data/home/ssattrs.json @@ -0,0 +1,22 @@ +[ + { + "title": "Comprehensible Interaction", + "img": "/img/interact.png", + "desc": "The interface to software should be clear, without surprises. Engineers working on the project should not be deciphering code. Documentation is implied as part of the system, enabling all users to understand the software package better." + }, + { + "title": "Straightforward Modification", + "img": "/img/tools.png", + "desc": "Software should handle changes smoothly. Great software feels like it was designed for future changes. The documentation will instruct an engineer's strategy, removing ambiguity of how something works." + }, + { + "title": "Robust", + "img": "/img/robust.png", + "desc": "Load spikes, accidental misuse, and business growth should not bring software crashing to the ground. Systems should be designed to handle faults gracefully. If there are errors, they should be reported clearly." + }, + { + "title": "Leveraged by Other Systems", + "img": "/img/leverage.png", + "desc": "When software simply does its job, and does it well, it will be an asset to other systems. When software becomes convoluted, it will hinder other systems." + } +] diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html new file mode 100644 index 0000000..0dd2df1 --- /dev/null +++ b/layouts/_default/baseof.html @@ -0,0 +1,29 @@ + + + + + + + + + + + + {{ block "title" . }} + {{ .Site.Title }} + {{ end }} + + + + {{ partial "navbar/site-navbar.html" . }} + +
+ {{ block "main" . }} + + {{ end }} +
+ + {{ partial "footer/site-footer.html" . }} + {{ partial "scripts/scripts.html" . }} + + diff --git a/layouts/_default/section.html b/layouts/_default/section.html new file mode 100644 index 0000000..e30bf06 --- /dev/null +++ b/layouts/_default/section.html @@ -0,0 +1,26 @@ +{{ define "main" }} + {{ .Content }} + +
+
+ {{ range .Pages }} +
+ +
+
+ + {{ .Title }} +
+ +
+ +
+ {{ .Params.desc }} ... +
+
+ +
+ {{ end }} +
+
+{{ end }} diff --git a/layouts/_default/single.html b/layouts/_default/single.html new file mode 100644 index 0000000..7b60c10 --- /dev/null +++ b/layouts/_default/single.html @@ -0,0 +1,9 @@ +{{ define "main" }} +
+
+
+ {{ .Content }} +
+
+
+{{ end }} diff --git a/layouts/blog/single.html b/layouts/blog/single.html new file mode 100644 index 0000000..9c58e2f --- /dev/null +++ b/layouts/blog/single.html @@ -0,0 +1,35 @@ +{{ define "main" }} +
+
+
+ +
+ +
+

{{ .Params.title }}

+
+
+ +
+
+ by {{ .Params.author }} + | + {{ .Params.pdate }} +
+
+ +
+
+
+
+
+ +
+
+
+ {{ .Content }} +
+
+
+
+{{ end }} diff --git a/layouts/index.html b/layouts/index.html new file mode 100644 index 0000000..8ab3285 --- /dev/null +++ b/layouts/index.html @@ -0,0 +1,4 @@ +{{ define "main" }} + {{ partial "jumbotron.html" . }} + {{ partial "simple-software.html" . }} +{{ end }} diff --git a/layouts/partials/cards/app-card.html b/layouts/partials/cards/app-card.html new file mode 100644 index 0000000..e70306c --- /dev/null +++ b/layouts/partials/cards/app-card.html @@ -0,0 +1,12 @@ +
+
+ + {{ .title }} +
+ +
+ +
+ {{ .desc }} ... +
+
diff --git a/layouts/partials/cards/home-card.html b/layouts/partials/cards/home-card.html new file mode 100644 index 0000000..3fa6de0 --- /dev/null +++ b/layouts/partials/cards/home-card.html @@ -0,0 +1,13 @@ +
+
+ +
+ +
+

{{ .title }}

+
+ +
+

{{ .desc }}

+
+
diff --git a/layouts/partials/cards/job.html b/layouts/partials/cards/job.html new file mode 100644 index 0000000..c36dc84 --- /dev/null +++ b/layouts/partials/cards/job.html @@ -0,0 +1,12 @@ +
+
+ {{ .icon }} + {{ .title }} +
+ +
+ +
+ {{ .desc }} +
+
diff --git a/layouts/partials/cards/portfolio-card.html b/layouts/partials/cards/portfolio-card.html new file mode 100644 index 0000000..22017bc --- /dev/null +++ b/layouts/partials/cards/portfolio-card.html @@ -0,0 +1,19 @@ +
+
+ + {{ .title }} + +
+ + + Visit Site + launch + +
+ +
+ +
+ {{ .desc }} +
+
diff --git a/layouts/partials/cards/services-card.html b/layouts/partials/cards/services-card.html new file mode 100644 index 0000000..442e5d4 --- /dev/null +++ b/layouts/partials/cards/services-card.html @@ -0,0 +1,22 @@ +
+
+ + {{ .title }} +
+ +
+ +
+ {{ range .desc }} +

{{ . }}

+ {{ end }} +
+ +
+ {{ range .links }} +
+ {{ .text }} +
+ {{ end }} +
+
diff --git a/layouts/partials/footer/site-footer.html b/layouts/partials/footer/site-footer.html new file mode 100644 index 0000000..1576d08 --- /dev/null +++ b/layouts/partials/footer/site-footer.html @@ -0,0 +1,18 @@ +
+
+
+
+ +
+

Contact Us

+ +
+ mail_outline + info@simplesystems.tech +
+
+ +
+
+
+
diff --git a/layouts/partials/jumbotron.html b/layouts/partials/jumbotron.html new file mode 100644 index 0000000..c5be80e --- /dev/null +++ b/layouts/partials/jumbotron.html @@ -0,0 +1,35 @@ +
+
+
+
+
+
+

Simple

+

Systems

+

LLC

+
+ +
+

Simple Systems, LLC

+
+
+
+ +
+
+
+ business + +
We build software that businesses understand and engineers want to use.
+ + + mail_outline + Email Us: + info@simplesystems.tech + +
+
+
+
+
+
diff --git a/layouts/partials/navbar/site-navbar.html b/layouts/partials/navbar/site-navbar.html new file mode 100644 index 0000000..191edac --- /dev/null +++ b/layouts/partials/navbar/site-navbar.html @@ -0,0 +1,45 @@ + + + + + diff --git a/layouts/partials/scripts/scripts.html b/layouts/partials/scripts/scripts.html new file mode 100644 index 0000000..4179e63 --- /dev/null +++ b/layouts/partials/scripts/scripts.html @@ -0,0 +1,66 @@ + diff --git a/layouts/partials/simple-software.html b/layouts/partials/simple-software.html new file mode 100644 index 0000000..a384751 --- /dev/null +++ b/layouts/partials/simple-software.html @@ -0,0 +1,16 @@ +
+
+
+

Software Should be Simple

+
+
+
+ +
+ {{ range $.Site.Data.home.ssattrs }} +
+ {{ partial "cards/home-card.html" . }} +
+ {{ end }} +
+
diff --git a/layouts/section/about.html b/layouts/section/about.html new file mode 100644 index 0000000..2d679a6 --- /dev/null +++ b/layouts/section/about.html @@ -0,0 +1,60 @@ +{{ define "main" }} +
+
+
+

Our mission is to deliver simple solutions for complex problems.

+
+
+ +
+
+
+
+
+ +
+ +
+

“Any darn fool can make something complex;
It takes a genius to make something simple.”

+
+

-- Albert Einstein

+
+
+
+
+
+ +
+
+
+
+
+ +
+
+

The Team

+
+
+ +
+
+
+
+
+ +
+ +
+

Jeff

+
+

My name is Jeff Russo. I am the founder of Simple Systems, LLC. I've been a software engineer for about a decade, and I'm still passionate about it!

+

I've worked at several companies in my career. Some were three man startup teams, and some were fortune 50 enterprises. At each job, I learned many things, and now I can apply that knowledge to my own company! I pursue excellence in all that I do, and this adventure will be no different.

+

The biggest thing I saw at all levels of business was unnecessary complexity. It demoralizes teams and can bring your software to a crashing halt. My mission is to deliver software that is simple, to both the business, and the engineers that have to use it.

+
+
+
+
+
+
+
+{{ end }} diff --git a/layouts/section/blog.html b/layouts/section/blog.html new file mode 100644 index 0000000..3f295f9 --- /dev/null +++ b/layouts/section/blog.html @@ -0,0 +1,21 @@ +{{ define "main" }} + {{ .Content }} + +
+
+
+

Blog

+
+
+ +
+ {{ range .Pages }} +
+ + {{ partial "cards/app-card.html" .Params }} + +
+ {{ end }} +
+
+{{ end }} diff --git a/layouts/section/jobs.html b/layouts/section/jobs.html new file mode 100644 index 0000000..39684f9 --- /dev/null +++ b/layouts/section/jobs.html @@ -0,0 +1,21 @@ +{{ define "main" }} + {{ .Content }} + +
+
+
+

Jobs

+
+
+ +
+ {{ range .Pages }} +
+ + {{ partial "cards/job.html" .Params }} + +
+ {{ end }} +
+
+{{ end }} diff --git a/layouts/section/portfolio.html b/layouts/section/portfolio.html new file mode 100644 index 0000000..fb1c744 --- /dev/null +++ b/layouts/section/portfolio.html @@ -0,0 +1,18 @@ +{{ define "main" }} +
+
+
+

Our Portfolio

+
+
+
+ +
+ {{ range .Params.projects }} +
+ {{ partial "cards/portfolio-card.html" . }} +
+ {{ end }} +
+
+{{ end }} diff --git a/layouts/section/services.html b/layouts/section/services.html new file mode 100644 index 0000000..b8b47b4 --- /dev/null +++ b/layouts/section/services.html @@ -0,0 +1,17 @@ +{{ define "main" }} +
+
+
+

What We Do

+
+
+ +
+ {{ range .Params.services }} +
+ {{ partial "cards/services-card.html" . }} +
+ {{ end }} +
+
+{{ end }} diff --git a/static/favicon.ico b/static/favicon.ico new file mode 100644 index 0000000..d3f7763 Binary files /dev/null and b/static/favicon.ico differ diff --git a/static/icons.css b/static/icons.css new file mode 100644 index 0000000..c8cb6f8 --- /dev/null +++ b/static/icons.css @@ -0,0 +1,23 @@ +/* fallback */ +@font-face { + font-family: 'Material Icons'; + font-style: normal; + font-weight: 400; + src: url(https://fonts.gstatic.com/s/materialicons/v50/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format('woff2'); +} + +.material-icons { + font-family: 'Material Icons'; + font-weight: normal; + font-style: normal; + font-size: 24px; + line-height: 1; + letter-spacing: normal; + text-transform: none; + display: inline-block; + white-space: nowrap; + word-wrap: normal; + direction: ltr; + -moz-font-feature-settings: 'liga'; + -moz-osx-font-smoothing: grayscale; +} diff --git a/static/img/background-grey.png b/static/img/background-grey.png new file mode 100644 index 0000000..f3ab6fd Binary files /dev/null and b/static/img/background-grey.png differ diff --git a/static/img/checklist.png b/static/img/checklist.png new file mode 100644 index 0000000..5757e38 Binary files /dev/null and b/static/img/checklist.png differ diff --git a/static/img/database.png b/static/img/database.png new file mode 100644 index 0000000..dcbaf5f Binary files /dev/null and b/static/img/database.png differ diff --git a/static/img/hyperinflation_wheelbarrow.jpg b/static/img/hyperinflation_wheelbarrow.jpg new file mode 100644 index 0000000..84cb40e Binary files /dev/null and b/static/img/hyperinflation_wheelbarrow.jpg differ diff --git a/static/img/interact.png b/static/img/interact.png new file mode 100644 index 0000000..f7b08de Binary files /dev/null and b/static/img/interact.png differ diff --git a/static/img/jeff-snow.jpg b/static/img/jeff-snow.jpg new file mode 100644 index 0000000..66b8ae6 Binary files /dev/null and b/static/img/jeff-snow.jpg differ diff --git a/static/img/leverage.png b/static/img/leverage.png new file mode 100644 index 0000000..0111261 Binary files /dev/null and b/static/img/leverage.png differ diff --git a/static/img/monero.png b/static/img/monero.png new file mode 100644 index 0000000..e6a8126 Binary files /dev/null and b/static/img/monero.png differ diff --git a/static/img/monitor.png b/static/img/monitor.png new file mode 100644 index 0000000..b481fb6 Binary files /dev/null and b/static/img/monitor.png differ diff --git a/static/img/robust.png b/static/img/robust.png new file mode 100644 index 0000000..43ea148 Binary files /dev/null and b/static/img/robust.png differ diff --git a/static/img/rocket.png b/static/img/rocket.png new file mode 100644 index 0000000..3e383d8 Binary files /dev/null and b/static/img/rocket.png differ diff --git a/static/img/settings.png b/static/img/settings.png new file mode 100644 index 0000000..98c9fb1 Binary files /dev/null and b/static/img/settings.png differ diff --git a/static/img/tools.png b/static/img/tools.png new file mode 100644 index 0000000..44dbed7 Binary files /dev/null and b/static/img/tools.png differ diff --git a/static/img/website.png b/static/img/website.png new file mode 100644 index 0000000..678a96f Binary files /dev/null and b/static/img/website.png differ diff --git a/static/light-theme.css b/static/light-theme.css new file mode 100644 index 0000000..c8bbf16 --- /dev/null +++ b/static/light-theme.css @@ -0,0 +1,65 @@ +@media (prefers-color-scheme: dark) { + #thToggle { + } + body { + background: #303030; + color: #eee; + } + + p { color: #ccc } + + hr { border-color: #6c6c6c } + + .card { + --bgclr: #444; + color: white; + } + .card-title { + background: #555; + } + + .navbar { + background: #222; + } + .navbar-title, .navbar-items *, .drawer-items * { + color: #fff; + } + + .jtron { + background: linear-gradient(to bottom, rgba(15, 15, 15, 0.55), rgba(48, 48, 48, 0.75)), url(/img/background-grey.png) center center no-repeat; + } + .jtron-right { + background: rgba(0, 0, 0, 0.25); + } +} + +body.dark { + background: #303030; + color: #eee; +} + +p.dark { color: #ccc } + +hr.dark { border-color: #6c6c6c } + +.card.dark { + --bgclr: #444; + color: white; +} +.card-title.dark { + background: #555; +} + +.navbar.dark { + background: #222; +} +.navbar-title.dark, .navbar-items.dark *, .drawer-items.dark * { + color: #fff; +} + +.jtron.dark { + background: linear-gradient(to bottom, rgba(15, 15, 15, 0.55), rgba(48, 48, 48, 0.75)), url(/img/background-grey.png) center center no-repeat; +} +.jtron-right.dark { + background: rgba(0, 0, 0, 0.25); +} diff --git a/static/simplesystems.css b/static/simplesystems.css new file mode 100644 index 0000000..d967d4d --- /dev/null +++ b/static/simplesystems.css @@ -0,0 +1,336 @@ +* { + box-sizing: border-box; +} + +html, body { + height: 100%; +} + +body, body.light { + background: #f8f8f8; + color: #333; +} +body { + font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Oxygen-Sans,Cantarell,Ubuntu,Helvetica Neue,Roboto,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji !important; + margin: 0; + padding: 0; + display: flex; + flex-direction: column; +} + +main { + flex: 1 0 auto; + padding-top: 64px; +} + +a { + color: #2196f3; + text-decoration: none; +} + +img { max-width: 100% !important } + +p, p.light { color: #555 } + +h1 { font-weight: normal; font-size: 2.5rem; } +h2 { font-weight: normal; font-size: 2.25rem; } + +hr, hr.light { + border-color: rgba(0, 0, 0, 0.2); + border-width: thin 0 0 0; + border-style: solid; + display: block; + margin: 0; + max-height: 0px; + max-width: 100%; +} + +.d-flex { display: flex !important } +.d-inline-flex { display: inline-flex !important } +.d-inline-block { display: inline-block !important } +.d-none { display: none !important } + +.flex-column { display: flex !important; flex-direction: column !important } + +.container { + margin: auto; + max-width: 1200px; + width: 100%; +} +.blog.container { max-width: 800px; padding-top: 2rem; } + +.row { + display: flex; + flex-flow: row wrap; +} + +.col { flex: 0 1 auto; padding: 0.75rem; } +.col.xs-12 { width: 100% !important } +.col.xs-6 { width: 50% !important } +.col.shrink { flex: 0 0 auto !important } +@media (min-width: 600px) { + .col.sm-content { flex-basis: content !important } + .col.sm-grow { flex-grow: 1 !important; flex-basis: 0 !important; } + .col.sm-shrink { flex: 0 0 auto !important; } + .col.sm-6 { width: 50% !important } + .col.sm-9 { width: 75% !important } + .col.sm-10 { width: 83.3334% !important } + + .text-sm-center { text-align: center !important; } + .justify-sm-center { justify-content: center !important; } +} +@media (min-width: 950px) { + .col.md-content { flex-basis: content !important } + .col.md-grow { flex-grow: 1 !important; flex-basis: 0 !important; } + .col.md-shrink { flex: 0 0 auto !important; } + .col.md-3 { width: 25% !important } + .col.md-4 { width: 33.3334% !important } + .col.md-6 { width: 50% !important } + .col.md-8 { width: 66.6667% !important } + .col.md-9 { width: 75% !important } + + .hide-md-and-up { display: none; } +} +@media (min-width: 1250px) { + .col.lg-6 { width: 50% !important } +} + +@media (max-width: 949px) { + .hide-sm-and-down { display: none; } +} + +.spacer { flex-grow: 1 !important } + +.align-center { align-items: center !important } +.justify-center { justify-content: center !important } +.justify-end { justify-content: end !important } +.text-center { text-align: center !important } +.text-right { text-align: right !important } + +.title { font-size: 1.25rem } +.headline { font-size: 1.5rem } + +.mx-auto { margin: auto !important } +.ml-4 { margin-left: 1rem !important } +.mr-4 { margin-right: 1rem !important } +.mt-4 { margin-top: 1rem !important } +.mt-8 { margin-top: 2rem !important } + +.pa-4 { padding: 1rem !important } +.pb-4 { padding-bottom: 1rem !important } +.pr-4 { padding-right: 1rem !important } + +.overlay { + background-color: rgba(0,0,0,0.4); + + display: flex; + + position: fixed; + left: 0; + top: 0; + z-index: 5; + + width: 100%; + height: 100%; + overflow: auto; +} + +.card, .card.light { + --bgclr: white; + background: var(--bgclr); + border-radius: 4px; + color: #555; + display: block; + max-width: 100%; + outline: none; + overflow-wrap: break-word; + position: relative; + text-decoration: none; + width: 100%; + height: 100%; + + transition-property: box-shadow; + transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1); + will-change: box-shadow; + box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); +} +.card.blue { --bgclr: #1E88E5 !important; color: white !important; } +.card.outlined { + border: 1px solid rgba(0, 0, 0, 0.12); + box-shadow: none; +} +.card-title, .card-text { + padding: 1rem; +} +.card-title, .card-title.light { + background: #f2f2f2; + border-radius: 4px 4px 0 0 !important; + display: flex; + font-size: 1.5rem; +} +.card-text p { + text-indent: 12pt; +} + +.navbar, .navbar.light { + color: white; + background: #222; + display: flex; + align-items: center; + padding: 1.1rem 1.5rem; + box-shadow: 0 2px 4px -1px rgba(0,0,0,.2),0 4px 5px 0 rgba(0,0,0,.35),0 1px 10px 0 rgba(0,0,0,.12); + position: fixed; + top: 0; + width: 100%; + height: 64px !important; + z-index: 2; +} +.navbar-title { + font-size: 1.4rem; +} +.navbar-items { + font-size: 1.1rem; +} +.navbar-items a { + color: white; + margin-left: 2rem; +} +.navbar-items a:hover, .navbar-items.light a:hover { color: #555 } + +#navDrawer { padding-top: 64px } +.drawer { + background: #333; + color: #ddd; + + position: fixed; + top: 0; + right: 0; + z-index: 6; + + min-width: 350px; + max-width: 350px; + max-height: 100%; + height: 100%; + + transition: transform 0.3s; + transform: translate(100%); +} +.drawer-items a { + color: white; + display: block; + font-size: 1.25rem; + padding: 1rem; + padding-right: 3rem; + text-align: right; +} +.drawer-items a:hover { + background: grey; +} + +.footer { + background: #111; + color: white !important; + flex-shrink: 0; + margin-top: 3rem; + padding-top: 2rem; + padding-bottom: 2rem; +} +.footer .contact { + padding-bottom: 2rem !important; +} + +.jtron, .jtron.light { + background: linear-gradient(to bottom, rgba(25, 25, 25, 0.25), rgba(250, 250, 250, 0.75)), url(/img/background-grey.png) center center no-repeat; +} +.jtron { + padding-top: 9rem; + padding-bottom: 9rem; +} +.jtron h1 { + font-size: 4rem; + font-weight: normal; +} +.jtron h3 { + font-size: 2rem; +} +.jtron h3, .jtron h1 { + display: block; + margin: 0; +} +.jtron-content { + padding-top: 1rem; + padding-bottom: 1rem; +} +.jtron-left { + width: 100%; + max-width: 600px; +} +.jtron-right, .jtron-right.light { + background: rgba(190, 190, 190, 0.5); + font-size: 1.75rem; + max-width: 600px; + text-align: center; + height: 100%; + display: flex; + align-items: center; + padding: 1rem; + padding-top: 1.5rem; + padding-bottom: 1.5rem; + width: 100%; + margin: auto; +} +@media (max-width: 1249px) { + .jtron { + padding-top: 1.5rem; + padding-bottom: 1.5rem; + } +} + +.article {} +.article h1, +.article h2, +.article h3 { + margin-top: 2.5rem; + margin-bottom: 1rem; +} +.article p { + text-indent: 16pt; +} +p.no-indent { + text-indent: 0; +} + +.material-icons.sm { font-size: 0.925rem } +.material-icons { font-size: 1.75rem } +.material-icons.lg { font-size: 2.25rem } +.material-icons.xl { font-size: 3rem } + +button::-moz-focus-inner, .btn::-moz-focus-inner { + border: none; + outline: 0 !important; +} +button, .btn { + --clr: #777; + border: 1px solid var(--clr); + border-radius: 4px; + background: var(--clr); + color: white; + cursor: pointer; + display: inline-flex; + align-items: center; + margin: 0; + padding: 0.5rem 1rem; +} +button.lg, .btn.lg { font-size: 1.1rem } +button.flat, .btn.flat { + background: none; + border: none; + padding: 0.25rem !important; +} +button.round, .btn.round { + border: none; + border-radius: 50%; + padding: 0.75rem; +} + +.blue { --clr: #42A5F5 }