Pour tout problème contactez-nous par mail : support@froggit.fr | La FAQ :grey_question: | Rejoignez-nous sur le Chat :speech_balloon:

Skip to content
Snippets Groups Projects
whoami.scss 1.93 KiB
Newer Older
  • Learn to ignore specific revisions
  • peter_rabbit's avatar
    peter_rabbit committed
    #whoami {
        padding: 20px 0 50px;
        .page-contents-center {
            padding: 40px;
            @include flex-center-col;
            h2 {
                text-align: center;
                background-color: $medium_grey;
                @include flex-center-col;
                width: 220px;
                height: 220px;
                border-radius: 100%;
                padding: 30px;
                margin: 40px 0;
                color: $blue_3;
            }
            .presentation-card {
                .header {
                    display: grid;
                    grid-template-columns: auto 1fr;
                    gap: 30px;
                    padding: 50px 0;
                    .pic {
                        @include flex-center-col;
                        img {
                            width: 150px;
                            height: auto;
                            border-radius: 100%;
                        }
                    }
                    .header-text {
                        h3 {
                            font-size: 22px;
                            color: $light_1;
                            margin: 0;
                        }
                        h4 {
                            font-size: 18px;
                        }
                        strong,
                        h4 {
                            color: $light_1;
                        }
                    }
                }
                .body {
                    p {
                        font-size: 18px;
                        font-style: italic;
                        font-family: serif;
                        color: $dark_3;
                        *:not(blue, a) {
                            color: $dark_3;
                        }
                    }
                }
            }
        }
        @media screen and (max-width: $screen_s) {
            .page-contents-center {
                .presentation-card {
                    .header {
                        @include flex-center-col;
                        .header-text {
                            text-align: center;
                        }
                    }
                }
            }
        }
    }