profile
viewpoint
Scott Byrne spbyrne @forestryio Charlottetown scottbyrne.ca ✌️

tinacms/tina-starter-grande 161

Tina Grande is a Gatsby starter with first-class TinaCMS integration

tinacms/gatsby-tinacms-blog-post-reference 1

Reference repo for "Integrate TinaCMS With Your Gatsby Website" article

jamespohalloran/brevifolia-next-tinacms 0

A simple starter blog built with Next.js & TinaCMS

ncphillips/www 0

Our site

spbyrne/awesome-readme 0

A curated list of awesome READMEs

spbyrne/brevifolia-next-tinacms 0

A simple starter blog built with Next.js & TinaCMS

spbyrne/gatsby-starter-blog 0

Gatsby starter for creating a blog

pull request commenttinacms/tinacms.org

Guide Index Updates

So many options! Honestly any of those 3 would work.

kendallstrautman

comment created time in 15 hours

pull request commenttinacms/tinacms.org

Guide Index Updates

Yeah I think that works. Easier to decipher for sure.

kendallstrautman

comment created time in 15 hours

pull request commenttinacms/tinacms.org

Guide Index Updates

I think the expanded intro & brief guide descriptions are great. The individual step links after the guide description look a bit cluttered, though. We don't have a ton of formatting options with markdown so I'm not sure how to improve that hierarchy.

kendallstrautman

comment created time in 16 hours

push eventtinacms/tinacms.org

Scott Byrne

commit sha 03b794e913621dbcd00341cff77411957c8c64a1

fix nav scroll logic

view details

Scott Byrne

commit sha c9d0c2a14b5fe45729d20b547a9adc89c70abe16

adjust nav scroll position

view details

Scott Byrne

commit sha c5ec8cf72918c7aaab2ed55acec056b9995cf540

fix ul ref type

view details

Scott Byrne

commit sha 2347775538c0a8a6902427a3e7085423d5dabacb

rename scroll function

view details

Scott Byrne

commit sha 1647d6f8f87f8be7326bf61fcd249e509a483369

Merge pull request #652 from tinacms/nav-scroll Nav Scroll

view details

push time in 16 hours

delete branch tinacms/tinacms.org

delete branch : nav-scroll

delete time in 16 hours

PR merged tinacms/tinacms.org

Nav Scroll documentation enhancement guide

This takes the logic @kendallstrautman wrote for auto scrolling to the guides nav section and applies it to all nav items. If a nav link appears more than half way down the nav, the nav will load scrolled to that location when the user is on that page.

Screen Shot 2020-08-11 at 2 09 43 PM

+54 -46

3 comments

3 changed files

spbyrne

pr closed time in 16 hours

pull request commenttinacms/tinacms.org

Nav Scroll

Looks like nav highlighting also doesn't work for release notes, likely related.

spbyrne

comment created time in 16 hours

Pull request review commenttinacms/tinacms.org

Nav Scroll

 export const NavSection = (section: NavSectionProps) => { }  const NavLink = ({ section, currentPage, router }) => {-  const guidesTitleRef = useRef<HTMLElement>(null)-  const sidebarNav = useContext(NavContext)+  const linkTitleRef = useRef<HTMLElement>(null)+  const sidebarNav = useContext(NavListContext)    function scrollToGuides() {

Good call, updated.

spbyrne

comment created time in 16 hours

push eventtinacms/tinacms.org

Scott Byrne

commit sha 2347775538c0a8a6902427a3e7085423d5dabacb

rename scroll function

view details

push time in 16 hours

push eventtinacms/tinacms.org

Scott Byrne

commit sha c5ec8cf72918c7aaab2ed55acec056b9995cf540

fix ul ref type

view details

push time in 16 hours

PR opened tinacms/tinacms.org

Reviewers
Nav Scroll

This takes the logic @kendallstrautman wrote for auto scrolling to the guides nav section and applies it to all nav items. If a nav link appears more than half way down the nav, the nav will load scrolled to that location when the user is on that page.

Screen Shot 2020-08-11 at 2 09 43 PM

+53 -45

0 comment

3 changed files

pr created time in 17 hours

create barnchtinacms/tinacms.org

branch : nav-scroll

created branch time in 17 hours

issue commentforestryio/forestry.io

Favicon isn't visible on dark background

We could probably just add a white background? Would still look the same for light browsers.

mitchmac

comment created time in 20 hours

push eventtinacms/tinacms.org

Scott Byrne

commit sha 60f6a12864c6de029ac129485dc22f7efc74125e

spacing tweak

view details

push time in 2 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha db874365877dc16483e74194f56d7a91559c4ec4

make breadcrumb grey

view details

push time in 2 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 15633c0e2feabe1ba1c615926f867d288dceeaaf

style nav breadcrumb

view details

push time in 2 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 96d7b9392036edfd832ba72e6977450cd31e9006

search input padding adjustment

view details

push time in 2 days

push eventtinacms/tinacms.org

Nolan Phillips

commit sha b57d1c21f66a701432e9fc3dee093030e45579bd

refactor: getJsonPreviewProps delegates to getJsonFile

view details

Nolan Phillips

commit sha cacb394c02bcae019349fc6900dc4a4b2c793d3a

refactor: getMarkdownPreviewProps has same name patter as json equivalent

view details

Nolan Phillips

commit sha 8d9801f106bc034782063fe449f46e41f12a88cf

refactor: seperate getting the file from making the preview props

view details

Nolan Phillips

commit sha 0708388f3e22a8171ab17e74a6478060fbf008dd

switch to new options api

view details

Nolan Phillips

commit sha 4fbf79e2a7b489c51a527d3ba24f9c3e8dfa2f4c

refactor a couple uses of getXPreviewProps to getXFile

view details

Nolan Phillips

commit sha 73aabc924f600b92c6e8c8c533a1de132384a5e1

use prerelease so this will build

view details

Kendall Strautman

commit sha b731b508b9ca661ed3432085eb5f5364ef08ae34

guides: removes index cards

view details

Kendall Strautman

commit sha b89da29e9c1fc1f6d3781f1b6aa8cf9c07677907

style(guides): padding top matches docs

view details

Kendall Strautman

commit sha 5dfdfba58b73b138b8c651b252f146d5e8d66e7a

feat(guides): adds docs nav to guides index

view details

Kendall Strautman

commit sha 8709ee43c2b9d6ab1072f4cda40d71c4c0201104

chore(docsNav): removes guide category slugs

view details

Nolan Phillips

commit sha b4ddd5b893baf8c1bed615cb9db03ce081d49cea

Merge branch 'master' into refactor-to-get-github-file

view details

Kendall Strautman

commit sha 3e4e4e556f5e3a1efc77e82ef4f4005622f6ab49

chore(guides): basic guide index outline

view details

Nolan Phillips

commit sha 93b4da2bc8562d96017f2258b5c0ea5546bf5f29

upgrade tinacms

view details

Kendall Strautman

commit sha 3701a8623353c84bb2d3b0f74600878633896bb2

feat(guides): adds toc & docs layout

view details

Kendall Strautman

commit sha 786f39536aa119ac1a3a38c08e7acaefce6d03d9

feat(docs-nav): scrolls to guides on index

view details

Kendall Strautman

commit sha 2bce73ab861390c8677c9160f454628e72e057bb

chore: removes old TODO comment

view details

Kendall Strautman

commit sha 745e74c7521daa8a3fec862b04f1efaa515a2fd1

chore: removes unused component

view details

Kendall Strautman

commit sha bb08fc819933aedf88cb7f8fd52fa05129c08cd3

Merge branch 'master' into guide-updates

view details

Kendall Strautman

commit sha 05086de6752783457d72719195268c64fd907e2e

fix: fills in guide title

view details

Nolan Phillips

commit sha 3c922bcffa760f35194809a2f8cfef24be443de5

switch back to fallback: true

view details

push time in 2 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 5b873e021bd8d5bc0a96db84e416717d479a10e9

uppercase interface name

view details

push time in 2 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 7faf2b491fe10e13d96e7be224e0d864e7c96072

searchBoxProps interface

view details

push time in 2 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 35a2f266c86aaee5a0d77f72e7311b770f435df6

nav section title size and padding tweak

view details

push time in 2 days

PR closed tinacms/tinacms.org

Test

test

+2 -2

0 comment

1 changed file

pxwee5

pr closed time in 2 days

pull request commenttinacms/tinacms.org

Add guides to search

I grouped the guide title differently, but this is great. Works for me.

Screen Shot 2020-08-07 at 1 27 51 PM

dwalkr

comment created time in 5 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha ecdea51133219fd480a04a59fe18d90b98d7e0c7

guide title styles

view details

push time in 5 days

PR opened tinacms/tinacms.org

Fixed Docs Nav Header + Search
  • Docs sidebar nav header is now always visible as the nav is scrolled
  • Search input is expanded and positioned in the sidebar nav header
  • "Community" removed from docs nav

Screen Shot 2020-08-07 at 11 29 05 AM

+91 -49

0 comment

9 changed files

pr created time in 5 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 1928a7c98112c21ed32e5b17d4fb3b65205531e9

fix hits wrapper styles

view details

push time in 5 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 06a71249bdf5eeca5e56b6be228493f8db3f67ef

revert changes to collapse prop

view details

push time in 5 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 7c010211d2459badbcfcc0a875325393bf041d16

mobile nav improvements

view details

push time in 5 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 47b5d46bc3cd6b788fb3561095fa7f58dbd1ac76

check for query

view details

push time in 5 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 77a11379fcc8004c66714f58b874ee5671526322

improve nav header styles

view details

push time in 5 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 0ae88c10c683be1cdda817a942a42cfc8e8f3fc1

change sidebar scroll behaviour

view details

push time in 6 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha da662f529fbdddd4c4c0e4f01a507654954f62a0

move button to dedicated component

view details

Scott Byrne

commit sha 4388c7779d49db7e32c8ff0a30a27c760d83bdce

style copy code button

view details

Scott Byrne

commit sha 7eb2ebcbb218f342275c79358f295ab998e11ede

Merge branch 'copy-code-block' of github.com:tinacms/tinacms-site-next into copy-code-block

view details

push time in 6 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha a0c41afa30aecbf3b53301482dcb11fa09cc501f

move search to docs sidebar nav header

view details

push time in 6 days

create barnchtinacms/tinacms.org

branch : fixed-nav-header

created branch time in 6 days

pull request commenttinacms/tinacms.org

Guide Index template updates

This is looking great, already a huge improvement. Nav scrolling is working for me, though we may tweak once we have the fixed nav header ready (working on that now).

kendallstrautman

comment created time in 6 days

push eventtinacms/tinacms.org

Kendall Strautman

commit sha a19f6d23f63e93331c22d9bfc2d1734b73684c18

blog: adds prev / next fm values to recent blogs

view details

Kendall Strautman

commit sha 2b45e7e6201db7a1f21f06cb1cd98edc0b1c681f

feat: adds basic prev / next to blog

view details

Kendall Strautman

commit sha a8eb3e6ffb656af46cc40c42ac1bb0025149e2d8

chore: removes unused imports and variable

view details

Kendall Strautman

commit sha 21333b631aa88eb07dfa62751ee7e8c247da29da

chore(blog): adds next prev fm values

view details

Kendall Strautman

commit sha 0a4ced9420f839ef646b3a222a947479aeb6322e

fix(blog): index pagination current value

view details

Scott Byrne

commit sha db8266d20fee49f56879d67620344761217dda29

Merge pull request #619 from tinacms/next-prev-blog Blog Template: next / prev posts

view details

push time in 7 days

PR merged tinacms/tinacms.org

Reviewers
Blog Template: next / prev posts blog enhancement

Pretty much just copied the implementation from the docs template.

If we are okay with this manual approach, I can go through the old blogs and fill in the correct next / prev frontmatter values. Wanted to get feedback before I went and updated all those. To check this out, it works on the two most recent blogs.

Updated all fm values.

+76 -20

1 comment

26 changed files

kendallstrautman

pr closed time in 7 days

pull request commenttinacms/tinacms.org

Improve Nav Search

I bet something else trigged a regen of the indices. They're stored externally (algolia). I can trigger a regen right now and see if that fixes the preview.

spbyrne

comment created time in 7 days

pull request commenttinacms/tinacms.org

Improve Nav Search

@kendallstrautman You can test/see the new excerpts, it's just some old excerpts show up in cases where the page was moved or removed. Not all old data is kept, just in cases where the incoming data doesn't match up with a slug (I think?).

spbyrne

comment created time in 7 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha a5f3e6403a8af501878a7f273803b2171fa94471

remove console log Co-authored-by: Kendall Strautman <36613477+kendallstrautman@users.noreply.github.com>

view details

push time in 7 days

PR opened tinacms/tinacms.org

Improve Nav Search
  • Adds working excerpt to search results
  • Hides excerpts for title hits
  • Reduce excerpt generation from 3000 to 200 characters
  • Strip markdown from excerpts
  • Improve hit components
+53 -32

0 comment

3 changed files

pr created time in 8 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha e90b963d363267c0bc43e081d069542ae69c671d

fix promise in createIndices

view details

Scott Byrne

commit sha 7c5635c4f95690b6dfab1a7d17c6f3ac6bbfc43c

export stripMarkdown

view details

push time in 8 days

create barnchtinacms/tinacms.org

branch : search

created branch time in 8 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 4a0755fa922d76c6a2dd7da2a8b014500f0f4325

inline form setup

view details

push time in 9 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 0296b45cb66c9990d0861662477c33c9dc8f3fb6

update interface in guide

view details

push time in 12 days

Pull request review commenttinacms/tinacms.org

update focusRing references

 There are two ways to use `InlineImage`, with and without children. If no childr  ## Options -| Key          | Description                                                                                                                                                                                                 |-| ------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |-| `name`       | The path to some value in the data being edited.                                                                                                                                                            |-| `parse`      | Defines how the actual front matter or data value gets populated. The name of the file gets passed as an argument, and one can set the path this image as defined by the uploadDir property.                |-| `uploadDir`  | Defines the upload directory for the image. All of the post data is passed in, `fileRelativePath` is most useful in defining the upload directory, but you can also statically define the upload directory. |-| `previewSrc` | Defines the path for the src attribute on the image preview. If using gatsby-image, the path to the `childImageSharp.fluid.src` needs to be provided.                                                       |-| `focusRing`  | Controls whether to display a focus outline.                                                                                                                                                                |-| `children`   | Children need to be passed through the [Render Props](https://reactjs.org/docs/render-props.html) pattern to access `previewSrc`.                                                                           |+| Key          | Description                                                                                                                                                                                                                                                                                                                        |+| ------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |+| `name`       | The path to some value in the data being edited.                                                                                                                                                                                                                                                                                   |+| `parse`      | Defines how the actual front matter or data value gets populated. The name of the file gets passed as an argument, and one can set the path this image as defined by the uploadDir property.                                                                                                                                       |+| `uploadDir`  | Defines the upload directory for the image. All of the post data is passed in, `fileRelativePath` is most useful in defining the upload directory, but you can also statically define the upload directory.                                                                                                                        |+| `previewSrc` | Defines the path for the src attribute on the image preview. If using gatsby-image, the path to the `childImageSharp.fluid.src` needs to be provided.                                                                                                                                                                              |+| `focusRing`  | Either an object to style the focus ring or `false`, which hides the focus ring entirely. For styles, `offset` (in pixels) controls the distance from the ring to the edge of the group; `borderRadius`(in pixels) controls the [rounding](https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius) edge of the focus ring. |

Update to:

Either an object to style the focus ring or a boolean to show/hide the focus ring. Defaults to true which displays the focus ring with default styles. For style options, offset (in pixels) sets the distance from the ring to the edge of the component, and borderRadius (in pixels) controls the rounded corners of the focus ring.

spbyrne

comment created time in 12 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha bf82b491b25ee9b4d3535291c3d9b9916aac994d

update focus ring wording

view details

push time in 12 days

Pull request review commenttinacms/tinacms.org

update focusRing references

 There are two ways to use `InlineImage`, with and without children. If no childr  ## Options -| Key          | Description                                                                                                                                                                                                 |-| ------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |-| `name`       | The path to some value in the data being edited.                                                                                                                                                            |-| `parse`      | Defines how the actual front matter or data value gets populated. The name of the file gets passed as an argument, and one can set the path this image as defined by the uploadDir property.                |-| `uploadDir`  | Defines the upload directory for the image. All of the post data is passed in, `fileRelativePath` is most useful in defining the upload directory, but you can also statically define the upload directory. |-| `previewSrc` | Defines the path for the src attribute on the image preview. If using gatsby-image, the path to the `childImageSharp.fluid.src` needs to be provided.                                                       |-| `focusRing`  | Controls whether to display a focus outline.                                                                                                                                                                |-| `children`   | Children need to be passed through the [Render Props](https://reactjs.org/docs/render-props.html) pattern to access `previewSrc`.                                                                           |+| Key          | Description                                                                                                                                                                                                                                                                                                                        |+| ------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |+| `name`       | The path to some value in the data being edited.                                                                                                                                                                                                                                                                                   |+| `parse`      | Defines how the actual front matter or data value gets populated. The name of the file gets passed as an argument, and one can set the path this image as defined by the uploadDir property.                                                                                                                                       |+| `uploadDir`  | Defines the upload directory for the image. All of the post data is passed in, `fileRelativePath` is most useful in defining the upload directory, but you can also statically define the upload directory.                                                                                                                        |+| `previewSrc` | Defines the path for the src attribute on the image preview. If using gatsby-image, the path to the `childImageSharp.fluid.src` needs to be provided.                                                                                                                                                                              |+| `focusRing`  | Either an object to style the focus ring or `false`, which hides the focus ring entirely. For styles, `offset` (in pixels) controls the distance from the ring to the edge of the group; `borderRadius`(in pixels) controls the [rounding](https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius) edge of the focus ring. |

Ah, good call. I'll switch up this wording.

spbyrne

comment created time in 12 days

PR opened tinacms/tinacms.org

update focusRing references

This adds a description of the focusRing API to all inline fields. This is tied to the Focus Ring Fixes PR.

+52 -30

0 comment

6 changed files

pr created time in 12 days

create barnchtinacms/tinacms.org

branch : docs/focus-ring

created branch time in 12 days

pull request commenttinacms/tinacms.org

move release notes to docs

Screen Shot 2020-07-31 at 12 50 02 PM

Looks good enough for now. Excerpts (when a clean intro para is available), formatted dates (for new version based releases) and pagination can all come when this list becomes unwieldy.

ncphillips

comment created time in 12 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha ab8da0159bb2f208f9cd59a7189749a9e3e8d1e9

hide docs pagination when nothing to display

view details

push time in 12 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha d942b22edc871f689df594232ae3f1dea705c3c4

simple release list styling

view details

Scott Byrne

commit sha 35502c1cc01e452edea33ca8a950139e93faffd6

fix markdown header link position

view details

push time in 12 days

pull request commenttinacms/tinacms.org

move release notes to docs

Taking a look now

ncphillips

comment created time in 12 days

pull request commenttinacms/tinacms.org

Last Edited Refactor

Is there a page on the preview site where this is visible (or do you have a screenshot)?

jhuggett

comment created time in 13 days

PR opened tinacms/tinacms.org

404 Page

We needed a branded 404 page, so now we have one.

+137 -0

0 comment

1 changed file

pr created time in 13 days

create barnchtinacms/tinacms.org

branch : 404

created branch time in 13 days

push eventtinacms/tinacms.org

Kendall Strautman

commit sha ad51a4efebc7c4db56a72f95b98aabfc0ccb313f

chore: update env example

view details

Kendall Strautman

commit sha c1779e4a820387f3f0cf5b76e84daf150df2cf43

revert toc refactor

view details

Kendall Strautman

commit sha ee582ed4af73e8d87cee424dd7a1e4a236523958

chore: remove comment

view details

Kendall Strautman

commit sha ccfbf73f84bd1e8333fba856c11cf7a59b4c0154

Merge pull request #574 from tinacms/env-example-update chore: update env example

view details

Kendall Strautman

commit sha 590bf7cbe08c44b8c602eb49f3947bbabc4459c9

refactor: moves toc listener to own function

view details

Kendall Strautman

commit sha 0a4393516f686a0e857d7cd4a5dc5650191d259f

refactor: defined handle toc function inline

view details

Kendall Strautman

commit sha 8e2feada245f4c848af1523999888d2199e818d7

refactor: guide step uses activeTocListener helper

view details

Kendall Strautman

commit sha 4e154b8c7d3214226977e5809dd61fefdc561e35

chore: removes console.log

view details

Kendall Strautman

commit sha c452ffd3e126e356334290f827da7a99364e4852

chore: import from absolute utils

view details

Kendall Strautman

commit sha 2aa3a000154f1ca042506a23e27cd94edcd335a1

feat: adds toc to packages page

view details

Kendall Strautman

commit sha ab782e74f165c8b69a4de2554fb9b8432031f3dc

chore: adds types to toc helpers

view details

Kendall Strautman

commit sha 6b25d4d2bda24ac42766694b4fa0ac42a4a130a8

refactor: some toc helper variables to constants

view details

Scott Byrne

commit sha d01feb54b36304b69e816a1419ec2b487c67f46b

Merge pull request #577 from tinacms/toc-updates refactors toc & adds to packages pages

view details

Nolan Phillips

commit sha 8defe2f234485e99b05457a85e677c39759ef386

move non-default fields to bottom of toc - date, markdown, html - update those docs ot point to the package docs instead

view details

Nolan Phillips

commit sha 1dac78dd93cbb916c3ad74cddaabf4e13a89b456

capitals are weird

view details

DJ

commit sha 72b73f558f8f4c5a7f655b1ddfae4abc08692b61

fix: generate better slugs in docs ToC

view details

NCPhillips

commit sha c742dd27f8bcb76b6c49cb8d9ac91073803d214f

Update from TinaCMS

view details

NCPhillips

commit sha bd66163efdf99c42288b36abcdc40d0dd5cc76be

Update from TinaCMS

view details

NCPhillips

commit sha f9bb76e2bb3f4e1c13228ad0c335aa323b9bf55a

Update from TinaCMS

view details

Kendall Strautman

commit sha 917dc6a7cc93fc39a755a0301eeae946b1c1789e

Merge pull request #579 from tinacms/field-docs-restructure Deprioritize non-default fields

view details

push time in 13 days

Pull request review commenttinacms/tinacms

Focus Ring Fixes

 See the License for the specific language governing permissions and limitations under the License.  */+import * as React from 'react' import styled, { css } from 'styled-components' import { BlocksEmptyState } from '../blocks/inline-field-blocks'+import { useInlineForm } from '..' -export interface FocusRingStyleProps {+export interface FocusRingOptions {   offset?: number | { x: number; y: number }   borderRadius?: number+  nestedFocus?: boolean } -interface FocusRingProps extends FocusRingStyleProps {+export interface StyledFocusRingProps {+  offset?: number | { x: number; y: number }+  borderRadius?: number   active: boolean   disableHover?: boolean   disableChildren?: boolean } -export const FocusRing = styled.div<FocusRingProps>(p => {+export interface FocusRingProps {+  name?: string+  children?: any+  options?: boolean | FocusRingOptions

Right, I think it was using the 'extends' syntax before I made my changes. I was just confused so I did what made sense to me at the time but I figured I'd need help improving the interfaces.

spbyrne

comment created time in 13 days

pull request commenttinacms/tinacms

Focus Ring Fixes

There are a lot of events that can trigger a focus loss given how that's handled (Dismissible onDismiss function on a wrapper) including interacting with a settings modal, clicking an item within a group that's not editable, interacting with links or images in the WYSIWYG..etc. In all cases it doesn't interrupt editing, the focus ring just goes away. The WYSIWYG does seem the most prone to losing focus, even double clicking to edit will remove the focus.

@ncphillips I'm not sure if this is an issue to solve now or not.

spbyrne

comment created time in 13 days

push eventtinacms/tinacms

Scott Byrne

commit sha e2ededf5aedc9fd4c9a33fed42aacbe541f0f403

chore: inline settings improvement

view details

push time in 14 days

push eventtinacms/tinacms

Scott Byrne

commit sha 382be37d46fc56664c851fa6fe7220e7887f3014

chore: remove focus context

view details

push time in 14 days

push eventtinacms/tinacms

Scott Byrne

commit sha cfd6a6a66ac8f0d4cd942e5ad263e15fc7ea16e6

chore: add disableHover back to blocks

view details

push time in 14 days

push eventtinacms/tinacms

Scott Byrne

commit sha 460cb1b1dcf19c89b576e38036dcf77881156307

chore: move focus ring logic to component

view details

push time in 14 days

Pull request review commenttinacms/tinacms

Focus Ring Fixes

 limitations under the License.  import * as React from 'react' import { useCMS } from 'tinacms'-import { InlineField } from 'react-tinacms-inline'+import { InlineField, FocusRing, useInlineForm } from 'react-tinacms-inline'+import { FocusRingStyleProps } from 'react-tinacms-inline/src/styles' import { Wysiwyg } from '../components/Wysiwyg' import { EditorProps } from '../types'  export interface InlineWysiwygFieldProps extends Omit<EditorProps, 'input'> {   name: string   children: any+  focusRing?: boolean | FocusRingStyleProps }  export function InlineWysiwyg({   name,   children,+  focusRing = false,

I also want to make the WYSIWYG toolbar hidden when the focus isn't active since it will get a hover focus ring to indicate editing is possible, but that's another PR.

spbyrne

comment created time in 14 days

Pull request review commenttinacms/tinacms

Focus Ring Fixes

 import styled, { css } from 'styled-components' import { BlocksEmptyState } from '../blocks/inline-field-blocks'  export interface FocusRingStyleProps {-  offset?: number | { x: number; y: number }+  offset?: number | { x: number; y: number } | undefined

Yeah I can try changing this. I think I was getting a type error and this fixed it but it shouldn't have so I'll try reversing.

spbyrne

comment created time in 14 days

Pull request review commenttinacms/tinacms

Focus Ring Fixes

 limitations under the License.  import * as React from 'react' import { useCMS } from 'tinacms'-import { InlineField } from 'react-tinacms-inline'+import { InlineField, FocusRing, useInlineForm } from 'react-tinacms-inline'+import { FocusRingStyleProps } from 'react-tinacms-inline/src/styles' import { Wysiwyg } from '../components/Wysiwyg' import { EditorProps } from '../types'  export interface InlineWysiwygFieldProps extends Omit<EditorProps, 'input'> {   name: string   children: any+  focusRing?: boolean | FocusRingStyleProps }  export function InlineWysiwyg({   name,   children,+  focusRing = false,

I suppose everything could have it enabled by default.

spbyrne

comment created time in 14 days

Pull request review commenttinacms/tinacms

Focus Ring Fixes

 limitations under the License.  import * as React from 'react' import { useCMS } from 'tinacms'-import { InlineField } from 'react-tinacms-inline'+import { InlineField, FocusRing, useInlineForm } from 'react-tinacms-inline'+import { FocusRingStyleProps } from 'react-tinacms-inline/src/styles' import { Wysiwyg } from '../components/Wysiwyg' import { EditorProps } from '../types'  export interface InlineWysiwygFieldProps extends Omit<EditorProps, 'input'> {   name: string   children: any+  focusRing?: boolean | FocusRingStyleProps

Yeah I'm working on standardizing this on a boolean since you may want to enable a focusRing on something without specifying any custom options. Though that was designed around the WYSIWYG having the focusRing disabled by default, which I may change.

spbyrne

comment created time in 14 days

pull request commenttinacms/tinacms

Focus Ring Fixes

Working on moving all the logic inside focusRing now.

spbyrne

comment created time in 14 days

PR opened tinacms/tinacms

Focus Ring Fixes

This standardizes all inline fields with the same focus ring component.

The logic for handling the focusRing active state is identical between the inline text, textarea and image fields, so I'd like to further extract that duplicated code. The focus ring component shouldn't handle this logic, but maybe some sort of higher level focus ring component could be created.

+139 -82

0 comment

8 changed files

pr created time in 14 days

pull request commenttinacms/tinacms

feat: focus ring on editor

@jpuri I've added the focusRing on a new branch, I'll create a PR today. The focus ring component wraps inline fields, their code doesn't need to modified in any way to accommodate it.

jpuri

comment created time in 14 days

PR closed tinacms/tinacms

Reviewers
feat: focus ring on editor

Focus ring works well except the scenario when code block or link modal is focused, I am working to fix those.

Fix #1347

+14 -1

5 comments

2 changed files

jpuri

pr closed time in 14 days

push eventtinacms/tinacms

Scott Byrne

commit sha a849dc65dfefbba36d935ec963a3e4cb73fe7215

chore: update inline image focus ring

view details

Scott Byrne

commit sha 2347c6cefed9956172c59cdec7c2b3fe6f5d33ab

chore: remove old focus ring

view details

Scott Byrne

commit sha cefbfd88d8f01b7bcd876f24051807dfda8a7d5e

chore: update inline textarea focus ring

view details

push time in 14 days

push eventtinacms/tinacms

Scott Byrne

commit sha 5cb867c05bbfbdc1ac21486ce34322970a55ff9b

chore: add new focus ring to inline text

view details

push time in 14 days

push eventtinacms/tinacms

Scott Byrne

commit sha bb797db608e414bf641e569d8409a1181dd391f5

chore: focusRing prop change

view details

push time in 14 days

create barnchtinacms/tinacms

branch : focus-ring-fixes

created branch time in 15 days

startedrobinsloan/perfect-edition

started time in 15 days

startedfelixrieseberg/macintosh.js

started time in 15 days

pull request commenttinacms/tinacms

feat: focus ring on editor

Probably, but it may have to be adapted. I'll need to take a look.

jpuri

comment created time in 16 days

push eventtinacms/tinacms.org

Kendall Strautman

commit sha c1779e4a820387f3f0cf5b76e84daf150df2cf43

revert toc refactor

view details

Kendall Strautman

commit sha ee582ed4af73e8d87cee424dd7a1e4a236523958

chore: remove comment

view details

Kendall Strautman

commit sha 590bf7cbe08c44b8c602eb49f3947bbabc4459c9

refactor: moves toc listener to own function

view details

Kendall Strautman

commit sha 0a4393516f686a0e857d7cd4a5dc5650191d259f

refactor: defined handle toc function inline

view details

Kendall Strautman

commit sha 8e2feada245f4c848af1523999888d2199e818d7

refactor: guide step uses activeTocListener helper

view details

Kendall Strautman

commit sha 4e154b8c7d3214226977e5809dd61fefdc561e35

chore: removes console.log

view details

Kendall Strautman

commit sha c452ffd3e126e356334290f827da7a99364e4852

chore: import from absolute utils

view details

Kendall Strautman

commit sha 2aa3a000154f1ca042506a23e27cd94edcd335a1

feat: adds toc to packages page

view details

Kendall Strautman

commit sha ab782e74f165c8b69a4de2554fb9b8432031f3dc

chore: adds types to toc helpers

view details

Kendall Strautman

commit sha 6b25d4d2bda24ac42766694b4fa0ac42a4a130a8

refactor: some toc helper variables to constants

view details

Scott Byrne

commit sha d01feb54b36304b69e816a1419ec2b487c67f46b

Merge pull request #577 from tinacms/toc-updates refactors toc & adds to packages pages

view details

push time in 18 days

delete branch tinacms/tinacms.org

delete branch : toc-updates

delete time in 18 days

PR merged tinacms/tinacms.org

Reviewers
refactors toc & adds to packages pages enhancement fix

For some reason, moving the toc file into components/ui broke some stuff — the active toc items weren't registering. So I reverted that change to get back to baseline.

This PR creates a toc_helpers file in utils that extracts the 'active' toc item event listener logic into a higher-order function. This refactors guides and docs templates to use the function and also adds the toc to the packages page.

On another note, I noticed one weird thing with the guides toc (not caused by these changes), but let's dig into that in another PR.

+116 -147

2 comments

9 changed files

kendallstrautman

pr closed time in 18 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha c2f9b1773c01f7b879994606f69544bb8b116e51

blur

view details

push time in 18 days

PR opened tinacms/tinacms.org

DRAFT: New homepage

Work in progress, we're going to post this for discussion next week.

+2019 -321

0 comment

16 changed files

pr created time in 19 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 9ee219b91ec4d6addc7fd25d6fd85eac54e05e2d

adjust timing

view details

push time in 19 days

push eventtinacms/tinacms.org

logan-anderson

commit sha 1600e30d05595e652dc6771e442ef11e463fc256

wip: adding toc

view details

logan-anderson

commit sha e4a1c077363e210081d47ecc6af3e0a5c91805c1

wip: adding toc

view details

logan-anderson

commit sha 25f7fc12f3c11c4767c1e2f72c0d315639e9eeac

fixed build error

view details

logan-anderson

commit sha bbb2f82d8541db924324b0abb9b88dfbf3adb6c1

repositioned TOC

view details

Nolan Phillips

commit sha 82348a57f41ef1844fb3ba7ba203ef6995ccc438

started a "packages" page

view details

Scott Byrne

commit sha 4082246d5eed64815dbe0a625268be5f48a5810b

Merge branch 'master' into adding-toc

view details

Scott Byrne

commit sha 426f7cd912f2ef92136de6a274060fb01c6184da

Merge branch 'master' into adding-toc

view details

Scott Byrne

commit sha 0c7359a64d09b559105c2ad4a1b92e197dd29df8

add toc to docs, remove from blog

view details

Scott Byrne

commit sha 4670f41e2b9a2adc9db7a548391a96fe8650fa31

strip styles

view details

Scott Byrne

commit sha 15c20d105540ea33d2b9a3fa7ec75d8985b75abd

basic toc styling

view details

Scott Byrne

commit sha 4250925638bb517aa21ec62472c728e23d13e350

improve spacing

view details

Scott Byrne

commit sha 6fc6d339118b3b996950e969cea112f3fe2343fa

styling

view details

Scott Byrne

commit sha fb133aa69457b92862761db216481f3e517f4f7c

mobile styles

view details

Scott Byrne

commit sha b7995446f45a602c4c10f43e0e4125b1263af067

desktop styles

view details

Scott Byrne

commit sha 7a66c7cd9da18639aae9744a92b36eb4b0bd0c92

fix sticky

view details

Scott Byrne

commit sha 2793d71a8f818cf85f6ac453d8c23124fe98f1ae

alignment

view details

Scott Byrne

commit sha b963825b78eb631ec7444f21c3b7e5c65db34fb3

prototype toc highlighting

view details

Scott Byrne

commit sha 7fa886abb634d1940ce5bd41758f26f9eab579cf

terrible but working

view details

Scott Byrne

commit sha c7eb237928433ca190b03f9d16bc4db4465ed52a

adjust throttle

view details

Scott Byrne

commit sha bd466f5e7f8d4c7ad4f0e94d2d9e85e3bbe99152

fix code wrapping layout issue

view details

push time in 19 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 98724d2202afd1025a1473837c6279fb5f743930

change easing

view details

push time in 19 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 4494e64bfa77ef968ca638a72fb6ae6d9a04c2ef

blocks editing icon animation

view details

push time in 19 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha a2d741198ab216071b1dc002405136377957adfa

wrap icon animation

view details

push time in 19 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha bd66ad84978c90988321d453d705369ec47c0919

icon animation 1

view details

push time in 19 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 416871300d3a6467fb666f3ec58c481d9ae5dd5e

copy

view details

push time in 19 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 24ec8e75d81d1b22ea8c16513b31971b58a5aa1a

small fixes

view details

push time in 19 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 182fce969a257c017a231c2787e41f7124fb93a9

adjust code style

view details

Scott Byrne

commit sha 63c023826ce4c88954e1c4aaad013635bcfcc659

code wrapper styles

view details

Scott Byrne

commit sha 23d754e3e469a9077cec1457fb4dbb8b353eefd8

responsive improvements

view details

Scott Byrne

commit sha f0c50f791833e8e043d62645c61d2b58d1ff0efd

grid improvement

view details

push time in 19 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 1bec1723ccdac732a928e5bc903904b77708eb69

header spacing

view details

Scott Byrne

commit sha ee35cce1707c5b143bdeaf02bb6204e0d0bb1aec

add unstyled code

view details

Scott Byrne

commit sha 86af663e2980be65a5bd78a3e6cb83928d151bc5

add home specific code styles

view details

push time in 19 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 92519d4ea684cc6d328c75fe6ea342a992da118c

flip bg gradient

view details

push time in 19 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 4b4194b8a21ba3c02b95367a0f9b8dd56d43eebd

adjust spacing

view details

push time in 19 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 3554e37675bc046571f6b9353431cc091d6f9454

add static icons

view details

push time in 19 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha 90bfea2cf380d0efb2d1c5d0bfeab2bcbc1d4b59

add animatino stagger

view details

push time in 19 days

push eventtinacms/tinacms.org

Scott Byrne

commit sha ac25ab67da011967e377b2e74cab64cc6e819efa

user override

view details

push time in 19 days

more