Skip to content
Snippets Groups Projects
Verified Commit d31e46f4 authored by Jakob Görgen's avatar Jakob Görgen
Browse files

different border radius for card and button

parent 10fdf654
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
_posts/2024-10-30-networking-case-study.md
+ 1
− 1
View file @ d31e46f4
......@@ -5,7 +5,7 @@ subtitle: |
date: 2024-10-30
author: jakob
permalink: /blog/networking-case-study.html
card_image: TODO
card_image: /assets/images/blog/vp-complex-network-systems.png
---
Modern networks are becoming increasingly complex, with a multitude of devices and protocols. Understanding these in-depth is challenging and requires deep visibility into such systems, especially if physical prototypes are out of reach. Therefore it’s essential for engineers to have tools that allow them to analyze and optimize such systems. Virtual prototyping offers a way to create flexible software representations of such systems to provide the required visibility into such systems, as discussed in a previous [blog post](https://www.simbricks.io/blog/deep-visibility-virtual-prototypes.html). The creation of these virtual prototypes is however challenging, requiring to simulate all components involved that influence the systems behavior. In this blog post we look at how to easily create virtual prototypes of such systems with SimBricks.
......
_sass/base-design.scss
+ 7
− 8
View file @ d31e46f4
......@@ -31,12 +31,15 @@ $col-sb-gre_d1: hsl(77, 58%, 38%) !default;
$col-sb-gre_d2: hsl(77, 58%, 32%) !default;
$col-sb-gre_d3: hsl(77, 58%, 26%) !default;
$col-car-bg: #f9fafb;
$font-title: 'Exo 2', sans-serif;
$font-main: 'Roboto Flex', sans-serif;
$font-fa: 'Font Awesome 6 Free';
$font-fab: 'Font Awesome 6 Brands';
$border-radius: 8px;
$border-radius-card: 20px;
$border-radius-button: 8px;
$shadow-color: rgba(0, 0, 0, 0.1);
html {
......@@ -225,7 +228,7 @@ nav#navbar {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
a {
border-radius: $border-radius;
border-radius: $border-radius-button;
padding: 4px 8px;
}
}
......@@ -261,11 +264,7 @@ nav#navbar {
header.page-header {
background-image: url('/assets/images/bricks_tumbling_outline.svg');
background-repeat: no-repeat;
background-position: center right;
@include sec-bluegradient;
@include sec-grey-l1-gradient;
div.container {
div.text {
p.subtitle {
......@@ -351,7 +350,7 @@ section.faq {
div {
padding: 1rem;
border: 2px $col-sb-org solid;
border-radius: $border-radius;
border-radius: $border-radius-card;
background-color: white;
h3 {
......
_sass/base-form.scss
+ 5
− 5
View file @ d31e46f4
......@@ -3,7 +3,7 @@ $info-input-text-size: 18px;
.form-card {
width: auto;
background-color: #fff;
border-radius: $border-radius;
border-radius: $border-radius-card;
box-shadow: 0px 4px 8px $shadow-color;
padding: 20px;
}
......@@ -69,7 +69,7 @@ $info-input-text-size: 18px;
width: 100px;
font-size: $info-input-text-size;
border: 1px solid lightgray;
border-radius: $border-radius;
border-radius: $border-radius-button;
color: white;
background-color: $col-sb-org-l1;
}
......@@ -85,11 +85,11 @@ $info-input-text-size: 18px;
.frc-captcha {
border: 1px solid lightgray;
border-radius: $border-radius;
border-radius: $border-radius-button;
.frc-button {
border: 1px solid lightgray;
border-radius: $border-radius;
border-radius: $border-radius-button;
color: white;
background-color: $col-sb-org-l1;
}
......@@ -108,7 +108,7 @@ $info-input-text-size: 18px;
color: white;
font-size: $info-input-text-size;
border: 1px solid lightgray;
border-radius: $border-radius;
border-radius: $border-radius-card;
text-align: center;
}
......
_sass/base-layout.scss
+ 2
− 1
View file @ d31e46f4
......@@ -127,10 +127,11 @@ header.page-header {
margin: 0;
}
h1 {
text-align: center;
margin: 0.5rem 0rem;
}
p.subtitle {
text-align: right;
text-align: center;
padding-top: 2rem;
padding-right: 0rem;
padding-left: 4rem;
......
_sass/blog.scss
+ 6
− 6
View file @ d31e46f4
......@@ -13,7 +13,7 @@ article.blog {
flex-direction: row;
align-items: center;
justify-content: center;
border-radius: $border-radius;
border-radius: $border-radius-card;
border: 1px solid $col-os-grey_l2;
box-shadow: 1px 1px 4px $col-os-grey_l2;
max-width: 100%;
......@@ -22,12 +22,12 @@ article.blog {
a {
overflow: hidden;
border-radius: $border-radius;
border-radius: $border-radius-card;
width: calc((#{$width} / 2) - 10px);
img {
width: 100%;
border-radius: $border-radius;
border-radius: $border-radius-card;
object-fit: cover;
}
......@@ -97,7 +97,7 @@ article.blog {
max-width: 90%;
display: flex;
flex-direction: column;
border-radius: $border-radius;
border-radius: $border-radius-card;
border: 1px solid $col-os-grey_l2;
box-shadow: 1px 1px 4px $col-os-grey_l2;
overflow: hidden;
......@@ -105,7 +105,7 @@ article.blog {
a {
img {
width: 100%;
border-radius: $border-radius;
border-radius: $border-radius-card;
object-fit: cover;
}
......@@ -210,7 +210,7 @@ article.blog-post {
div.call-to-action {
margin-top: 2rem;
border-radius: $border-radius;
border-radius: $border-radius-button;
a {
font-family: $font-title;
......
_sass/home.scss
+ 14
− 14
View file @ d31e46f4
......@@ -24,7 +24,7 @@ body.home {
div.container {
.card {
border-radius: $border-radius;
border-radius: $border-radius-card;
transition: 0.3s;
width: 80%;
margin: auto;
......@@ -50,7 +50,7 @@ body.home {
display: inline-block;
font-size: min(4vmin, 1.5em);
margin: 4px 2px;
border-radius: $border-radius;
border-radius: $border-radius-button;
width: fit-content;
}
......@@ -122,7 +122,7 @@ body.home {
width: calc($width/1.6);
max-width: 100%;
height: fit-content;
border-radius: $border-radius;
border-radius: $border-radius-card;
color: black;
background-color: $col-os-grey_l2;
overflow: scroll;
......@@ -131,7 +131,7 @@ body.home {
opacity: 1;
border: solid 2px;
border-color: $col-os-grey_l2;
border-radius: $border-radius;
border-radius: $border-radius-card;
padding-left: 10px;
padding-right: 10px;
}
......@@ -147,7 +147,7 @@ body.home {
.feature {
color: black;
padding: 10px;
border-radius: $border-radius;
border-radius: $border-radius-card;
border: solid 2px;
border-color: white;
width: 330px;
......@@ -202,7 +202,7 @@ body.home {
div.non-code-feature {
color: black;
padding: 10px;
border-radius: $border-radius;
border-radius: $border-radius-card;
border: solid 2px;
border-color: white;
width: 45%;
......@@ -264,8 +264,8 @@ body.home {
li {
width: $block-size;
min-height: calc(0.9 * $block-size);
background-color: #f9fafb;
border-radius: $border-radius;
background-color: $col-car-bg;
border-radius: $border-radius-card;
position: relative;
overflow: hidden;
......@@ -275,9 +275,9 @@ body.home {
line-height: 1.2;
div.bg {
background-image: url('/assets/images/tumbling_bricks.svg');
background-size: 205%;
opacity: .05;
// background-image: url('/assets/images/tumbling_bricks.svg');
// background-size: 205%;
// opacity: .05;
width: 100%;
height: 100%;
position: absolute;
......@@ -532,9 +532,9 @@ body.home {
margin: 0rem 0.5rem;
padding: 1rem;
border: 1px #e9e7e7 solid;
background-color: white;
border-radius: $border-radius;
// border: 1px #e9e7e7 solid;
background-color: $col-car-bg;
border-radius: $border-radius-card;
height: 16rem;
div.date {
......
_sass/research.scss
+ 2
− 2
View file @ d31e46f4
......@@ -4,8 +4,8 @@ article.research {
text-align: center;
padding: 10px;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
border-radius: $border-radius;
box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
border-radius: $border-radius-card;
div.people {
position: absolute;
......
_sass/technology.scss
+ 6
− 6
View file @ d31e46f4
......@@ -24,7 +24,7 @@ body.technology {
gap: 2rem;
video {
border-radius: $border-radius;
border-radius: $border-radius-card;
}
div {
......@@ -134,11 +134,11 @@ body.technology {
width: $block-size;
min-height: calc(0.9 * $block-size);
background-color: $col-sb-blu;
border-radius: $border-radius;
background-color: $col-car-bg;
border-radius: $border-radius-card;
background-image: url('/assets/images/bricks_outlines.svg');
background-size: 205%;
// background-image: url('/assets/images/bricks_outlines.svg');
// background-size: 205%;
margin: 0px;
color: white;
......@@ -278,7 +278,7 @@ section.coder {
@include sec-grey-l1-gradient;
.coder-card {
border-radius: $border-radius;
border-radius: $border-radius-card;
box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
transition: 0.3s;
img {
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment