css changes

This commit is contained in:
asuk 2023-09-22 14:20:18 +02:00
parent 386bdd026b
commit 86d3e07f6f
16 changed files with 33 additions and 25 deletions

View file

@ -49,7 +49,7 @@ export const ItemSectionWithPreviews = (props: {
const SectionHeader = styled.h3<{collapsible: boolean}>`
font-family: 'Inter', sans-serif;
font-style: normal;
font-weight: 400;
font-weight: normal;
font-size: 16px;
line-height: 19px;
@ -75,7 +75,7 @@ const ItemDesc = styled.div`
font-family: 'Inter', sans-serif;
font-style: normal;
font-weight: 600;
font-weight: normal;
font-size: 15px;
line-height: 18px;
@ -85,7 +85,7 @@ const ItemDesc = styled.div`
& > p {
margin: 0;
font-weight: 400;
font-weight: normal;
font-size: 13px;
line-height: 16px;
/* identical to box height, or 123% */

View file

@ -19,9 +19,9 @@ const PlaygroundHeaderVersion = styled.div`
background: rgba(34, 103, 99, 0.38);
border-radius: 30px;
font-family: 'Source Code Pro', 'Monaco', monospace;
font-family: 'Tonka', 'Monaco', monospace;
font-style: normal;
font-weight: 400;
font-weight: normal;
font-size: 13px;
line-height: 17px;
@ -41,7 +41,7 @@ const HeaderGroup = styled.div`
const HeaderLink = styled.a`
font-family: 'Inter', sans-serif;
font-style: normal;
font-weight: 400;
font-weight: normal;
font-size: 16px;
line-height: 1;

View file

@ -100,7 +100,7 @@ const NotificationContainer = styled.div`
const NotificationTitle = styled.div`
font-size: 14px;
font-weight: bold;
font-weight: normal;
color: #fff;
`
@ -127,7 +127,7 @@ const NotificationMessage = styled.div`
}
strong {
font-weight: bold;
font-weight: normal;
color: #d5d5d5;
}
@ -159,7 +159,7 @@ const NotificationMessage = styled.div`
const DismissButton = styled.button`
color: rgba(255, 255, 255, 0.9);
font-weight: 500;
font-weight: normal;
display: flex;
align-items: center;
justify-content: center;

View file

@ -54,7 +54,7 @@ export const TitleBar = styled.div`
// background-color: #a5a5a5;
border-bottom: 1px dashed #91919177;
font-size: 10px;
font-weight: 500;
font-weight: normal;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;

View file

@ -55,7 +55,7 @@ const Container = styled.div<{pin: boolean}>`
const Title = styled.div`
margin: 0 10px;
color: #000000;
font-weight: bold;
font-weight: normal;
font-size: 10px;
user-select: none;
${pointerEventsAutoInNormalMode};

View file

@ -85,7 +85,7 @@ const Head_Label = styled.span`
`
const Head_IconContainer = styled.div`
font-weight: 500;
font-weight: normal;
display: flex;
justify-content: center;
align-items: center;

View file

@ -23,13 +23,15 @@ const SingleKeyframePropEditorContainer = styled.div`
`
const SingleKeyframePropLabel = styled.div`
font-style: normal;
font-weight: 400;
font-weight: normal;
font-size: 11px;
line-height: 13px;
letter-spacing: 0.01em;
padding: 6px 6px 6px 0;
width: 40%;
font-family: 'Tonka';
font-variation-settings: 'wght' 500;
color: #606060;

View file

@ -2,7 +2,7 @@ import type {PropHighlighted} from '@theatre/studio/panels/SequenceEditorPanel/w
import {css} from 'styled-components'
export const propNameTextCSS = css<{isHighlighted?: PropHighlighted}>`
font-weight: 300;
font-weight: normal;
font-size: 12px;
font-variation-settings: 'wght' 500;
color: ${(props) => (props.isHighlighted === 'self' ? '#000000' : '#000000')};

View file

@ -42,7 +42,9 @@ const NumberOfConflictsIndicator = styled.div`
border-radius: 4px;
text-align: center;
line-height: 14px;
font-weight: 600;
font-family: 'Tonka';
font-variation-settings: 'wght' 500;
font-weight: normal;
font-size: 8px;
position: relative;
left: -6px;

View file

@ -34,8 +34,10 @@ const Container = styled.div`
const Item = styled.div`
position: relative;
padding: 0px 12px;
font-weight: 400;
font-weight: normal;
font-size: 11px;
font-family: 'Tonka';
font-variation-settings: 'wght' 500;
height: 32px;
text-decoration: none;
user-select: none;
@ -82,7 +84,7 @@ const VersionContainer = styled(Item)`
`
const VersionLabel = styled.div`
font-weight: 600;
font-weight: normal;
`
const VersionValueRow = styled.div`

View file

@ -7,7 +7,7 @@ const DetailPanelButton = styled.button<{disabled?: boolean}>`
border: 1px solid #627b7b87;
background-color: #4b787d3d;
color: #eaeaea;
font-weight: 400;
font-weight: normal;
display: block;
appearance: none;
flex-grow: 1;

View file

@ -5,13 +5,13 @@ import React from 'react'
import styled from 'styled-components'
import PopoverArrow from './PopoverArrow'
export const popoverBackgroundColor = transparentize(0.08, `#999999`)
export const popoverBackgroundColor = transparentize(0.09, `#b4b4b4`)
const Container = styled.div`
position: absolute;
--popover-bg: ${popoverBackgroundColor};
--popover-inner-stroke: #505159;
--popover-outer-stroke: #111;
--popover-inner-stroke: transparent;
--popover-outer-stroke: transparent;
background: var(--popover-bg);

View file

@ -40,7 +40,7 @@ const Container = styled.div`
`
const Input = styled.input`
background: rgba(255, 255, 255, 1);
background: rgb(255, 255, 255);
border: none;
color: rgba(0, 0, 0, 1);
padding: 3px 6px 1px 6px;

View file

@ -29,8 +29,10 @@ const MenuTitle = styled.div`
padding: 4px 10px;
border-bottom: 1px solid #6262626d;
color: #000000;
font-family: 'Tonka';
font-variation-settings: 'wght' 500;
font-size: 11px;
font-weight: 500;
font-weight: normal;
`
type MenuItem = {

View file

@ -12,7 +12,7 @@ const ItemContainer = styled.li<{enabled: boolean}>`
display: flex;
align-items: center;
font-size: 11px;
font-weight: 400;
font-weight: normal;
position: relative;
font-family: 'Tonka';
font-variation-settings: 'wght' 800;

View file

@ -14,7 +14,7 @@ export const Container = styled.button`
align-items: center;
justify-content: center;
font-size: 14px;
font-weight: 600;
font-weight: normal;
width: 32px;
height: 32px;
outline: none;